:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#202738;--panel:#232c3de0;--panel-strong:#1c2333f5;--surface:#ffffff12;--text:#f7f4ea;--muted:#aeb7c7;--line:#ffffff29;--shadow:#090c1461;--gold:#ffc857;--danger:#f15162;--green:#58b368;--cyan:#4ecdc4;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{color:var(--text);background:linear-gradient(135deg,#f151622e,#0000 28%),linear-gradient(215deg,#4ecdc438,#0000 30%),linear-gradient(#202738 0%,#151a27 100%);margin:0}button{font:inherit}.app-shell{place-items:center;min-height:100svh;padding:16px;display:grid}.game-surface{border:1px solid var(--line);background:linear-gradient(#ffffff0d 1px, transparent 1px), linear-gradient(90deg, #ffffff0d 1px, transparent 1px), var(--panel);width:min(1180px,100%);height:min(860px,100svh - 32px);min-height:0;box-shadow:0 24px 80px var(--shadow);background-size:36px 36px,36px 36px,auto;border-radius:18px;flex-direction:column;gap:12px;padding:20px;display:flex;position:relative;overflow:hidden}.game-surface--game{gap:8px}.topbar{justify-content:space-between;align-items:center;gap:16px;display:flex}.topbar__actions{justify-content:flex-end;align-items:center;gap:8px;display:flex}.eyebrow{color:var(--gold);text-transform:uppercase;letter-spacing:0;margin:0 0 4px;font-size:.78rem;font-weight:800}h1,h2,p{margin-top:0}h1{letter-spacing:0;margin-bottom:0;font-size:2.4rem;line-height:1}h2{letter-spacing:0;margin-bottom:10px;font-size:2rem;line-height:1}.text-button,.primary-button,.secondary-button,.icon-button,.mode-card,.level-tile{cursor:pointer;letter-spacing:0;border:0;font-weight:900;transition:transform .14s,filter .14s,background .14s,border-color .14s}.text-button,.primary-button{color:#1b2030;background:linear-gradient(180deg, #ffe08a, var(--gold))}.text-button{border-radius:999px;min-height:42px;padding:0 18px}.primary-button,.secondary-button{border-radius:999px;min-height:48px;padding:0 26px}.primary-button--wide{width:100%}.secondary-button,.icon-button{color:var(--text);border:1px solid var(--line);background:#ffffff14}.icon-button--install{color:#1b2030;background:linear-gradient(180deg, #ffe08a, var(--gold));border-color:#0000}.icon-button{border-radius:50%;width:42px;height:42px}.text-button:hover,.primary-button:hover,.secondary-button:hover,.icon-button:hover,.mode-card:hover,.level-tile:hover{filter:brightness(1.06);transform:translateY(-1px)}.text-button:active,.primary-button:active,.secondary-button:active,.icon-button:active,.mode-card:active,.level-tile:active{transform:translateY(1px)}.menu-layout{flex:1;grid-template-columns:minmax(0,1fr) 240px;align-items:center;gap:18px;display:grid}.mode-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.mode-card{min-height:190px;color:var(--text);text-align:left;border:1px solid var(--line);background:radial-gradient(circle at 18% 18%,#fff3,#0000 18%),linear-gradient(155deg,#4ecdc433,#f1516229),#ffffff14;border-radius:16px;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:18px;display:flex}.mode-card span{font-size:1.35rem}.mode-card strong{color:var(--gold);text-transform:uppercase;font-size:.95rem}.menu-side,.side-panel{gap:10px;display:grid}.offline-note{color:var(--muted);text-align:center;margin:0;font-weight:800}.level-select{flex:1;grid-template-rows:auto minmax(0,1fr) auto;gap:14px;min-height:0;display:grid}.level-select__top{border:1px solid var(--line);background:var(--surface);border-radius:14px;justify-content:space-between;align-items:center;gap:14px;padding:12px 14px;display:flex}.level-select__top h2{margin-bottom:0}.level-select__count{color:var(--gold);white-space:nowrap;font-size:.92rem;font-weight:900}.level-select__grid{scrollbar-color:#ffffff47 transparent;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));align-content:start;gap:10px;min-height:0;padding:2px 4px 2px 0;display:grid;overflow-y:auto}.level-tile{min-height:68px;color:var(--text);border:1px solid var(--line);background:radial-gradient(circle at 24% 18%,#ffffff2e,#0000 24%),#ffffff14;border-radius:12px;place-items:center;gap:2px;display:grid}.level-tile strong{font-size:1.25rem;line-height:1}.level-tile span{min-height:14px;color:var(--gold);text-transform:uppercase;font-size:.62rem;font-weight:900;line-height:1}.level-tile--latest{background:radial-gradient(circle at 24% 18%,#ffffff38,#0000 24%),linear-gradient(155deg,#ffc8573d,#4ecdc424),#ffffff17;border-color:#ffc857b3;box-shadow:0 0 0 1px #ffc8571f}.level-tile--locked{color:#f7f4ea6b;cursor:default;background:#ffffff0a}.level-tile--locked span{color:#aeb7c7ad}.level-select__back{justify-self:start}.stats-grid{grid-template-columns:1.1fr repeat(4,minmax(0,1fr));gap:10px;display:grid}.stat{border:1px solid var(--line);background:var(--surface);border-radius:12px;min-width:0;padding:10px 12px}.stat span{color:var(--muted);margin-bottom:4px;font-size:.78rem;font-weight:800;display:block}.stat strong{overflow-wrap:anywhere;font-size:1.2rem;line-height:1;display:block}.stat--accent strong{color:var(--danger)}.progress-track{border:1px solid var(--line);background:#ffffff14;border-radius:999px;height:10px;overflow:hidden}.progress-track__fill{border-radius:inherit;background:linear-gradient(90deg, var(--green), var(--cyan), var(--gold));height:100%;transition:width .22s}.board-wrap{flex:1;grid-template-columns:minmax(340px,680px) minmax(150px,210px);justify-content:center;align-items:center;gap:18px;min-height:0;display:grid;overflow:hidden}.board-stage{justify-self:center;width:min(100%,680px,100svh - 260px);position:relative}.board{--board-gap:7px;aspect-ratio:1;gap:var(--board-gap);background:var(--panel-strong);touch-action:none;border:1px solid #ffffff2e;border-radius:16px;width:100%;padding:12px;display:grid;box-shadow:inset 0 0 0 1px #00000038}.cell{aspect-ratio:1;cursor:pointer;border:0;border-radius:50%;outline:0;place-items:center;width:100%;transition:transform .21s cubic-bezier(.22,1,.36,1),filter .12s,opacity .15s,box-shadow .12s;display:grid;position:relative;transform:translateZ(0)}.cell:before{content:"";border-radius:inherit;background:inherit;position:absolute;inset:7%;box-shadow:inset -8px -10px 16px #00000042,inset 7px 8px 12px #ffffff52,0 8px 12px #00000040}.cell:after{content:"";border-radius:inherit;pointer-events:none;border:2px solid #fff0;position:absolute;inset:8%}.cell__shine{filter:blur(.4px);pointer-events:none;background:#ffffffb8;border-radius:50%;width:22%;height:18%;position:absolute;top:19%;left:24%}.cell:hover:not(:disabled),.cell:focus-visible{transform:translateY(-2px);box-shadow:0 0 0 3px #ffffffb8}.cell:disabled{cursor:default}.cell--selected{box-shadow:0 0 0 4px var(--gold), 0 0 24px #ffc85780}.cell--hint{animation:.85s ease-in-out infinite hint-pulse}.cell--swap{z-index:4;transform:translate(var(--swap-x), var(--swap-y));filter:brightness(1.08);box-shadow:0 14px 24px #00000047}.cell--swap-back{z-index:4;animation:.21s cubic-bezier(.33,1,.68,1) swap-back}.cell--dropping{animation:.22s cubic-bezier(.2,.8,.22,1.12) drop-in}.cell--clearing{animation:.19s ease-out forwards pop-clear}.cell--clearing:after{animation:.19s ease-out forwards pop-ring}.cell--invalid{filter:saturate(1.25)}.cell--ruby{background:linear-gradient(135deg,#ff8790,#f15162 54%,#b6203f)}.cell--sun{background:linear-gradient(135deg,#ffe9a7,#ffc857 54%,#d38919)}.cell--leaf{background:linear-gradient(135deg,#b8f68b,#58b368 54%,#2d7f45)}.cell--sky{background:linear-gradient(135deg,#a5fff8,#4ecdc4 54%,#188f9c)}.cell--violet{background:linear-gradient(135deg,#c5a7ff,#8a5cf6 54%,#5b2ec2)}.cell--pearl{background:linear-gradient(135deg,#fff,#cfd7e6 54%,#8794aa)}.cell--coral{background:linear-gradient(135deg,#ffb18f,#ff7a59 54%,#bd3d2f)}.combo-pop{z-index:8;text-align:center;pointer-events:none;background:#141823d1;border:1px solid #ffffff47;border-radius:999px;min-width:140px;padding:10px 16px;animation:.82s both combo-rise;position:absolute;top:44%;left:50%;box-shadow:0 16px 40px #00000052}.combo-pop span,.combo-pop strong{display:block}.combo-pop span{color:var(--gold);text-transform:uppercase;font-size:.82rem;font-weight:900}.combo-pop strong{font-size:1.25rem}.status-line{min-height:24px;color:var(--gold);text-align:center;font-weight:900}.overlay{z-index:10;background:#0b0e17b8;place-items:center;padding:22px;display:grid;position:absolute;inset:0}.overlay-panel{border:1px solid var(--line);text-align:center;background:var(--panel-strong);border-radius:18px;width:min(370px,100%);padding:26px;box-shadow:0 20px 70px #00000073}.overlay-panel p:not(.eyebrow){color:var(--muted);font-weight:800}.dialog-actions{gap:10px;display:grid}@keyframes hint-pulse{0%,to{transform:translateY(0)scale(1);box-shadow:0 0 #ffc85733}50%{transform:translateY(-2px)scale(1.04);box-shadow:0 0 0 5px #ffc857c2}}@keyframes swap-back{0%{transform:translate(var(--swap-x), var(--swap-y))}to{transform:translate(0)}}@keyframes drop-in{0%{transform:translateY(var(--drop-offset)) scale(.98)}74%{transform:translateY(3%)scale(1.02)}to{transform:translateY(0)scale(1)}}@keyframes pop-clear{0%{opacity:1;filter:brightness();transform:scale(1)}55%{opacity:1;filter:brightness(1.35);transform:scale(1.22)}to{opacity:0;filter:brightness(1.6);transform:scale(1.42)}}@keyframes pop-ring{0%{opacity:0;border-color:#fff0;transform:scale(.7)}35%{opacity:1;border-color:#ffffffd1;transform:scale(1.1)}to{opacity:0;border-color:#fff0;transform:scale(1.62)}}@keyframes combo-rise{0%{opacity:0;transform:translate(-50%,18px)scale(.9)}18%{opacity:1;transform:translate(-50%)scale(1.04)}to{opacity:0;transform:translate(-50%,-42px)scale(1)}}@media (width>=1180px) and (height>=820px){.board-wrap{grid-template-columns:minmax(520px,720px) minmax(180px,240px)}.board-stage{width:min(100%,720px,100svh - 260px)}}@media (width<=1024px){.app-shell{padding:12px}.game-surface{border-radius:14px;height:calc(100svh - 24px);padding:14px}h1{font-size:1.9rem}.menu-layout,.board-wrap{grid-template-columns:minmax(0,1fr);align-content:start}.level-select__grid{grid-template-columns:repeat(auto-fill,minmax(64px,1fr))}.mode-grid{grid-template-columns:1fr}.mode-card{min-height:104px}.stats-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.board-stage{justify-self:center;width:min(100%,650px,100svh - 220px)}.board{--board-gap:5px;border-radius:13px;padding:9px}.side-panel,.menu-side{grid-template-columns:repeat(3,minmax(0,1fr))}.game-surface--game .side-panel{display:none}.stat strong{font-size:1rem}}@media (width<=560px){.app-shell{padding:8px}.game-surface{gap:10px;height:calc(100svh - 16px);padding:10px}.topbar{align-items:flex-start}.topbar__actions{gap:6px}h1{font-size:1.65rem}.game-surface--game{gap:8px}.game-surface--game .topbar{align-items:center}.game-surface--game .eyebrow{display:none}.game-surface--game h1{font-size:1.28rem}.game-surface--menu .mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.game-surface--menu .mode-card{border-radius:12px;min-height:86px;padding:12px}.mode-card span{font-size:1.05rem}.game-surface--menu .menu-layout{gap:12px}.level-select{gap:10px}.level-select__top{align-items:center;gap:8px;padding:10px 12px}.level-select__top h2{font-size:1.25rem}.level-select__count{font-size:.8rem}.level-select__grid{grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:7px}.level-tile{border-radius:10px;min-height:54px}.level-tile strong{font-size:1.05rem}.level-tile span{font-size:.5rem}.game-surface--menu .menu-side{grid-template-columns:repeat(2,minmax(0,1fr))}.game-surface--menu .offline-note,.game-surface--menu .primary-button--wide{grid-column:1/-1}.stats-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.stat{border-radius:9px;min-height:42px;padding:6px 3px}.stat span{white-space:nowrap;margin-bottom:3px;font-size:.52rem}.stat strong{font-size:.78rem}.text-button{min-height:34px;padding-inline:12px}.icon-button{width:34px;height:34px}.progress-track{height:6px}.board-wrap{gap:8px}.board-stage{width:min(100%,650px,100svh - 178px)}.board{--board-gap:3px;padding:5px}.game-surface--game .side-panel{display:none}.menu-side{grid-template-columns:1fr}.status-line{min-height:18px;font-size:.82rem}}@media (width<=390px){.stats-grid{gap:3px}}@media (width<=900px) and (height<=620px){.game-surface--game{gap:8px;height:calc(100svh - 24px)}.game-surface--game .topbar{align-items:center}.game-surface--game .eyebrow{display:none}.game-surface--game h1{font-size:1.28rem}.game-surface--game .topbar__actions{gap:6px}.game-surface--game .text-button{min-height:34px;padding-inline:12px}.game-surface--game .icon-button{width:34px;height:34px}.game-surface--game .stats-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.game-surface--game .stat{border-radius:9px;min-height:42px;padding:6px 3px}.game-surface--game .stat span{white-space:nowrap;margin-bottom:3px;font-size:.52rem}.game-surface--game .stat strong{font-size:.78rem}.game-surface--game .progress-track{height:6px}.game-surface--game .board-wrap{gap:8px}.game-surface--game .board-stage{width:min(100%,650px,100svh - 190px)}.game-surface--game .side-panel{display:none}.game-surface--game .status-line{min-height:18px;font-size:.82rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important}}
