:root{color:#35493c;font-synthesis:none;--ink:#35493c;--ink-soft:#718078;--cream:#fffdf5;--paper:#fffaf0;--orange:#ee8d58;--orange-dark:#d56f42;--leaf:#598a61;--leaf-dark:#3f6e4a;--mint:#dbe9cc;--line:#e5dfcf;--shadow:0 20px 50px #4c563e21;background:#f8f4e8;font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif}*{box-sizing:border-box}html{background:#f8f4e8;min-width:320px;min-height:100%}body{background:radial-gradient(circle at 8% 15%,#ffffffe6 0 2px,#0000 3px),radial-gradient(circle at 90% 7%,#ffffffd9 0 3px,#0000 4px),linear-gradient(#dfeecf 0,#f5efdc 48%,#f8f4e8 100%);min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit;font:inherit}button:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #ee8d586b}.sky-decor{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.cloud{filter:blur(.2px);background:#ffffff9e;border-radius:40px;width:128px;height:34px;position:absolute}.cloud:before,.cloud:after{content:"";background:inherit;border-radius:50%;position:absolute}.cloud:before{width:48px;height:48px;top:-21px;left:25px}.cloud:after{width:62px;height:62px;top:-32px;right:18px}.cloud-one{animation:28s ease-in-out infinite alternate cloud-drift;top:10%;left:-25px}.cloud-two{animation:32s ease-in-out infinite alternate cloud-drift-reverse;top:25%;right:-32px;transform:scale(.72)}.leaf{opacity:.55;font-size:28px;animation:8s ease-in-out infinite leaf-float;position:absolute}.leaf-one{top:13%;right:8%}.leaf-two{animation-delay:-3s;bottom:9%;left:5%}.app-shell{z-index:1;width:min(1540px,100% - 44px,150svh + 64px);margin:0 auto;padding:24px 0 18px;position:relative}.topbar{grid-template-columns:minmax(240px,1fr) auto minmax(240px,1fr);align-items:center;gap:24px;margin-bottom:20px;display:grid}.brand{width:fit-content;color:var(--ink);align-items:center;text-decoration:none;display:inline-flex}.brand-mark{background:linear-gradient(145deg,#f7aa63,#e67848);border:2px solid #ffffffb3;border-radius:17px;place-items:center;width:54px;height:54px;margin-right:11px;font-size:29px;display:grid;transform:rotate(-4deg);box-shadow:0 8px 18px #bf65373d,inset 0 1px #ffffff80}.brand strong,h1,h2{font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif}.brand strong{letter-spacing:-.5px;margin-bottom:-5px;font-size:23px;font-weight:800;display:block}.brand small{color:var(--ink-soft);letter-spacing:1.6px;text-transform:uppercase;font-size:12px;font-weight:800}.hud{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffdf5c2;border:1px solid #fffc;border-radius:18px;justify-content:center;align-items:center;gap:8px;padding:7px;display:flex;box-shadow:0 10px 28px #48593c17}.hud-pill{border-right:1px solid #e6e2d5;align-items:center;gap:8px;min-width:106px;padding:7px 13px;display:flex}.hud-pill:last-child{border-right:0}.hud-pill>span:first-child{font-size:21px}.hud-pill strong,.hud-pill small{line-height:1.05;display:block}.hud-pill strong{font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif;font-size:18px}.hud-pill small{color:#8c968d;letter-spacing:.8px;text-transform:uppercase;margin-top:2px;font-size:10px;font-weight:800}.top-actions{justify-content:flex-end;gap:9px;display:flex}.icon-button,.soft-button,.control-button,.primary-button,.upgrade-button,.sell-button{cursor:pointer;border:0;font-weight:800;transition:transform .16s,box-shadow .16s,background .16s,opacity .16s}.icon-button:hover,.soft-button:hover,.control-button:hover,.primary-button:hover,.upgrade-button:hover,.sell-button:hover{transform:translateY(-2px)}.icon-button{background:#fffdf5b8;border:1px solid #ffffffd9;border-radius:13px;width:43px;height:43px;box-shadow:0 8px 18px #4d5b4214}.soft-button{background:#fffdf5b8;border:1px solid #fffc;border-radius:13px;padding:0 17px;font-size:13px;box-shadow:0 8px 18px #4d5b4214}.game-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:stretch;gap:18px;display:grid}.stage-column{min-width:0}.board-frame{box-shadow:var(--shadow), 0 0 0 1px #495b4014;background:#89b870;border:6px solid #fffdf5f0;border-radius:29px;position:relative;overflow:hidden}.board-frame:after{content:"";pointer-events:none;border:1px solid #385c3633;border-radius:23px;position:absolute;inset:0}.board-ribbon{z-index:2;color:#ffffffed;letter-spacing:1px;text-transform:uppercase;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#375c348c;border:1px solid #ffffff73;border-radius:11px;padding:7px 13px 6px;font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif;font-size:13px;font-weight:800;position:absolute;top:16px;left:18px;box-shadow:0 6px 15px #32462e21}canvas{aspect-ratio:3/2;cursor:crosshair;touch-action:none;width:100%;height:auto;display:block}.game-message{z-index:5;color:#fff;opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#384e3bd9;border:1px solid #ffffffb3;border-radius:99px;padding:10px 18px;font-size:13px;font-weight:800;transition:opacity .2s,transform .2s;position:absolute;top:22px;left:50%;transform:translate(-50%,-12px);box-shadow:0 8px 24px #34423033}.game-message.visible{opacity:1;transform:translate(-50%)}.play-controls{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffdf5d1;border:1px solid #ffffffdb;border-radius:19px;justify-content:space-between;align-items:center;gap:20px;min-height:74px;margin-top:12px;padding:11px 12px 11px 18px;display:flex;box-shadow:0 10px 28px #48593c14}.tip-copy{color:#66766b;align-items:center;min-width:0;font-size:13px;font-weight:700;display:flex}.tip-spark{color:#e59654;margin-right:9px;font-size:18px}.control-buttons{flex:none;gap:8px;display:flex}.control-button{background:#fffdf8;border:1px solid #e6dfcf;border-radius:13px;min-height:45px;padding:0 15px;font-size:12px}.control-button span{color:var(--leaf);margin-right:5px;font-size:16px}.primary-button{color:#fff;background:linear-gradient(145deg,#f4a167,#e77c4e);border-radius:13px;justify-content:center;align-items:center;min-height:45px;padding:0 19px;font-size:13px;display:inline-flex;box-shadow:0 8px 18px #cc693e40,inset 0 1px #ffffff47}.primary-button span{margin-left:12px;font-size:18px}.primary-button:disabled,.upgrade-button:disabled{cursor:not-allowed;opacity:.48;transform:none}.side-panel{min-width:0;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffcf2e6;border:1px solid #ffffffe6;border-radius:25px;flex-direction:column;padding:22px;display:flex}.panel-heading,.selected-title{justify-content:space-between;align-items:flex-start;display:flex}.eyebrow{color:#8a998d;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:2px;font-size:10px;font-weight:900;display:block}h1,h2,p{margin-top:0}h1{margin-bottom:15px;font-size:25px;line-height:1}.shortcut-note{color:#859188;letter-spacing:.8px;text-transform:uppercase;background:#f2eee3;border-radius:8px;padding:6px 9px;font-size:9px;font-weight:900}.defender-list{gap:9px;display:grid}.defender-card{text-align:left;cursor:pointer;background:#ffffffb3;border:1px solid #e5dfd2;border-radius:16px;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:11px;min-height:82px;padding:10px 11px;transition:border .16s,background .16s,transform .16s,box-shadow .16s;display:grid;position:relative;overflow:hidden}.defender-card:hover{border-color:#c9d5bd;transform:translateY(-2px);box-shadow:0 8px 18px #4e5b4514}.defender-card.selected{background:#f3f8eb;border:2px solid #75a86f;box-shadow:0 8px 18px #5b814f1f}.defender-card.selected:after{color:#fff;content:"✓";background:#70a468;border-radius:50%;place-items:center;width:17px;height:17px;font-size:10px;font-weight:900;display:grid;position:absolute;top:7px;right:7px}.portrait{border-radius:17px;place-items:center;width:57px;height:57px;font-size:36px;line-height:1;display:grid;overflow:hidden}.bunny-portrait{background:linear-gradient(145deg,#efe6fb,#dfd1f2)}.fox-portrait{background:linear-gradient(145deg,#ffe2bd,#f5bf88)}.bear-portrait{background:linear-gradient(145deg,#dff0ea,#bcdcd2)}.defender-copy{min-width:0}.defender-copy>span,.defender-copy strong,.defender-copy em,.defender-copy small{display:block}.defender-copy strong{font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif;font-size:17px;line-height:1.05}.defender-copy em{color:#718078;letter-spacing:.7px;text-transform:uppercase;margin-top:1px;font-size:10px;font-style:normal;font-weight:900}.defender-copy small{color:#8c978e;text-overflow:ellipsis;white-space:nowrap;margin-top:6px;font-size:11px;font-weight:700;overflow:hidden}.price-tag{color:#8c623f;background:#f7ead0;border-radius:8px;align-self:end;padding:5px 8px;font-size:10px;font-weight:900}.selection-card{background:#faf7edbf;border:1px dashed #d8d0c0;border-radius:17px;min-height:163px;margin-top:13px;padding:16px}.selection-empty{text-align:center;align-content:center;place-items:center;min-height:128px;display:grid}.selection-empty[hidden],.selection-details[hidden]{display:none}.empty-paw{opacity:.7;margin-bottom:5px;font-size:24px}.selection-empty strong{font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif;font-size:16px}.selection-empty p{color:#89958d;max-width:220px;margin:2px auto 0;font-size:11px;font-weight:700;line-height:1.45}.selected-title h2{margin:0;font-size:22px;line-height:1}.level-badge{color:#55775a;background:#e1edd6;border-radius:9px;padding:6px 9px;font-size:11px;font-weight:900}.stat-grid{grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0;display:grid}.stat-grid div{text-align:center;background:#f3eee2;border-radius:9px;padding:8px 7px}.stat-grid span,.stat-grid strong{display:block}.stat-grid span{color:#90998f;letter-spacing:.7px;text-transform:uppercase;font-size:8px;font-weight:900}.stat-grid strong{margin-top:2px;font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif;font-size:14px}.selection-actions{grid-template-columns:1.2fr 1fr;gap:7px;display:grid}.upgrade-button,.sell-button{border-radius:10px;min-height:36px;font-size:10px}.upgrade-button{color:#fff;background:#67945f;box-shadow:0 6px 13px #4c784733}.sell-button{color:#6f7b72;background:#ebe8de}.field-note{color:#859087;align-items:flex-start;gap:10px;margin-top:auto;padding:13px 2px 0;display:flex}.field-note>span{font-size:18px}.field-note p{margin-bottom:0;font-size:10px;font-weight:700;line-height:1.5}.field-note strong{color:#67766c}footer{color:#8a948d;letter-spacing:.4px;justify-content:space-between;padding:13px 6px 0;font-size:10px;font-weight:800;display:flex}.modal-backdrop{z-index:20;opacity:1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#2c3a2f80;place-items:center;padding:20px;transition:opacity .22s;display:grid;position:fixed;inset:0}.modal-backdrop[hidden]{display:none}.modal-card{text-align:center;background:radial-gradient(circle at 100% 0,#e7f1d8e6,#0000 36%),#fffaf0;border:2px solid #fffc;border-radius:27px;width:min(520px,100%);padding:34px;animation:.26s cubic-bezier(.2,.85,.3,1.15) modal-pop;position:relative;box-shadow:0 28px 80px #2531284d}.modal-close{color:#738078;cursor:pointer;background:#efebe1;border:0;border-radius:10px;place-items:center;width:32px;height:32px;font-size:20px;display:grid;position:absolute;top:14px;right:14px}.modal-icon{background:#f6dfb7;border-radius:22px;place-items:center;width:70px;height:70px;margin:-4px auto 12px;font-size:39px;display:grid;transform:rotate(-3deg);box-shadow:inset 0 -4px #b87e451a}.modal-card h2{margin-bottom:8px;font-size:31px;line-height:1.1}.modal-card>p{color:#718078;max-width:430px;margin:0 auto 20px;font-size:13px;font-weight:700;line-height:1.6}.modal-steps{grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 23px;display:grid}.modal-steps div{background:#ffffffa6;border:1px solid #e7e0d2;border-radius:13px;min-width:0;padding:12px 8px}.modal-steps span,.modal-steps strong,.modal-steps small{display:block}.modal-steps span{color:#fff;background:#75a36e;border-radius:50%;place-items:center;width:24px;height:24px;margin:0 auto 6px;font-size:10px;font-weight:900;display:grid}.modal-steps strong{font-family:Arial Rounded MT Bold,Trebuchet MS,ui-rounded,sans-serif;font-size:13px}.modal-steps small{color:#8d978f;font-size:9px;font-weight:700;line-height:1.35}.modal-action{min-width:245px}@keyframes cloud-drift{to{transform:translate(60px)translateY(8px)}}@keyframes cloud-drift-reverse{to{transform:translate(-70px)translateY(-5px)scale(.72)}}@keyframes leaf-float{0%,to{transform:translateY(0)rotate(-8deg)}50%{transform:translateY(16px)rotate(10deg)}}@keyframes modal-pop{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=980px){.app-shell{width:min(100% - 28px,150svh + 64px)}.topbar{grid-template-columns:1fr auto}.hud{grid-area:2/1/auto/-1}}@media (width<=820px){.app-shell{width:min(780px,100% - 28px)}.game-layout{grid-template-columns:1fr}.side-panel{grid-template-columns:1fr 1fr;gap:14px 18px;display:grid}.panel-heading,.defender-list{grid-column:1}.selection-card,.field-note{grid-column:2}.selection-card{grid-row:1/span 2;margin-top:0}.field-note{align-self:end}}@media (width>=821px) and (height<=950px) and (aspect-ratio>=3/2){.app-shell{padding-bottom:0}footer{display:none}}@media (width<=720px){.app-shell{width:min(100% - 18px,620px);padding-top:12px}.topbar{gap:12px;margin-bottom:12px}.brand-mark{border-radius:14px;width:45px;height:45px;font-size:25px}.brand strong{font-size:19px}.brand small,.soft-button{display:none}.hud{justify-content:stretch;width:100%}.hud-pill{flex:1;min-width:0;padding:5px 7px}.hud-pill>span:first-child{font-size:16px}.hud-pill strong{font-size:15px}.board-frame{border-width:4px;border-radius:21px}.board-ribbon{padding:4px 8px;font-size:8px;top:8px;left:8px}.play-controls{gap:9px;padding:10px;display:grid}.tip-copy{padding-left:3px;font-size:11px}.control-buttons{grid-template-columns:auto auto 1fr;display:grid}.control-button,.primary-button{min-height:41px;padding:0 11px;font-size:10px}.side-panel{padding:17px;display:block}.defender-card{grid-template-columns:50px minmax(0,1fr) auto;min-height:70px}.portrait{width:48px;height:48px;font-size:31px}.selection-card{margin-top:12px}.field-note{margin-top:2px}footer{display:none}.modal-card{padding:28px 19px 22px}.modal-card h2{font-size:26px}.modal-steps{grid-template-columns:1fr}.modal-steps div{text-align:left;grid-template-columns:32px 1fr;display:grid}.modal-steps span{grid-row:1/span 2;margin:0}.modal-action{width:100%;min-width:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
