*{box-sizing:border-box}[hidden]{display:none!important}:root{color-scheme:dark;--bg:#08101a;--ink:#f6fbff;--muted:#91a1b3;--line:rgba(255,255,255,.11);--cyan:#5ee7de;--blue:#6f8cff;--violet:#ad83ff;--red:#ff718a;--gold:#ffd266}html,body{margin:0;min-height:100%;overflow:hidden;background:var(--bg)}body{font-family:Pretendard,"Noto Sans KR",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink)}button{font:inherit}.game{min-height:900px;padding:16px;background:radial-gradient(circle at 85% 0,rgba(115,103,255,.18),transparent 33%),radial-gradient(circle at 10% 20%,rgba(94,231,222,.08),transparent 28%),linear-gradient(180deg,#0a1522,#060c14)}.topbar,.start-panel,.stage,.complete{max-width:980px;margin-left:auto;margin-right:auto}.topbar{margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px}.eyebrow{margin:0 0 2px;color:#8098b1;font-size:10px;font-weight:950;letter-spacing:.18em}h1{margin:0;font-size:clamp(21px,3vw,28px)}.top-actions{display:flex;gap:7px}.mode,.sound{min-height:34px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.055);color:#dce8f1;font-size:11px;font-weight:850}.start-panel{padding:18px;border:1px solid rgba(111,140,255,.18);border-radius:22px;background:linear-gradient(145deg,rgba(17,31,49,.92),rgba(8,20,31,.94));display:grid;gap:14px}.start-panel>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px}.start-panel>div:first-child>span{font-size:12px;font-weight:900;color:#8fa4b9}.difficulty{display:flex;gap:5px;flex-wrap:wrap}.difficulty button,.tool-row button{border:1px solid var(--line);border-radius:10px;background:#102033;color:#93a9bd;padding:8px 11px;font-size:11px;font-weight:900;cursor:pointer}.difficulty button.is-on,.tool-row button.is-on{background:linear-gradient(135deg,#6f8cff,#5ee7de);color:#071420;border-color:transparent}.start-actions{display:flex;gap:8px}.start-actions button,.complete button{min-height:48px;padding:9px 20px;border:0;border-radius:14px;background:linear-gradient(135deg,#6f8cff,#5ee7de);color:#071420;font-weight:950;cursor:pointer}.start-actions .secondary{background:#13263a;color:#d9e8f5;border:1px solid var(--line)}.start-panel p{margin:0;color:#71879b;font-size:11px}.stage{padding:14px;border:1px solid rgba(94,231,222,.15);border-radius:26px;background:linear-gradient(160deg,#0d1d2b,#08131e);box-shadow:0 25px 75px rgba(0,0,0,.32)}.statusbar{min-height:42px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.statusbar span{color:#7d92a6;font-size:10px;font-weight:850}.statusbar strong{margin-left:3px;color:#eaf5ff}.play-area{display:grid;grid-template-columns:minmax(0,600px) 1fr;gap:14px;align-items:start}.board{width:100%;aspect-ratio:1;display:grid;grid-template-columns:repeat(9,1fr);border:3px solid #86a7c3;border-radius:12px;overflow:hidden;background:#07121e;box-shadow:0 12px 40px rgba(0,0,0,.25)}.cell{position:relative;display:grid;place-items:center;min-width:0;border:0;border-right:1px solid rgba(142,173,198,.19);border-bottom:1px solid rgba(142,173,198,.19);background:#0b1927;color:#b8d6ea;font-size:clamp(16px,2.6vw,25px);font-weight:850;cursor:pointer;padding:0}.cell:nth-child(3n){border-right:2px solid rgba(154,190,219,.56)}.cell:nth-child(9n){border-right:0}.cell:nth-child(n+19):nth-child(-n+27),.cell:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid rgba(154,190,219,.56)}.cell:nth-child(n+73){border-bottom:0}.cell.fixed{background:#0f2233;color:#f2f8fc;font-weight:950}.cell.box-related{background:#11223e}.cell.axis-related{background:linear-gradient(145deg,#145064,#12364f);color:#e8ffff}.cell.fixed.axis-related{background:linear-gradient(145deg,#1a5870,#173e58);color:#fff}.cell.same{background:linear-gradient(145deg,#4d3277,#29366f);color:#fff0a8;box-shadow:inset 0 0 0 1px rgba(255,220,120,.4)}.cell.axis-related.same{background:linear-gradient(145deg,#4a496f,#24566b)}.cell.selected{background:linear-gradient(145deg,#1d7b82,#2851a2);color:#fff;box-shadow:inset 0 0 0 3px #8ffff1,0 0 18px rgba(94,231,222,.38);z-index:2}.cell.flash-wrong{animation:wrong .32s;background:#5a1d2e;color:#fff}.notes{position:absolute;inset:3px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);font-size:clamp(7px,1vw,10px);font-weight:700;color:#6e9ca7}.notes i{font-style:normal;display:grid;place-items:center}.side{display:grid;gap:11px}.tool-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.pad{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.pad button{aspect-ratio:1;border:1px solid rgba(94,231,222,.18);border-radius:14px;background:linear-gradient(150deg,#10283a,#0b1b2a);color:#dffdfa;font-size:25px;font-weight:950;cursor:pointer;box-shadow:inset 0 0 18px rgba(94,231,222,.03)}.pad button:active{transform:scale(.96);background:#164354}.legend{padding:10px;border:1px solid var(--line);border-radius:14px;background:rgba(5,13,22,.45)}.legend p{margin:5px 0;color:#748b9e;font-size:10px}.dot{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:3px}.dot.selected{background:#8ffff1}.dot.axis{background:#1f8ea0}.dot.box{background:#253f73}.dot.same{background:#b488ff}.dot.fixed{background:#48657b}.message{margin:12px 2px 0;text-align:center;color:#8096a9;font-size:11px}.complete{min-height:520px;border:1px solid rgba(255,210,102,.2);border-radius:28px;background:radial-gradient(circle,rgba(255,210,102,.13),transparent 45%),linear-gradient(160deg,#151e2d,#09121d);display:grid;place-content:center;justify-items:center;text-align:center}.complete .trophy{width:100px;height:100px;display:grid;place-items:center;border:1px solid rgba(255,210,102,.38);border-radius:50%;background:radial-gradient(circle,#ffe9a3,#9f7125 44%,#272019 70%);font-size:50px;color:#fff8d4;box-shadow:0 0 60px rgba(255,205,85,.25);animation:trophy 1.6s ease-in-out infinite}.complete>span{margin-top:18px;color:#f0c865;font-size:10px;font-weight:950;letter-spacing:.18em}.complete h2{margin:5px 0 0;font-size:clamp(35px,6vw,60px)}.complete>strong{font-size:28px;color:#ffd66f}.complete p{color:#8da0b2}.complete button{margin-top:10px}@keyframes wrong{50%{transform:translateX(5px)}}@keyframes trophy{50%{transform:translateY(-5px);filter:brightness(1.15)}}@media(max-width:760px){.game{padding:10px;min-height:980px}.play-area{grid-template-columns:1fr}.side{grid-template-columns:1fr}.pad{grid-template-columns:repeat(9,1fr);gap:4px}.pad button{aspect-ratio:auto;min-height:44px;border-radius:10px;font-size:19px}.legend{display:none}.start-panel>div:first-child{align-items:flex-start;flex-direction:column}.stage{padding:10px}.statusbar{gap:10px}.cell{font-size:clamp(15px,5vw,22px)}}@media(max-width:430px){.game{padding:8px}.difficulty{display:grid;grid-template-columns:repeat(4,1fr);width:100%}.difficulty button{padding:7px 5px}.start-actions{display:grid;grid-template-columns:1fr 1fr}.pad button{font-size:17px}.tool-row button{padding:8px 5px}.cell{font-size:19px}.notes{font-size:7px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}

.input-mode{display:grid;gap:8px;padding:12px;border:1px solid rgba(94,231,222,.14);border-radius:15px;background:rgba(4,14,24,.35)}.input-mode>span{font-size:12px;font-weight:900;color:#9bb1c6}.input-mode>div{display:flex;gap:7px}.input-mode button{border:1px solid var(--line);border-radius:11px;background:#102033;color:#93a9bd;padding:9px 13px;font-size:11px;font-weight:900;cursor:pointer}.input-mode button.is-on{background:linear-gradient(135deg,#6f8cff,#5ee7de);color:#071420;border-color:transparent}.input-mode p{margin:0!important;color:#71879b!important}.cell.conflict:not(.selected){background:linear-gradient(145deg,#552235,#3b1828)!important;color:#ffd7df!important;box-shadow:inset 0 0 0 2px rgba(255,113,138,.48)}.top-actions{align-items:center}


/* v1.1.2 mobile game-first layout */
@media(max-width:760px){
  html,body{min-height:0}
  .game{min-height:0;padding:7px 7px 10px}
  .topbar{margin-bottom:6px;min-height:34px}
  .topbar>div:first-child{display:none}
  .top-actions{width:100%;justify-content:flex-end;gap:5px}
  .mode,.sound{min-height:30px;padding:5px 8px;font-size:10px}
  .start-panel{padding:11px;border-radius:16px;gap:10px}
  .start-panel>div:first-child{gap:7px}
  .difficulty{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
  .difficulty button{padding:7px 4px;font-size:10px}
  .input-mode{padding:9px;gap:6px;border-radius:12px}
  .input-mode>span{font-size:10px}
  .input-mode button{padding:7px 9px;font-size:10px}
  .input-mode p,#start-help{font-size:9px;line-height:1.45}
  .start-actions{gap:6px}
  .start-actions button{min-height:42px;padding:7px 10px;border-radius:11px;font-size:13px}
  .stage{padding:6px;border-radius:16px}
  .statusbar{min-height:30px;justify-content:space-between;gap:5px;flex-wrap:nowrap;padding:0 2px 5px}
  .statusbar span{font-size:9px;white-space:nowrap}
  .statusbar strong{font-size:10px}
  .play-area{gap:7px}
  .board{border-width:2px;border-radius:8px}
  .cell{font-size:clamp(17px,5.4vw,22px)}
  .side{gap:6px}
  .tool-row{gap:4px;order:2}
  .tool-row button{min-height:36px;padding:6px 4px;font-size:10px}
  .pad{order:1;grid-template-columns:repeat(9,1fr);gap:3px}
  .pad button{min-height:38px;padding:0;border-radius:8px;font-size:16px}
  .message{margin:6px 2px 0;font-size:9px;line-height:1.35}
  .legend{display:none}
}
@media(max-width:430px){
  .game{padding:5px 5px 8px}
  .mode,.sound{padding:5px 7px;font-size:9px}
  .stage{padding:5px}
  .statusbar{gap:3px}
  .statusbar span{font-size:8.5px}
  .pad button{min-height:36px;font-size:15px}
  .cell{font-size:18px}
}


/* v0.9.7 universal mobile compact */
@media(max-width:700px){
  html,body{min-height:0!important;max-width:100%!important;overflow-x:hidden!important}
  .game{min-height:0!important;padding:6px!important;max-width:100%!important;overflow-x:hidden!important}
  .topbar,.top,main.game>header{min-height:30px!important;margin-bottom:5px!important;padding:0!important;display:flex!important;align-items:center!important}
  .topbar>div:first-child,.top>div:first-child,main.game>header>div:first-child{display:none!important}
  .top-actions,.topbar>.actions,.top>.top-actions,main.game>header>div:last-child{width:100%!important;display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:4px!important;margin:0!important}
  .mode,.sound,.pill,.top-actions>*,main.game>header>div:last-child>*{min-height:27px!important;padding:4px 7px!important;font-size:9px!important;line-height:1.1!important}
  .intro,.done,.result,.complete{min-height:0!important;padding:15px 11px!important;border-radius:18px!important}
  .intro h2,.done h2,.result h2,.complete h2{font-size:clamp(24px,7vw,31px)!important;line-height:1.15!important;margin-top:5px!important;margin-bottom:6px!important;word-break:keep-all}
  .intro>p:not(.state),.intro .desc,.intro .description,.copy p:last-child,.done>p:not(.state),.result>p:not(.state){font-size:10.5px!important;line-height:1.45!important;margin:6px auto 12px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;max-width:96%!important}
  .stage{border-radius:18px!important;padding-left:9px!important;padding-right:9px!important}
  .meteor-logo,.cosmos,.hero-heart,.portal,.demo,.sky,.galaxy,.done-heart,.pulse,.const{transform:scale(.72);transform-origin:center;margin-top:-14px!important;margin-bottom:-13px!important}
  .evolution{margin:9px 0!important;gap:4px!important;max-width:100%;overflow:hidden}.evolution em{width:34px!important;height:34px!important;font-size:16px!important;flex:0 0 auto}.evolution b{font-size:10px!important}
  .primary,.action,.intro button,.done button,.result button{min-height:43px!important;padding:9px 17px!important;border-radius:12px!important;font-size:12px!important}
  .help,.message,.note{font-size:9px!important;line-height:1.35!important}
}
@media(max-width:390px){
  .game{padding:5px!important}
  .intro h2,.done h2,.result h2,.complete h2{font-size:24px!important}
  .mode,.sound,.pill,.top-actions>*,main.game>header>div:last-child>*{font-size:8.5px!important;padding:4px 6px!important}
}


/* v0.9.7 mobile idle/gameplay compaction */
@media(max-width:700px){
  .arena.state-idle,.stage.state-idle{min-height:min(430px,calc(100dvh - 145px))!important;padding:12px 10px!important}
  .arena.state-idle .copy h2,.stage.state-idle .copy h2,.stage .copy h2{font-size:clamp(22px,6.5vw,29px)!important;line-height:1.15!important;margin:5px 0 6px!important;word-break:keep-all}
  .arena.state-idle .copy>p:not(.state),.stage.state-idle .copy>p:not(.state),.stage .copy>p:not(.state){font-size:10.5px!important;line-height:1.4!important;margin:5px auto 9px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .hint,.typing-note{font-size:9px!important;line-height:1.3!important;margin-top:5px!important}
  .mode-card,.start-panel{padding:10px!important;margin-bottom:7px!important;border-radius:15px!important}
  .summary{min-height:0!important;padding:11px 9px!important}
}

/* v0.10.0 common fullscreen bridge */
html.host-fullscreen,html.host-fullscreen body{width:100%!important;height:100%!important;min-height:100%!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important}
html.host-fullscreen .game{width:100%!important;min-height:100dvh!important;height:auto!important;max-height:none!important;overflow:visible!important;padding:6px!important}
@media(max-width:700px){
 html.host-fullscreen .topbar,html.host-fullscreen .top,html.host-fullscreen main.game>header{display:none!important}
 html.host-fullscreen .intro,html.host-fullscreen .done,html.host-fullscreen .result,html.host-fullscreen .complete,html.host-fullscreen .stage,html.host-fullscreen .arena,html.host-fullscreen .panel{min-height:0!important;max-height:none!important}
 html.host-fullscreen .summary{display:none!important}
 html.host-fullscreen .intro,html.host-fullscreen .done{padding-top:10px!important;padding-bottom:10px!important}
 html.host-fullscreen .help,html.host-fullscreen .hint,html.host-fullscreen .legend{max-height:34px;overflow:hidden}
}