:root{--desktop-bg: #808080;--desktop-pattern: repeating-linear-gradient(45deg, #909090 25%, transparent 25%, transparent 75%, #909090 75%, #909090), repeating-linear-gradient(45deg, #909090 25%, #808080 25%, #808080 75%, #909090 75%, #909090);--window-bg: #ffffff;--window-header: #000000;--window-header-text: #ffffff;--text-primary: #1a1a1a;--text-secondary: #666666;--border-color: #000000;--font-ui: "Inter", sans-serif;--font-header: "VT323", monospace;--taskbar-height: 48px;--icon-size: 64px}*{box-sizing:border-box;margin:0;padding:0}body,html{width:100%;height:100%;overflow:hidden;font-family:var(--font-ui);background-color:var(--desktop-bg);color:var(--text-primary)}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:#eee;border-left:2px solid var(--border-color)}::-webkit-scrollbar-thumb{background:var(--border-color);border:2px solid #fff}button{font-family:var(--font-header);cursor:pointer}.window-frame{position:absolute;top:0;left:0;display:flex;flex-direction:column;background-color:var(--window-bg);border:2px solid var(--border-color);box-shadow:4px 4px #0003}.window-frame.active{box-shadow:4px 4px #0006;z-index:100}.window-header{height:32px;background-color:var(--window-bg);color:var(--text-primary);border-bottom:2px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;padding:0 8px;cursor:grab;-webkit-user-select:none;user-select:none;font-family:var(--font-header);font-size:1.2rem;letter-spacing:.5px}.window-frame.active .window-header{background-color:var(--window-header);color:var(--window-header-text)}.window-controls{display:flex;gap:4px}.window-btn{width:20px;height:20px;background:#fff;border:2px solid black;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;line-height:1;padding-bottom:2px}.window-btn:hover,.window-btn:active{background:#000;color:#fff}.window-content{flex:1;overflow:auto;padding:16px;font-family:var(--font-ui);font-size:.95rem;line-height:1.5}.desktop-icon{width:80px;height:auto;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;cursor:pointer;padding:4px;border:1px solid transparent;color:var(--text-primary);-webkit-user-select:none;user-select:none}.desktop-icon:hover,.desktop-icon:focus{background-color:#fff3;border:1px dotted var(--border-color)}.icon-img-container{width:48px;height:48px;margin-bottom:4px;display:flex;align-items:center;justify-content:center}.icon-img-container img{width:100%;height:100%;image-rendering:pixelated;object-fit:contain}.icon-placeholder{width:100%;height:100%;background:#ccc;border:2px solid #000;display:flex;align-items:center;justify-content:center;font-family:var(--font-header);font-size:24px}.icon-label{font-family:var(--font-ui);font-size:13px;background-color:transparent;color:#fff;text-shadow:1px 1px 0 #000;padding:0 4px;line-height:1.2}.desktop-icon:hover .icon-label{background-color:var(--window-header);color:var(--window-header-text);text-shadow:none}.pixel-icon{width:32px;height:32px;color:#000}.taskbar{position:fixed;bottom:0;left:0;width:100%;height:var(--taskbar-height);background-color:silver;border-top:2px solid #fff;display:flex;align-items:center;justify-content:space-between;padding:3px 6px;z-index:10000;box-shadow:inset 0 1px #fff}.start-btn{display:flex;align-items:center;gap:6px;font-family:var(--font-header);font-size:18px;font-weight:700;padding:2px 8px;height:100%;background:silver;border:2px solid;border-color:#fff #000 #000 #fff;box-shadow:1px 1px #000;margin-right:8px}.start-btn:active,.start-btn.active{border-color:#000 #fff #fff #000;transform:translate(1px,1px);box-shadow:none}.start-icon{font-size:20px}.taskbar-windows{flex:1;display:flex;gap:4px;overflow:hidden;padding:0 4px}.taskbar-item{flex:1;max-width:160px;height:100%;background:silver;border:2px solid;border-color:#fff #000 #000 #fff;font-family:var(--font-ui);font-size:13px;text-align:left;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center}.taskbar-item.active{background:#eee;border-color:#000 #fff #fff #000;font-weight:700}.taskbar-item:active{border-color:#000 #fff #fff #000}.taskbar-tray{border:2px solid;border-color:#808080 #fff #fff #808080;padding:2px 8px;margin-left:8px;background:silver;height:100%;display:flex;align-items:center;justify-content:center;min-width:80px}.taskbar-time{font-family:var(--font-ui);font-size:12px}.taskbar-divider{width:2px;height:80%;background:gray;margin:0 4px;border-right:1px solid #fff}.desktop{position:relative;width:100vw;height:calc(100vh - var(--taskbar-height));overflow:hidden}.desktop-icons-container{padding:24px;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start;height:100%;gap:16px}.mascot-container{position:absolute;bottom:24px;right:24px;width:200px;pointer-events:none;image-rendering:pixelated;z-index:0;opacity:.9}.mascot-container img{width:100%;height:auto;filter:drop-shadow(4px 4px 0 rgba(0,0,0,.4));animation:float 6s ease-in-out infinite}.ghost-king-container{position:absolute;bottom:24px;right:24px;width:200px;height:auto;z-index:10;z-index:0}.ghost-img-wrapper{cursor:pointer;transition:transform .1s;-webkit-user-select:none;user-select:none}.ghost-img-wrapper:active{transform:scale(.95)}.ghost-img-wrapper img{width:100%;height:auto;image-rendering:pixelated;filter:drop-shadow(4px 4px 0 rgba(0,0,0,.4));animation:float 6s ease-in-out infinite}.ghost-bubble{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background-color:#fff;border:2px solid #000;padding:12px;width:200px;margin-bottom:20px;box-shadow:4px 4px #0003;font-family:var(--font-header),monospace;font-size:16px;line-height:1.4;color:#000;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275);z-index:20}.ghost-bubble:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);border-width:10px 10px 0;border-style:solid;border-color:#000 transparent transparent transparent}.ghost-bubble:before{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);border-width:8px 8px 0;border-style:solid;border-color:#fff transparent transparent transparent;z-index:1}.cursor{animation:blink 1s infinite}@keyframes popIn{0%{opacity:0;transform:translate(-50%) scale(.8)}to{opacity:1;transform:translate(-50%) scale(1)}}@keyframes blink{50%{opacity:0}}@keyframes float{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(2deg)}to{transform:translateY(0) rotate(0)}}
