:root{--font-body: "Sora", "Avenir Next", "Segoe UI", sans-serif;--color-ink: #0c223c;--color-ink-soft: #344b66;--color-ink-muted: #5b6f86;--radius-lg: 22px;--radius-md: 16px;--shadow-panel: 0 20px 40px rgba(14, 38, 63, .14);--shadow-elevated: 0 24px 40px rgba(16, 42, 74, .18);--bg-gradient: linear-gradient(145deg, #f4fbf6 0%, #eef7ff 50%, #fff4df 100%);--bg-spot-a: radial-gradient( circle at 12% 12%, rgba(154, 226, 204, .55) 0%, transparent 28% );--bg-spot-b: radial-gradient( circle at 88% 16%, rgba(141, 193, 255, .48) 0%, transparent 25% );--bg-spot-c: radial-gradient( circle at 18% 84%, rgba(255, 226, 163, .44) 0%, transparent 30% );--glass-surface: linear-gradient( 160deg, rgba(255, 255, 255, .86), rgba(248, 253, 255, .76) );--glass-border: rgba(12, 34, 60, .13);--control-surface: linear-gradient(145deg, #ffffff, #e2f4ff);--control-surface-alt: linear-gradient( 150deg, rgba(255, 255, 255, .9), rgba(226, 243, 255, .76) );--control-surface-active: linear-gradient( 140deg, rgba(251, 236, 207, .98), rgba(255, 255, 255, .92) );--control-border: rgba(17, 36, 61, .14);--control-border-strong: rgba(17, 36, 61, .24);--tool-cta: #0c5775;--status-active-ink: #1e5f3b;--status-active-bg: rgba(146, 230, 170, .26);--status-draw-ink: #865902;--status-draw-bg: rgba(255, 225, 140, .3);--status-p1-ink: #8f4308;--status-p1-bg: rgba(255, 183, 126, .32);--status-p2-ink: #0d5e74;--status-p2-bg: rgba(144, 231, 255, .34);--status-idle-bg: rgba(164, 180, 201, .24);--status-error-ink: #8e2926;--status-error-bg: rgba(255, 194, 194, .44);--theme-toolbar-bg: rgba(248, 253, 255, .84);--theme-toolbar-border: rgba(12, 34, 60, .15);--canvas-frame-stroke: rgba(19, 42, 65, .12);--canvas-board-stroke: rgba(20, 42, 71, .15);--canvas-ttt-bg: #edf3ff;--canvas-ttt-cell-bg: rgba(255, 255, 255, .86);--canvas-player-1-mark: #d76824;--canvas-player-2-mark: #1f8ca3;--canvas-c4-bg: #e6f4ff;--canvas-c4-cell-bg: rgba(225, 239, 253, .98);--canvas-c4-empty-disc: rgba(255, 255, 255, .75);--canvas-c4-empty-disc-stroke: rgba(20, 42, 71, .12);--canvas-c4-player-1-start: #ffe3b6;--canvas-c4-player-1-mid: #ff8d42;--canvas-c4-player-1-end: #ca5a18;--canvas-c4-player-2-start: #d7f8ff;--canvas-c4-player-2-mid: #40afca;--canvas-c4-player-2-end: #1e7086;--canvas-hex-bg: #f3f8ff;--canvas-hex-player-1-start: #ffd993;--canvas-hex-player-1-mid: #ff9a57;--canvas-hex-player-1-end: #dc6429;--canvas-hex-player-2-start: #d4f6ff;--canvas-hex-player-2-mid: #58b5ca;--canvas-hex-player-2-end: #17788d;--canvas-hex-empty-start: rgba(255, 255, 255, .95);--canvas-hex-empty-end: rgba(231, 244, 255, .92);font-family:var(--font-body);color:var(--color-ink);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root[data-theme=dark]{--color-ink: #dce9fb;--color-ink-soft: #b8c8dc;--color-ink-muted: #92a7be;--shadow-panel: 0 18px 36px rgba(2, 10, 20, .44);--shadow-elevated: 0 24px 40px rgba(2, 8, 18, .58);--bg-gradient: linear-gradient(145deg, #07141f 0%, #0b1a2f 55%, #132332 100%);--bg-spot-a: radial-gradient( circle at 14% 10%, rgba(44, 124, 119, .44) 0%, transparent 30% );--bg-spot-b: radial-gradient( circle at 88% 18%, rgba(61, 104, 168, .42) 0%, transparent 28% );--bg-spot-c: radial-gradient( circle at 20% 86%, rgba(107, 91, 38, .34) 0%, transparent 30% );--glass-surface: linear-gradient( 160deg, rgba(19, 37, 58, .86), rgba(12, 27, 43, .84) );--glass-border: rgba(161, 190, 220, .18);--control-surface: linear-gradient(145deg, #1c3147, #1a273f);--control-surface-alt: linear-gradient( 150deg, rgba(34, 54, 76, .94), rgba(22, 40, 62, .9) );--control-surface-active: linear-gradient( 140deg, rgba(99, 73, 37, .84), rgba(42, 54, 74, .94) );--control-border: rgba(161, 190, 220, .24);--control-border-strong: rgba(172, 205, 239, .44);--tool-cta: #7dd3f6;--status-active-ink: #a7efc2;--status-active-bg: rgba(57, 112, 77, .44);--status-draw-ink: #f3db91;--status-draw-bg: rgba(113, 86, 26, .46);--status-p1-ink: #ffd2b4;--status-p1-bg: rgba(134, 71, 36, .5);--status-p2-ink: #bdefff;--status-p2-bg: rgba(30, 90, 110, .5);--status-idle-bg: rgba(97, 122, 146, .4);--status-error-ink: #ffd0cd;--status-error-bg: rgba(121, 47, 45, .52);--theme-toolbar-bg: rgba(15, 30, 48, .82);--theme-toolbar-border: rgba(172, 205, 239, .3);--canvas-frame-stroke: rgba(157, 187, 217, .22);--canvas-board-stroke: rgba(160, 194, 228, .28);--canvas-ttt-bg: #142236;--canvas-ttt-cell-bg: rgba(35, 54, 78, .88);--canvas-player-1-mark: #ffb378;--canvas-player-2-mark: #7cdaf4;--canvas-c4-bg: #12253d;--canvas-c4-cell-bg: rgba(32, 52, 78, .95);--canvas-c4-empty-disc: rgba(66, 92, 126, .52);--canvas-c4-empty-disc-stroke: rgba(164, 197, 231, .24);--canvas-c4-player-1-start: #ffd7b2;--canvas-c4-player-1-mid: #ff9f54;--canvas-c4-player-1-end: #cf6d2c;--canvas-c4-player-2-start: #cdf2ff;--canvas-c4-player-2-mid: #66c4dd;--canvas-c4-player-2-end: #2f899f;--canvas-hex-bg: #12253d;--canvas-hex-player-1-start: #ffd0a5;--canvas-hex-player-1-mid: #ffa767;--canvas-hex-player-1-end: #d57234;--canvas-hex-player-2-start: #caefff;--canvas-hex-player-2-mid: #68c4dd;--canvas-hex-player-2-end: #2d8aa1;--canvas-hex-empty-start: rgba(57, 82, 116, .9);--canvas-hex-empty-end: rgba(37, 62, 93, .9)}*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0;min-width:320px;background:var(--bg-spot-a),var(--bg-spot-b),var(--bg-spot-c),var(--bg-gradient)}.app-shell{min-height:100vh}.theme-toolbar{position:fixed;top:.75rem;right:.75rem;z-index:30;display:flex;align-items:center;gap:.45rem;border-radius:999px;padding:.35rem .4rem .35rem .62rem;background:var(--theme-toolbar-bg);box-shadow:var(--shadow-panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--theme-toolbar-border)}.theme-toolbar label{font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;color:var(--color-ink-muted)}.theme-toolbar select{border:none;border-radius:999px;padding:.32rem .6rem;font:inherit;font-size:.79rem;color:var(--color-ink);background:var(--control-surface);box-shadow:inset 0 0 0 1px var(--control-border)}.shell{width:min(1080px,100%);margin:0 auto;padding:clamp(1.1rem,2.8vw,2.3rem)}.glass-panel{border-radius:var(--radius-lg);border:1px solid var(--glass-border);background:var(--glass-surface);box-shadow:var(--shadow-panel);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:clamp(1rem,2.6vw,1.45rem)}.dashboard-page{display:grid;gap:1rem}.hero-panel{position:relative;overflow:hidden;color:#f7fffd;background:linear-gradient(135deg,#0f6e66,#14488a 52%,#2f2f78)}.hero-panel:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 8%,rgba(255,224,178,.4),transparent 28%),radial-gradient(circle at 10% 72%,rgba(138,244,219,.3),transparent 30%);pointer-events:none}.hero-panel h1{margin:.34rem 0 .72rem;font-size:clamp(2rem,5vw,2.9rem);letter-spacing:-.02em}.hero-eyebrow{margin:0;text-transform:uppercase;letter-spacing:.15em;font-size:.72rem;opacity:.84}.hero-summary{margin:0;max-width:58ch;color:#f1fcffeb}.tool-section{display:grid;gap:.85rem}.section-header{display:grid;gap:.22rem}.section-header h2{margin:0;font-size:clamp(1.25rem,2.2vw,1.5rem)}.section-header p{margin:0;color:var(--color-ink-soft)}.tool-grid{display:grid;gap:.75rem}.tool-card{text-decoration:none;color:inherit;display:grid;gap:.45rem;border-radius:var(--radius-md);opacity:0;transform:translateY(10px) scale(.99);animation:cardReveal .42s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--card-delay, 0ms);transition:transform .19s ease,box-shadow .22s ease}.tool-card:hover{transform:translateY(-3px) scale(1.01);box-shadow:var(--shadow-elevated)}.tool-card:active{transform:translateY(0) scale(.995)}.tool-card h3{margin:0;font-size:1.1rem}.tool-card p{margin:0;color:var(--color-ink-soft);line-height:1.45}.tool-cta{margin-top:.22rem;width:fit-content;font-size:.8rem;font-weight:700;color:var(--tool-cta);text-transform:uppercase;letter-spacing:.07em}@keyframes cardReveal{to{opacity:1;transform:translateY(0) scale(1)}}@media(min-width:760px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}