@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--green:#07583e;--deep:#064b35;--green2:#116e4a;--orange:#f27920;--text:#172733;--muted:#6b7990;--line:#e1eae6;--soft:#f3f8f5;font-family:Nunito,'Segoe UI',Arial,sans-serif;color:var(--text);background:#fbfcfa;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh}button{font:inherit}button:focus-visible{outline:3px solid #ec923c;outline-offset:3px}.container{width:min(1160px,calc(100% - 40px));margin:auto}.site-header{height:89px;background:#fff;border-bottom:1px solid #e5ebe7}.header-content{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;gap:9px;align-items:center}.brand-logo{width:55px;height:55px;flex:none}.brand strong{display:block;color:var(--green);font-size:28px;font-weight:900;line-height:1;letter-spacing:-1px}.brand strong span{color:var(--orange)}.brand small{display:block;font-size:9px;color:#5c7867;font-weight:800;margin-top:5px}.header-status{background:#f5f8f6;border-radius:999px;padding:11px 17px;color:var(--green);font-size:12px;font-weight:900;display:flex;gap:10px;align-items:center}.status-light{height:9px;width:9px;background:#28a06a;border-radius:50%;box-shadow:0 0 0 4px #ddf1e5}.main-content{padding:36px 0 55px}.welcome{min-height:280px;border:1px solid #e1ebe5;background:linear-gradient(110deg,#edf7f1,#fcf7ef);border-radius:24px;padding:33px 36px;display:grid;grid-template-columns:1.3fr .7fr;gap:18px;align-items:center;overflow:hidden}.eyebrow{font-size:11px;font-weight:900;letter-spacing:1.2px;color:var(--green2)}.welcome h1{font-size:clamp(30px,3.5vw,48px);line-height:1.08;letter-spacing:-1.7px;color:var(--deep);font-weight:900;margin:12px 0 13px;max-width:610px}.welcome h1 em{font-style:normal;color:var(--orange)}.welcome p{color:#647188;font-size:15px;line-height:1.65;font-weight:700;max-width:600px;margin:0 0 20px}.message{display:flex;align-items:center;gap:12px}.message-icon{width:39px;height:39px;flex:none;border-radius:12px;background:#e0eee3;display:grid;place-items:center;font-size:21px}.message strong,.message span{display:block}.message strong{font-size:13px;color:var(--green)}.message div span{font-size:12px;color:#718374;font-weight:700}.welcome-art{height:216px;position:relative;overflow:hidden;border-radius:20px;background:linear-gradient(#c6e9df,#eff9ea);isolation:isolate}.sun{position:absolute;top:23px;right:52px;width:69px;height:69px;background:#f3c54e;border-radius:50%;z-index:-1}.land{position:absolute;left:-10%;width:120%;height:135px;border-radius:50%}.land-back{background:#79b69b;bottom:-37px;transform:rotate(-6deg)}.land-front{background:#086442;bottom:-82px;transform:rotate(8deg)}.river{position:absolute;background:#80cfcc;bottom:14px;left:18%;width:97%;height:33px;z-index:2;border-radius:50%;transform:rotate(-9deg)}.art-leaf{position:absolute;z-index:3;font-size:37px}.art-leaf.a{left:11%;top:44px}.art-leaf.b{right:12%;top:101px}.art-title{position:absolute;z-index:4;bottom:16px;left:24px;font-size:19px;line-height:1.13;color:#fff;font-weight:900}.section-title{display:flex;align-items:end;justify-content:space-between;gap:15px;margin:39px 0 19px}.section-title h2{font-size:30px;color:var(--text);letter-spacing:-.7px;margin:5px 0 4px;font-weight:900}.section-title p{color:var(--muted);font-weight:700;font-size:14px;margin:0}.section-pill{border:1px solid #d7e6dc;padding:10px 14px;border-radius:99px;color:var(--green);background:#f0f7f2;font-size:12px;font-weight:900;white-space:nowrap}.game-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:0 10px 28px #2345360b}.scoreboard{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.stat{background:#f5f9f6;border:1px solid #e6eee9;border-radius:13px;padding:10px 16px}.stat small{display:block;color:#71827a;font-size:10px;letter-spacing:.7px;font-weight:900}.stat strong{display:block;color:var(--green);font-size:24px;font-weight:900}.game-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,.85fr);gap:22px}.board-shell{position:relative;align-self:start;background:#d7f0dc;border:7px solid #e8f3eb;border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 2px #9cccaf;touch-action:none}canvas{display:block;width:100%;height:auto;aspect-ratio:5/4}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(7,54,38,.61);padding:20px}.overlay[hidden]{display:none}.overlay-panel{text-align:center;background:#fff;border-radius:18px;padding:23px;max-width:350px;box-shadow:0 15px 45px #062b2580}.overlay-emoji{font-size:40px}.overlay-panel h3{color:var(--deep);font-size:24px;font-weight:900;margin:7px 0}.overlay-panel p{font-size:14px;color:var(--muted);font-weight:700;line-height:1.5}.btn{border-radius:12px;padding:12px 15px;border:1px solid #d9e8df;font-size:14px;font-weight:900;cursor:pointer;min-height:46px}.btn.primary{background:var(--green2);color:#fff;border-color:var(--green2)}.btn.primary:hover{background:#074b34}.btn.secondary{background:#fff;color:var(--green)}.btn.secondary:hover:not(:disabled){background:#edf6ef}.btn:disabled{opacity:.48;cursor:not-allowed}.overlay .btn{width:100%}.side-panel{display:flex;flex-direction:column;gap:14px}.instructions{background:#f8fbf9;border:1px solid var(--line);padding:18px;border-radius:16px}.instructions h3{margin:0 0 8px;font-size:21px;color:var(--deep)}.instructions p{font-size:13px;color:#667b71;font-weight:700;line-height:1.5;margin:0 0 13px}.legend{display:grid;gap:7px}.legend>div{display:grid;grid-template-columns:90px 1fr auto;gap:8px;align-items:center;border:1px solid #e1ebe5;background:#fff;border-radius:11px;padding:9px;font-size:12px}.legend span{font-size:17px;white-space:nowrap}.legend strong{font-size:12px;color:#255543}.legend b{color:#0f7c4e;font-size:14px}.legend .danger b{color:#be5b24}.instructions .hint{margin:13px 0 0;color:#8b5832}.buttons{display:flex;gap:8px}.buttons .btn{flex:1}.live-status{background:#eef8f1;padding:9px 12px;border-radius:10px;color:#215f44;font-size:13px;font-weight:800;margin:0;min-height:42px}.touch-controls{display:grid;grid-template-columns:repeat(3,64px);justify-content:center;gap:7px;margin:20px auto 0}.touch-controls button{background:#e9f5ed;border:1px solid #b8d8c5;color:var(--green);border-radius:14px;width:64px;height:53px;font-size:23px;font-weight:900;cursor:pointer;touch-action:manipulation}.touch-controls button:active{background:#c5ead3;transform:scale(.96)}.game-bottom{text-align:center;color:#789084;font-size:12px;font-weight:800;margin-top:13px}.info-strip{margin:26px 0 0;display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#738378;font-weight:800}.footer{background:var(--deep);color:#d8e9df}.footer .container{padding:17px 0;display:flex;justify-content:space-between;gap:14px;align-items:center;font-size:12px}.footer strong{color:#fff;font-size:17px;font-weight:900}@media(max-width:920px){.welcome{grid-template-columns:1fr}.welcome-art{height:155px}.game-layout{grid-template-columns:1fr}.side-panel{display:grid;grid-template-columns:1fr}.legend{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.container{width:calc(100% - 24px)}.site-header{height:74px}.brand-logo{width:43px;height:43px}.brand strong{font-size:22px}.brand small{font-size:7px}.header-status{padding:9px;font-size:0}.header-status .status-light{height:10px;width:10px}.main-content{padding:20px 0 35px}.welcome{padding:22px 19px;border-radius:18px}.welcome h1{font-size:33px}.welcome-art{height:120px}.section-title{margin:27px 0 15px;align-items:start;flex-direction:column}.section-title h2{font-size:26px}.game-card{padding:12px;border-radius:17px}.scoreboard{gap:5px}.stat{padding:8px 7px}.stat small{font-size:9px}.stat strong{font-size:20px}.board-shell{border-width:4px}.legend{grid-template-columns:1fr}.buttons{flex-wrap:wrap}.info-strip,.footer .container{flex-direction:column;align-items:start;gap:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}