:root{--cream:#fff9ef;--paper:#fffdf8;--ink:#604555;--muted:#a57f8c;--pink:#f58fae;--mint:#72cdb7;--sun:#f3c65d;--shadow:0 18px 44px rgba(124,83,97,.15);--board-size:min(92vw,calc(100dvh - 250px),900px)}
*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;overflow:hidden;background:var(--cream)}body{color:var(--ink);font-family:"YouYuan","STHupo","Microsoft YaHei",sans-serif;user-select:none;-webkit-tap-highlight-color:transparent}button{color:inherit;font:inherit}button:focus-visible{outline:3px solid rgba(75,190,167,.45);outline-offset:3px}
#app{position:relative;width:100%;height:100dvh;overflow:hidden;background:radial-gradient(circle at 9% 12%,rgba(255,255,255,.9) 0 6%,transparent 6.2%),radial-gradient(circle at 88% 18%,rgba(255,223,228,.58) 0 11%,transparent 11.2%),linear-gradient(145deg,#fff9ef 0%,#fff3f5 48%,#eaf8f2 100%)}
.screen{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .28s ease,transform .28s ease,visibility .28s}.screen.active{opacity:1;visibility:visible;transform:none}
.home-screen{display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));overflow-y:auto;overflow-x:hidden}.home-card{position:relative;width:min(680px,100%);text-align:center;z-index:2}.brand-kicker{color:#d59375;font:800 11px/1.2 Georgia,serif;letter-spacing:.32em}.brand h1{margin:6px 0 2px;color:#5c7e66;font-size:clamp(42px,8vw,72px);line-height:1;letter-spacing:.08em;text-shadow:0 4px 0 #fff,0 8px 18px rgba(84,135,100,.16)}.brand p{margin:12px 0 6px;color:#9b7582;font-size:14px}.sun-glow{position:absolute;width:42vmin;height:42vmin;left:-12vmin;top:-14vmin;border-radius:50%;background:rgba(255,218,127,.2);filter:blur(3px)}.leaf{position:absolute;width:180px;height:90px;border-radius:100% 0 100% 0;background:rgba(119,196,138,.13)}.leaf-a{left:-42px;bottom:8%;transform:rotate(25deg)}.leaf-b{right:-62px;top:12%;transform:rotate(210deg)}
.mascot-stage{position:relative;width:min(470px,88vw);height:270px;margin:4px auto 8px}.mascot{position:absolute;display:grid;place-items:center;width:106px;height:106px;border:3px solid rgba(255,255,255,.9);border-radius:46% 54% 50% 50%;background:rgba(255,255,255,.65);box-shadow:0 12px 25px rgba(112,83,92,.13);animation:mascot-float 4s ease-in-out infinite}.mascot img{width:80%;height:80%;object-fit:contain;filter:drop-shadow(0 5px 4px rgba(94,67,76,.15))}.mascot-fox{left:3%;top:83px;background:#ead9f6;transform:rotate(-7deg)}.mascot-rabbit{right:2%;top:75px;background:#ffe0e8;transform:rotate(7deg);animation-delay:-1.1s}.mascot-bear{left:50%;top:16px;width:126px;height:126px;margin-left:-63px;background:#fff0cd;animation-delay:-.5s}.mascot-penguin{left:23%;bottom:0;width:92px;height:92px;background:#d8f5f5;animation-delay:-1.7s}.mascot-cat{right:22%;bottom:0;width:92px;height:92px;background:#fff5b7;animation-delay:-2.2s}.garden-sign{position:absolute;left:50%;bottom:13px;transform:translateX(-50%);width:210px;padding:13px 14px 12px;border:2px solid rgba(255,255,255,.9);border-radius:22px;background:rgba(255,255,255,.82);box-shadow:0 10px 26px rgba(104,82,89,.11);z-index:3}.garden-sign b,.garden-sign span{display:block}.garden-sign b{font-size:14px}.garden-sign span{margin-top:3px;color:var(--muted);font-size:10px}
.mode-picker{display:flex;gap:9px;justify-content:center;margin:6px auto 14px}.mode-chip{min-width:112px;padding:10px 15px;border:2px solid transparent;border-radius:18px;background:rgba(255,255,255,.72);box-shadow:0 5px 12px rgba(120,84,96,.08);cursor:pointer;transition:.2s ease}.mode-chip b,.mode-chip span{display:block}.mode-chip b{font-size:14px}.mode-chip span{margin-top:2px;color:var(--muted);font-size:10px}.mode-chip:hover{transform:translateY(-2px)}.mode-chip.selected{border-color:#f3a0b8;background:#fff8fa;box-shadow:0 7px 0 #f8cfda}.primary-button{display:flex;align-items:center;justify-content:center;gap:15px;width:min(360px,86vw);margin:auto;padding:15px 24px;border:2px solid #fff;border-radius:24px;color:#fff;background:linear-gradient(110deg,#f58fac,#f4b866 52%,#78cbb5);box-shadow:0 8px 0 #e97198,0 15px 26px rgba(225,103,145,.22);font-weight:900;font-size:18px;cursor:pointer;transition:.18s ease}.primary-button:hover{transform:translateY(-2px);box-shadow:0 10px 0 #e97198,0 18px 30px rgba(225,103,145,.25)}.primary-button:active{transform:translateY(5px);box-shadow:0 3px 0 #e97198}.primary-button i{font-style:normal;font-size:22px}.home-meta{display:flex;justify-content:center;gap:18px;margin-top:18px;color:#aa8490;font-size:11px}.home-meta b{color:#6d9277}@keyframes mascot-float{0%,100%{margin-top:0}50%{margin-top:-7px}}
.game-screen{display:grid;grid-template-rows:auto auto 1fr auto;padding:max(8px,env(safe-area-inset-top)) 10px max(8px,env(safe-area-inset-bottom))}.game-header{display:grid;grid-template-columns:44px minmax(100px,.7fr) minmax(360px,2fr) 44px;align-items:center;gap:10px;max-width:1280px;width:100%;margin:auto}.round-button{width:42px;height:42px;border:2px solid rgba(243,158,181,.5);border-radius:15px;background:rgba(255,255,255,.86);box-shadow:0 4px 0 rgba(235,153,174,.28);font-weight:900;font-size:18px;cursor:pointer}.level-label small,.level-label b{display:block}.level-label small{color:#b08491;font-size:10px}.level-label b{margin-top:2px;font-size:16px}.hud-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hud-card{min-height:48px;padding:7px 14px;border:2px solid #f3cfda;border-radius:17px;background:rgba(255,255,255,.86);text-align:center;box-shadow:0 4px 0 rgba(237,177,194,.45)}.hud-card span,.hud-card b{display:block}.hud-card span{color:#a67887;font-size:9px}.hud-card b{font-size:17px;line-height:1.2}.hud-card.mint{border-color:#b9e2d8;box-shadow:0 4px 0 #c5e8df}.hud-card.sun{border-color:#f3db98;box-shadow:0 4px 0 #efdcab}
.progress-row{display:flex;align-items:center;gap:10px;width:min(870px,90%);margin:9px auto 4px}.progress-track{flex:1;height:8px;padding:2px;border-radius:999px;background:rgba(255,255,255,.82);box-shadow:inset 0 0 0 1px rgba(233,163,181,.35);overflow:hidden}.progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f394ae,#f3ca66,#71cbb5);transition:width .35s ease}.progress-row span{min-width:105px;color:#98727f;font-size:10px}.game-main{min-height:0;display:grid;grid-template-columns:minmax(150px,220px) auto minmax(140px,190px);align-items:center;justify-content:center;gap:16px}.goal-panel,.status-panel{align-self:center;padding:18px;border:2px solid rgba(255,255,255,.78);border-radius:24px;background:rgba(255,255,255,.56);box-shadow:0 12px 28px rgba(107,83,91,.08);backdrop-filter:blur(8px)}.panel-kicker{color:#d28ba0;font-size:9px;letter-spacing:.18em}.goal-panel b{display:block;margin:7px 0 6px;font-size:16px}.goal-panel>p,.tip-card p{margin:0;color:#997683;font-size:11px;line-height:1.6}.tip-card{margin-top:18px;padding:11px;border-radius:16px;background:#fff5d9}.tip-card span{color:#bd8a45;font-size:10px;font-weight:900}
.board-column{position:relative}.board-shell{position:relative;width:var(--board-size);max-width:900px;aspect-ratio:1;overflow:hidden;border:4px solid rgba(255,255,255,.9);border-radius:5.5%;background:linear-gradient(180deg,#c9f1ee 0%,#eef8df 44%,#fff0cf 68%,#cfeaba 100%);box-shadow:0 0 0 3px rgba(239,183,205,.58),0 15px 30px rgba(89,116,98,.16),inset 0 0 45px rgba(255,255,255,.4)}.board-shell::before{content:"";position:absolute;left:-12%;right:-12%;bottom:-14%;height:45%;border-radius:50% 50% 0 0;background:rgba(116,195,124,.19);transform:rotate(-3deg)}.board-shell::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 8% 78%,rgba(255,170,195,.45) 0 .7%,transparent .9%),radial-gradient(circle at 91% 57%,rgba(255,208,100,.4) 0 .8%,transparent 1%),radial-gradient(circle at 76% 87%,rgba(95,181,129,.35) 0 .8%,transparent 1%)}.cloud{position:absolute;width:14%;height:5%;border-radius:50%;background:rgba(255,255,255,.54);z-index:0}.cloud-one{left:5%;top:7%}.cloud-two{right:8%;top:14%;transform:scale(.8)}.board{position:absolute;inset:2.4%;z-index:2;touch-action:none}
.piece{--c:0;--r:0;position:absolute;left:0;top:0;width:12.5%;height:12.5%;padding:0;border:0;background:transparent;display:grid;place-items:center;transform:translate(calc(var(--c)*100%),calc(var(--r)*100%));transition:transform .2s cubic-bezier(.22,.76,.24,1.08),opacity .18s ease;will-change:transform;cursor:pointer;touch-action:none}.piece.instant{transition:none!important}.piece img{width:73%;height:73%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 4px 3px rgba(93,68,77,.17));transform-origin:50% 72%}.piece:hover img{transform:translateY(-2px) scale(1.04)}.piece.selected img{animation:selected-bob .6s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(255,131,170,.65))}.piece.selected::before{content:"";position:absolute;inset:9%;border:2px dashed rgba(244,125,160,.78);border-radius:50%;animation:ring-spin 4s linear infinite}.piece.hint img{animation:hint-pop .42s ease-in-out 3}.piece.invalid img{animation:invalid-shake .25s ease 2}.piece.clearing{z-index:5;pointer-events:none}.piece.clearing img{animation:clear-happy .3s ease-in forwards}.piece.clearing::before{content:"♥";position:absolute;left:60%;top:2%;color:#f574a0;font-size:clamp(12px,2.5vmin,24px);z-index:4;animation:heart-fly .35s ease-out forwards;text-shadow:0 1px #fff}.piece.special-row::after,.piece.special-col::after,.piece.special-burst::after,.piece.special-rainbow::after{position:absolute;right:7%;bottom:8%;display:grid;place-items:center;width:27%;aspect-ratio:1;border:2px solid #fff;border-radius:50%;color:#fff;font-size:clamp(8px,1.7vmin,16px);font-weight:900;box-shadow:0 2px 5px rgba(70,57,61,.2)}.piece.special-row::after{content:"↔";background:#ef89aa}.piece.special-col::after{content:"↕";background:#65c6b0}.piece.special-burst::after{content:"✿";background:#f0b44d}.piece.special-rainbow::after{content:"★";background:linear-gradient(135deg,#ef87aa,#f3c35d,#65c6b0,#9b7ad4)}.piece.special-born img{animation:special-born .48s ease}
.combo-badge{position:absolute;left:50%;top:-9px;z-index:8;transform:translate(-50%,-100%) scale(.7);opacity:0;padding:7px 16px;border:2px solid #fff;border-radius:999px;color:#fff;background:linear-gradient(100deg,#f08cac,#efba58);box-shadow:0 5px 12px rgba(213,104,140,.25);font-weight:900;transition:.2s ease;pointer-events:none}.combo-badge.show{transform:translate(-50%,-100%) scale(1);opacity:1}.streak-card{padding:14px;border-radius:18px;background:#e5f6ec;text-align:center}.streak-card span,.streak-card b{display:block}.streak-card span{color:#799785;font-size:10px}.streak-card b{margin-top:5px;color:#4da98f;font-size:25px}.legend{display:grid;gap:10px;margin-top:16px;color:#92727e;font-size:10px}.legend span{display:flex;align-items:center;gap:8px}.legend i{display:grid;place-items:center;width:26px;height:26px;border-radius:9px;color:#fff;font-style:normal;font-weight:900}.legend-line{background:#ef8fac}.legend-star{background:#eeba55}
.tool-bar{display:flex;justify-content:center;gap:9px;margin-top:7px}.tool-button{position:relative;min-width:75px;padding:7px 14px;border:2px solid rgba(241,188,203,.75);border-radius:17px;background:rgba(255,255,255,.87);box-shadow:0 4px 0 rgba(230,175,191,.45);cursor:pointer;transition:.16s ease}.tool-button:hover{transform:translateY(-2px)}.tool-button:active,.tool-button.active{transform:translateY(3px);box-shadow:0 1px 0 rgba(230,175,191,.45);background:#fff1f5}.tool-button i,.tool-button span,.tool-button small{display:block}.tool-button i{font-style:normal;font-size:17px;line-height:1}.tool-button span{margin-top:3px;font-size:10px;font-weight:900}.tool-button small{position:absolute;right:5px;top:3px;color:#b78042;font-size:8px}
.modal{position:absolute;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(95,69,82,.22);backdrop-filter:blur(9px);opacity:0;visibility:hidden;transition:.22s ease}.modal.show{opacity:1;visibility:visible}.modal-card{width:min(360px,90vw);padding:24px;border:3px solid #fff;border-radius:30px;background:linear-gradient(155deg,#fffdf9,#fff0f4);box-shadow:var(--shadow);text-align:center;transform:translateY(12px) scale(.96);transition:.22s ease}.modal.show .modal-card{transform:none}.modal-mascot{width:90px;height:90px;margin:-58px auto 4px;padding:8px;border:3px solid #fff;border-radius:50%;background:#ffefc8;box-shadow:0 8px 18px rgba(112,81,90,.15)}.modal-mascot img{width:100%;height:100%;object-fit:contain}.modal h2{margin:9px 0 7px;font-size:25px}.modal p{margin:0 0 17px;color:#987681;font-size:12px;line-height:1.7}.modal-actions{display:grid;gap:8px}.modal-actions button{padding:11px 15px;border:0;border-radius:15px;background:#f292ae;color:#fff;font-weight:900;cursor:pointer}.modal-actions button.secondary{color:#6a8f79;background:#e1f3e9}.toast{position:absolute;left:50%;bottom:90px;z-index:60;transform:translate(-50%,15px);padding:9px 18px;border:2px solid #fff;border-radius:999px;color:#fff;background:rgba(94,74,82,.88);box-shadow:0 8px 18px rgba(72,53,60,.15);font-size:11px;opacity:0;pointer-events:none;transition:.2s ease}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes selected-bob{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8%) scale(1.06)}}@keyframes ring-spin{to{transform:rotate(360deg)}}@keyframes hint-pop{0%,100%{transform:scale(1)}50%{transform:translateY(-10%) scale(1.12)}}@keyframes invalid-shake{0%,100%{transform:translateX(0)}35%{transform:translateX(-8%)}70%{transform:translateX(8%)}}@keyframes clear-happy{0%{transform:scale(1)}45%{transform:translateY(-14%) scale(1.18) rotate(-4deg)}100%{transform:scale(.15) rotate(9deg);opacity:0}}@keyframes heart-fly{0%{opacity:0;transform:translateY(6px) scale(.5)}30%{opacity:1}100%{opacity:0;transform:translateY(-24px) scale(1.2)}}@keyframes special-born{0%{transform:scale(.35) rotate(-18deg)}65%{transform:scale(1.18) rotate(5deg)}100%{transform:scale(1)}}
@media(max-width:900px){.game-main{grid-template-columns:auto}.goal-panel,.status-panel{display:none}.game-header{grid-template-columns:40px 90px 1fr 40px}.hud-stats{gap:5px}.hud-card{padding:6px 7px}.level-label b{font-size:13px}}
@media(max-width:620px){:root{--board-size:min(96vw,calc(100dvh - 220px))}.home-screen{align-items:start;padding-top:18px}.brand h1{font-size:47px}.brand p{margin-top:8px}.mascot-stage{height:238px}.mascot{width:88px;height:88px}.mascot-bear{width:108px;height:108px;margin-left:-54px}.mascot-penguin,.mascot-cat{width:76px;height:76px}.garden-sign{width:190px;padding:10px}.mode-picker{gap:6px}.mode-chip{min-width:0;flex:1;padding:8px 6px}.home-meta{gap:11px}.game-screen{padding-left:5px;padding-right:5px}.game-header{grid-template-columns:37px 67px 1fr 37px;gap:5px}.round-button{width:36px;height:36px;border-radius:12px}.level-label small{display:none}.level-label b{font-size:11px}.hud-card{min-height:39px;border-radius:13px}.hud-card span{font-size:8px}.hud-card b{font-size:13px}.progress-row{margin:7px auto 3px}.progress-row span{display:none}.tool-bar{gap:5px}.tool-button{min-width:62px;padding:6px 8px}.tool-button span{font-size:9px}.toast{bottom:75px}.board-shell{border-width:3px}.piece img{width:77%;height:77%}}
@media(max-height:720px) and (min-width:700px){:root{--board-size:min(58vh,calc(100vw - 430px))}.game-header{max-width:1160px}.goal-panel,.status-panel{padding:14px}.tool-bar{margin-top:5px}.tool-button{padding-top:5px;padding-bottom:5px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}


/* v3 adventure, shop and animation layer */
:root{--ink:#5d4653;--berry:#ef7e9d;--berry-deep:#d85e82;--mint:#9adbc7;--mint-deep:#4fae99;--cream:#fff9ec;--sun:#ffd56c;--leaf:#79bf83;--cell:12.5%;--ease-spring:cubic-bezier(.2,.85,.25,1.18)}
button{font:inherit}.screen{min-height:100%;min-height:100dvh}.screen:not(.active){display:none!important}
.home-topbar{position:absolute;z-index:5;top:max(14px,env(safe-area-inset-top));right:clamp(16px,4vw,48px);display:flex;gap:10px}.profile-pill{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:6px;min-width:92px;padding:8px 13px;border:2px solid rgba(255,255,255,.9);border-radius:20px;background:rgba(255,255,255,.78);box-shadow:0 8px 24px rgba(111,81,91,.1);backdrop-filter:blur(9px);color:var(--ink)}.profile-pill span{grid-row:1/3;font-size:22px}.profile-pill b{font-size:17px;line-height:1}.profile-pill small{font-size:10px;opacity:.65}.coin-pill{background:rgba(255,248,211,.86)}
.home-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;padding:72px 20px 32px;text-align:center}.brand-badge{padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.76);color:#7b9b69;font-weight:800;font-size:12px;letter-spacing:.08em;box-shadow:0 8px 24px rgba(88,126,92,.1)}
.mascot-stage{position:relative;width:min(430px,84vw);height:clamp(150px,23vh,230px);margin:8px auto -5px}.mascot-hill{position:absolute;left:8%;right:8%;bottom:10px;height:50%;border-radius:50% 50% 20% 20%;background:linear-gradient(180deg,#d9f3bf,#a9dfaa);box-shadow:inset 0 10px 20px rgba(255,255,255,.5)}.hill-back:before,.hill-back:after{content:"";position:absolute;bottom:28%;width:34%;height:45%;border-radius:50%;background:#c9edb8}.hill-back:before{left:-6%}.hill-back:after{right:-7%}
.home-animal{position:absolute;z-index:2;object-fit:contain;filter:drop-shadow(0 8px 5px rgba(104,70,80,.18));animation:home-bob 3.2s ease-in-out infinite}.animal-main{width:36%;height:70%;left:32%;bottom:8%}.animal-left{width:27%;height:55%;left:11%;bottom:8%;animation-delay:-1.2s}.animal-right{width:27%;height:56%;right:11%;bottom:7%;animation-delay:-2.1s}.mascot-cloud{position:absolute;width:65px;height:22px;border-radius:999px;background:rgba(255,255,255,.85)}.mascot-cloud:before,.mascot-cloud:after{content:"";position:absolute;border-radius:50%;background:inherit}.mascot-cloud:before{width:27px;height:27px;left:11px;bottom:5px}.mascot-cloud:after{width:34px;height:34px;right:8px;bottom:3px}.cloud-one{left:1%;top:24%}.cloud-two{right:0;top:10%;transform:scale(.75)}.mascot-flower{position:absolute;z-index:3;color:#fff;font-size:24px;text-shadow:0 2px 0 #f6a9bb}.flower-one{left:20%;bottom:12%}.flower-two{right:18%;bottom:9%;color:#fff5a7;text-shadow:0 2px 0 #f0c66b}
.brand-copy h1{margin:0;color:var(--ink);font-size:clamp(40px,7vw,70px);line-height:1;font-weight:950;letter-spacing:-.06em;text-shadow:0 5px 0 rgba(255,255,255,.72)}.brand-copy p:last-child{margin:12px 0 18px;color:#8d6f7c;font-weight:700}.eyebrow{margin:0 0 8px;color:#d67b96;font-size:11px;font-weight:900;letter-spacing:.35em}
.mode-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;width:min(540px,100%);padding:6px;border-radius:25px;background:rgba(255,255,255,.58);box-shadow:inset 0 0 0 1px rgba(255,255,255,.75)}.mode-chip{padding:11px 8px;border:0;border-radius:19px;background:transparent;color:#8d7280;cursor:pointer;transition:.2s ease}.mode-chip b,.mode-chip small{display:block}.mode-chip b{font-size:14px}.mode-chip small{margin-top:3px;font-size:9px;opacity:.72}.mode-chip.selected{color:#fff;background:linear-gradient(145deg,#f494ad,#efb37c);box-shadow:0 6px 16px rgba(220,104,133,.27);transform:translateY(-1px)}
.primary-button{display:flex;align-items:center;justify-content:space-between;width:min(390px,92vw);margin:14px 0 10px;padding:17px 18px 17px 27px;border:0;border-radius:24px;background:linear-gradient(135deg,#f58da7 0 52%,#87d8bd);color:#fff;box-shadow:0 7px 0 #e6658b,0 13px 26px rgba(210,88,121,.25);font-size:18px;font-weight:950;cursor:pointer}.primary-button i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.24);font-style:normal}.primary-button:active{transform:translateY(4px);box-shadow:0 3px 0 #e6658b}
.home-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;width:min(390px,92vw);margin-top:5px}.soft-button{display:flex;align-items:center;justify-content:center;gap:7px;padding:11px;border:1px solid rgba(225,139,162,.28);border-radius:17px;background:rgba(255,255,255,.76);color:#765563;box-shadow:0 5px 14px rgba(109,78,89,.08);cursor:pointer}.soft-button.shop-accent{background:rgba(255,246,204,.8);border-color:#f2d77c}.home-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:14px;color:#a18491;font-size:11px;font-weight:700}
.nature-decor{position:absolute;pointer-events:none}.nature-sun{top:-80px;left:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,#fffbd8 0 35%,rgba(255,234,158,.35) 36% 61%,transparent 62%)}.nature-leaf{width:160px;height:80px;border-radius:100% 0 100% 0;background:rgba(151,221,181,.16)}.leaf-a{right:-35px;bottom:8%;transform:rotate(-22deg)}.leaf-b{left:-50px;bottom:24%;transform:rotate(28deg);background:rgba(255,183,201,.15)}
.menu-screen{overflow-y:auto;padding:clamp(16px,3vw,38px);background:radial-gradient(circle at 10% 10%,rgba(255,255,255,.95) 0 8%,transparent 9%),linear-gradient(160deg,#fff9ef,#f4fff7 55%,#fff3f6);color:var(--ink)}.menu-screen:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.45;background-image:radial-gradient(circle at 20% 35%,rgba(154,219,199,.18) 0 70px,transparent 72px),radial-gradient(circle at 86% 78%,rgba(255,194,208,.2) 0 110px,transparent 112px)}
.menu-header{position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;max-width:980px;margin:0 auto 18px}.menu-header>div:nth-child(2){text-align:left}.menu-header h2{margin:1px 0;font-size:clamp(24px,4vw,38px);letter-spacing:-.04em}.menu-header small{color:#a27d8c;font-weight:800}.round-button{display:grid;place-items:center;width:46px;height:46px;padding:0;border:2px solid rgba(255,255,255,.9);border-radius:17px;background:rgba(255,255,255,.78);color:#765563;box-shadow:0 5px 0 rgba(224,148,168,.35),0 9px 20px rgba(101,74,84,.09);font-size:22px;font-weight:950;cursor:pointer}.currency-button{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:5px;min-width:102px;padding:8px 12px;border:0;border-radius:17px;background:#fff5c9;color:#785e35;box-shadow:0 5px 0 #efd27a;cursor:pointer}.currency-button span{grid-row:1/3;font-size:21px}.currency-button b{font-size:16px}.currency-button small{font-size:9px}.currency-button.static{cursor:default}
.chapter-card,.shop-banner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;max-width:980px;min-height:150px;margin:0 auto 22px;padding:25px 32px;overflow:hidden;border:2px solid rgba(255,255,255,.92);border-radius:32px;background:linear-gradient(125deg,rgba(194,235,191,.95),rgba(255,245,195,.95));box-shadow:0 12px 35px rgba(89,126,91,.13)}.chapter-card:after{content:"";position:absolute;right:-40px;bottom:-65px;width:250px;height:160px;border-radius:50%;background:rgba(255,255,255,.34)}.chapter-card img{position:relative;z-index:2;width:130px;height:120px;object-fit:contain;filter:drop-shadow(0 8px 5px rgba(90,95,69,.17))}.chapter-copy span{font-size:12px;font-weight:950;color:#65936a}.chapter-copy h3,.shop-banner h3{margin:7px 0;font-size:clamp(22px,3vw,31px)}.chapter-copy p,.shop-banner p{margin:0;color:#70806e;font-weight:650}
.level-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(6,minmax(110px,1fr));gap:14px;max-width:980px;margin:0 auto;padding-bottom:30px}.level-card{position:relative;min-height:142px;padding:16px 12px;border:2px solid rgba(255,255,255,.9);border-radius:25px;background:rgba(255,255,255,.78);color:var(--ink);box-shadow:0 7px 0 rgba(171,211,176,.55),0 12px 24px rgba(79,111,83,.08);text-align:left;cursor:pointer;transition:.2s var(--ease-spring)}.level-card:hover:not(:disabled){transform:translateY(-4px) rotate(-1deg);box-shadow:0 11px 0 rgba(171,211,176,.55),0 17px 28px rgba(79,111,83,.12)}.level-card:disabled{filter:grayscale(.6);opacity:.56;cursor:not-allowed}.level-card.current{outline:3px solid #f3b5c5;outline-offset:2px}.level-card.complete{background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(255,248,205,.88))}.level-number{display:flex;align-items:center;justify-content:space-between}.level-number b{font-size:25px}.level-number span{font-size:18px}.level-objective{display:block;min-height:31px;margin-top:9px;color:#8a737d;font-size:10px;font-weight:800;line-height:1.45}.level-stars{display:flex;gap:2px;margin-top:8px;font-size:16px}.level-stars .off{filter:grayscale(1);opacity:.23}.chapter-divider{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin:10px 0 0;color:#739878;font-size:13px;font-weight:950}.chapter-divider:after{content:"";height:2px;flex:1;background:linear-gradient(90deg,rgba(115,152,120,.3),transparent)}
.shop-banner{background:linear-gradient(125deg,#ffe6b6,#ffd8e3)}.shopkeeper{position:relative;align-self:stretch;min-width:180px}.shopkeeper img{position:absolute;right:35px;bottom:-20px;width:120px;height:120px;object-fit:contain}.shopkeeper span{position:absolute;right:0;top:0;padding:7px 10px;border-radius:14px 14px 14px 2px;background:#fff;color:#b76e80;font-size:10px;font-weight:900;box-shadow:0 4px 12px rgba(126,86,94,.12)}.tiny-label{display:inline-block;padding:5px 9px;border-radius:99px;background:#fff8d9;color:#bf8356;font-size:10px;font-weight:900}
.inventory-strip{position:relative;z-index:1;display:flex;gap:8px;max-width:980px;margin:0 auto 14px;padding:11px 13px;overflow-x:auto;border-radius:20px;background:rgba(255,255,255,.58)}.inventory-chip{flex:0 0 auto;display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:13px;background:#fff;color:#765563;font-size:11px;font-weight:850}.inventory-chip span{font-size:18px}.shop-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:980px;margin:0 auto;padding-bottom:30px}.shop-item{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:18px;border:2px solid rgba(255,255,255,.9);border-radius:25px;background:rgba(255,255,255,.8);box-shadow:0 7px 0 rgba(236,185,197,.48),0 12px 26px rgba(109,78,89,.08)}.shop-item-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:19px;background:linear-gradient(145deg,#fff5c3,#ffe5ed);font-size:30px}.shop-item h3{margin:2px 0 3px;font-size:16px}.shop-item p{margin:0;color:#937b86;font-size:10px;font-weight:650;line-height:1.45}.shop-item-footer{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;margin-top:5px}.owned-label{font-size:11px;font-weight:850;color:#6b9b81}.buy-button{padding:9px 13px;border:0;border-radius:14px;background:linear-gradient(135deg,#f493ad,#efb172);color:#fff;font-size:12px;font-weight:900;box-shadow:0 4px 0 #df6687;cursor:pointer}.buy-button:disabled{filter:grayscale(.7);opacity:.55;cursor:not-allowed}
.game-header{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important}.game-title{text-align:center}.game-title h2{margin:1px 0;color:var(--ink);font-size:clamp(18px,3vw,28px)}.game-title small{color:#9a7d88;font-weight:850}.hud{grid-template-columns:repeat(3,1fr)!important}.hud-card{min-width:0}.hud-card strong{font-variant-numeric:tabular-nums}.goal-panel{display:flex!important;align-items:center;gap:14px}.goal-copy{display:flex;align-items:center;gap:9px;min-width:max-content}.goal-copy>span{display:grid;place-items:center;width:37px;height:37px;border-radius:14px;background:#fff7d3;font-size:21px}.goal-copy small,.goal-copy b{display:block}.goal-copy small{font-size:9px;color:#a28791}.goal-copy b{font-size:12px;color:var(--ink)}.progress-track{height:10px;flex:1;overflow:hidden;border:2px solid rgba(255,255,255,.9);border-radius:999px;background:rgba(255,255,255,.55)}.progress-track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#facf65,#78d1b4,#f397ae);transition:width .35s ease}
.board-shell{position:relative;isolation:isolate}.board-scenery{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}.scenery-cloud{position:absolute;width:80px;height:25px;border-radius:999px;background:rgba(255,255,255,.55)}.scenery-cloud:before,.scenery-cloud:after{content:"";position:absolute;bottom:5px;border-radius:50%;background:inherit}.scenery-cloud:before{left:13px;width:31px;height:31px}.scenery-cloud:after{right:12px;width:39px;height:39px}.scenery-cloud.c1{left:4%;top:9%;transform:scale(.75)}.scenery-cloud.c2{right:2%;top:25%;transform:scale(.55)}.scenery-bush{position:absolute;bottom:-7%;width:43%;height:19%;border-radius:50% 50% 0 0;background:rgba(112,196,132,.16)}.scenery-bush.b1{left:-9%}.scenery-bush.b2{right:-10%;transform:scaleX(1.3)}
.board{position:relative!important;z-index:2;width:100%;height:100%;touch-action:none}.piece{position:absolute!important;left:0!important;top:0!important;width:var(--cell)!important;height:var(--cell)!important;padding:clamp(2px,.55vw,6px)!important;border:0!important;background:transparent!important;transform:translate3d(calc(var(--col,0) * 100%),calc(var(--row,0) * 100%),0);transition:transform .235s cubic-bezier(.2,.82,.28,1),filter .18s ease;will-change:transform;cursor:pointer;z-index:2}.piece-face{position:relative;display:grid;width:100%;height:100%;place-items:center;border-radius:34%;background:rgba(255,255,255,.17);transition:transform .18s var(--ease-spring),background .2s ease,box-shadow .2s ease}.piece img{display:block;width:91%!important;height:91%!important;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 1px rgba(91,69,77,.16));transform-origin:50% 66%}.piece:hover .piece-face{transform:translateY(-2px) scale(1.04);background:rgba(255,255,255,.35)}.piece.selected .piece-face{background:rgba(255,255,255,.72);box-shadow:0 0 0 3px #fff,0 0 0 6px #f3a7bc,0 6px 18px rgba(218,103,136,.28);animation:selected-breathe .75s ease-in-out infinite alternate}.piece.hint .piece-face{animation:hint-hop .6s var(--ease-spring) 2;background:rgba(255,248,181,.65);box-shadow:0 0 0 3px #fff4a1}.piece-enter .piece-face{animation:piece-arrive .44s var(--ease-spring) both;animation-delay:calc(var(--delay,0) * 22ms)}
.piece.special-row .piece-face:after,.piece.special-col .piece-face:after,.piece.special-burst .piece-face:after,.piece.special-rainbow .piece-face:after{position:absolute;display:grid;place-items:center;right:3%;bottom:5%;width:30%;height:30%;border:2px solid #fff;border-radius:50%;color:#fff;font-size:clamp(8px,1.4vw,15px);font-weight:950;box-shadow:0 2px 6px rgba(75,53,65,.22);animation:special-pulse 1.1s ease-in-out infinite}.piece.special-row .piece-face:after{content:"↔";background:#f28aa6}.piece.special-col .piece-face:after{content:"↕";background:#67c9b0}.piece.special-burst .piece-face:after{content:"✦";background:#f1b24a}.piece.special-rainbow .piece-face:after{content:"✿";background:conic-gradient(#f38aa5,#f3d168,#72d3b8,#79bce8,#b98ae8,#f38aa5)}
.combo-badge{position:absolute;z-index:20;left:50%;top:48%;padding:9px 18px;border:3px solid #fff;border-radius:999px;background:linear-gradient(135deg,#f68fac,#f5c65f);color:#fff;box-shadow:0 8px 25px rgba(197,84,114,.28);font-size:clamp(18px,4vw,34px);font-weight:950;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.5)}.combo-badge.show{animation:combo-pop .72s var(--ease-spring)}
.piece.clearing{z-index:8;pointer-events:none}.piece.clearing:after{content:attr(data-reaction);position:absolute;z-index:5;left:50%;top:-5%;padding:3px 7px;border:2px solid #fff;border-radius:10px 10px 10px 2px;background:#fff8cb;color:#9b6474;font-size:clamp(7px,1vw,11px);font-weight:950;white-space:nowrap;animation:reaction-pop .34s ease both}.piece.clearing.clear-style-0 img{animation:clear-rabbit .38s ease-in forwards}.piece.clearing.clear-style-1 img{animation:clear-bear .4s ease-in forwards}.piece.clearing.clear-style-2 img{animation:clear-cat .38s ease-in forwards}.piece.clearing.clear-style-3 img{animation:clear-frog .4s ease-in forwards}.piece.clearing.clear-style-4 img{animation:clear-penguin .42s ease-in forwards}.piece.clearing.clear-style-5 img{animation:clear-fox .4s ease-in forwards}.piece.clearing.clear-combo-2 .piece-face{filter:drop-shadow(0 0 8px #fff09a)}.piece.clearing.clear-combo-3 .piece-face,.piece.clearing.clear-combo-4 .piece-face{filter:drop-shadow(0 0 13px #f68dad)}
.piece.invalid{z-index:9}.piece.invalid:after{content:attr(data-reaction);position:absolute;left:50%;top:-10%;padding:3px 6px;border:2px solid #fff;border-radius:10px;background:#ffe5eb;color:#c75d79;font-size:9px;font-weight:950;white-space:nowrap;animation:reaction-pop .28s ease both}.piece.invalid.invalid-style-0 img{animation:no-rabbit .42s ease 2}.piece.invalid.invalid-style-1 img{animation:no-bear .46s ease 2}.piece.invalid.invalid-style-2 img{animation:no-cat .38s ease 2}.piece.invalid.invalid-style-3 img{animation:no-frog .44s ease 2}.piece.invalid.invalid-style-4 img{animation:no-penguin .42s ease 2}.piece.invalid.invalid-style-5 img{animation:no-fox .4s ease 2}
.board-shell.tool-hammer{animation:tool-impact .38s ease}.board-shell.tool-cross:after{content:"";position:absolute;z-index:15;inset:0;background:linear-gradient(90deg,transparent 47%,rgba(255,244,158,.82) 50%,transparent 53%),linear-gradient(0deg,transparent 47%,rgba(255,244,158,.82) 50%,transparent 53%);animation:tool-flash .42s ease forwards;pointer-events:none}.board-shell.tool-rainbow:after{content:"";position:absolute;z-index:15;inset:0;border-radius:inherit;background:conic-gradient(from 30deg,rgba(255,139,169,.32),rgba(255,222,111,.28),rgba(105,214,183,.32),rgba(113,188,235,.28),rgba(189,142,237,.3),rgba(255,139,169,.32));animation:rainbow-wave .56s ease forwards;pointer-events:none}.board.shuffling .piece-face{animation:shuffle-leaf .48s var(--ease-spring)}
.toolbar{display:flex!important;gap:8px!important;overflow-x:auto!important;scrollbar-width:none;padding-bottom:max(8px,env(safe-area-inset-bottom))!important}.toolbar::-webkit-scrollbar{display:none}.tool-button{position:relative;flex:0 0 clamp(72px,11vw,95px)!important;min-width:0!important}.tool-button.active{background:#fff7c8!important;box-shadow:0 0 0 3px #f4cc6d,0 5px 0 #ddb96a!important;transform:translateY(-2px)}.tool-button.empty{filter:grayscale(.65);opacity:.56}.tool-count{position:absolute;right:5px;top:3px;display:grid;place-items:center;min-width:22px;height:19px;padding:0 5px;border:2px solid #fff;border-radius:99px;background:#f29ab1;color:#fff;font-size:10px;font-weight:950}.status-panel.success{background:rgba(225,250,220,.88)!important}.status-panel.warning{background:rgba(255,234,218,.9)!important}
@keyframes home-bob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}@keyframes selected-breathe{to{transform:translateY(-3px) scale(1.07)}}@keyframes hint-hop{0%,100%{transform:none}45%{transform:translateY(-12%) scale(1.08)}}@keyframes piece-arrive{0%{opacity:0;transform:translateY(-65%) scale(.62) rotate(-8deg)}70%{opacity:1;transform:translateY(5%) scale(1.05)}100%{transform:none}}@keyframes special-pulse{50%{transform:scale(1.18) rotate(8deg)}}@keyframes combo-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.4) rotate(-8deg)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.15) rotate(3deg)}70%{opacity:1;transform:translate(-50%,-60%) scale(1)}100%{opacity:0;transform:translate(-50%,-90%) scale(.8)}}@keyframes reaction-pop{0%{opacity:0;transform:translate(-50%,8px) scale(.5)}60%{opacity:1;transform:translate(-50%,-3px) scale(1.1)}100%{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes clear-rabbit{0%{transform:none}35%{transform:translateY(-23%) scale(1.12)}60%{transform:translateY(7%) scaleX(1.15) scaleY(.82)}100%{opacity:0;transform:translateY(-45%) scale(.25)}}@keyframes clear-bear{0%{transform:none}30%{transform:rotate(-10deg) scale(1.1)}55%{transform:rotate(10deg) scale(1.13)}100%{opacity:0;transform:translateY(25%) scale(.2)}}@keyframes clear-cat{0%{transform:none}25%{transform:translateX(-10%) rotate(-8deg)}50%{transform:translateX(10%) rotate(8deg) scale(1.1)}100%{opacity:0;transform:translateY(-30%) rotate(-18deg) scale(.2)}}@keyframes clear-frog{0%{transform:none}35%{transform:scaleX(1.18) scaleY(.75) translateY(10%)}65%{transform:scaleX(.82) scaleY(1.25) translateY(-15%)}100%{opacity:0;transform:scale(1.45);filter:blur(3px)}}@keyframes clear-penguin{0%{transform:none}45%{transform:rotate(20deg) translateY(-8%) scale(1.08)}100%{opacity:0;transform:rotate(180deg) scale(.18)}}@keyframes clear-fox{0%{transform:none}35%{transform:rotate(-14deg) scale(1.12)}70%{transform:rotate(18deg) translateY(-15%)}100%{opacity:0;transform:rotate(120deg) scale(.16)}}@keyframes no-rabbit{0%,100%{transform:none}25%{transform:translateX(-9%) rotate(-5deg)}75%{transform:translateX(9%) rotate(5deg)}}@keyframes no-bear{0%,100%{transform:none}30%{transform:translateY(7%) scaleY(.92)}65%{transform:translateY(-4%) scaleY(1.04)}}@keyframes no-cat{0%,100%{transform:none}20%{transform:translateX(-12%) rotate(-9deg)}40%{transform:translateX(10%) rotate(8deg)}60%{transform:translateX(-7%) rotate(-5deg)}80%{transform:translateX(5%) rotate(4deg)}}@keyframes no-frog{0%,100%{transform:none}40%{transform:scaleX(1.12) scaleY(.88)}70%{transform:scaleX(.9) scaleY(1.08)}}@keyframes no-penguin{0%,100%{transform:none}25%{transform:rotate(-13deg)}75%{transform:rotate(13deg)}}@keyframes no-fox{0%,100%{transform:none}25%{transform:translateX(-8%) rotate(-12deg)}50%{transform:translateX(8%) rotate(10deg)}75%{transform:translateX(-5%) rotate(-6deg)}}@keyframes tool-impact{45%{transform:scale(.985)}70%{transform:scale(1.008)}}@keyframes tool-flash{0%{opacity:0;transform:scale(.7)}35%{opacity:1}100%{opacity:0;transform:scale(1.08)}}@keyframes rainbow-wave{0%{opacity:0;transform:scale(.5) rotate(-20deg)}45%{opacity:1}100%{opacity:0;transform:scale(1.25) rotate(18deg)}}@keyframes shuffle-leaf{0%,100%{transform:none}35%{transform:rotate(-20deg) scale(.82)}70%{transform:rotate(18deg) scale(1.08)}}
@media(max-width:820px){.level-grid{grid-template-columns:repeat(3,minmax(90px,1fr))}.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chapter-card,.shop-banner{padding:20px}.home-topbar{right:14px}.profile-pill{min-width:78px;padding:7px 9px}}@media(max-width:540px){.home-content{justify-content:flex-start;padding-top:82px}.mascot-stage{height:155px}.brand-copy h1{font-size:43px}.brand-copy p:last-child{font-size:12px}.mode-chip{padding:9px 4px}.mode-chip b{font-size:12px}.mode-chip small{font-size:8px}.home-meta{display:none}.menu-screen{padding:13px}.menu-header{gap:9px}.round-button{width:42px;height:42px}.currency-button{min-width:88px}.chapter-card,.shop-banner{min-height:125px;padding:17px;border-radius:25px}.chapter-card img{width:90px;height:90px}.chapter-copy p,.shop-banner p{font-size:10px}.level-grid{gap:9px}.level-card{min-height:125px;padding:13px 10px;border-radius:20px}.shop-grid{grid-template-columns:1fr;gap:10px}.shop-item{padding:14px}.shopkeeper{min-width:95px}.shopkeeper img{right:0;width:85px;height:85px}.shopkeeper span{display:none}.goal-panel{gap:8px}.goal-copy{min-width:120px}.goal-copy b{max-width:116px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.piece{padding:2px!important}.piece img{width:96%!important;height:96%!important}.toolbar{padding-left:7px!important;padding-right:7px!important}.tool-button{flex-basis:68px!important}.tool-button b{font-size:9px!important}.tool-button small{font-size:7px!important}}@media(max-height:720px) and (min-width:700px){.home-content{padding-top:50px}.mascot-stage{height:145px}.brand-copy h1{font-size:45px}.brand-copy p:last-child{margin:8px 0 10px}.mode-chip{padding:8px}.primary-button{padding-top:13px;padding-bottom:13px}.home-meta{margin-top:9px}}@media(prefers-reduced-motion:reduce){.home-animal,.piece,.piece-face,.piece img,.combo-badge{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* v4 responsive game composition */
.hud{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
.board-shell{margin-left:auto!important;margin-right:auto!important}
@media (min-width:980px) and (min-height:680px){
  #game-screen.active{
    box-sizing:border-box;
    display:grid!important;
    grid-template-columns:minmax(540px,820px) minmax(340px,420px);
    grid-template-rows:auto auto auto minmax(84px,1fr) auto;
    align-content:center;
    justify-content:center;
    align-items:stretch;
    column-gap:clamp(16px,2vw,26px);
    row-gap:11px;
    width:100%;
    height:100dvh;
    min-height:0!important;
    padding:14px clamp(24px,4vw,72px) 16px;
    overflow:hidden;
    background:
      radial-gradient(circle at 10% 11%,rgba(255,255,255,.92) 0 82px,transparent 84px),
      radial-gradient(circle at 88% 16%,rgba(255,216,226,.34) 0 150px,transparent 152px),
      radial-gradient(circle at 83% 92%,rgba(169,226,197,.26) 0 180px,transparent 182px),
      linear-gradient(145deg,#fff9f3 0 46%,#f4fbf9 100%);
  }
  #game-screen.active:before{
    content:"";
    position:absolute;
    z-index:0;
    left:4%;
    bottom:-55px;
    width:34%;
    height:145px;
    border-radius:50% 50% 0 0;
    background:rgba(171,221,161,.16);
    pointer-events:none;
  }
  #game-screen.active>*{position:relative;z-index:1}
  #game-screen.active .game-header{
    grid-column:1/-1;
    grid-row:1;
    align-self:start;
    width:100%;
    max-width:none!important;
    min-height:58px;
    margin:0!important;
    padding:7px 11px!important;
    border:2px solid rgba(255,255,255,.9);
    border-radius:23px;
    background:rgba(255,255,255,.67);
    box-shadow:0 8px 24px rgba(108,77,88,.08);
    backdrop-filter:blur(10px);
  }
  #game-screen.active .game-header .round-button{width:42px;height:42px;border-radius:15px}
  #game-screen.active .game-title h2{font-size:25px;line-height:1.05}
  #game-screen.active .game-title small{font-size:10px}
  #game-screen.active .board-shell{
    grid-column:1;
    grid-row:2/6;
    align-self:center;
    justify-self:end;
    width:min(76dvh,820px)!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    margin:0!important;
    aspect-ratio:1;
    border-radius:35px!important;
    box-shadow:
      0 0 0 6px rgba(255,255,255,.74),
      0 0 0 9px rgba(238,184,203,.48),
      0 18px 45px rgba(94,90,73,.16)!important;
  }
  #game-screen.active .hud{
    grid-column:2;
    grid-row:2;
    align-self:start;
    width:100%;
    margin:0!important;
    padding:0!important;
    gap:8px!important;
  }
  #game-screen.active .hud-card{
    display:flex!important;
    min-width:0!important;
    min-height:69px;
    padding:11px 6px!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-width:2px!important;
    border-radius:18px!important;
    box-shadow:0 5px 0 rgba(226,158,178,.35),0 9px 20px rgba(110,80,90,.07)!important;
  }
  #game-screen.active .hud-card small{font-size:9px;white-space:nowrap}
  #game-screen.active .hud-card strong{font-size:clamp(16px,1.6vw,23px);line-height:1.05;white-space:nowrap}
  #game-screen.active .goal-panel{
    grid-column:2;
    grid-row:3;
    align-self:start;
    width:100%;
    min-height:66px;
    margin:0!important;
    padding:10px 12px!important;
    border:2px solid rgba(255,255,255,.86)!important;
    border-radius:20px!important;
    background:rgba(255,251,230,.76)!important;
    box-shadow:0 7px 22px rgba(106,83,70,.08)!important;
  }
  #game-screen.active .goal-copy{min-width:152px}
  #game-screen.active .goal-copy>span{width:36px;height:36px}
  #game-screen.active .goal-copy b{max-width:142px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #game-screen.active .progress-track{height:12px}
  #game-screen.active .status-panel{
    grid-column:2;
    grid-row:4;
    align-self:stretch;
    display:flex!important;
    align-items:flex-start!important;
    width:100%;
    min-height:84px;
    margin:0!important;
    padding:15px 16px!important;
    border:2px solid rgba(255,255,255,.86)!important;
    border-radius:22px!important;
    background:rgba(255,255,255,.62)!important;
    box-shadow:0 8px 25px rgba(88,95,83,.07)!important;
  }
  #game-screen.active .status-panel>span{
    display:grid;
    place-items:center;
    flex:0 0 35px;
    width:35px;
    height:35px;
    margin-right:9px;
    border-radius:13px;
    background:#fff6ce;
  }
  #game-screen.active .status-panel p{margin:3px 0 0!important;font-size:12px!important;line-height:1.55!important;text-align:left!important}
  #game-screen.active .toolbar{
    grid-column:2;
    grid-row:5;
    align-self:end;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
    margin:0!important;
    padding:10px!important;
    gap:8px!important;
    overflow:visible!important;
    border:2px solid rgba(255,255,255,.88);
    border-radius:24px;
    background:rgba(255,255,255,.58);
    box-shadow:0 9px 28px rgba(103,77,86,.08);
  }
  #game-screen.active .tool-button{
    display:flex!important;
    flex:initial!important;
    width:100%!important;
    min-width:0!important;
    min-height:67px!important;
    padding:8px 4px!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:16px!important;
  }
  #game-screen.active .tool-button .tool-icon{font-size:22px!important;line-height:1}
  #game-screen.active .tool-button b{margin-top:3px;font-size:10px!important;white-space:nowrap}
  #game-screen.active .tool-button small{font-size:7px!important;white-space:nowrap}
  #game-screen.active .tool-count{right:4px;top:3px}
}
@media (min-width:980px) and (max-height:820px){
  #game-screen.active{grid-template-columns:minmax(520px,760px) minmax(330px,390px);row-gap:8px;padding-top:9px;padding-bottom:10px}
  #game-screen.active .board-shell{width:min(73dvh,690px)!important}
  #game-screen.active .game-header{min-height:50px;padding:4px 9px!important}
  #game-screen.active .hud-card{min-height:57px;padding:7px 4px!important}
  #game-screen.active .goal-panel{min-height:55px;padding:7px 10px!important}
  #game-screen.active .status-panel{min-height:66px;padding:10px 13px!important}
  #game-screen.active .toolbar{padding:7px!important;gap:6px!important}
  #game-screen.active .tool-button{min-height:56px!important;padding:5px 3px!important}
  #game-screen.active .tool-button .tool-icon{font-size:19px!important}
}
@media (max-width:979px), (max-height:679px){
  #game-screen.active .board-shell{margin-left:auto!important;margin-right:auto!important}
  #game-screen.active .hud{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
}


/* v5 account, fullscreen and mobile obstruction fixes */
.game-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px}.game-header-actions .round-button{flex:0 0 auto}
#fullscreen-button.active{color:#fff!important;background:linear-gradient(145deg,#78cdb6,#66b9a4)!important;box-shadow:0 5px 0 #4b9e8d!important}
.player-pill{appearance:none;border:2px solid rgba(255,255,255,.9);min-width:205px;cursor:pointer;text-align:left}.player-pill b{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;letter-spacing:.02em}
.boot-overlay{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;background:linear-gradient(145deg,#fffaf1,#effbf6);transition:opacity .28s ease,visibility .28s ease}.boot-overlay.hidden{opacity:0;visibility:hidden}.boot-card{display:flex;align-items:center;gap:14px;padding:18px 23px;border:2px solid #fff;border-radius:25px;background:rgba(255,255,255,.82);color:var(--ink);box-shadow:0 15px 45px rgba(93,70,83,.13)}.boot-card img{width:58px;height:58px;object-fit:contain;animation:home-bob 1.4s ease-in-out infinite}.boot-card span{display:block;margin-top:4px;color:#9d808d;font-size:11px;font-weight:700}.boot-dots:after{content:"";display:inline-block;width:20px;animation:boot-dots 1.1s steps(4,end) infinite}
.account-modal{position:fixed;z-index:1900;inset:0;display:none;place-items:center;padding:18px}.account-modal.show{display:grid}.account-backdrop{position:absolute;inset:0;background:rgba(76,57,66,.25);backdrop-filter:blur(8px)}.account-card{position:relative;width:min(470px,94vw);padding:27px;border:2px solid rgba(255,255,255,.95);border-radius:31px;background:linear-gradient(155deg,#fffdf7,#f3fff8);box-shadow:0 22px 70px rgba(77,55,65,.22);color:var(--ink)}.account-close{position:absolute;right:14px;top:14px;width:35px;height:35px;border:0;border-radius:13px;background:#fff;color:#8e707d;font-size:20px;font-weight:900;cursor:pointer}.account-hero{display:flex;align-items:center;gap:13px;padding-right:35px}.account-hero img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 6px 3px rgba(97,75,83,.14))}.account-hero h2{margin:0 0 5px;font-size:25px}.account-hero p{margin:0;color:#917782;font-size:11px;font-weight:700;line-height:1.5}
.current-id-box{display:grid;grid-template-columns:1fr auto;gap:8px;margin:18px 0;padding:13px;border-radius:19px;background:#fff4c9;border:2px dashed #eccf72}.current-id-box small{grid-column:1/-1;color:#9b8053;font-size:9px;font-weight:900}.current-id-box code{align-self:center;overflow-wrap:anywhere;color:#725b34;font-family:"Trebuchet MS",sans-serif;font-size:14px;font-weight:950;letter-spacing:.04em}.copy-id-button{padding:9px 11px;border:0;border-radius:12px;background:#fff;color:#9a7440;font-size:11px;font-weight:900;cursor:pointer}.account-divider{display:flex;align-items:center;gap:9px;margin:15px 0;color:#ad929d;font-size:10px;font-weight:850}.account-divider:before,.account-divider:after{content:"";height:1px;flex:1;background:#eadde2}
.account-field{display:block;color:#806572;font-size:11px;font-weight:900}.account-field input{box-sizing:border-box;width:100%;margin-top:7px;padding:13px 14px;border:2px solid #eddce2;border-radius:15px;outline:0;background:#fff;color:var(--ink);font-size:14px;font-weight:800;text-transform:uppercase}.account-field input:focus{border-color:#8fd4bf;box-shadow:0 0 0 4px rgba(143,212,191,.16)}.account-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:13px}.account-action{padding:12px 9px;border:0;border-radius:15px;background:#fff0f4;color:#b65e7a;font-size:12px;font-weight:950;cursor:pointer}.account-action.primary{background:linear-gradient(135deg,#ef8da8,#79ccb3);color:#fff;box-shadow:0 5px 0 #d86988}.account-action:disabled{opacity:.55}.account-error{min-height:18px;margin:12px 0 0;color:#ca617c;font-size:10px;font-weight:800;text-align:center}.account-error.success{color:#4e9b83}.account-note{margin:8px 0 0;color:#ab939c;font-size:9px;line-height:1.5;text-align:center}.account-modal.first-time .account-card{animation:account-arrive .45s var(--ease-spring)}
.combo-badge:not(.show){opacity:0!important;visibility:hidden!important}.combo-badge.show{visibility:visible!important;pointer-events:none!important;animation:combo-pop .72s var(--ease-spring) both!important}
html:fullscreen,html:-webkit-full-screen{background:#fff9f3}html:fullscreen #app,html:-webkit-full-screen #app{min-height:100dvh}
@keyframes boot-dots{0%{content:""}25%{content:"."}50%{content:".."}75%,100%{content:"..."}}@keyframes account-arrive{0%{opacity:0;transform:translateY(25px) scale(.92)}100%{opacity:1;transform:none}}
@media(max-width:700px){.home-topbar{left:9px!important;right:9px!important;top:max(7px,env(safe-area-inset-top))!important;gap:5px!important}.profile-pill{min-width:65px!important;padding:6px 7px!important}.profile-pill span{font-size:17px!important}.profile-pill b{font-size:13px!important}.profile-pill small{font-size:8px!important}.player-pill{flex:1;min-width:0!important;max-width:190px}.player-pill b{max-width:125px;font-size:9px!important}.home-content{padding-top:75px!important}.account-card{padding:22px 18px;border-radius:25px}.account-hero img{width:58px;height:58px}.account-hero h2{font-size:21px}.current-id-box code{font-size:12px}.game-header-actions{gap:4px}.game-header-actions .round-button{width:38px!important;height:38px!important;border-radius:13px!important}}
@media(max-width:979px){
  #game-screen.active{box-sizing:border-box;height:auto!important;min-height:100dvh!important;overflow-x:hidden!important;overflow-y:visible!important;padding-bottom:calc(12px + env(safe-area-inset-bottom))!important}
  #game-screen.active .game-header{grid-template-columns:auto minmax(0,1fr) auto!important}
  #game-screen.active .board-shell{position:relative!important;z-index:1!important;flex:none!important;margin-bottom:10px!important;overflow:hidden!important}
  #game-screen.active .status-panel{position:relative!important;inset:auto!important;z-index:1!important;transform:none!important;margin-top:0!important}
  #game-screen.active .toolbar{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:2!important;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;width:calc(100% - 12px)!important;max-width:none!important;margin:9px auto 0!important;padding:6px!important;gap:4px!important;overflow:visible!important;transform:none!important;border-radius:18px!important;background:rgba(255,255,255,.76)!important;box-shadow:0 7px 22px rgba(99,73,82,.1)!important}
  #game-screen.active .tool-button{box-sizing:border-box;display:flex!important;flex:none!important;width:100%!important;min-width:0!important;min-height:59px!important;padding:6px 1px!important;flex-direction:column;align-items:center;justify-content:center;border-radius:13px!important}
  #game-screen.active .tool-button .tool-icon{font-size:18px!important;line-height:1}
  #game-screen.active .tool-button b{margin-top:3px;font-size:8px!important;letter-spacing:-.06em;white-space:nowrap}
  #game-screen.active .tool-button small{display:none!important}
  #game-screen.active .tool-count{right:1px!important;top:1px!important;min-width:17px!important;height:16px!important;padding:0 3px!important;font-size:8px!important}
}
@media(max-width:390px){#game-screen.active .toolbar{gap:2px!important;padding:5px 3px!important}#game-screen.active .tool-button{min-height:53px!important}#game-screen.active .tool-button b{font-size:7px!important}}


/* v6 portrait-only mobile layout */
.portrait-guard{position:fixed;z-index:3100;inset:0;display:none;place-items:center;padding:28px;background:linear-gradient(155deg,#fffaf1,#ecfaf5);color:var(--ink);text-align:center}.portrait-guard-card{width:min(330px,88vw);padding:28px 22px;border:2px solid #fff;border-radius:31px;background:rgba(255,255,255,.86);box-shadow:0 18px 55px rgba(91,68,79,.17)}.portrait-guard-card img{width:105px;height:105px;object-fit:contain;filter:drop-shadow(0 8px 4px rgba(93,70,83,.15));animation:portrait-turn 1.5s ease-in-out infinite}.portrait-guard-card h2{margin:9px 0 7px;font-size:25px}.portrait-guard-card p{margin:0;color:#917783;font-size:12px;font-weight:750;line-height:1.65}.portrait-phone{display:inline-block;margin-top:13px;padding:7px 11px;border-radius:12px;background:#fff1c2;color:#9d7944;font-size:20px}
@keyframes portrait-turn{0%,100%{transform:rotate(0)}45%{transform:rotate(-10deg)}70%{transform:rotate(4deg)}}
@media (orientation:landscape) and (pointer:coarse){.portrait-guard{display:grid}}
@media (max-width:979px) and (orientation:portrait){
  #game-screen.active{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto auto auto auto auto!important;
    align-content:start!important;
    align-items:start!important;
    justify-items:center!important;
    gap:6px!important;
    width:100%!important;
    height:auto!important;
    min-height:100dvh!important;
    margin:0!important;
    padding:max(7px,env(safe-area-inset-top)) 6px max(10px,env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:none;
  }
  #game-screen.active .game-header,
  #game-screen.active .hud,
  #game-screen.active .goal-panel,
  #game-screen.active .board-shell,
  #game-screen.active .status-panel,
  #game-screen.active .toolbar{
    box-sizing:border-box!important;
    position:relative!important;
    inset:auto!important;
    float:none!important;
    clear:both!important;
    transform:none;
    grid-column:1!important;
    width:100%!important;
    max-width:760px!important;
    margin:0 auto!important;
  }
  #game-screen.active .game-header{
    grid-row:1!important;
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) auto!important;
    min-height:45px!important;
    padding:3px 5px!important;
    align-items:center!important;
    border-radius:17px!important;
  }
  #game-screen.active .game-header>.round-button{width:38px!important;height:38px!important;border-radius:13px!important}
  #game-screen.active .game-header-actions{display:flex!important;gap:3px!important}
  #game-screen.active .game-header-actions .round-button{width:36px!important;height:36px!important;border-radius:12px!important;font-size:17px!important}
  #game-screen.active .game-title h2{font-size:20px!important;line-height:1!important}
  #game-screen.active .game-title small{font-size:8px!important}
  #game-screen.active .hud{
    grid-row:2!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
    padding:0!important;
  }
  #game-screen.active .hud-card{
    box-sizing:border-box!important;
    display:flex!important;
    min-width:0!important;
    min-height:49px!important;
    padding:6px 3px!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:15px!important;
  }
  #game-screen.active .hud-card small{font-size:8px!important;white-space:nowrap!important}
  #game-screen.active .hud-card strong{font-size:16px!important;line-height:1.1!important;white-space:normal!important;text-align:center!important}
  #game-screen.active .goal-panel{
    grid-row:3!important;
    display:flex!important;
    min-height:53px!important;
    padding:7px 9px!important;
    gap:7px!important;
    align-items:center!important;
    border-radius:18px!important;
  }
  #game-screen.active .goal-copy{min-width:125px!important;gap:6px!important}
  #game-screen.active .goal-copy>span{width:32px!important;height:32px!important;border-radius:11px!important;font-size:17px!important}
  #game-screen.active .goal-copy small{font-size:7px!important}
  #game-screen.active .goal-copy b{max-width:115px!important;font-size:10px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  #game-screen.active .progress-track{height:9px!important}
  #game-screen.active .board-shell{
    grid-row:4!important;
    z-index:1!important;
    width:min(calc(100vw - 12px),calc(100dvh - 250px),760px)!important;
    height:auto!important;
    min-width:0!important;
    max-height:none!important;
    aspect-ratio:1!important;
    overflow:hidden!important;
    border-radius:25px!important;
  }
  #game-screen.active .status-panel{
    grid-row:5!important;
    z-index:1!important;
    display:flex!important;
    min-height:39px!important;
    padding:7px 10px!important;
    align-items:center!important;
    border-radius:15px!important;
  }
  #game-screen.active .status-panel>span{flex:0 0 auto!important;margin-right:6px!important;font-size:15px!important}
  #game-screen.active .status-panel p{margin:0!important;font-size:9px!important;line-height:1.4!important;text-align:left!important}
  #game-screen.active .toolbar{
    grid-row:6!important;
    z-index:1!important;
    display:grid!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    min-height:56px!important;
    padding:5px!important;
    gap:3px!important;
    overflow:visible!important;
    border-radius:17px!important;
  }
  #game-screen.active .tool-button{
    box-sizing:border-box!important;
    position:relative!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    min-height:52px!important;
    margin:0!important;
    padding:5px 1px!important;
    flex:none!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:12px!important;
    transform:none!important;
  }
  #game-screen.active .tool-button .tool-icon{font-size:17px!important;line-height:1!important}
  #game-screen.active .tool-button b{margin-top:3px!important;font-size:7px!important;line-height:1!important;letter-spacing:-.08em!important;white-space:nowrap!important}
  #game-screen.active .tool-button small{display:none!important}
  #game-screen.active .tool-count{right:0!important;top:0!important;min-width:16px!important;height:15px!important;padding:0 2px!important;font-size:7px!important}
}
@media (max-width:360px) and (orientation:portrait){
  #game-screen.active{gap:4px!important;padding-left:4px!important;padding-right:4px!important}
  #game-screen.active .board-shell{width:min(calc(100vw - 8px),calc(100dvh - 235px))!important}
  #game-screen.active .tool-button b{font-size:6px!important}
}


/* v7 virtual portrait inside mobile landscape fullscreen */
.piece,.piece-face,.board,.board-shell{box-sizing:border-box!important}.piece img{max-width:100%!important}
.portrait-guard{display:none!important}
html.virtual-portrait,html.virtual-portrait body{width:100%!important;height:100%!important;overflow:hidden!important;background:#fff9f3!important}
html.virtual-portrait #app{
  position:fixed!important;
  z-index:1!important;
  left:50%!important;
  top:50%!important;
  width:100vh!important;
  height:100vw!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  transform:translate(-50%,-50%) rotate(var(--virtual-rotation,90deg))!important;
  transform-origin:50% 50%!important;
}
html.virtual-portrait #game-screen.active{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto auto auto auto auto auto!important;
  align-content:center!important;
  align-items:start!important;
  justify-items:center!important;
  gap:6px!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:7px 6px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  background:linear-gradient(155deg,#fff9f2,#f0fbf6)!important;
}
html.virtual-portrait #game-screen.active .game-header,
html.virtual-portrait #game-screen.active .hud,
html.virtual-portrait #game-screen.active .goal-panel,
html.virtual-portrait #game-screen.active .board-shell,
html.virtual-portrait #game-screen.active .status-panel,
html.virtual-portrait #game-screen.active .toolbar{
  box-sizing:border-box!important;
  position:relative!important;
  inset:auto!important;
  float:none!important;
  clear:both!important;
  grid-column:1!important;
  width:100%!important;
  max-width:760px!important;
  margin:0 auto!important;
  transform:none!important;
}
html.virtual-portrait #game-screen.active .game-header{grid-row:1!important;display:grid!important;grid-template-columns:40px minmax(0,1fr) auto!important;min-height:45px!important;padding:3px 5px!important;align-items:center!important;border-radius:17px!important}
html.virtual-portrait #game-screen.active .game-header>.round-button{width:38px!important;height:38px!important;border-radius:13px!important}
html.virtual-portrait #game-screen.active .game-header-actions{display:flex!important;gap:3px!important}
html.virtual-portrait #game-screen.active .game-header-actions .round-button{width:36px!important;height:36px!important;border-radius:12px!important;font-size:17px!important}
html.virtual-portrait #game-screen.active .game-title h2{font-size:20px!important;line-height:1!important}
html.virtual-portrait #game-screen.active .game-title small{font-size:8px!important}
html.virtual-portrait #game-screen.active .hud{grid-row:2!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;padding:0!important}
html.virtual-portrait #game-screen.active .hud-card{box-sizing:border-box!important;display:flex!important;min-width:0!important;min-height:49px!important;padding:6px 3px!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;border-radius:15px!important}
html.virtual-portrait #game-screen.active .hud-card small{font-size:8px!important;white-space:nowrap!important}
html.virtual-portrait #game-screen.active .hud-card strong{font-size:16px!important;line-height:1.1!important;white-space:normal!important;text-align:center!important}
html.virtual-portrait #game-screen.active .goal-panel{grid-row:3!important;display:flex!important;min-height:53px!important;padding:7px 9px!important;gap:7px!important;align-items:center!important;border-radius:18px!important}
html.virtual-portrait #game-screen.active .goal-copy{min-width:125px!important;gap:6px!important}
html.virtual-portrait #game-screen.active .goal-copy>span{width:32px!important;height:32px!important;border-radius:11px!important;font-size:17px!important}
html.virtual-portrait #game-screen.active .goal-copy small{font-size:7px!important}
html.virtual-portrait #game-screen.active .goal-copy b{max-width:115px!important;font-size:10px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html.virtual-portrait #game-screen.active .progress-track{height:9px!important}
html.virtual-portrait #game-screen.active .board-shell{grid-row:4!important;z-index:1!important;width:min(calc(100% - 12px),760px)!important;height:auto!important;min-width:0!important;max-height:none!important;aspect-ratio:1!important;overflow:hidden!important;border-radius:25px!important}
html.virtual-portrait #game-screen.active .status-panel{grid-row:5!important;z-index:1!important;display:flex!important;min-height:39px!important;padding:7px 10px!important;align-items:center!important;border-radius:15px!important}
html.virtual-portrait #game-screen.active .status-panel>span{flex:0 0 auto!important;margin-right:6px!important;font-size:15px!important}
html.virtual-portrait #game-screen.active .status-panel p{margin:0!important;font-size:9px!important;line-height:1.4!important;text-align:left!important}
html.virtual-portrait #game-screen.active .toolbar{grid-row:6!important;z-index:1!important;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;min-height:56px!important;padding:5px!important;gap:3px!important;overflow:visible!important;border-radius:17px!important}
html.virtual-portrait #game-screen.active .tool-button{box-sizing:border-box!important;position:relative!important;display:flex!important;width:100%!important;min-width:0!important;min-height:52px!important;margin:0!important;padding:5px 1px!important;flex:none!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;border-radius:12px!important;transform:none!important}
html.virtual-portrait #game-screen.active .tool-button .tool-icon{font-size:17px!important;line-height:1!important}
html.virtual-portrait #game-screen.active .tool-button b{margin-top:3px!important;font-size:7px!important;line-height:1!important;letter-spacing:-.08em!important;white-space:nowrap!important}
html.virtual-portrait #game-screen.active .tool-button small{display:none!important}
html.virtual-portrait #game-screen.active .tool-count{right:0!important;top:0!important;min-width:16px!important;height:15px!important;padding:0 2px!important;font-size:7px!important}
html.virtual-portrait .modal,html.virtual-portrait .account-modal{
  left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;
  width:100vh!important;height:100vw!important;
  transform:translate(-50%,-50%) rotate(var(--virtual-rotation,90deg))!important;
  transform-origin:50% 50%!important;
}
html.virtual-portrait .toast{left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%) rotate(var(--virtual-rotation,90deg))!important}


/* v9: rebuilt mobile landscape presentation layer */
html.virtual-portrait,html.virtual-portrait body{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
html.virtual-portrait #app{
  position:fixed!important;
  left:var(--virtual-center-x,50%)!important;
  top:var(--virtual-center-y,50%)!important;
  width:var(--virtual-short,100vh)!important;
  height:var(--virtual-long,100vw)!important;
  min-width:0!important;
  max-width:none!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  transform:translate(-50%,-50%) rotate(var(--virtual-rotation,90deg))!important;
  transform-origin:50% 50%!important;
  box-sizing:border-box!important;
}
html.virtual-portrait .board-shell{
  position:relative!important;
  width:var(--virtual-board-size)!important;
  height:var(--virtual-board-size)!important;
  min-width:var(--virtual-board-size)!important;
  min-height:var(--virtual-board-size)!important;
  max-width:none!important;
  max-height:none!important;
  flex:0 0 var(--virtual-board-size)!important;
  justify-self:center!important;
  align-self:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  isolation:isolate!important;
  box-shadow:0 10px 30px rgba(109,76,87,.12)!important;
}
html.virtual-portrait .board-shell::after{
  content:""!important;
  position:absolute!important;
  inset:-4px!important;
  z-index:90!important;
  border:3px solid rgba(241,181,205,.78)!important;
  border-radius:inherit!important;
  box-shadow:0 0 0 3px rgba(255,255,255,.78)!important;
  pointer-events:none!important;
  box-sizing:border-box!important;
}
html.virtual-portrait .board{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  contain:layout style!important;
}
html.virtual-portrait .piece{
  width:12.5%!important;
  height:12.5%!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
html.virtual-portrait .piece-face,
html.virtual-portrait .piece img{
  max-width:100%!important;
  max-height:100%!important;
  transform-origin:50% 50%!important;
}
html.virtual-portrait .portrait-guard{
  display:none!important;
}