/* A monitor containing an operating system, with real window controls. */
dialog.computer-modal{width:min(1240px,98vw);max-height:98dvh;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;overflow:auto}
.computer-modal>.modal-header{display:none}
.computer-modal #modal-body{padding:0!important}
.computer-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 14px 9px;color:#d9e4e8;font:12px/1.3 system-ui,sans-serif;letter-spacing:.1em}
.computer-exit{background:#20323fe8;color:#edf5f7;border:1px solid #7a8f9b;border-radius:6px;padding:9px 13px;font-size:14px;letter-spacing:normal}
.computer-exit:hover{background:#334f62}
.computer-case{border:12px solid #20252c;border-bottom:0;border-radius:19px;background:#20252c;box-shadow:0 24px 80px #000a,0 0 0 1px #818995,inset 0 0 0 2px #080a0d;overflow:hidden;padding:2px 2px 0}
.computer-display{position:relative;height:min(735px,calc(100dvh - 145px));min-height:370px;overflow:hidden;background:radial-gradient(ellipse at 77% 60%,#3981b9 0,transparent 53%),radial-gradient(ellipse at 18% 120%,#70b4d8 0,transparent 52%),linear-gradient(130deg,#092e62,#164d89 55%,#133b76);border:1px solid #070d15;border-radius:5px;display:flex;flex-direction:column;color-scheme:dark}
.computer-display::after{content:'';position:absolute;inset:0;border:1px solid #c8e4ff25;border-radius:inherit;pointer-events:none}
.computer-chin{height:29px;display:flex;align-items:center;justify-content:center;position:relative;color:#818b94;font:10px system-ui;letter-spacing:.32em}
.computer-led{position:absolute;right:17px;width:5px;height:5px;border-radius:50%;background:#98cfb5;box-shadow:0 0 5px #98cfb5a0}
.computer-led.booting{background:#e8bd78;box-shadow:0 0 5px #e8bd7890}
.os-workspace{flex:1;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;padding:18px}
.os-window{width:91%;height:91%;display:flex;flex-direction:column;min-height:0;border:1px solid #7e98ac;border-radius:8px;box-shadow:0 10px 35px #00162d88;background:#182c37;overflow:hidden}
.os-window.os-window-maximized{width:100%;height:100%;border-radius:0}
.os-titlebar{display:flex;align-items:center;gap:9px;background:#dce7ef;color:#172a3a;min-height:39px;padding-left:13px;flex-shrink:0;font:13px/1.2 'Segoe UI',system-ui,sans-serif}
.os-app-icon{display:flex;width:18px;height:18px;color:#3b698a;flex-shrink:0}
.os-app-icon svg{width:18px;height:18px}
.os-window-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.os-window-controls{display:flex;align-self:stretch}
.os-window-controls button{width:43px;min-height:39px;background:transparent;color:#243c50;font:20px/1 system-ui}
.os-window-controls button:hover{background:#bdcedd}.os-window-controls button:last-child:hover{background:#bf3f49;color:white}
.os-content{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:22px;color:#e9f0ee;background:#172d38}
.os-taskbar{display:flex;align-items:center;gap:9px;min-height:48px;padding:4px 10px;background:#d9e7f0ed;color:#213c50;border-top:1px solid #f7fcff88;flex-shrink:0;font-family:'Segoe UI',system-ui,sans-serif}
.os-start,.os-task{background:transparent;color:#234965;display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid transparent;border-radius:5px;font-size:14px;min-height:38px}
.os-start svg,.os-task svg{width:23px;height:23px;flex-shrink:0}
.os-start:hover,.os-task:hover:not(:disabled){background:#ffffff80;border-color:#c1d2e0}
.os-task{background:#ffffff60;max-width:43%;border-bottom:2px solid #3485b7}.os-task:disabled{opacity:.7;border-bottom-color:transparent}.os-task>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.os-tray{display:flex;align-items:center;gap:12px;margin-left:auto;color:#264860}
.os-tray button{background:transparent;color:inherit;font-size:22px;width:34px;height:36px;border-radius:5px}.os-tray button:hover{background:#ffffff88}
.os-clock{display:flex;flex-direction:column;font-size:12px;line-height:1.35;min-width:45px;text-align:right;margin-right:6px}
.os-start-menu{position:absolute;bottom:55px;left:12px;background:#eaf2f8;color:#1b3449;border:1px solid #bcd1df;border-radius:9px;padding:18px;width:min(320px,90%);box-shadow:0 10px 35px #001e4266;z-index:9}
.os-start-menu strong{display:block;font-size:16px;margin:0 5px 13px}
.os-start-menu button{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:transparent;color:#1c405b;padding:12px 8px;font-size:15px;border-radius:5px}.os-start-menu button:hover{background:#cfdfec}
.os-start-menu svg{width:23px;height:23px}
.computer-modal .computer-desktop{position:absolute;inset:0;min-height:0;background:transparent;border:0;border-radius:0;padding:25px;margin:0}
.computer-modal .desktop-folder{margin:0;width:136px;padding:12px 8px;min-height:135px;gap:7px;background:transparent;border:1px solid transparent;border-radius:4px;font-family:'Segoe UI',system-ui,sans-serif}
.computer-modal .desktop-folder:hover,.computer-modal .desktop-folder:focus-visible{background:#83bef04a;border-color:#bcdeff7a}
.computer-modal .desktop-folder strong{font-size:14px;font-weight:500;line-height:1.25;color:white;text-shadow:0 2px 4px #082340}.computer-modal .desktop-folder small{font-size:11px;color:#d0e4f7;text-shadow:0 1px 3px #092f55}
.os-desktop-folder-icon{display:block;width:64px;height:52px;filter:drop-shadow(0 3px 3px #00183466)}
.os-desktop-folder-icon svg{display:block;width:100%;height:100%}
.computer-modal .desktop-hint{position:absolute;left:28px;bottom:15px;font:13px 'Segoe UI',system-ui,sans-serif;color:#e0effb;margin:0;text-shadow:0 1px 2px #103d65}
.computer-modal .file-browser{border:0;min-height:0;border-radius:0;background:#f4f7fa;color:#1f3b50;margin:-22px}
.computer-modal .file-path{background:#e8eff5;border-bottom:1px solid #ccd9e3;padding:13px 18px;font:14px 'Segoe UI',system-ui,sans-serif;gap:12px}.computer-modal .file-path .text-button{color:#315f81}
.computer-modal .file-instruction{font:14px/1.5 'Segoe UI',system-ui,sans-serif;color:#4f6b81;padding:9px 20px;margin:0;background:#fff}
.computer-modal .file-list{padding:10px 15px 24px;min-height:235px;background:#fff}
.computer-modal .file-entry{background:white;color:#1f3b50;border:1px solid transparent;border-radius:3px;padding:14px 12px;margin:3px 0;font-family:'Segoe UI',system-ui,sans-serif;gap:15px}
.computer-modal .file-entry:hover:not(:disabled){background:#e2f0fc;border-color:#b8d7ef}.computer-modal .file-entry strong{font-size:15px;font-weight:500}.computer-modal .file-entry small{font-size:13px;color:#60788b}.computer-modal .file-entry .file-symbol{color:#4d82a7;text-shadow:none}.computer-modal .file-tag{color:#4e7688}.computer-modal .game-symbol{color:#379478!important}
.os-content.os-notepad{background:#fff;color:#162b3c;padding:0}
.computer-modal .found-note{background:white;color:#263d4b;border:0;border-radius:0;padding:26px 30px;min-height:0;font-family:'Consolas','Courier New',monospace}
.computer-modal .found-note .eyebrow{font:13px/1.4 Consolas,monospace;letter-spacing:0;color:#647d8e}.computer-modal .found-note p{font:23px/1.6 Consolas,monospace;color:#1e3545}.computer-modal .found-note div{font:16px/1.7 Consolas,monospace}.computer-modal .found-note small{font:14px Consolas,monospace;color:#557085}
.os-notepad>.button-row{margin:0;padding:0 30px 25px}.os-notepad .primary{font-size:14px}
.display-boot .os-workspace{padding:0;background:#071219}.computer-modal .power-view,.computer-modal .boot-view{width:100%;height:100%;min-height:0;border:0;border-radius:0;background:#071219}
.computer-modal .os-game{padding:14px 18px}.computer-modal .unfinished-stage{width:min(100%,calc((100dvh - 455px)*16/9));min-width:min(100%,380px)}
.computer-modal .dummy-dialogue{margin-top:10px;padding:9px 12px}.computer-modal .dummy-dialogue img{height:66px;width:51px}.computer-modal .dummy-dialogue p{font-size:15px;line-height:1.45}
.computer-modal .game-bottom{gap:15px;margin-top:11px}.computer-modal .game-actions{gap:9px}.computer-modal .game-actions .text-button{font-size:13px}.computer-modal .move-instruction{font-size:13px}
.room-poster-target{position:absolute;left:51.25%;top:2.59%;width:10.42%;height:20.74%;background:transparent;border:2px solid transparent;z-index:2;cursor:zoom-in;border-radius:2px}.room-poster-target:hover,.room-poster-target:focus-visible{border-color:#ffe4a5;background:#ffe4a51a}
.poster-preview{display:block;width:100%;max-height:400px;object-fit:contain;background:#10242e;border:1px solid #5a7480;border-radius:5px;margin:15px auto}
#poster-large-preview .poster-preview{max-height:65dvh}
@media(max-width:700px){.computer-top{margin:0 5px 7px;font-size:10px;gap:10px}.computer-exit{padding:7px 9px;font-size:12px}.computer-case{border-width:6px;border-bottom:0;border-radius:11px}.computer-display{height:calc(100dvh - 112px);min-height:330px}.computer-chin{height:22px}.os-workspace{padding:7px}.os-window{width:100%;height:100%;border-radius:4px}.os-titlebar{gap:6px;padding-left:8px}.os-window-controls button{width:34px}.os-content{padding:15px}.computer-modal .file-browser{margin:-15px}.os-start{padding:6px}.os-start>span{display:none}.os-task{max-width:55%;font-size:12px;padding:5px}.os-tray{gap:4px}.os-taskbar{gap:5px;padding-inline:6px}.computer-modal .os-game{padding:10px}.computer-modal .unfinished-stage{width:100%;min-width:0}.computer-modal .game-bottom{align-items:stretch}.computer-modal .game-actions{align-items:stretch}.computer-modal .computer-desktop{padding:15px}.computer-modal .desktop-folder{width:122px}.computer-modal .found-note{padding:20px}.computer-modal .found-note p{font-size:20px}.os-notepad>.button-row{padding:0 20px 20px}}

.computer-modal .desktop-icons{display:flex;flex-wrap:wrap;gap:12px}.computer-modal .computer-desktop{overflow:auto;padding-bottom:65px}.desktop-story-notice{max-width:510px;margin:20px 0 30px;padding:16px 20px;background:#10335be8;border:1px solid #91c8ed;border-radius:6px;color:#fff;font:16px/1.5 'Segoe UI',system-ui,sans-serif}.desktop-story-notice p{margin:6px 0 0}.computer-modal .desktop-hint{position:static;margin-top:18px}.computer-modal .desktop-folder small{font-size:14px}

.character-bubble{position:absolute;z-index:5;max-width:min(310px,62%);width:310px;transform:translate(-50%,-100%);background:#fff;color:#172733;border:2px solid #243e50;border-radius:14px;padding:10px 14px;box-shadow:0 4px 0 #0003;font:16px/1.35 'Segoe UI',sans-serif}.character-bubble[hidden],.dummy-dialogue[hidden]{display:none}.character-bubble:after{content:"";position:absolute;bottom:-10px;left:50%;width:16px;height:16px;background:#fff;border-right:2px solid #243e50;border-bottom:2px solid #243e50;transform:rotate(45deg)}.character-bubble p{margin:0 0 5px}.character-bubble button{position:relative;z-index:1;color:#174c85;font-size:14px;padding:4px}.desktop-character-symbol{font:48px/52px system-ui;color:#d3eeff;text-shadow:0 3px 4px #123}

.character-bubble.bubble-below{transform:translateX(-50%)}.character-bubble.bubble-below:after{top:-10px;bottom:auto;transform:rotate(225deg)}@media(max-width:700px){.character-bubble{font-size:14px;max-width:70%;padding:7px 10px}}

.dance-game{max-width:850px;margin:auto}.dance-luna{display:flex;gap:14px;align-items:center;background:#102c40;color:#fff;padding:12px 16px;border-radius:12px}.dance-luna img{width:58px;height:64px;object-fit:cover;object-position:top}.dance-luna p{margin:5px 0;font-size:16px}.dance-luna strong{color:#f7cd6b}.dance-stage{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center;background:linear-gradient(145deg,#193c5d,#312151);border-radius:12px;margin-top:12px;padding:10px}.dance-stage canvas{width:100%;image-rendering:pixelated}.dance-track{height:260px;position:relative;overflow:hidden;border-radius:10px;background:repeating-linear-gradient(90deg,#ffffff0b 0%,#ffffff0b 24.5%,#ffffff30 24.5%,#ffffff30 25%)}.dance-targets{position:absolute;top:80%;left:0;right:0;transform:translateY(-50%);display:flex;border-block:2px solid #f4d274;background:#f4d27422}.dance-targets span{width:25%;text-align:center;font:32px/42px system-ui;color:#d7c28f}.dance-note{position:absolute;transform:translate(-50%,-50%);font:bold 35px/1 system-ui;color:#80e7ff;text-shadow:0 2px 3px #000}.dance-pads{display:flex;justify-content:center;gap:12px}.dance-pads button{font:30px system-ui;width:60px;height:52px;background:#243b58;color:white;border:2px solid #85c8e0;border-radius:10px;touch-action:manipulation}.dance-pads button:active{background:#8556b5}#dance-feedback{text-align:center;min-height:24px;font-weight:600}@media(max-width:600px){.dance-track{height:195px}.dance-stage{gap:8px;padding:6px}.dance-luna{padding:8px}.dance-luna p{font-size:14px}.dance-pads{gap:8px}.dance-pads button{width:52px}.dance-note{font-size:28px}}

.room-dance{position:absolute;inset:0;z-index:20;overflow:hidden}.room-dance>#dance-character{position:absolute;left:22%;bottom:20%;width:31%;height:auto;image-rendering:pixelated;filter:drop-shadow(0 7px 3px #10252c44)}.room-dance-hud{position:absolute;top:3%;right:4%;width:29%;height:57%;padding:8px 10px;background:#0b233fd9;border:1px solid #82b8d88c;border-radius:12px;color:white;display:flex;flex-direction:column;gap:6px}.room-dance .dance-track{flex:1;min-height:50px;height:auto}.room-dance #dance-feedback{margin:0;font-size:14px;line-height:1.2;min-height:17px}.room-dance .dance-pads{gap:5px}.room-dance .dance-pads button{width:24%;height:34px;font-size:23px;padding:0}.room-dance-dialogue{position:absolute;left:3%;right:3%;bottom:3%;padding:10px 15px;border:1px solid #bfa469;box-shadow:0 4px 15px #0005;max-height:36%;overflow:auto}.room-dance-dialogue>div{flex:1}.room-dance-dialogue .button-row{margin-top:7px;gap:8px}.room-dance-dialogue button{padding:7px 11px;font-size:14px}.room-dance-dialogue .hint{font-size:14px;margin:3px 0}.dancing-in-room .hotspot{visibility:hidden}@media(max-width:650px){.room-dance-hud{top:2%;right:2%;width:37%;height:54%;padding:5px}.room-dance>#dance-character{left:12%;width:35%;bottom:28%}.room-dance-dialogue{left:2%;right:2%;bottom:2%;padding:6px 8px;max-height:42%;gap:8px}.room-dance-dialogue img{width:38px;height:45px}.room-dance-dialogue p{font-size:14px;line-height:1.2}.room-dance-dialogue .hint{display:none}.room-dance .dance-targets span{font-size:24px;line-height:28px}.room-dance #dance-feedback{font-size:12px}.room-dance .dance-pads button{height:28px;font-size:20px}}