:root{--eco:#1d9e75;--eco-dark:#147a5a;--eco-soft:#e8f5ef;--ink:#0f1115;--ink2:#6b7076;--bg:#f7f7f5;--surface:#fff;--border:#e6e7e9;--blue:#9cc9e8;--gold:#f2b705;--danger:#b43a2c;--radius:18px;--shadow:0 10px 30px #0f111526;color:var(--ink);font-family:Nunito,Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{-webkit-user-select:none;user-select:none;background:#cfe8f7;height:100%;margin:0;overflow:hidden}canvas{display:block}[hidden]{display:none!important}button{font:inherit;cursor:pointer}kbd{border:2px solid var(--ink);text-align:center;background:#fff;border-bottom-width:4px;border-radius:8px;min-width:1.8em;padding:.1em .45em;font-family:inherit;font-weight:800;line-height:1.3;display:inline-block}.ui{pointer-events:none;position:fixed;inset:0}.ui>*{pointer-events:auto}.ui .world-layer,.ui .banner,.ui .card,.ui .hud-panel{pointer-events:none}.topbar{z-index:30;gap:8px;display:flex;position:absolute;top:16px;right:16px}.topbar button{box-shadow:var(--shadow);background:#ffffffeb;border:0;border-radius:999px;padding:10px 16px;font-weight:700}.topbar .restart{background:var(--ink);color:#fff}.hud-panel{border-radius:var(--radius);min-width:240px;max-width:320px;box-shadow:var(--shadow);background:#fffffff0;padding:16px 20px;font-size:18px;position:absolute;top:16px;left:16px}.hud-panel small{text-transform:uppercase;letter-spacing:.12em;color:var(--ink2);font-size:13px;font-weight:800}.hud-panel h3{margin:2px 0 8px;font-size:22px}.hud-panel .big{color:var(--eco);margin-bottom:6px;font-size:40px;font-weight:900}.hud-panel .row{justify-content:space-between;padding:2px 0;font-size:22px;display:flex}.hud-panel .row b{font-size:26px}.inv{border-left:6px solid var(--c);justify-content:space-between;align-items:center;margin:4px 0;padding:3px 0 3px 12px;font-weight:700;display:flex}.inv b{font-size:22px}.badge{background:var(--gold);text-align:center;border-radius:10px;margin-top:8px;padding:6px 10px;font-weight:900;animation:.6s infinite alternate pulse}.hud-hint{box-shadow:var(--shadow);white-space:nowrap;background:#fffffff0;border-radius:999px;gap:12px;padding:12px 22px;font-size:20px;font-weight:700;display:flex;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.keycap{background:var(--c);color:#fff;border:0;border-radius:14px;padding:10px 20px;font-size:24px;font-weight:900;box-shadow:0 4px #00000040}.keycap:active{box-shadow:none;transform:translateY(3px)}.keycap kbd{color:var(--ink);margin-right:6px}.hud-hint:has(.keycap){box-shadow:none;background:0 0;gap:16px;padding:0}.world-layer{position:absolute;inset:0;overflow:hidden}.world-label{white-space:nowrap;box-shadow:var(--shadow);text-align:center;background:#fff;border-radius:12px;padding:6px 12px;font-size:18px;font-weight:800;position:absolute;top:0;left:0}.world-label.action{background:var(--ink);color:#fff;font-size:20px}.world-label.action kbd{color:var(--ink)}.world-label.target{background:var(--eco);color:#fff}.world-label.target b{font-size:26px}.world-label.warn{background:var(--gold)}.world-label.ghost{color:var(--eco-dark);background:#9fe8c8d9;font-size:15px}.float{white-space:nowrap;text-shadow:0 2px #fff,0 0 12px #fff;font-size:26px;font-weight:900;animation:1s ease-out forwards rise;position:absolute;transform:translate(-50%,-50%)}.float.good{color:var(--eco-dark)}.float.bad{color:var(--danger);font-size:24px}.float.big{font-size:38px}.banner{box-shadow:var(--shadow);opacity:0;white-space:nowrap;z-index:20;background:#fffffff5;border-radius:999px;padding:14px 30px;font-size:30px;font-weight:900;transition:opacity .25s,transform .25s;position:absolute;top:18%;left:50%;transform:translate(-50%,-20px)}.banner.show{opacity:1;transform:translate(-50%)}.banner.ok{background:var(--eco);color:#fff}.banner.gold{background:var(--gold)}.banner.warn{background:var(--ink);color:#fff;font-size:22px}.banner.count{padding:10px 50px;font-size:80px;top:30%}.card{opacity:0;z-index:15;background:#0f111559;place-items:center;transition:opacity .3s;display:grid;position:absolute;inset:0}.card.show{opacity:1}.card-box{text-align:center;max-width:560px;box-shadow:var(--shadow);background:#fff;border-radius:28px;padding:36px 48px;transition:transform .3s;transform:scale(.9)}.card.show .card-box{transform:scale(1)}.card-num{background:var(--eco);color:#fff;border-radius:50%;place-items:center;width:64px;height:64px;font-size:34px;font-weight:900;display:inline-grid}.card-box h2{letter-spacing:.06em;color:var(--eco-dark);margin:14px 0 8px;font-size:40px}.card-box p{color:var(--ink2);margin:0;font-size:24px}.progress{width:360px;height:18px;box-shadow:var(--shadow);background:#fff;border-radius:999px;position:absolute;bottom:90px;left:50%;overflow:hidden;transform:translate(-50%)}.progress-fill{background:var(--eco);height:100%;transition:width .1s}.screen{z-index:10;justify-content:safe center;align-items:safe center;padding:76px 24px 24px;display:flex;position:absolute;inset:0;overflow-y:auto}.btn{border:0;border-radius:16px;padding:14px 28px;font-size:20px;font-weight:900;transition:transform .1s}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--eco);color:#fff;box-shadow:0 5px 0 var(--eco-dark)}.btn.ghost{color:var(--eco-dark);border:3px solid var(--eco);background:#fff}.btn.big{padding:18px 64px;font-size:32px}.btn:focus-visible{outline:4px solid var(--gold);outline-offset:3px}.menu{background:linear-gradient(90deg,#f7f7f5f2 0%,#f7f7f5bf 55%,#f7f7f526 100%);justify-content:flex-start;padding:40px 8vw}.menu-main{text-align:center;flex-direction:column;align-items:center;gap:14px;display:flex}.menu .logo{object-fit:contain;width:min(420px,70vw);max-height:26vh}.menu h1{margin:0;font-size:44px}.menu .tag{color:var(--eco-dark);letter-spacing:.04em;margin:0 0 10px;font-size:24px;font-weight:700}.menu .keys{color:var(--ink2);font-size:18px;font-weight:700}.rank{border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;min-width:280px;padding:20px 26px}.rank h3{letter-spacing:.08em;color:var(--eco-dark);margin:0 0 10px}.rank ol{margin:0;padding:0;font-size:22px;font-weight:800;list-style:none}.rank li{border-bottom:1px solid var(--border);font-variant-numeric:tabular-nums;justify-content:space-between;gap:24px;padding:6px 0;display:flex}.rank li.me{color:var(--eco)}.rank li.empty{color:var(--ink2);font-weight:600}.rank .challenge{color:var(--ink2);margin:14px 0 0;font-weight:800}.menu-foot{color:var(--ink2);justify-content:space-between;font-size:14px;display:flex;position:absolute;bottom:14px;left:20px;right:20px}.menu-foot label{cursor:pointer;box-shadow:var(--shadow);background:#ffffffeb;border-radius:999px;align-items:center;gap:6px;padding:6px 14px;display:flex}.modal{z-index:20;background:#0f111573;place-items:center;display:grid;position:absolute;inset:0}.modal-box{max-width:600px;box-shadow:var(--shadow);text-align:center;background:#fff;border-radius:24px;padding:32px 40px}.modal-box h2{margin-top:0;font-size:34px}.steps{text-align:left;padding-left:0;font-size:21px;line-height:1.5;list-style:none}.steps li{margin-bottom:12px}.know .logo{width:240px}.know p{font-size:19px;line-height:1.45}.know .flow-line{color:var(--eco-dark);font-size:17px;font-weight:800}.know .qr{width:150px}.muted{color:var(--ink2)}.results,.final,.eco-flow{background:#e8f5eff0}.panel{box-shadow:var(--shadow);text-align:center;background:#fff;border-radius:28px;padding:32px 44px;animation:.4s ease-out pop}.panel h2.ok{color:var(--eco);letter-spacing:.04em;margin:0 0 12px;font-size:40px}.big-stat span{color:var(--ink2);font-size:20px;font-weight:700;display:block}.big-stat b{font-size:64px}.stats{justify-content:center;gap:14px;margin:16px 0;display:flex}.stat{background:var(--bg);border-radius:16px;min-width:150px;padding:12px 20px}.stat span{color:var(--ink2);font-size:15px;font-weight:700;display:block}.stat b{font-size:30px}.stat.mat{border-top:6px solid var(--c)}.eco-flow{flex-direction:column;gap:22px}.eco-flow>*,.flow>*,.dash-eco,.dash-note{opacity:0;animation:.5s ease-out forwards appear;animation-delay:var(--d,0s)}.flow{opacity:1;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;animation:none;display:flex}.flow-step{box-shadow:var(--shadow);background:#fff;border-radius:14px;padding:12px 20px;font-size:20px;font-weight:900}.flow-step.eco{background:var(--eco);color:#fff}.flow-arrow{color:var(--eco);font-size:30px;font-weight:900;transform:rotate(-90deg)}.dash{width:min(520px,90vw);box-shadow:var(--shadow);border:3px solid var(--ink);background:#fff;border-radius:20px;overflow:hidden}.dash-bar{background:var(--bg);border-bottom:2px solid var(--border);color:var(--ink2);align-items:center;gap:12px;padding:8px 16px;font-weight:800;display:flex}.dash-bar img{height:34px}.dash-body{text-align:center;padding:20px}.dash-ok{color:var(--eco);margin:0;font-size:26px;font-weight:900}.dash-kg{margin:4px 0;font-size:48px;font-weight:900}.dash-eco{color:var(--eco);margin:6px 0 0;font-size:64px;font-weight:900}.dash-note{color:var(--ink2);margin:0;font-weight:700}.caption{box-shadow:var(--shadow);background:#fff;border-radius:18px;align-items:center;gap:16px;padding:14px 24px;font-size:20px;display:flex}.caption .card-num{flex:none;width:48px;height:48px;font-size:26px}.final{flex-direction:column;gap:22px}.panel.wide{text-align:left;align-items:flex-start;gap:40px;display:flex}.impact h2{color:var(--eco-dark);margin:0 0 10px;font-size:40px}.impact-list{margin:0 0 16px;padding:0;font-size:24px;list-style:none}.impact-list li{padding:4px 0}.impact-list b{font-size:30px}.impact-list .eco b{color:var(--eco)}.how{background:var(--eco-soft);border-radius:16px;padding:14px 20px;font-size:19px}.how p{margin:0 0 6px;font-weight:700}.how .chain{color:var(--eco-dark);flex-direction:column;gap:2px;font-weight:900;display:flex}.how .chain span{color:var(--eco)}.side{flex-direction:column;gap:16px;min-width:280px;display:flex}.side .rank{box-shadow:none;border:2px solid var(--border)}.score-total{margin:0;font-size:22px;font-weight:700}.score-total b{color:var(--eco);font-size:36px}.initials{flex-direction:column;gap:8px;display:flex}.initials label{font-weight:800}.initials input{font:inherit;letter-spacing:.4em;text-align:center;text-transform:uppercase;border:3px solid var(--eco);border-radius:14px;width:100%;padding:8px;font-size:40px;font-weight:900}.actions{gap:16px;display:flex}.hud-top{box-shadow:var(--shadow);letter-spacing:.06em;white-space:nowrap;pointer-events:none;background:#fffffff2;border-radius:999px;padding:10px 26px;font-size:20px;font-weight:800;position:absolute;top:16px;left:50%;transform:translate(-50%)}.hud-top b{font-variant-numeric:tabular-nums;margin-left:6px;font-size:32px}.hud-top.urgent{background:var(--danger);color:#fff;animation:.5s infinite alternate pulse-x}.hud-top.rush{color:#fff;background:linear-gradient(90deg,#1d9e75,#7ee2b8,#1d9e75) 0 0/200% 100%;animation:1s linear infinite slide,.4s infinite alternate pulse-x}.chip{background:#ffffff4d;border-radius:999px;padding:2px 10px;font-size:18px;display:inline-block}.chip.gold{background:var(--gold);color:var(--ink)}.meter{background:var(--border);border-radius:999px;height:12px;margin:4px 0 8px;overflow:hidden}.meter i{background:var(--eco);border-radius:inherit;height:100%;transition:width .15s;display:block}.meter.small{height:6px;margin-top:0}.meter.low i{background:var(--gold)}.meter.rush i{background:linear-gradient(90deg,#7ee2b8,#1d9e75)}.meter.rush.on i{background:linear-gradient(90deg,#f2b705,#1d9e75);animation:.3s infinite alternate pulse}.world-label .meter{background:#ffffff4d;width:120px;margin:6px auto 0}.row.combo b{color:var(--eco);font-size:30px}.row.combo.hot b{color:var(--gold);text-shadow:0 1px 0 var(--ink)}.row.combo.dim b{color:var(--ink2)}.pct{color:var(--eco-dark);font-size:15px}.mission{background:var(--eco-soft);border:2px dashed var(--eco);border-radius:12px;margin-top:10px;padding:8px 12px;font-size:16px;font-weight:700}.mission small{color:var(--eco-dark);font-size:11px;display:block}.mission.done{background:var(--eco);color:#fff;border-style:solid}.mission.done small{color:#fff}.note{color:var(--ink2);font-size:14px}.warn-txt{color:var(--danger)}.gold-txt{color:#b98900}.banner.bad{background:var(--danger);color:#fff;font-size:24px}.banner.mission{background:var(--eco);color:#fff}.banner.show.mission,.banner.show.rush{animation:.25s 4 alternate pulse-b}.banner.rush{color:#fff;background:linear-gradient(90deg,#1d9e75,#f2b705);font-size:56px}.confetti{z-index:40;pointer-events:none;border-radius:2px;width:10px;height:14px;animation:1.2s ease-out forwards confetti;position:absolute;top:22%;left:50%}.card-box .sum-n{color:var(--ink);font-size:34px}.card-box .sum-pts{color:var(--eco);font-size:32px}.menu h1{letter-spacing:.06em}.row-btns{gap:12px;display:flex}.record{box-shadow:var(--shadow);background:#fff;border-radius:18px;flex-direction:column;align-items:center;max-width:420px;padding:10px 28px;display:flex}.record small{letter-spacing:.12em;color:var(--ink2);font-weight:900}.record b{color:var(--eco);font-size:40px;line-height:1.1}.record span{text-overflow:ellipsis;white-space:nowrap;max-width:360px;font-weight:800;overflow:hidden}ol.ranking li{grid-template-columns:2.2em minmax(0,1fr) auto auto;align-items:center;gap:10px;display:grid}ol.ranking li.empty{display:block}ol.ranking .name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.big-list{text-align:left;min-width:min(560px,80vw)}.rank-badge{background:var(--border);border-radius:6px;padding:1px 7px;font-size:13px}.r-splus{color:#8a6200;background:#ffe58a}.r-s{color:#fff;background:var(--eco)}.r-a{color:#fff;background:#3b82f6}.r-b{color:var(--ink);background:#d7d9dc}.r-c{color:var(--ink2);background:var(--border)}.rank-hero{justify-content:center;align-items:center;gap:30px;margin:4px 0 14px;display:flex}.rank-hero small{letter-spacing:.15em;color:var(--ink2);font-weight:900}.rank-letter{border-radius:24px;padding:6px 26px;font-size:96px;font-weight:900;line-height:1;animation:.6s cubic-bezier(.3,1.6,.5,1) pop}.rank-pts b{font-size:56px;display:block}.rank-pts span{color:var(--ink2);font-weight:700}.results-grid{text-align:left;justify-content:center;align-items:stretch;gap:24px;margin-bottom:18px;display:flex}.stats.col{flex-direction:column;gap:8px;margin:0}.stats.col .stat{padding:8px 16px}.stats.col .stat b{font-size:24px}.breakdown{border-collapse:collapse;min-width:300px;font-size:18px}.breakdown td{border-bottom:1px solid var(--border);padding:6px 12px;font-weight:700}.breakdown td:last-child{text-align:right;font-variant-numeric:tabular-nums}.breakdown .total td{color:var(--eco);border-bottom:0;font-size:26px;font-weight:900}.game-stats{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px;display:grid}.game-stats div{background:var(--bg);text-align:center;border-radius:12px;padding:6px 10px}.game-stats span{letter-spacing:.08em;color:var(--ink2);font-size:12px;font-weight:900;display:block}.game-stats b{border-radius:6px;padding:0 6px;font-size:24px}.panel.wide .side{width:min(480px,80vw)}.side ol.ranking{font-size:19px}.new-record{text-align:center;color:var(--ink);background:var(--gold);border-radius:14px;margin:0;padding:8px;font-size:28px;font-weight:900;animation:.5s infinite alternate pulse}.name-form{flex-direction:column;gap:6px;display:flex}.name-form label{letter-spacing:.1em;font-weight:900}.name-form input{font:inherit;border:3px solid var(--eco);-webkit-user-select:text;user-select:text;border-radius:14px;width:100%;padding:10px 14px;font-size:24px;font-weight:800}.name-form input:focus{outline:4px solid var(--gold)}.name-meta{color:var(--ink2);justify-content:space-between;font-size:14px;font-weight:700;display:flex}.name-meta .err{color:var(--danger)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.name-required{background:var(--gold);border-radius:999px;margin:0;padding:8px 18px;font-size:18px;font-weight:900;animation:.7s infinite alternate pulse}.saved{color:var(--eco-dark);margin:0;font-size:20px;font-weight:900}.screen.attract{pointer-events:none;background:linear-gradient(#0f111500 40%,#0f111573 100%);align-items:flex-end}.attract-box{flex-direction:column;align-items:center;gap:10px;margin-bottom:4vh;display:flex}.attract-box .logo{filter:drop-shadow(0 4px 12px #0000004d);width:220px}.attract-box h1{color:#fff;text-shadow:0 3px 12px #00000080;margin:0;font-size:52px}.attract-box .rank{min-width:420px}.blink{color:#fff;text-shadow:0 2px 8px #0009;font-size:22px;font-weight:900;animation:.7s infinite alternate pulse}.stand{color:var(--ink2);flex-direction:column;align-items:center;font-size:16px;font-weight:700;display:flex}.stand small{letter-spacing:.12em;font-size:11px;font-weight:900}.stand b{color:var(--eco-dark);font-size:18px}.team-tools{gap:10px;min-width:min(420px,80vw);margin-bottom:10px;display:grid}.btn.danger{color:var(--danger);border:3px solid var(--danger);background:#fff}.team-info{margin:0 0 12px}.board{background:linear-gradient(160deg,#e8f5ef 0%,#f7f7f5 60%,#cfe8f7 100%);flex-direction:column;gap:3vh;padding:4vh 5vw;display:flex;position:fixed;inset:0;overflow:auto}.board header{align-items:center;gap:3vw;display:flex}.board .logo{height:16vh}.board h1{letter-spacing:.06em;color:var(--eco-dark);margin:0;font-size:clamp(32px,6vh,72px)}.board-sub{color:var(--ink2);margin:0;font-size:clamp(18px,3vh,34px);font-weight:800}.board main{flex:1;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);align-items:start;gap:3vw;display:grid}.board-list{box-shadow:var(--shadow);background:#fff;border-radius:28px;padding:2vh 2.5vw;font-size:clamp(20px,4vh,44px)}.board-list li{padding:1vh 0}.board-list li:first-child .pos{color:#b98900}.board-list li.me{animation:.6s infinite alternate pulse}.board-list .rank-badge{font-size:.55em}.board aside{flex-direction:column;gap:2vh;display:flex}.board-card{box-shadow:var(--shadow);text-align:center;background:#fff;border-radius:22px;flex-direction:column;align-items:center;padding:2vh 1.5vw;display:flex}.board-card small{letter-spacing:.12em;color:var(--ink2);font-size:clamp(12px,1.8vh,20px);font-weight:900}.board-card b{color:var(--eco);font-size:clamp(28px,6vh,72px);line-height:1.15}.board-card span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:clamp(16px,2.6vh,30px);font-weight:800;overflow:hidden}.board-chain{text-align:center;color:var(--eco-dark);margin:0;font-size:clamp(14px,2.2vh,24px);font-weight:900}@media (width<=900px){.board main{grid-template-columns:1fr}}@keyframes pulse-x{0%{transform:translate(-50%)scale(1)}to{transform:translate(-50%)scale(1.06)}}@keyframes pulse-b{0%{transform:translate(-50%)scale(1)}to{transform:translate(-50%)scale(1.08)}}@keyframes slide{to{background-position:200% 0}}@keyframes confetti{0%{opacity:1;transform:translate(0)rotate(0)}to{opacity:0;transform:translate(var(--x), calc(var(--y) + 160px)) rotate(var(--r))}}@keyframes rise{0%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-160%)}}@keyframes appear{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes pop{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}@keyframes pulse{to{transform:scale(1.06)}}@media (width<=900px){.menu{flex-direction:column;justify-content:center;gap:20px;overflow-y:auto}.panel.wide,.results-grid{flex-direction:column}.attract-box .rank{width:90vw;min-width:0}.stats{flex-wrap:wrap}.hud-hint{font-size:15px}.keycap{padding:8px 12px;font-size:17px}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation-duration:10ms!important}}@media (height<=820px){.menu .keys{display:none}}