*{margin:0;padding:0;box-sizing:border-box}:root{--icon-spacing: 16px}@media (resolution >= 2dppx){:root{--icon-spacing: 8px}}body{overflow:hidden;font-family:"Press Start 2P",monospace;font-size:10px;-webkit-user-select:none;user-select:none}#desktop{position:relative;width:100vw;height:100vh;overflow:hidden;background:linear-gradient(180deg,#4169aa,#2b4d7e)}#deskbar{position:absolute;top:0;right:0;z-index:9999;display:flex;align-items:center;gap:6px;padding:2px 8px;background:silver;border:2px solid;border-color:#fff #808080 #808080 #fff;box-shadow:2px 2px #0000004d}#beos-logo{display:block;width:auto;height:20px}#deskbar-icons{display:flex;align-items:center;gap:6px;font-size:14px;color:#000}#deskbar-label{font-size:10px;color:#000}#clock{min-width:100px;padding:4px 8px;font-size:10px;text-align:center;background:#fff;border:2px solid;border-color:#808080 #fff #fff #808080}.desktop-icon{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px;width:144px;padding:8px;text-align:center;transition:background-color .1s;cursor:pointer;-webkit-user-select:none;user-select:none}@media (resolution >= 2dppx){.desktop-icon{width:80px}}.desktop-icon:hover{background:#fff3;border-radius:4px}.desktop-icon.selected{background:#ffffff4d;border-radius:4px}.desktop-icon img{width:128px;height:128px;pointer-events:none}@media (resolution >= 2dppx){.desktop-icon img{width:64px;height:64px}}.icon-label{display:block;font-size:9px;line-height:1.3;text-align:center;color:#fff;pointer-events:none;text-shadow:1px 1px 2px rgb(0 0 0 / 80%);white-space:pre-line}.window{position:absolute;display:flex;flex-direction:column;min-width:400px;min-height:300px}.window-titlebar{display:flex;align-items:center;cursor:move}.window-tab{z-index:9999;display:flex;justify-content:space-between;align-items:center;margin-bottom:-1px;padding:4px 12px 4px 4px;background:linear-gradient(180deg,#fd4,#fa0);border:1px solid #000;border-bottom:none}.window-title{font-size:10px;font-weight:700;color:#000}.window-close{display:flex;justify-content:center;align-items:center;width:20px;height:20px;margin-right:8px;font-size:16px;font-weight:700;line-height:1;color:#000;background:linear-gradient(135deg,#ff3,#ffaf13);border-top:1px solid #989800;border-right:1px solid #ff3;border-bottom:1px solid #ff3;border-left:1px solid #989800;cursor:pointer}.window-close:hover{background:linear-gradient(-45deg,#ff3,#ffaf13)}.window-close:active{border-color:#404040 #fff #fff #404040}.window-content{flex:1;padding:16px 16px 16px 0;overflow:auto;background:#fff;border:1px solid #000;box-shadow:0 8px 8px #000c}.file-list{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.file-item{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:8px;transition:background-color .1s;cursor:pointer}.file-item:hover{background:#e0e0e0;border-radius:4px}.file-item img{width:48px;height:48px}.file-item span{font-size:9px;text-align:center;color:#000}.dragging{z-index:10000;opacity:.7}@media (width <= 768px){.desktop-icon{width:70px}.desktop-icon img{width:48px;height:48px}.icon-label{font-size:8px}.window{min-width:90vw;max-width:90vw}#deskbar{gap:4px;padding:2px 4px}#beos-logo{height:16px}#deskbar-icons{gap:4px;font-size:12px}#deskbar-label{font-size:8px}}@media (width <= 480px){.file-list{gap:12px;grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}#clock{min-width:80px;font-size:8px}}