.modern-clean{position:relative;min-height:500px;display:flex;align-items:center;justify-content:center;margin-bottom:3rem;background:transparent;border-radius:24px;padding:2rem;overflow:hidden}.workspace-container{position:relative;width:100%;max-width:900px;height:400px}.desk-setup{position:relative;width:100%;height:100%;perspective:1200px}.desk{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:600px;height:200px;transform-style:preserve-3d}.desk-surface{width:100%;height:20px;background:linear-gradient(145deg,#8B4513,#A0522D);border-radius:10px;position:absolute;bottom:80px;box-shadow:0 10px 30px rgba(0,0,0,0.2);transform:rotateX(90deg)translateZ(10px)}.desk-legs{position:absolute;bottom:0;width:100%;height:80px}.leg{position:absolute;width:8px;height:80px;background:#654321;border-radius:4px}.leg:first-child{left:50px}.leg:last-child{right:50px}.computer-monitor{position:absolute;bottom:100px;left:50%;transform:translateX(-50%);z-index:10}.monitor-screen{width:380px;height:240px;background:#000;border:8px solid #2a2a2a;border-radius:12px;position:relative;box-shadow:0 0 0 2px #1a1a1a,0 20px 40px rgba(0,0,0,0.3);overflow:hidden}.screen-content{width:100%;height:100%;background:var(--screen-bg,#1e1e1e);color:var(--screen-text,#ffffff);font-family:'Geist Mono',monospace}
@media(prefers-color-scheme:light){.screen-content{--screen-bg:#ffffff;--screen-text:#000000}.title-bar{background:#f0f0f0!important}.sidebar{background:#f8f8f8!important}.main-editor{background:#ffffff!important}.file-tabs{background:#e8e8e8!important}}
@media(prefers-color-scheme:dark){.screen-content{--screen-bg:#1e1e1e;--screen-text:#ffffff}}.title-bar{height:30px;background:#2d2d2d;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-bottom:1px solid #404040}.window-controls{display:flex;gap:6px}.control{width:12px;height:12px;border-radius:50%;cursor:pointer}.close{background:#ff5f57}.minimize{background:#ffbd2e}.maximize{background:#28ca42}.title{font-size:11px;color:#ccc;font-weight:500}.editor-interface{display:flex;height:calc(100%-30px)}.sidebar{width:50px;background:#252526;display:flex;flex-direction:column;align-items:center;padding:10px 0;gap:8px;border-right:1px solid #404040}.file-icon{font-size:16px;opacity:0.7;cursor:pointer;transition:opacity 0.2s}.file-icon:hover{opacity:1}.main-editor{flex:1;background:#1e1e1e;display:flex;flex-direction:column}.file-tabs{height:32px;background:#2d2d2d;display:flex;align-items:center;padding:0 10px;gap:5px;border-bottom:1px solid #404040}.tab{background:#3c3c3c;color:#ccc;padding:4px 8px;border-radius:4px 4px 0 0;font-size:10px;cursor:pointer;transition:all 0.2s}.tab.active{background:#1e1e1e;color:#fff}.code-editor{flex:1;padding:10px;font-size:11px;line-height:16px;overflow:hidden}.line{display:flex;align-items:center;margin-bottom:2px}.line-num{width:25px;color:#858585;text-align:right;margin-right:10px;font-size:10px}.code-editor.tag{color:#4ec9b0;background:none;padding:0;border:none;border-radius:0;display:inline}.code-editor.attr{color:#92c5f7}.code-editor.string{color:#ce9178}.cursor{animation:cursor-blink 1s infinite;color:#fff;background:rgba(255,255,255,0.8);padding:0 1px;margin-left:2px}
@keyframes cursor-blink{0%,50%{opacity:1}
51%,100%{opacity:0}}.monitor-stand{width:20px;height:35px;background:linear-gradient(145deg,#3a3a3a,#2a2a2a);margin:0 auto;border-radius:3px;position:relative;top:5px;box-shadow:0 2px 6px rgba(0,0,0,0.2)}.monitor-stand::before{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:60px;height:8px;background:linear-gradient(145deg,#3a3a3a,#2a2a2a);border-radius:4px;box-shadow:0 2px 6px rgba(0,0,0,0.15)}.monitor-base{width:100px;height:12px;background:linear-gradient(145deg,#4a4a4a,#3a3a3a);margin:0 auto;border-radius:6px;position:relative;top:8px;box-shadow:0 4px 12px rgba(0,0,0,0.2)}.peripherals{position:absolute;bottom:140px;left:50%;transform:translateX(-50%);display:flex;gap:20px;align-items:center;z-index:8}.keyboard{width:280px;height:120px;background:linear-gradient(145deg,#4a4a4a,#3a3a3a);border-radius:8px;padding:8px;box-shadow:0 3px 10px rgba(0,0,0,0.2)}.keyboard-body{width:100%;height:100%}.keys{display:flex;flex-direction:column;gap:3px;height:100%}.key-row{display:flex;gap:2px;justify-content:center}.key{background:#666;border-radius:3px;border:1px solid #777;transition:all 0.1s;position:relative;box-shadow:0 1px 3px rgba(0,0,0,0.3)}.key-esc,.key-f1,.key-f2,.key-f3,.key-f4{width:12px;height:8px}.key-tilde,.key-1,.key-2,.key-3,.key-4,.key-5,.key-6,.key-7,.key-8,.key-9,.key-0,.key-minus,.key-equals{width:10px;height:8px}.key-tab{width:18px;height:8px}.key-q,.key-w,.key-e,.key-r,.key-t,.key-y,.key-u,.key-i,.key-o,.key-p,.key-bracket-left,.key-bracket-right,.key-backslash{width:10px;height:8px}.key-caps{width:22px;height:8px}.key-a,.key-s,.key-d,.key-f,.key-g,.key-h,.key-j,.key-k,.key-l,.key-semicolon,.key-quote{width:10px;height:8px}.key-enter{width:18px;height:8px}.key-shift-left,.key-shift-right{width:25px;height:8px}.key-z,.key-x,.key-c,.key-v,.key-b,.key-n,.key-m,.key-comma,.key-period,.key-slash{width:10px;height:8px}.key-ctrl,.key-win,.key-alt,.key-alt-gr,.key-fn,.key-ctrl-right{width:15px;height:8px}.key-space{width:60px;height:8px}.key:hover{background:#777;transform:translateY(-1px);box-shadow:0 2px 5px rgba(0,0,0,0.4)}.key:active{background:#4CAF50;transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,0.3)}.mouse{width:18px;height:25px;background:linear-gradient(145deg,#555,#444);border-radius:8px;position:relative;box-shadow:0 2px 6px rgba(0,0,0,0.2)}.mouse::after{content:'';position:absolute;top:4px;left:50%;transform:translateX(-50%);width:2px;height:6px;background:#777;border-radius:1px}.tech-icons{position:absolute;inset:0;pointer-events:none;z-index:1}.tech-item{position:absolute;background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.1);border-radius:8px;padding:6px 10px;font-family:'Geist Mono',monospace;font-weight:600;font-size:12px;animation:float-tech 6s ease-in-out infinite;box-shadow:0 4px 12px rgba(0,0,0,0.05)}.html{top:15%;left:10%;color:#e34c26;animation-delay:0s}.css{top:25%;right:15%;color:#1572b6;animation-delay:2s}.js{bottom:30%;left:5%;color:#f7df1e;background:rgba(247,223,30,0.1);animation-delay:4s}
@keyframes float-tech{0%,100%{transform:translateY(0px)rotate(0deg);opacity:0.8}
50%{transform:translateY(-15px)rotate(3deg);opacity:1}}
@media(max-width:768px){.workspace-container{height:300px}.desk{width:400px}.monitor-screen{width:280px;height:175px}.developer-person{left:50%;transform:translateX(-50%)scale(0.8)}.peripherals{transform:translateX(-50%)scale(0.8)}}