:root{color-scheme:dark;--bg:#14291f;--panel:#1b3227;--line:#ffffff14;--muted:#9bab9a;--text:#f1f2e6;--accent:#c8e99a;--orange:#f2a77e;font-family:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-width:280px;-webkit-tap-highlight-color:transparent}button,a,canvas{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:4px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 80% 0%,#48644420,transparent 50%);z-index:-1}.shell{max-width:1120px;margin:auto;padding:0 44px}.topbar{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;font-size:19px;font-weight:650}.brand img{border-radius:11px}.brand-en{display:block;font-size:8px;letter-spacing:2.3px;margin-top:3px;color:#becbb4}.top-note{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:9px}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent)}.icon-button{border:1px solid var(--line);border-radius:30px;background:transparent;padding:10px 14px;font-size:17px;display:flex;align-items:center;gap:9px}.icon-button span{font-size:11px;color:var(--muted)}.intro{display:flex;justify-content:space-between;align-items:center;padding:40px 0 30px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:600;margin:0 0 12px}h1{font-size:39px;letter-spacing:1px;margin:0;font-weight:600}h1 span{color:var(--accent)}.subtitle{font-size:13px;color:var(--muted);margin:12px 0 0;letter-spacing:1px}.edition{font-size:9px;letter-spacing:2px;color:#8a9b87;line-height:2;text-align:right}.edition strong{font-size:12px;color:#d5dfc8;font-weight:400}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:30px}.play-column{min-width:0}.game-top{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);height:33px;align-items:flex-start}.game-top>span:first-child{display:flex;gap:8px;align-items:center;color:#d1dfc4}.board-frame{position:relative;aspect-ratio:1;border:1px solid #b8cc9140;border-radius:17px;background:#0e2118;overflow:hidden;box-shadow:0 16px 50px #08190f38;padding:9px}.board-frame canvas{width:100%;height:100%;display:block;touch-action:none;border-radius:9px}.overlay{position:absolute;inset:9px;display:flex;align-items:center;justify-content:center;background:#10221990;backdrop-filter:blur(3px);border-radius:9px}.overlay-content{text-align:center;padding:20px}.snake-mark{display:inline-block;transform:rotate(-9deg);margin-bottom:25px;box-shadow:0 14px 35px #07120d40;border-radius:24px}.snake-mark img{display:block}.overlay .eyebrow{font-size:9px;letter-spacing:2.2px;color:#b7c7a8;margin-bottom:12px}.overlay h2{font-size:30px;font-weight:550;letter-spacing:2px;margin:0 0 14px}.overlay p:not(.eyebrow){font-size:12px;line-height:1.9;color:#b0bfa9;margin:0 0 25px}.primary{display:flex;align-items:center;justify-content:space-between;gap:52px;margin:auto;padding:15px 24px;min-height:48px;background:var(--accent);color:#213b23;border:0;border-radius:9px;font-weight:650;font-size:14px;box-shadow:0 5px 20px #c8e99a10;transition:background .2s,transform .2s}.primary:hover{background:#dcf6b7;transform:translateY(-2px)}.primary span{font-size:20px}.overlay-tip{display:block;color:#8a9f84;font-size:10px;margin-top:18px}.text-button{display:block;margin:10px auto 0;background:none;border:0;min-height:40px;color:var(--muted);font-size:12px}.result{margin:-12px 0 18px}.result strong{display:block;font-size:52px;color:var(--accent);font-weight:500}.result span{font-size:11px;color:#bac9ae}.board-toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:12px 0 0;font-size:10px;color:var(--muted)}.board-toolbar>span{display:flex;align-items:center;gap:5px}.board-toolbar b{font-weight:400;color:#bac7ac}.fruit-dot{width:8px;height:8px;background:var(--orange);border-radius:50%;display:inline-block}.gold-dot{color:#e7d184;margin-left:13px;font-size:16px}.pause-button{border:1px solid var(--line);border-radius:6px;background:transparent;min-height:36px;padding:7px 11px;font-size:13px}.pause-button span{font-size:11px;margin-left:4px}.sidebar{padding-top:33px}.score-panel{padding:23px 24px 0;background:linear-gradient(120deg,#284331,#20382a);border:1px solid #d0e5b21a;border-radius:13px}.panel-label{font-size:12px;color:#d2dfc6;margin:0;display:flex;justify-content:space-between;gap:8px}.panel-label>span{font-size:8px;letter-spacing:1.1px;color:#94a58a}.score-value{font-size:64px;line-height:1.4;letter-spacing:3px;font-weight:350;color:var(--accent);font-variant-numeric:tabular-nums}.record{display:flex;justify-content:space-between;padding:15px 0;border-top:1px solid var(--line);font-size:12px;color:#adbfa0}.record strong{color:#e5e8d5;font-weight:500;font-variant-numeric:tabular-nums}.progress-panel{padding:21px 2px}.level-row{display:flex;justify-content:space-between;font-size:12px;color:#b4c4aa}.level-row strong{color:var(--accent);font-size:12px;letter-spacing:1px;font-weight:500}.progress-track{margin-top:13px;height:4px;border-radius:4px;background:#ffffff0c;overflow:hidden}#level-progress{height:100%;width:0;background:var(--accent);transition:width .2s}.progress-caption{display:flex;justify-content:space-between;font-size:10px;color:#8c9e84;margin-top:10px}.mode-panel{border-top:1px solid var(--line);padding:20px 0}.mode-buttons{display:flex;margin-top:13px;padding:4px;background:#0c211763;border:1px solid var(--line);border-radius:8px;gap:3px}.mode-buttons button{width:33.333%;min-height:36px;border:0;background:transparent;border-radius:5px;font-size:12px;color:var(--muted)}.mode-buttons button.selected{background:#40573a;color:#e0efcc}.mode-panel>p{font-size:10px;color:#8c9e84;margin:11px 0 0}.how-to{border-top:1px solid var(--line);padding-top:21px}.how-to>div{display:flex;align-items:center;gap:13px;margin-top:19px}.step{font-size:10px;color:#93ab7e;border:1px solid #bcd1a126;border-radius:7px;padding:7px}.how-to>div p{font-size:12px;margin:0;color:#d2ddc8}.how-to>div p span{display:block;font-size:10px;color:#8f9f87;margin-top:5px}.keyboard-note{font-size:10px;color:#99aa8f;margin:22px 0 0}kbd{font:9px inherit;border:1px solid #ffffff20;border-radius:3px;padding:3px 5px;margin-right:4px}.small-quote{display:flex;align-items:center;gap:14px;margin-top:23px;padding:16px;background:#cadba708;border-radius:9px}.small-quote>span{font-size:31px;color:#94af77}.small-quote p{font-size:11px;line-height:1.9;color:#91a384;margin:0}footer{display:flex;justify-content:space-between;margin:34px 0 25px;padding-top:21px;border-top:1px solid var(--line);font-size:10px;letter-spacing:1px;color:#82947b}footer>span:last-child{font-size:8px;letter-spacing:1.5px}footer i{font-size:15px;font-style:normal;color:var(--accent);margin-left:10px}.touch-controls{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:900px) and (max-height:850px){.shell{max-width:1010px}.topbar{height:76px}.intro{padding:26px 0 24px}.game-layout{grid-template-columns:minmax(0,1fr) 265px;gap:27px}.small-quote{display:none}.how-to>div{margin-top:14px}.score-value{font-size:52px}.progress-panel{padding:17px 2px}.mode-panel{padding:16px 0}.how-to{padding-top:16px}footer{margin-top:24px}}
@media(max-width:760px){.shell{max-width:580px;padding:0 20px}.topbar{height:76px}.top-note{display:none}.intro{padding:28px 0 24px}h1{font-size:31px}.eyebrow{font-size:8px}.subtitle{font-size:11px;margin-top:9px}.edition{display:none}.game-layout{display:flex;flex-direction:column;gap:15px}.sidebar{display:contents}.score-panel{order:-2;display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:10px}.score-panel .panel-label{display:block;font-size:10px;white-space:nowrap}.panel-label>span{display:block;font-size:7px;margin-top:4px}.score-value{font-size:32px;line-height:1;letter-spacing:1px}.record{margin-left:auto;padding:0 0 0 15px;border-top:0;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:4px;align-items:flex-end;font-size:10px}.record strong{font-size:16px}.progress-panel{display:none}.play-column{order:-1}.game-top{height:28px}.board-frame{padding:6px;border-radius:13px}.overlay{inset:6px}.mode-panel{border-top:0;padding:10px 0 0}.mode-panel .panel-label{font-size:11px}.mode-buttons button{min-height:44px}.how-to,.small-quote{display:none}.touch-controls{display:flex;align-items:center;justify-content:space-between;margin-top:17px;gap:8px}.touch-controls p,.touch-note{font-size:11px;line-height:1.9;color:#b7c8aa}.touch-controls p span,.touch-note{color:#859c7c;font-size:10px}.dpad{display:grid;grid-template-columns:48px 48px 48px;grid-template-rows:44px 44px;gap:5px}.dpad button{border:1px solid #b9d49726;background:#233d2c;border-radius:9px;color:#d2e7bd;font-size:22px;touch-action:none}.dpad button:active{background:#5f7c46;transform:scale(.94)}.dpad .up{grid-column:2}.dpad .left{grid-column:1;grid-row:2}.dpad .down{grid-column:2;grid-row:2}.dpad .right{grid-column:3;grid-row:2}.overlay h2{font-size:25px}.snake-mark{margin-bottom:18px}.snake-mark img{width:61px;height:61px}.overlay p:not(.eyebrow){margin-bottom:19px}.overlay-tip{margin-top:13px}.board-toolbar{font-size:9px}.board-toolbar .pause-button{min-height:44px}.gold-dot{margin-left:6px}footer{margin:22px 0 max(18px,env(safe-area-inset-bottom));font-size:9px;padding-top:17px}footer>span:last-child{font-size:6px;letter-spacing:1px}.touch-note{white-space:nowrap}.primary{padding:12px 23px}.overlay .eyebrow{font-size:8px}}
@media(max-width:360px){.shell{padding:0 12px}.intro{padding:23px 0 20px}h1{font-size:28px}.snake-mark{display:none}.overlay h2{font-size:23px}.overlay-content{padding:14px}.overlay p:not(.eyebrow){font-size:11px}.touch-note{display:none}.touch-controls{justify-content:space-around}.board-toolbar b{font-size:8px}.result strong{font-size:38px}footer>span:last-child{display:none}}
@media(pointer:coarse) and (min-width:761px){.touch-controls{display:flex;justify-content:center;align-items:center;gap:25px}.touch-controls p,.touch-note{font-size:11px;color:var(--muted)}.dpad{display:grid;grid-template-columns:50px 50px 50px;gap:5px}.dpad button{height:45px;background:var(--panel);border:1px solid var(--line);border-radius:8px}.dpad .up{grid-column:2}.dpad .left{grid-column:1;grid-row:2}.dpad .down{grid-column:2;grid-row:2}.dpad .right{grid-column:3;grid-row:2}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
/* Keep the board and touch controls together on short phone screens. */
@media(max-width:760px){body.playing .intro{display:none}body.playing .topbar{height:60px;margin-bottom:14px}body.playing .board-frame{max-width:clamp(210px,calc(100svh - 345px),100%);margin-inline:auto}body.playing .touch-controls{margin-top:9px}body.playing .overlay-content{padding:12px}body.playing .overlay-tip,body.playing .overlay .eyebrow{display:none}body.playing .overlay h2{font-size:21px;margin-bottom:8px}body.playing .overlay p:not(.eyebrow){margin-bottom:12px}body.playing .text-button{margin-top:2px}body.playing .mode-panel{padding-top:0}}

/* Warm paper, charcoal and burnt orange palette. */
:root{color-scheme:light;--bg:#f5f2eb;--panel:#fffdf8;--line:#332b201c;--muted:#787066;--text:#292620;--accent:#c45127;--orange:#ed8758}
.ambient{background:radial-gradient(ellipse at 85% 0%,#e6ccb335,transparent 50%)}
.brand-en,.edition,.panel-label>span,.progress-caption,.mode-panel>p,.how-to>div p span,.keyboard-note,.touch-controls p span,.touch-note,footer{color:#81766a}
.edition strong,.game-top>span:first-child,.panel-label,.record,.level-row,.how-to>div p,.touch-controls p{color:#665b4e}
.board-frame{border-color:#3e352a26;background:#25231f;box-shadow:0 16px 50px #33251015}
.overlay{background:#25231fbd}.overlay h2{color:#fff8ea}.overlay .eyebrow{color:#cbb99f}.overlay p:not(.eyebrow),.result span,.overlay .text-button{color:#d0c4b4}.overlay-tip{color:#b3a48f}.result strong{color:#ffc48c}
.snake-mark{box-shadow:0 14px 35px #0c080525}.primary{background:#f2804d;color:#221a14;box-shadow:0 5px 20px #e77e361c}.primary:hover{background:#ffa16f}
.score-panel{background:linear-gradient(120deg,#fffcf5,#eee5d7);border-color:#5b42281c}.record strong{color:#382d23}.progress-track{background:#50361512}
.mode-buttons{background:#e8e1d580}.mode-buttons button.selected{background:#2e2923;color:#fff7e9}
.step{color:#a05a32;border-color:#a1774c36}.small-quote{background:#e9dfcf70}.small-quote>span{color:#bd642e}.small-quote p{color:#87745f}
.board-toolbar b{color:#79634d}.gold-dot{color:#a88121}kbd{border-color:#52433430}
.dpad button{border-color:#9d795335;background:#eae0d1;color:#5e4230}.dpad button:active{background:#e4af87}.pause-button{background:#fffcf6}