:root{color-scheme:dark;--bg:#151421;--panel:#1e1d2e;--line:#353347;--muted:#aaa5bd;--text:#f6f0ec;--lavender:#c4aff7;--mint:#8bd3bb;--gold:#f6c879;--danger:#f8a2a7;font-family:ui-rounded,"Hiragino Maru Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;color:var(--text);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 70% 25%,#28213b44,transparent 55%),var(--bg);font-size:14px}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.48}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid var(--lavender);outline-offset:4px}button{transition:background .15s,transform .15s,border-color .15s}button:active:not(:disabled){transform:translateY(2px)}button:disabled:active{transform:none}a{color:inherit;text-decoration:none}[hidden]{display:none!important}canvas{image-rendering:pixelated}h1,h2,h3,p{margin:0}button svg{display:block}kbd{font-family:inherit;font-size:10px;border:1px solid #504b64;background:#252335;border-radius:4px;padding:2px 5px;white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.site-header{height:98px;max-width:1216px;padding:0 32px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #343044}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:800;letter-spacing:1px;white-space:nowrap}.brand-cat{width:40px;height:40px}.brand-night{color:var(--lavender)}.brand small{display:block;font-size:8px;letter-spacing:3.5px;color:#9890aa;font-weight:500;margin-top:3px}.header-actions{display:flex;align-items:center;gap:11px}.online-badge{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:1.3px;color:#b3a8c4;margin-right:14px}.online-badge i,.tiny-dot,.connection-status i{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px #8bd3bb42;display:inline-block}.icon-button{border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;gap:6px;background:transparent;padding:8px 10px;font-size:11px;color:#bfb5d0;min-height:36px}.icon-button span:first-child{font-size:16px}.icon-button[aria-pressed="true"]{background:#393047;border-color:#70607f;color:var(--gold)}.text-button{border:0;background:transparent;padding:9px 4px;font-size:12px;color:#c3b9d0}.text-button:hover{color:var(--text)}.header-actions>.text-button{margin-left:14px}.site-footer{max-width:1152px;margin:50px auto 0;padding:24px 0 28px;border-top:1px solid #343044;display:flex;justify-content:space-between;gap:16px;font-size:10px;color:#847e95;letter-spacing:.2px}.footer-dot{margin:0 8px;color:#584e65}
.home-screen{max-width:1152px;margin:55px auto 0;display:grid;grid-template-columns:1fr 1fr;column-gap:72px;row-gap:45px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--lavender);font-weight:700;line-height:1.5}.hero-copy>.eyebrow{font-size:12px;letter-spacing:1.5px;margin-bottom:20px}.little-spark{color:var(--gold);font-size:16px;margin-right:6px}.hero-copy h1{font-size:43px;letter-spacing:.015em;line-height:1.5;font-weight:800}.hero-copy h1>span{color:var(--gold)}.hero-description{font-size:13px;line-height:1.95;color:#bdb3cc;margin-top:17px}.play-card{margin-top:27px;background:linear-gradient(130deg,#252132cc,#1b1a2a);padding:24px;border:1px solid #3c354a;border-radius:16px;box-shadow:0 20px 50px #09081030}.field-row{display:flex;justify-content:space-between;gap:12px;font-size:11px;margin-bottom:8px;font-weight:700}.field-row>span:last-child{color:#8e859f;font-size:9px;font-weight:400}.play-card>input,.join-form input{width:100%;border:1px solid #494155;border-radius:8px;padding:12px 13px;background:#151321;color:var(--text);min-height:42px;font-size:13px}.role-heading{margin-top:19px}.role-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}.role-option{display:flex;align-items:center;gap:6px;background:#1b1828;border:1px solid #40384e;border-radius:9px;text-align:left;padding:8px 9px;min-height:66px;position:relative}.role-option canvas{width:44px;height:44px;flex-shrink:0}.role-option strong{display:block;font-size:12px}.role-option small{display:block;font-size:9px;color:#aba1b9;line-height:1.7}.role-option.selected{background:#392e3c;border-color:var(--gold)}.role-option[data-role="killer"].selected{background:#332b45;border-color:var(--lavender)}.selection-dot{margin-left:auto;width:11px;height:11px;border-radius:50%;border:1px solid #5a4f69;flex-shrink:0}.selected .selection-dot{background:var(--gold);border-color:var(--gold);box-shadow:inset 0 0 0 3px #382c3b}.role-option[data-role="killer"].selected .selection-dot{background:var(--lavender);border-color:var(--lavender)}.button-primary{border:1px solid #ffda94;background:var(--gold);color:#342333;font-weight:800;min-height:44px;padding:12px 18px;border-radius:8px;font-size:13px;box-shadow:0 3px 0 #a7734255}.button-primary:hover:not(:disabled){background:#ffdc99}.play-button{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:15px;padding:14px 18px;min-height:51px}.play-button>span:last-child{font-size:21px}.solo-note{font-size:9px;color:#a198b1;text-align:center;margin-top:11px}.friend-divider{display:flex;align-items:center;gap:12px;font-size:9px;color:#968ba8;margin:18px 0 13px}.friend-divider:before,.friend-divider:after{content:"";flex:1;height:1px;background:#3c344b}.friend-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.button-secondary{min-height:42px;border:1px solid #54485f;color:#e0d4ec;background:#2b2537;border-radius:8px;padding:10px 13px;font-size:11px;font-weight:700}.button-secondary:hover:not(:disabled){background:#3b314a;border-color:#857196}.friend-actions button{display:flex;align-items:center;justify-content:space-between}.join-form{display:flex;gap:8px;margin-top:12px}.join-form input{min-width:0;font-family:monospace;text-transform:uppercase;font-size:15px;letter-spacing:3px}.join-form button{flex-shrink:0}.form-error{font-size:12px;color:var(--danger);margin-top:12px;line-height:1.7}
.hero-visual{align-self:center;position:relative;margin:12px 0 25px;min-width:0}.cave-illustration{border:1px solid #483954;border-radius:17px;background:#100e1c;position:relative;overflow:hidden;box-shadow:0 35px 100px #09071375;transform:rotate(-2deg)}.cave-label{padding:17px 19px;display:flex;align-items:center;gap:8px;color:#92809f;letter-spacing:1.4px;font-size:7px;background:#201a2a;border-bottom:1px solid #3c2d48}.cave-label .tiny-dot{width:5px;height:5px;background:#c2a0ed}.cave-illustration canvas{width:100%;display:block;aspect-ratio:1}.cave-caption{padding:18px 21px;background:#201a2a;border-top:1px solid #3c2d48;display:flex;justify-content:space-between;font-size:11px;color:#d6c7e3}.cave-coordinate{font-size:8px;letter-spacing:1.5px;color:#917e9e}.floating-note{position:absolute;padding:13px 16px;border:1px solid #675272;border-radius:12px;display:flex;align-items:center;gap:12px;box-shadow:0 12px 24px #0003;background:#2b2138eF;font-size:10px;color:#b9a7c7;line-height:1.8;transform:rotate(2deg)}.floating-note strong{color:#e9d9ee;font-weight:700}.note-crystal{top:86px;right:-25px}.crystal-icon{color:#b497f3;font-size:28px;display:inline-block;text-shadow:0 0 16px #a28cdc60}.note-ghost{bottom:100px;left:-30px;transform:rotate(-4deg)}.note-ghost canvas{width:42px;height:42px}.visual-footer{margin-top:30px;display:flex;justify-content:center;gap:25px;font-size:10px;color:#9f91b1}.visual-footer .tiny-dot{width:4px;height:4px;margin-right:6px}.intro-strip{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);padding-top:28px;border-top:1px solid #353044;gap:24px}.intro-strip>div{display:flex;align-items:center;gap:15px}.strip-icon{font-size:10px;color:#b7a2ce;border:1px solid #4c3f5c;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:#252031;flex-shrink:0}.intro-strip strong{font-size:12px;display:block;letter-spacing:.4px;margin-bottom:7px}.intro-strip p>span{display:block;font-size:10px;color:#94899f;line-height:1.5}
.lobby-screen{max-width:1050px;margin:55px auto}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:35px}.section-heading h1{font-size:29px;margin:12px 0;line-height:1.5}.section-heading p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.8}.section-heading>button{margin-top:18px}.lobby-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:24px}.party-panel,.invite-panel,.self-panel,.team-panel,.controls-panel{border:1px solid #43394f;background:linear-gradient(140deg,#242032,#1d1b2b);border-radius:13px;padding:22px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:17px}.panel-heading h2{font-size:12px;letter-spacing:.5px}.panel-heading>span{font-size:9px;color:#94849f;letter-spacing:1px}.lobby-players{display:grid;gap:10px}.lobby-player{display:flex;align-items:center;gap:13px;padding:12px;border:1px solid #43364c;border-radius:9px;min-height:76px;background:#1b1827}.lobby-player canvas{width:42px;height:42px;flex-shrink:0}.lobby-player h3{font-size:13px;display:flex;gap:7px;align-items:center;flex-wrap:wrap}.lobby-player p{color:#9c8dad;font-size:10px;margin-top:5px}.host-badge{font-size:8px;padding:2px 5px;border-radius:4px;background:#48384d;color:var(--gold);letter-spacing:.4px}.player-state{margin-left:auto;font-size:9px;color:var(--mint);white-space:nowrap}.player-empty{border-style:dashed;background:transparent;color:#8f7e9a}.player-empty .empty-icon{font-size:21px;width:42px;text-align:center;color:#756681}.lobby-start{margin-top:24px}.lobby-start p{font-size:10px;text-align:center;color:#9d8fac;margin-top:11px;line-height:1.7}.invite-panel{text-align:center;padding:32px 24px}.invite-icon{font-size:29px;color:var(--lavender)}.invite-panel h2{font-size:18px;margin:16px 0 12px}.invite-panel>p{font-size:11px;color:#a99abb;line-height:1.8}.room-code{background:#15121f;border:1px dashed #685078;border-radius:10px;font:700 31px/1.4 monospace;letter-spacing:7px;color:var(--gold);padding:18px 14px;margin:21px 0 15px;overflow-wrap:anywhere}.invite-panel>button{width:100%}.invite-panel .invite-note{font-size:9px;margin-top:12px}.small-rule{text-align:left;background:#33283d;border-radius:9px;padding:18px;margin-top:32px}.small-rule strong{font-size:11px;color:var(--gold)}.small-rule p{font-size:11px;line-height:1.9;color:#c0abc9;margin-top:9px}
.game-screen{max-width:1090px;margin:25px auto 0}.game-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;gap:15px}.game-topline>div:first-child{display:flex;align-items:center;gap:18px}.game-room{font-family:monospace;font-size:11px;letter-spacing:1px;color:#887c96}.game-top-actions{display:flex;gap:18px;align-items:center}.connection-status{font-size:10px;color:#a59bb3;display:flex;align-items:center;gap:6px}.connection-status i{width:5px;height:5px}.connection-status.offline{color:var(--gold)}.connection-status.offline i{background:var(--gold)}.game-layout{display:grid;grid-template-columns:minmax(0,680px) minmax(255px,1fr);gap:24px;align-items:start}.game-main{min-width:0}.game-hud{border:1px solid #4b3c59;border-radius:12px 12px 0 0;background:#282033;min-height:75px;padding:14px 22px;display:flex;justify-content:space-between;align-items:center;gap:12px}.objective-hud{display:flex;align-items:center;gap:12px}.objective-hud .crystal-icon{font-size:28px}.objective-hud small,.timer-hud small{display:block;font-size:9px;color:#b6a0c2;letter-spacing:.7px;margin-bottom:3px}.objective-hud strong{font-size:20px;line-height:1.1;font-family:system-ui,sans-serif}.objective-hud strong span{font-size:13px;color:#9584a4;font-weight:500}.crystal-dots{display:flex;gap:6px;margin-left:12px}.crystal-dots i{width:9px;height:13px;background:#504064;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}.crystal-dots i.found{background:#c2a1f7;filter:drop-shadow(0 0 6px #b992f7)}.timer-hud{text-align:right}.timer-hud strong{font-size:23px;font-family:system-ui,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:1px;color:var(--gold);font-weight:600}.timer-hud.urgent strong{color:var(--danger)}.board-wrap{position:relative;border:1px solid #4b3c59;border-top:0;background:#090811;aspect-ratio:1;overflow:hidden}.board-wrap:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 60px #03020a88;pointer-events:none}#game-canvas{display:block;width:100%;height:100%;touch-action:none}.board-corner{position:absolute;width:18px;height:18px;border-color:#b89cce;pointer-events:none;opacity:.55}.top-left{left:12px;top:12px;border-left:1px solid;border-top:1px solid}.bottom-right{right:12px;bottom:12px;border-right:1px solid;border-bottom:1px solid}.board-depth{position:absolute;left:22px;bottom:17px;color:#4a3d61;letter-spacing:2px;font-size:6px;pointer-events:none}.board-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 4px;color:#91829f;font-size:9px;letter-spacing:.2px}.self-marker{display:inline-block;width:8px;height:3px;background:#7be6d6;margin-right:7px;vertical-align:middle}.game-sidebar{display:grid;gap:14px}.self-panel,.team-panel,.controls-panel{padding:17px}.self-heading{display:flex;align-items:center;gap:9px;margin-bottom:17px}.self-heading canvas{width:46px;height:46px;flex-shrink:0}.self-heading h2{font-size:14px;margin-top:5px;max-width:154px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.self-heading>div>span{font-size:9px;color:#b4a1c2}.status-tag{margin-left:auto;font-size:8px;color:var(--mint);background:#8bd3bb12;border:1px solid #8bd3bb38;border-radius:5px;padding:4px 5px;white-space:nowrap}.status-tag.captured{color:var(--danger);background:#f8a2a712;border-color:#f8a2a744}.stamina-label{display:flex;justify-content:space-between;font-size:9px;color:#ac9eba;margin-bottom:8px}.stamina-label strong{font-size:9px;font-weight:500;color:var(--mint);font-variant-numeric:tabular-nums}.stamina-track{height:5px;background:#45334f;border-radius:3px;overflow:hidden}.stamina-track>div{height:100%;background:var(--mint);width:100%;transition:width .15s;border-radius:3px}.upgrade-stats{display:flex;justify-content:space-between;gap:15px;color:#b8a4c8;font-size:10px;margin-top:12px}.upgrade-stats strong{color:#e5d5ef;margin-left:8px;font-weight:500}.gaze-status{display:flex;align-items:center;gap:10px;border-top:1px solid #403047;margin-top:15px;padding-top:14px}.gaze-status>span{font-size:21px;color:var(--lavender)}.gaze-status strong{display:block;font-size:10px;font-weight:600}.gaze-status small{display:block;font-size:8px;color:#a28cb5;margin-top:4px}.gaze-status>i{margin-left:auto;width:6px;height:6px;background:var(--mint);border-radius:50%;flex-shrink:0}.gaze-status.cooldown>i{background:var(--gold);animation:gentle-blink 2s steps(2) infinite}.gaze-status.cooldown>span{color:var(--gold)}.team-list{display:grid;gap:9px}.team-row{display:flex;align-items:center;gap:8px;font-size:10px}.team-row canvas{width:28px;height:28px;flex-shrink:0}.team-name{max-width:125px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#d7c7e0}.bot-label{font-size:7px;border:1px solid #5b4567;color:#a58cb9;padding:1px 3px;border-radius:3px;margin-left:5px}.team-state{margin-left:auto;font-size:8px;color:#a59aae;white-space:nowrap}.team-state.active{color:var(--mint)}.team-state.captured{color:var(--danger)}.team-state.escaped{color:var(--gold)}.team-state.eliminated{color:#85758e}.team-row.eliminated canvas,.team-row.eliminated .team-name{opacity:.45}.controls-panel .panel-heading{margin-bottom:14px}.control-key{letter-spacing:0!important;font-size:8px!important}.touch-controls{display:flex;gap:16px;align-items:center}.dpad{display:grid;grid-template-columns:repeat(3,36px);grid-template-rows:repeat(3,36px);gap:4px;flex-shrink:0;user-select:none;touch-action:none}.direction-button{border:1px solid #61516e;background:#362a43;border-radius:7px;font-size:21px;line-height:1;padding:0;touch-action:none;user-select:none}.direction-button:hover,.direction-button.pressed{border-color:var(--lavender);background:#594169}.dir-up{grid-area:1/2}.dir-left{grid-area:2/1}.dir-right{grid-area:2/3}.dir-down{grid-area:3/2}.dpad-center{grid-area:2/2;display:grid;place-items:center;color:#706080;font-size:16px}.action-buttons{display:grid;gap:9px;flex:1;min-width:0}.action-buttons>button{font-size:9px;min-height:37px;padding:8px 8px;display:flex;align-items:center;justify-content:space-between;gap:4px}.turn-button{border:1px solid #574161;background:#2b2335;border-radius:7px;color:#b8a1c7}.turn-button span{font-size:14px}.turn-button[aria-pressed="true"]{color:var(--gold);background:#493644;border-color:#af8355}.control-tip{font-size:8px;color:#9981ac;line-height:1.8;margin-top:12px}.control-tip kbd{font-size:8px}.mission-tip{display:flex;gap:10px;padding:0 5px;color:#a995b9}.mission-tip>span{font-size:17px;color:var(--gold)}.mission-tip p{font-size:10px;line-height:1.85}.mission-tip kbd{font-size:8px}.event-panel{padding:12px 17px;background:#1c1729;border:1px solid #3c2d48;border-radius:9px}.event-heading{font-size:8px;letter-spacing:.6px;color:#9c83af}.event-panel p{font-size:10px;line-height:1.8;margin-top:7px;color:#ccb3dd;min-height:1.8em}
.actor-overlay{position:absolute;z-index:2;bottom:40px;left:50%;transform:translateX(-50%);width:85%;max-width:370px;padding:20px;text-align:center;background:#211b2eeF;border:1px solid #a36989;border-radius:13px;box-shadow:0 15px 40px #0007}.actor-overlay>span{font-size:24px;color:var(--danger)}.actor-overlay h2{font-size:16px;margin:10px 0}.actor-overlay p{font-size:11px;color:#cab6d5;line-height:1.8}.reconnect-overlay{position:absolute;inset:0;background:#100d1cdb;z-index:6;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:17px;text-align:center;padding:25px}.reconnect-overlay strong{font-size:16px}.reconnect-overlay p{font-size:11px;color:#bca4ca;line-height:1.8}.loading-ring{width:29px;height:29px;border:2px solid #665078;border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}.result-overlay{position:absolute;inset:0;background:#0f0c1bcd;z-index:4;display:grid;place-items:center;padding:22px}.result-card{background:linear-gradient(145deg,#36283f,#211a30);border:1px solid #796087;border-radius:17px;width:100%;max-width:360px;text-align:center;padding:20px 26px;box-shadow:0 20px 60px #0007}.result-card canvas{width:76px;height:76px;margin:0 auto 3px}.result-card h2{font-size:25px;line-height:1.5;color:var(--gold);margin:10px 0}.result-card>p:not(.eyebrow){font-size:11px;line-height:1.85;color:#c3afd0}.result-stats{display:flex;justify-content:center;gap:28px;margin:20px 0;padding:14px 0;border-top:1px solid #594363;border-bottom:1px solid #594363}.result-stats>div{font-size:10px;color:#bda4cd}.result-stats strong{font:600 25px/1.4 system-ui,sans-serif;color:var(--text);display:block}.result-card .play-button{font-size:13px;min-height:46px}.result-card>.text-button{margin-top:12px}.result-card .result-hint{margin-top:12px;font-size:10px!important}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:20;max-width:min(90%,520px);padding:13px 22px;border:1px solid #8b709b;background:#32243deF;box-shadow:0 10px 40px #0006;border-radius:10px;color:#f3e4ff;text-align:center;font-size:12px;line-height:1.65}
dialog{border:1px solid #746080;border-radius:16px;background:#241c30;color:var(--text);max-width:610px;width:calc(100% - 32px);padding:27px;box-shadow:0 30px 100px #0008;max-height:90dvh;overflow:auto}dialog::backdrop{background:#0b0819ca;backdrop-filter:blur(5px)}.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}.dialog-heading h2{font-size:22px;line-height:1.5;margin-top:7px}.close-button{background:#3d2d4b;border:1px solid #5f466e;border-radius:7px;width:35px;height:35px;font-size:22px;flex-shrink:0}.rules-content{display:grid;gap:20px}.rule-step{display:flex;gap:14px}.rule-step>span{font-size:11px;color:var(--gold);padding-top:5px;letter-spacing:1px}.rule-step h3{font-size:13px;margin-bottom:7px;color:#f0d5f6}.rule-step p{font-size:11px;color:#bca6cb;line-height:1.95}.rule-step kbd{font-size:9px}.item-legend{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#18121f;border:1px solid #4c365a;border-radius:8px;padding:15px;font-size:10px;color:#c5afd3}.item-legend i{font-style:normal;font-size:16px;margin-right:5px}.item-crystal{color:#c5a4ff}.item-vision{color:#80d7dd}.item-stamina{color:#f1a3b6}.item-speed{color:var(--gold)}.rules-note{font-size:10px;line-height:1.9;color:#a98cbd}dialog>.button-primary{width:100%;margin-top:22px}
@keyframes gentle-blink{50%{opacity:.35}}@keyframes spin{to{transform:rotate(360deg)}}body.calm *,body.calm *:before,body.calm *:after{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(min-width:1250px){.hero-copy{padding-left:5px}.hero-visual{margin-right:12px}}
@media(max-width:1215px){.site-header{margin:0 28px;padding:0 0}.home-screen{margin:44px 45px 0;column-gap:45px}.hero-copy h1{font-size:37px}.site-footer{margin:40px 32px 0}.game-screen{margin:25px 32px 0}.game-layout{grid-template-columns:minmax(0,1fr) 300px;gap:20px}.lobby-screen{margin:45px 40px}.note-crystal{right:-15px}.note-ghost{left:-20px}.cave-label{font-size:6px;padding:15px}.play-card{padding:20px}.touch-controls{gap:12px}}
@media(max-width:960px){.home-screen{margin:38px 30px 0;column-gap:30px}.hero-copy h1{font-size:31px}.hero-description{font-size:11px}.hero-copy>.eyebrow{font-size:10px;margin-bottom:16px}.play-card{padding:17px}.role-option{padding:7px 6px;gap:4px}.role-option canvas{width:34px;height:34px}.role-option small{font-size:8px}.role-option strong{font-size:11px}.role-option .selection-dot{width:9px;height:9px}.hero-visual{margin-right:10px}.note-crystal{top:70px;font-size:9px;padding:10px}.note-ghost{bottom:65px;padding:8px 12px}.visual-footer{gap:15px;font-size:8px}.cave-caption{font-size:10px}.cave-coordinate{font-size:7px}.intro-strip{gap:15px}.intro-strip>div{gap:10px}.intro-strip strong{font-size:11px}.intro-strip p>span{font-size:9px}.game-layout{grid-template-columns:minmax(0,1fr) 265px;gap:16px}.game-screen{margin:22px 24px 0}.self-panel,.team-panel,.controls-panel{padding:14px}.self-heading{gap:6px}.self-heading canvas{width:40px;height:40px}.self-heading h2{max-width:110px;font-size:12px}.touch-controls{gap:9px}.dpad{grid-template-columns:repeat(3,33px);grid-template-rows:repeat(3,33px);gap:3px}.action-buttons>button{font-size:8px;padding:8px 6px}.action-buttons kbd{font-size:7px;padding:2px 3px}.game-hud{padding:12px 16px}.game-topline .eyebrow{font-size:8px;letter-spacing:1px}.game-room{font-size:9px}.game-sidebar{gap:12px}.result-card{padding:16px 20px}.result-card h2{font-size:21px}.result-card canvas{width:60px;height:60px}.result-stats{margin:15px 0;padding:8px 0}.site-header{height:83px}.online-badge{display:none}}
@media(max-width:760px){.site-header{margin:0 20px;height:76px}.brand{font-size:17px;gap:6px}.brand-cat{width:33px;height:33px}.brand small{font-size:7px;letter-spacing:2.5px}.header-actions{gap:7px}.icon-button{padding:7px 8px}.icon-button .setting-label{display:none}.header-actions>.text-button{margin-left:4px;font-size:10px}.home-screen{grid-template-columns:minmax(0,1fr);margin:29px auto 0;max-width:470px;padding:0 23px;gap:30px}.hero-copy>.eyebrow{font-size:10px}.hero-copy h1{font-size:37px;line-height:1.45}.hero-description{font-size:12px;margin-top:15px}.play-card{padding:21px;margin-top:24px}.role-option{padding:8px 10px;gap:7px}.role-option canvas{width:42px;height:42px}.role-option strong{font-size:12px}.role-option small{font-size:9px}.hero-visual{grid-row:2;margin:10px 13px 7px}.note-crystal{right:-17px}.note-ghost{left:-18px}.cave-label{font-size:6px}.intro-strip{grid-column:1;grid-template-columns:1fr;gap:19px;padding:23px 0 0}.intro-strip>div{gap:15px}.intro-strip strong{font-size:12px;margin-bottom:5px}.intro-strip p>span{font-size:10px}.visual-footer{margin-top:21px;font-size:9px}.site-footer{margin:31px 22px 0;padding-top:20px;flex-direction:column;gap:10px;font-size:8px}.lobby-screen{margin:30px 22px}.section-heading h1{font-size:21px}.section-heading>.button-secondary{font-size:9px;padding:10px;white-space:nowrap}.lobby-layout{grid-template-columns:1fr;gap:18px}.invite-panel{padding:25px}.small-rule{margin-top:22px}.game-screen{margin:18px 16px 0}.game-layout{grid-template-columns:1fr;gap:12px}.game-topline{margin-bottom:11px}.game-topline>div:first-child{gap:8px;flex-wrap:wrap}.game-topline .eyebrow{font-size:7px;letter-spacing:.7px}.game-room{font-size:8px}.game-top-actions{gap:9px}.connection-status{font-size:8px}.game-top-actions>.text-button{font-size:10px}.game-hud{min-height:65px;padding:11px 17px}.board-wrap{max-height:68dvh;aspect-ratio:1;width:100%;margin:auto}.game-sidebar{display:grid;grid-template-columns:1fr 1fr;gap:11px}.self-panel,.team-panel{padding:13px}.self-heading{margin-bottom:13px;gap:5px}.self-heading canvas{width:32px;height:32px}.self-heading h2{max-width:90px;font-size:11px}.self-heading>div>span{font-size:7px}.self-heading .status-tag{font-size:6px;padding:3px;letter-spacing:-.2px}.gaze-status{gap:6px;margin-top:12px;padding-top:11px}.gaze-status>span{font-size:17px}.gaze-status strong{font-size:8px}.gaze-status small{font-size:7px;line-height:1.5}.upgrade-stats{font-size:8px}.upgrade-stats strong{margin-left:5px}.team-panel .panel-heading{margin-bottom:9px}.team-panel .panel-heading h2{font-size:10px}.team-panel .panel-heading>span{font-size:7px}.team-list{gap:7px}.team-row{gap:5px;font-size:8px}.team-row canvas{width:23px;height:23px}.team-name{max-width:76px}.bot-label{font-size:6px;padding:1px 2px;margin-left:3px}.team-state{font-size:7px}.controls-panel{grid-column:1/-1;padding:14px 17px}.controls-panel .panel-heading{margin-bottom:9px}.touch-controls{justify-content:center;gap:25px}.dpad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,41px);gap:5px}.direction-button{font-size:24px}.action-buttons{max-width:170px;gap:10px}.action-buttons>button{font-size:10px;min-height:40px;padding:9px 11px}.action-buttons kbd{font-size:8px}.control-tip{font-size:9px;text-align:center;margin-top:9px}.mission-tip{grid-column:1/-1;padding:3px 4px}.event-panel{grid-column:1/-1}.board-bottom{font-size:8px;padding:10px 2px}.actor-overlay{bottom:30px;padding:15px}.actor-overlay h2{font-size:14px}.actor-overlay p{font-size:10px}.result-card{max-width:325px;padding:14px 22px}.result-card canvas{width:57px;height:57px}.result-card .eyebrow{font-size:8px}.result-card h2{font-size:21px;margin:6px 0}.result-card>p:not(.eyebrow){font-size:10px}.result-stats{gap:30px;margin:12px 0;padding:7px 0}.result-stats strong{font-size:22px}.result-stats>div{font-size:9px}.result-card .play-button{min-height:42px;font-size:12px;padding:10px 13px}.result-card>.text-button{margin-top:6px}.result-overlay{padding:18px}.board-wrap:after{box-shadow:inset 0 0 45px #03020a88}dialog{padding:23px}.dialog-heading h2{font-size:20px}}
@media(max-width:380px){.brand{font-size:15px}.brand-cat{width:29px;height:29px}.site-header{margin:0 16px}.header-actions{gap:5px}.icon-button{padding:6px}.hero-copy h1{font-size:32px}.home-screen{padding:0 19px}.play-card{padding:17px}.role-option{padding:7px}.role-option canvas{width:34px;height:34px}.role-option small{font-size:8px}.role-option .selection-dot{width:8px;height:8px}.game-screen{margin:16px 10px 0}.game-sidebar{gap:8px}.self-panel,.team-panel{padding:11px}.team-name{max-width:64px}.team-state{font-size:6px}.self-heading .status-tag{display:none}.touch-controls{gap:17px}.dpad{grid-template-columns:repeat(3,40px);grid-template-rows:repeat(3,39px)}.board-depth{font-size:5px}.crystal-dots{gap:4px;margin-left:7px}.result-card{padding:11px 18px}.result-card canvas{width:42px;height:42px}.result-card h2{font-size:18px}.result-stats{margin:8px 0}.result-card>.text-button{padding:6px}}

/* Keep the board and touch controls together on small screens. */
@media(max-width:760px){
body[data-screen="game-screen"]{padding-bottom:calc(178px + env(safe-area-inset-bottom,0px))}
body[data-screen="game-screen"] .site-header{height:48px;margin:0 16px}
body[data-screen="game-screen"] .brand{font-size:14px;gap:5px}
body[data-screen="game-screen"] .brand small{display:none}
body[data-screen="game-screen"] .brand-cat{width:27px;height:27px}
body[data-screen="game-screen"] .icon-button{min-height:30px;padding:5px 7px}
body[data-screen="game-screen"] .header-actions>.text-button{font-size:9px;padding:7px 2px}
body[data-screen="game-screen"] .game-screen{margin-top:12px}
body[data-screen="game-screen"] .game-topline{min-height:20px;margin-bottom:9px}
.game-main{width:min(100%,calc(100dvh - 340px));min-width:220px;max-width:100%;margin:auto}
.game-hud{min-height:56px;padding:9px 14px}
.objective-hud{gap:9px}.objective-hud .crystal-icon{font-size:23px}
.objective-hud strong{font-size:18px}.objective-hud small,.timer-hud small{font-size:8px}
.timer-hud strong{font-size:20px}
.board-wrap{width:100%;max-height:none;aspect-ratio:1}
.controls-panel{position:fixed;left:0;right:0;bottom:0;z-index:8;padding:10px 17px calc(10px + env(safe-area-inset-bottom,0px));min-height:164px;margin:0;border-radius:16px 16px 0 0;border:1px solid #70567e;background:#241d31f7;box-shadow:0 -8px 30px #06031066;backdrop-filter:blur(10px)}
.controls-panel .panel-heading,.controls-panel .control-tip{display:none}
.controls-panel .touch-controls{max-width:420px;margin:auto;justify-content:center;gap:22px}
.controls-panel .dpad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:3px}
.controls-panel .direction-button{border-radius:9px;min-width:44px;min-height:44px;font-size:24px}
.controls-panel .action-buttons{max-width:180px;gap:8px}
.controls-panel .action-buttons>button{min-height:44px;font-size:10px;padding:10px 12px}
.controls-panel .action-buttons kbd{font-size:8px}
.toast{bottom:calc(185px + env(safe-area-inset-bottom,0px));z-index:21;font-size:11px;padding:10px 15px}
body[data-screen="home-screen"] .toast,body[data-screen="lobby-screen"] .toast{bottom:24px}
.board-bottom{padding:9px 2px}
}
@media(max-width:380px){.controls-panel{padding-left:14px;padding-right:14px}.controls-panel .touch-controls{gap:15px}.controls-panel .action-buttons>button{font-size:9px;padding:9px 10px}}
@media(max-width:960px) and (max-height:500px) and (orientation:landscape){
 body[data-screen="game-screen"]{padding-bottom:25px}
 body[data-screen="game-screen"] .site-header{height:48px}
 body[data-screen="game-screen"] .brand{font-size:14px}
 body[data-screen="game-screen"] .brand small{display:none}
 body[data-screen="game-screen"] .brand-cat{width:27px;height:27px}
 body[data-screen="game-screen"] .game-screen{width:calc(100% - 275px);margin:10px 12px 0}
 .game-layout{grid-template-columns:1fr;gap:12px}.game-sidebar{grid-template-columns:1fr}
 .game-main{width:min(100%,calc(100dvh - 150px));min-width:0;margin:auto}
 .game-topline{margin-bottom:7px}.game-topline>div:first-child>.eyebrow{display:none}
 .game-hud{min-height:52px;padding:8px 12px}.board-wrap{width:100%;max-height:none;aspect-ratio:1}
 .controls-panel{position:fixed;z-index:8;left:auto;right:12px;top:60px;bottom:12px;width:245px;min-height:0;margin:0;padding:12px;border:1px solid #70567e;border-radius:13px;background:#241d31f7;box-shadow:0 8px 30px #06031066}
 .controls-panel .panel-heading,.controls-panel .control-tip{display:none}
 .controls-panel .touch-controls{flex-direction:column;gap:12px;justify-content:center;height:100%;max-width:none}
 .controls-panel .dpad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:3px}
 .controls-panel .direction-button{min-width:44px;min-height:44px;font-size:24px}
 .controls-panel .action-buttons{display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:none;flex:none;gap:8px}
 .controls-panel .action-buttons>button{min-height:44px;font-size:9px;padding:9px 8px}
 .controls-panel #skill-action{grid-column:1/-1}
 .toast{bottom:15px;left:calc(50% - 130px);max-width:calc(100% - 280px);padding:9px 12px;font-size:10px}
 body[data-screen="home-screen"] .toast,body[data-screen="lobby-screen"] .toast{left:50%;max-width:80%}
}
/* Results need room for both actions, even when the play board is compact. */
@media(max-width:760px), (max-width:960px) and (max-height:500px) and (orientation:landscape){
 .result-overlay{position:fixed;inset:0;z-index:40;padding:16px;background:#0f0c1beb;overflow-y:auto}
 .result-card{max-height:calc(100dvh - 32px);overflow-y:auto;width:100%;max-width:360px;padding:22px 26px}
 .result-card canvas{width:76px;height:76px}
 .result-card h2{font-size:25px;margin:10px 0}
 .result-card .eyebrow{font-size:10px}
 .result-card>p:not(.eyebrow){font-size:11px}
 .result-stats{margin:20px 0;padding:14px 0}
 .result-card .play-button{min-height:48px;font-size:13px;padding:12px 16px}
 .result-card>.text-button{min-height:44px;margin-top:9px;padding:10px}
}