/* A fixed artboard keeps illustrated landmarks and interactive controls aligned. */
body{background:#020e18;overflow:hidden}#lobby{position:fixed;inset:0;padding:0;max-width:none;background:radial-gradient(ellipse,#0c3743,#010b13);overflow:hidden}#gameStage{position:absolute;width:1600px;height:900px;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--stage-scale,1));transform-origin:center;isolation:isolate;overflow:hidden}.world-art{position:absolute;inset:-8px;background:#073943 url('./assets/branding/ocean-world-game-v1.webp') center/cover no-repeat;z-index:-5;transform:translate(var(--pan-x,0px),var(--pan-y,0px)) scale(1.015);transition:transform 1.3s ease-out}.world-shade{position:absolute;inset:0;z-index:-4;pointer-events:none;background:linear-gradient(90deg,#011823e8 0%,#02222eb0 17%,#02222e24 33%,transparent 65%),linear-gradient(0deg,#00121ce8,transparent 25%,transparent 83%,#001623a8)}.sunrays{position:absolute;inset:0;z-index:-3;pointer-events:none;background:linear-gradient(116deg,transparent 27%,#b8fff209 28%,transparent 35%,#c8fff509 45%,transparent 49%);mix-blend-mode:screen;animation:light-drift 16s ease-in-out infinite alternate}.masthead{position:absolute;top:32px;left:48px;right:48px;height:60px;padding:0;border:0;z-index:4}.identity{gap:15px;font-family:serif;font-size:31px;color:#f0ecda;text-shadow:0 2px 12px #00101e;letter-spacing:5px}.identity img{width:50px;height:50px;filter:drop-shadow(0 0 12px #ff68702e)}.identity small{font:9px system-ui;letter-spacing:5px;margin-top:7px;color:#b8cfce}.game-tools{display:flex;gap:11px;align-items:center}.game-tools button{width:45px;height:45px;border:1px solid #bbd4c77d;border-radius:50%;background:linear-gradient(#163e48e6,#05212ce6);box-shadow:inset 0 0 0 3px #03202ac9,0 4px 18px #00141d80;color:#eddfb6;font-size:24px}.game-tools button:hover{border-color:#ffe3a0;color:white;box-shadow:0 0 20px #a9eddf33}.game-tools button[aria-pressed=false]{opacity:.55}.discovery{padding:12px 23px;background:linear-gradient(90deg,#04212cd9,#183e48db);border:1px solid #b3cab344;border-radius:24px;color:#d5c592;font-size:17px;letter-spacing:2px;box-shadow:inset 0 0 0 3px #07232b88}.discovery b{font-weight:400;color:#fff5d8}.discovery small{font-size:10px;letter-spacing:1px;margin-left:12px;color:#c7d3c9}.world-title{position:absolute;left:57px;top:146px;width:300px}.world-title>p:first-child{font-size:10px;letter-spacing:5px;color:#abcfc9}.world-title h1{font-family:"Songti TC","Noto Serif TC",serif;font-size:49px;line-height:1.5;font-weight:500;letter-spacing:5px;margin:18px 0 9px;color:#fff6dc;text-shadow:0 4px 20px #00151d}.world-title h1 span{color:#adeae3}.title-rule{display:flex;align-items:center;gap:10px;color:#d3bc8b;width:214px;font-size:15px}.title-rule:before,.title-rule:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#b8af7c)}.title-rule:after{transform:rotate(180deg)}.world-subtitle{font-size:12px;letter-spacing:2px;line-height:2;color:#b7cfcf}.world-mark{position:absolute;left:50%;top:98px;transform:translateX(-50%);font-size:11px;letter-spacing:4px;color:#ddeddf;text-shadow:0 1px 10px #002332}.world-mark>span{color:#e5cf8c;margin-right:10px}.world-mark small{display:block;text-align:center;font-size:7px;letter-spacing:4px;color:#a2c2c3;margin-top:8px}.world-hotspots{position:absolute;inset:0;pointer-events:none}.world-pin{pointer-events:auto;position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:flex;align-items:center;gap:12px;padding:10px 17px 10px 10px;border:1px solid #abccbe99;border-radius:5px 23px 23px 5px;background:linear-gradient(110deg,#0b3b46ed,#073343d9);box-shadow:inset 0 0 0 3px #061e28aa,0 6px 18px #00151b60;transition:background .2s,box-shadow .2s,border-color .2s;color:#dfeee7;min-width:186px;text-align:left;backdrop-filter:blur(6px)}.world-pin:after{content:'';position:absolute;left:50%;top:100%;height:27px;width:1px;background:linear-gradient(#c9e1bd,transparent)}.pin-diamond{width:30px;height:30px;display:grid;place-items:center;border:1px solid #b9d1b07a;transform:rotate(-5deg);font-family:Georgia,serif;font-size:16px;color:#d8dcb5;box-shadow:inset 0 0 8px #b6dbc022}.pin-name{font-family:"Songti TC",serif;font-size:18px;letter-spacing:2px;white-space:nowrap}.pin-name small{display:block;font-family:system-ui;font-size:6px;letter-spacing:1.5px;color:#a1c9cd;margin-top:4px}.pin-arrow{font-size:23px;margin-left:auto;color:#bfd0b5}.world-pin:hover,.world-pin.selected{border-color:#f1d99a;background:linear-gradient(110deg,#315b60f2,#12495be8);box-shadow:inset 0 0 0 3px #143846,0 0 22px #94e7de45,0 8px 20px #001b2380}.world-pin.selected .pin-diamond{background:#d7c590;color:#16424c}.world-pin.selected .pin-name{color:#fff2c7}.quest-panel{position:absolute;left:48px;top:449px;width:306px;padding:23px 25px 16px;border:1px solid #b9c39480;border-radius:3px 17px 3px 17px;background:linear-gradient(145deg,#1e4951ee,#072730f5 65%);box-shadow:inset 0 0 0 4px #09252e, inset 0 0 0 5px #a2b89529,0 12px 40px #00151b66;backdrop-filter:blur(8px)}.quest-overline{display:block;font-size:9px;letter-spacing:4px;color:#ddd0a0;margin-bottom:15px}.quest-panel #selectedNumber{font:8px system-ui;letter-spacing:1.3px;color:#8db9ba}.quest-panel h2{font-family:"Songti TC",serif;font-size:28px;letter-spacing:4px;font-weight:500;color:#f2edcc;margin:9px 0 12px}.quest-panel p{font-size:11px;line-height:1.9;color:#b5d0cf;min-height:63px;margin:0}.quest-panel #selectedTags{gap:6px;margin:15px 0 17px}.quest-panel #selectedTags span{font-size:8px;padding:4px 7px;color:#d3d8ba;border-color:#b9cdba36}.quest-panel .primary{position:relative;background:linear-gradient(#b9e4d2,#6caeab);border:1px solid #e0e5b0;box-shadow:inset 0 0 0 3px #52898d, inset 0 0 0 4px #d2e4bb70,0 4px 18px #00171f;color:#0a333e;border-radius:4px;font-size:13px;font-weight:600;text-shadow:0 1px #ffffff30;letter-spacing:2px;padding:15px 19px}.quest-panel .primary:hover{background:linear-gradient(#e3f4d8,#95d1bc);box-shadow:0 0 20px #95e4c044}.quest-note{display:block;text-align:center;font-size:8px;letter-spacing:1.5px;color:#799fa7;margin-top:11px}.panel-corner{position:absolute;width:13px;height:13px;border-color:#e5d3a2;pointer-events:none}.panel-corner.tl{left:-3px;top:-3px;border-left:3px double;border-top:3px double}.panel-corner.br{right:-3px;bottom:-3px;border-right:3px double;border-bottom:3px double}.map-whisper{position:absolute;bottom:143px;left:58%;transform:translateX(-50%);font-size:10px;letter-spacing:2px;color:#c8e1d9;text-shadow:0 2px 5px #001b29}.hall-cards{position:absolute;left:393px;right:49px;bottom:55px;height:82px;display:flex;padding:5px;gap:0;background:linear-gradient(#174550ec,#072a35f2);border:1px solid #c9d2af8c;border-radius:9px;box-shadow:inset 0 0 0 3px #0a2933,0 10px 36px #000c1770}.hall-card{flex:1;display:flex;align-items:center;justify-content:center;gap:12px;padding:11px;background:none;border:0;border-right:1px solid #c5dcc626;border-radius:0;color:#b9d1cc}.hall-card:last-child{border:0}.hall-card .hall-symbol{width:37px;height:37px;fill:none;stroke:currentColor;stroke-width:1.3;filter:drop-shadow(0 0 6px #9ce2d14d)}.hall-card strong{font-family:"Songti TC",serif;font-size:16px;letter-spacing:2px;margin:0;font-weight:500}.hall-card small{display:block;margin-top:6px;font-size:7px;letter-spacing:1.5px;color:#87b0b3}.hall-card.selected,.hall-card:hover{background:linear-gradient(#b9e1c928,#a9ded909);color:#f6e3ab}.hall-card.selected:after{content:'◆';position:absolute;bottom:2px;font-size:7px;color:#e9d38f}.hall-card .visited-mark{position:absolute;right:9px;top:7px;font-size:8px;color:#b3dcc5;opacity:0}.hall-card.visited .visited-mark{opacity:1}.studio-credit{position:absolute;bottom:29px;left:57px}.studio-credit img{width:150px;display:block}.studio-credit span{font-size:6px;letter-spacing:1.8px;color:#7da7b0}.world-edition{position:absolute;bottom:23px;right:51px;font-size:7px;letter-spacing:2px;color:#77a1aa}.sea-motes{position:absolute;inset:0;pointer-events:none;z-index:-2;overflow:hidden}.sea-motes i{position:absolute;bottom:-10px;left:var(--x);width:3px;height:3px;border-radius:50%;background:#d2fff0;box-shadow:0 0 9px #a6eee0;animation:sea-rise var(--duration) linear var(--delay) infinite;opacity:0}@keyframes sea-rise{0%{transform:translate(0,0);opacity:0}15%{opacity:.5}75%{opacity:.35}100%{transform:translate(38px,-850px);opacity:0}}@keyframes light-drift{to{transform:translateX(25px);opacity:.55}}.still-water .sunrays,.still-water .sea-motes i{animation-play-state:paused}.still-water .world-art{transform:scale(1.015);transition:none}#atlasDialog{width:760px;max-width:80vw;max-height:90vh;overflow:auto;padding:26px 40px;background:linear-gradient(135deg,#19444e,#052631);color:#e5edde;border:1px solid #c7cc9f;border-radius:15px;box-shadow:inset 0 0 0 5px #05202a;z-index:50}#atlasDialog::backdrop{background:#00151bba;backdrop-filter:blur(12px)}#atlasDialog h2{font-family:serif;font-size:25px;letter-spacing:5px;margin:10px 0 0}#atlasDialog #floorMap{width:100%;max-height:59vh;display:block}#atlasDialog #mapEnter{display:flex;max-width:300px;margin:auto;background:#dbe7bc;color:#163840;padding:12px 20px}#atlasDialog>p{font-size:10px;text-align:center;color:#96b9bd}#closeAtlas{position:absolute;right:20px;top:15px;background:none;color:#d7ddbe;font-size:27px}.in-exhibit #atlasDialog{display:none}#exhibit{animation:exhibit-reveal .55s ease}@keyframes exhibit-reveal{from{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.sea-motes i,.sunrays{animation:none}.world-art{transition:none}#exhibit{animation:none}}
.exhibit-actions{display:flex;align-items:center;gap:9px}#hallAudioPanel{position:fixed;right:28px;top:104px;z-index:40;width:310px;padding:25px;background:linear-gradient(145deg,#20454ff5,#06232ef7);border:1px solid #b9c69c88;border-radius:12px;box-shadow:0 16px 60px #000a1466;backdrop-filter:blur(18px);color:#dce8de}#closeHallAudio{position:absolute;right:14px;top:10px;border:0;background:none;color:#dce8de;font-size:25px}#hallAudioPanel h2{font-family:serif;font-size:25px;letter-spacing:3px;margin:14px 0 8px}#hallAudioPanel p{font-size:11px;color:#a8c9ca;line-height:1.8}#hallAudioPanel label{display:block;font-size:12px;margin-top:22px}#hallAudioPanel output{float:right;color:#d9e4b9}#hallAudioPanel input{width:100%;margin:12px 0 3px;accent-color:#cde4ba}#hallSoundMute{display:block;width:100%;padding:12px;border-radius:5px;background:#d9e4b9;color:#15363f;margin-top:22px;font-size:12px}#hallAudioPanel small{display:block;font-size:9px;line-height:1.9;color:#739ba8}#exhibitSound{min-width:42px}
