@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600&display=swap";:root{font-family:Space Grotesk,system-ui,-apple-system,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--bg: #e9f7ff;--text: #0f172a;--panel-bg: #ffffff;--panel-border: #d5ebfb;--shadow: rgba(15, 23, 42, .08);--primary: #05b3f9;--primary-contrast: #ffffff;--muted: #475569;--muted-2: #334155;--muted-3: #6b7280;--ghost-bg: #ffffff;--ghost-border: #d5ebfb;--link-bg: #f1f5f9;--coffee-bg: #fff9c4;--backdrop: rgba(15, 23, 42, .35);--modal-shadow: rgba(15, 23, 42, .18);--control-bg: #ffffff;--control-border: #d5ebfb;--control-shadow: rgba(15, 23, 42, .08)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text)}#app{min-height:100vh}.page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 20px}.top-bar{position:fixed;top:12px;inset-inline:0;display:flex;justify-content:center;gap:12px;background:transparent;pointer-events:none}.top-bar .icon-btn{pointer-events:auto;width:48px;height:48px;border-radius:999px;border:1px solid var(--control-border);background:var(--control-bg);display:grid;place-items:center;padding:10px;box-shadow:0 6px 18px var(--control-shadow)}.icon-btn svg{width:22px;height:22px;fill:var(--text)}.panel{width:min(420px,100%);background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:20px;padding:28px;box-shadow:0 12px 30px var(--shadow);display:grid;gap:20px}.value{font-size:clamp(56px,14vw,104px);font-weight:600;text-align:center;letter-spacing:-.04em}.meta{margin:-4px 0 8px;text-align:center;color:var(--muted);font-weight:600}.controls{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:12px}button,.form input,.form select{font-family:inherit}button{cursor:pointer;touch-action:manipulation;border-radius:14px;padding:14px 18px;font-size:18px;font-weight:600;border:1px solid var(--ghost-border);background:var(--ghost-bg);color:var(--text);transition:transform .12s ease,box-shadow .12s ease,background .16s ease}button:disabled{opacity:.55;cursor:not-allowed}button:focus-visible,.form input:focus-visible,.form select:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.primary{background:var(--primary);border-color:var(--primary);color:var(--primary-contrast);box-shadow:0 10px 20px color-mix(in srgb,var(--primary) 30%,transparent)}.primary:not(:disabled):hover,.ghost:not(:disabled):hover,.link:not(:disabled):hover{transform:translateY(-1px)}.ghost{background:var(--ghost-bg)}.link{justify-self:center;width:72px;background:var(--link-bg)}.link:not(:disabled):hover{transform:translateY(-1px)}.modal-backdrop{position:fixed;inset:0;background:var(--backdrop);display:grid;place-items:center;padding:16px;z-index:10}.modal{width:min(460px,100%);background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:18px;padding:24px;box-shadow:0 16px 40px var(--modal-shadow);display:grid;gap:16px;text-align:center}.modal-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.modal-actions{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:10px}.info-actions{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));justify-items:center}.modal-title{margin:0;font-weight:700;font-size:20px}.modal-text{margin:0;color:var(--muted-2);line-height:1.4}.modal-link{color:var(--primary);font-weight:600;text-decoration:none;margin-left:6px}.modal-foot{margin:0;font-size:14px;color:var(--muted-3)}.close-btn{border:none;background:transparent;font-size:24px;line-height:1;cursor:pointer;color:var(--text);border-radius:50%;width:36px;height:36px}.buy-coffee{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;padding:14px 18px;border:1px solid var(--ghost-border);background:var(--coffee-bg);color:var(--text);font-weight:700;text-decoration:none;transition:transform .12s ease,box-shadow .12s ease}.buy-coffee svg{width:18px;height:18px;flex-shrink:0}.buy-coffee:hover{transform:translateY(-1px);box-shadow:0 10px 18px color-mix(in srgb,var(--primary) 24%,transparent)}.modal-actions .ghost,.modal-actions .primary{text-align:center}.modal-actions .ghost{display:inline-block;border-radius:14px;padding:14px 18px;border:1px solid var(--ghost-border);background:var(--ghost-bg);color:var(--text);font-weight:600;text-decoration:none}.form{display:grid;gap:14px;text-align:left}.form label{display:grid;gap:6px;font-weight:600;color:var(--text)}.form input,.form select{border:1px solid var(--ghost-border);border-radius:12px;padding:12px;font-size:16px;background:var(--panel-bg);color:var(--text)}.form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--text) 50%),linear-gradient(135deg,var(--text) 50%,transparent 50%);background-position:calc(100% - 20px) center,calc(100% - 14px) center;background-size:6px 6px,6px 6px;background-repeat:no-repeat}.form input:focus-visible,.form select:focus-visible{outline-offset:1px}.theme-picker{display:grid;gap:10px}.theme-label{margin:0;font-weight:600;color:var(--text)}.swatch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:10px}.swatch{width:100%;aspect-ratio:1 / 1;border-radius:18px;border:3px solid transparent;box-shadow:0 4px 12px #0000001f;cursor:pointer;transition:transform .12s ease,box-shadow .16s ease,border-color .12s ease}.swatch:hover{transform:translateY(-2px);box-shadow:0 6px 18px #00000024}.swatch:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.swatch.active{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 30%,transparent),0 8px 20px #00000029}@media(max-width:520px){.controls{grid-template-columns:1fr 1fr}}.theme-sky{--bg: #e9f7ff;--text: #0f172a;--panel-bg: #ffffff;--panel-border: #d5ebfb;--shadow: rgba(15, 23, 42, .08);--primary: #05b3f9;--primary-contrast: #ffffff;--muted: #475569;--muted-2: #334155;--muted-3: #6b7280;--ghost-bg: #ffffff;--ghost-border: #d5ebfb;--link-bg: #f1f5f9;--coffee-bg: #fff9c4;--backdrop: rgba(15, 23, 42, .35);--modal-shadow: rgba(15, 23, 42, .18);--control-bg: #ffffff;--control-border: #d5ebfb;--control-shadow: rgba(15, 23, 42, .08)}.theme-green{--bg: #eaf9f1;--text: #0d2f1b;--panel-bg: #ffffff;--panel-border: #cfe9d8;--shadow: rgba(13, 148, 82, .12);--primary: #0aa858;--primary-contrast: #ffffff;--muted: #2f4f36;--muted-2: #294733;--muted-3: #486156;--ghost-bg: #ffffff;--ghost-border: #cfe9d8;--link-bg: #e4f3ea;--coffee-bg: #fff2ce;--backdrop: rgba(16, 94, 57, .32);--modal-shadow: rgba(13, 148, 82, .2);--control-bg: #ffffff;--control-border: #cfe9d8;--control-shadow: rgba(13, 148, 82, .14)}.theme-orange{--bg: #fff4e8;--text: #3f1f00;--panel-bg: #ffffff;--panel-border: #f8d7b2;--shadow: rgba(245, 134, 25, .14);--primary: #f58619;--primary-contrast: #ffffff;--muted: #7a3c09;--muted-2: #713508;--muted-3: #8b5a33;--ghost-bg: #ffffff;--ghost-border: #f8d7b2;--link-bg: #ffe9d0;--coffee-bg: #ffe6bf;--backdrop: rgba(180, 83, 9, .3);--modal-shadow: rgba(245, 134, 25, .2);--control-bg: #ffffff;--control-border: #f8d7b2;--control-shadow: rgba(245, 134, 25, .16)}.theme-lavender{--bg: #f4edff;--text: #2d1046;--panel-bg: #ffffff;--panel-border: #e5d5ff;--shadow: rgba(197, 147, 249, .16);--primary: #c593f9;--primary-contrast: #1f172a;--muted: #5d3d7b;--muted-2: #54386f;--muted-3: #6f5b8a;--ghost-bg: #ffffff;--ghost-border: #e5d5ff;--link-bg: #efe2ff;--coffee-bg: #fff2da;--backdrop: rgba(124, 58, 237, .32);--modal-shadow: rgba(197, 147, 249, .22);--control-bg: #ffffff;--control-border: #e5d5ff;--control-shadow: rgba(124, 58, 237, .18)}.theme-teal{--bg: #e5fbff;--text: #03353c;--panel-bg: #ffffff;--panel-border: #c8f0f6;--shadow: rgba(18, 191, 212, .16);--primary: #12bfd4;--primary-contrast: #ffffff;--muted: #0f4850;--muted-2: #0c4047;--muted-3: #1c5860;--ghost-bg: #ffffff;--ghost-border: #c8f0f6;--link-bg: #def5f8;--coffee-bg: #fff1ce;--backdrop: rgba(8, 145, 178, .3);--modal-shadow: rgba(18, 191, 212, .2);--control-bg: #ffffff;--control-border: #c8f0f6;--control-shadow: rgba(18, 191, 212, .18)}.theme-coral{--bg: #fff1f4;--text: #400c21;--panel-bg: #ffffff;--panel-border: #f9cbd6;--shadow: rgba(246, 80, 113, .16);--primary: #f65071;--primary-contrast: #ffffff;--muted: #7a243a;--muted-2: #6c2034;--muted-3: #8d5665;--ghost-bg: #ffffff;--ghost-border: #f9cbd6;--link-bg: #ffe3ea;--coffee-bg: #ffe7c8;--backdrop: rgba(180, 31, 65, .32);--modal-shadow: rgba(246, 80, 113, .22);--control-bg: #ffffff;--control-border: #f9cbd6;--control-shadow: rgba(246, 80, 113, .18)}.theme-navy{--bg: #0b1325;--text: #e7ecf7;--panel-bg: #0f1c34;--panel-border: #1f2f4f;--shadow: rgba(15, 23, 42, .35);--primary: #4da3ff;--primary-contrast: #0b1325;--muted: #c2cce0;--muted-2: #d7def0;--muted-3: #a4b1c8;--ghost-bg: #152544;--ghost-border: #1f2f4f;--link-bg: #1a2a45;--coffee-bg: #233252;--backdrop: rgba(11, 19, 37, .6);--modal-shadow: rgba(11, 19, 37, .6);--control-bg: #1c2a46;--control-border: #32456a;--control-shadow: rgba(13, 23, 43, .32)}.theme-slate{--bg: #f1f5f9;--text: #0f172a;--panel-bg: #ffffff;--panel-border: #cbd5e1;--shadow: rgba(15, 23, 42, .1);--primary: #596779;--primary-contrast: #ffffff;--muted: #475569;--muted-2: #334155;--muted-3: #64748b;--ghost-bg: #ffffff;--ghost-border: #cbd5e1;--link-bg: #e2e8f0;--coffee-bg: #f1f5f9;--backdrop: rgba(30, 41, 59, .35);--modal-shadow: rgba(30, 41, 59, .16);--control-bg: #ffffff;--control-border: #cbd5e1;--control-shadow: rgba(30, 41, 59, .12)}.theme-dark{--bg: #050507;--text: #e8ecf5;--panel-bg: #0b0f17;--panel-border: #1e2738;--shadow: rgba(5, 7, 10, .45);--primary: #3b82f6;--primary-contrast: #050507;--muted: #c7d0e0;--muted-2: #d2d9eb;--muted-3: #9aa5b8;--ghost-bg: #101827;--ghost-border: #1e2738;--link-bg: #141c2d;--coffee-bg: #1d2535;--backdrop: rgba(5, 7, 10, .7);--modal-shadow: rgba(5, 7, 10, .6);--control-bg: #131c2b;--control-border: #263044;--control-shadow: rgba(0, 0, 0, .45)}.theme-sunset{--bg: #fff4f2;--text: #3a0c0c;--panel-bg: #ffffff;--panel-border: #ffd3ca;--shadow: rgba(255, 107, 107, .16);--primary: #ff6b6b;--primary-contrast: #ffffff;--muted: #7a2f2f;--muted-2: #712727;--muted-3: #9b5b5b;--ghost-bg: #ffffff;--ghost-border: #ffd3ca;--link-bg: #ffe6df;--coffee-bg: #ffe7c3;--backdrop: rgba(190, 24, 24, .28);--modal-shadow: rgba(255, 107, 107, .22);--control-bg: #ffffff;--control-border: #ffd3ca;--control-shadow: rgba(190, 24, 24, .18)}