@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;600;700&display=swap";:root{color-scheme:light;--ink: #2d323a;--cream: #f4efe5;--teal: #64c7c2;--sea: #2f9aa3;--road: #4b4c62;--road-glow: #7d7f9b;--sunset: #ffb65c;--coral: #ff6f61;--shadow: rgba(44, 58, 72, .18);--glass: rgba(244, 239, 229, .78);--toolbar: rgba(255, 255, 255, .86);--toolbar-ink: #4b4c62;--grid-bg: #f4efe5;--grid-line: #ddd3c2}body[data-theme=dark]{color-scheme:dark;--ink: #edf3f6;--cream: #11151c;--teal: #64c7c2;--sea: #4dd4db;--road: #2d3444;--road-glow: #515a74;--sunset: #ffb65c;--coral: #ff6f61;--shadow: rgba(8, 12, 20, .45);--glass: rgba(20, 24, 34, .82);--toolbar: rgba(19, 24, 34, .86);--toolbar-ink: #edf3f6;--grid-bg: #10141c;--grid-line: #1f2633}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Nunito,system-ui,-apple-system,sans-serif;background:radial-gradient(circle at top left,rgba(100,199,194,.35),transparent 55%),radial-gradient(circle at 78% 10%,rgba(255,182,92,.35),transparent 52%),linear-gradient(135deg,#f6f1e7,#efe7d7 55%,#f0e8df);color:var(--ink);overflow:hidden}body[data-theme=dark]{background:radial-gradient(circle at top left,rgba(77,212,219,.2),transparent 55%),radial-gradient(circle at 78% 10%,rgba(255,182,92,.2),transparent 52%),linear-gradient(135deg,#0f1218,#141a25 55%,#121824)}#root{width:100vw;height:100vh}.app-root{position:relative;width:100%;height:100%}.canvas-host{width:100%;height:100%}.canvas-host canvas{border-radius:28px;box-shadow:0 30px 60px #232c3c38}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 15% 20%,rgba(100,199,194,.45),transparent 55%),radial-gradient(circle at 80% 20%,rgba(255,182,92,.4),transparent 52%),linear-gradient(180deg,#f8f1e6e6,#f4eee4f0);z-index:10}.overlay-panel{width:min(640px,90vw);background:var(--glass);border-radius:28px;padding:3rem 3rem 2.5rem;box-shadow:0 24px 60px var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:grid;gap:1.4rem;text-align:center;animation:floatIn .7s ease-out}.eyebrow{font-family:Fredoka,Nunito,sans-serif;font-size:.95rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sea)}.title{font-family:Fredoka,Nunito,sans-serif;font-size:clamp(2.6rem,4vw,3.6rem);color:var(--road)}.subtitle{font-size:1.15rem;line-height:1.6;color:#5c5d6f}.pill-row{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}.pill{padding:.35rem .9rem;border-radius:999px;background:#64c7c22e;color:#3b6f73;font-weight:600;font-size:.9rem}.primary-button{border:none;border-radius:999px;padding:.85rem 2.4rem;font-family:Fredoka,Nunito,sans-serif;font-size:1.1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--sea),var(--teal));box-shadow:0 14px 30px #2f9aa359;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.primary-button:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 18px 36px #2f9aa366}.primary-button:active{transform:translateY(1px) scale(.99)}.hud{position:absolute;top:1.2rem;left:0;right:0;display:flex;justify-content:center;pointer-events:none;z-index:5;gap:.8rem;align-items:center}.hud-pill{background:#ffffffd1;border-radius:999px;padding:.5rem 1.3rem;display:flex;gap:.5rem;align-items:baseline;font-family:Fredoka,Nunito,sans-serif;box-shadow:0 12px 30px var(--shadow)}.hud-label{font-size:.85rem;color:#6c6d7a;letter-spacing:.14em;text-transform:uppercase}.hud-value{font-size:1.4rem;font-weight:600;color:var(--road)}.hud-meter{background:#ffffffd1;border-radius:999px;padding:.45rem 1rem;display:grid;gap:.35rem;box-shadow:0 12px 30px var(--shadow);min-width:320px;font-family:Fredoka,Nunito,sans-serif}.hud-meter-label{font-size:.75rem;color:#6c6d7a;letter-spacing:.16em;text-transform:uppercase;text-align:center}.hud-meter-track{height:10px;background:#4f50622e;border-radius:999px;overflow:hidden}.hud-meter-fill{height:100%;width:100%;background:linear-gradient(90deg,#ffb65c,#ff7b6b);border-radius:999px;transition:width .2s ease}.toolbar{position:absolute;left:50%;bottom:1.4rem;transform:translate(-50%);background:var(--toolbar);border-radius:26px;padding:1rem 1.6rem;box-shadow:0 18px 40px var(--shadow);display:grid;gap:.6rem;z-index:6}.toolbar-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem}.toolbar-label{font-family:Fredoka,Nunito,sans-serif;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;color:#6c6d7a;text-align:center}.theme-toggle{border:none;background:#64c7c22e;color:var(--toolbar-ink);border-radius:999px;width:36px;height:36px;display:grid;place-items:center;cursor:pointer}.theme-icon{font-size:1rem}.tool-row{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}.tool-card{background:#f6f1e8e6;border:1px solid rgba(96,106,120,.15);border-radius:18px;padding:.7rem .9rem;min-width:120px;text-align:left;display:grid;gap:.2rem;box-shadow:0 10px 20px #505b6a1a;cursor:pointer}.tool-card.is-active{border-color:#2f9aa399;box-shadow:0 12px 24px #2f9aa347;background:#64c7c247}.tool-icon{font-size:1.4rem;color:var(--sea)}.tool-name{font-weight:700;color:var(--road)}.tool-hint{font-size:.85rem;color:#6c6d7a}@keyframes floatIn{0%{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:720px){.overlay-panel{padding:2.2rem 1.6rem}.canvas-host canvas{border-radius:18px}.toolbar{width:calc(100% - 2rem)}}