:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f7f7f8;--surface:#fff;--text:#1b1b1f;--text-muted:#6b6b76;--border:#e2e2e6;--accent:#4f46e5;--accent-text:#fff;--radius:10px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);margin:0}button{font:inherit;cursor:pointer;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text);padding:.6em 1.2em}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}button:disabled{opacity:.5;cursor:not-allowed}input[type=text],textarea{font:inherit;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:100%;color:var(--text);padding:.6em .8em}.app-shell{max-width:880px;margin:0 auto;padding:1.5rem 1rem 4rem}.app-footer{text-align:center;color:var(--text-muted);margin-top:3rem;padding-bottom:1rem;font-size:.85rem}.app-footer a{color:var(--accent);font-weight:600;text-decoration:none}.app-footer a:hover{text-decoration:underline}.view-toggle{z-index:10;color:var(--text-muted);border:1px solid var(--border);background:var(--surface);opacity:.85;border-radius:999px;align-items:center;gap:.4em;padding:.6em 1.1em;font-size:.85rem;font-weight:600;transition:opacity .18s,transform .18s;display:inline-flex;position:fixed;bottom:1.25rem;right:1.25rem;box-shadow:0 8px 24px -12px #0000004d}.view-toggle:hover{opacity:1;transform:translateY(-1px)}.training-progress{z-index:10;width:min(220px,100vw - 2.5rem);color:var(--text-muted);border:1px solid var(--border);background:var(--surface);opacity:.9;border-radius:14px;padding:.6em .9em;font-size:.72rem;position:fixed;bottom:1.25rem;left:1.25rem;box-shadow:0 8px 24px -12px #0000004d}.training-progress-label{white-space:nowrap;text-overflow:ellipsis;margin-bottom:.4em;overflow:hidden}.training-progress-track{background:var(--border);border-radius:999px;height:5px;overflow:hidden}.training-progress-fill{background:var(--accent);border-radius:inherit;height:100%;transition:width .3s}@media (width<=640px){.training-progress{width:min(180px,100vw - 1.5rem);bottom:.75rem;left:.75rem}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem}.stack{flex-direction:column;gap:1rem;display:flex}.row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.muted{color:var(--text-muted);font-size:.9rem}.progress{color:var(--text-muted);font-size:.85rem}.palette-strip-wrap{border-radius:var(--radius);overflow:hidden}.palette-strip{width:100%;height:320px;margin:0;padding:0;display:flex;overflow:hidden}.palette-strip-slice{flex:1 1 0;height:100%;margin:0;padding:0;position:relative}.palette-strip-input{opacity:0;cursor:pointer;border:none;width:100%;height:100%;margin:0;padding:0;position:absolute;inset:0}.palette-strip-labels{pointer-events:none;flex-direction:row;align-items:flex-start;gap:.4rem;display:flex;position:absolute;top:1rem;left:1rem}.palette-strip-role{writing-mode:vertical-rl;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;opacity:.55;font-size:.7rem;font-weight:500;transform:rotate(180deg)}.palette-strip-label{writing-mode:vertical-rl;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;font-size:1rem;font-weight:600;transform:rotate(180deg)}.suggest-hero,.train-hero{text-align:center;--glow-a:#6c5ce7;--glow-b:#ff7ac6;--glow-c:#4f46e5;flex-direction:column;align-items:center;gap:2.5rem;padding:3rem 1rem 2rem;display:flex;position:relative}.suggest-hero__glow,.train-hero__glow{z-index:-1;pointer-events:none;background:radial-gradient(38% 55% at 18% 25%, color-mix(in srgb, var(--glow-a) 55%, transparent), transparent 70%), radial-gradient(42% 60% at 82% 20%, color-mix(in srgb, var(--glow-b) 55%, transparent), transparent 70%), radial-gradient(50% 60% at 50% 70%, color-mix(in srgb, var(--glow-c) 40%, transparent), transparent 70%);filter:blur(40px)saturate(140%);opacity:.55;height:26rem;transition:opacity .6s;animation:16s ease-in-out infinite alternate glowDrift;position:absolute;inset:-10% -10% auto}@keyframes glowDrift{0%{transform:translate(0,0)scale(1)}to{transform:translate(1.5%,-2%)scale(1.05)}}.suggest-hero__intro,.train-hero__intro{flex-direction:column;align-items:center;gap:.9rem;max-width:46rem;display:flex}.eyebrow{border:1px solid var(--border);background:var(--surface);color:var(--text-muted);letter-spacing:.02em;border-radius:999px;align-items:center;gap:.4em;padding:.3em .9em;font-size:.8rem;font-weight:600;display:inline-flex}.suggest-heading,.train-heading{letter-spacing:-.02em;background:linear-gradient(120deg, var(--glow-a), var(--glow-b) 55%, var(--glow-c));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.05}.suggest-sub{max-width:34rem;font-size:1.05rem}.suggest-disclaimer{color:#d99a2b;max-width:34rem;font-size:.85rem}.shuffle-btn,.cta-btn{color:#fff;background:linear-gradient(120deg, var(--glow-a), var(--glow-c));box-shadow:0 10px 30px -12px color-mix(in srgb, var(--glow-a) 70%, transparent);border:none;border-radius:999px;align-items:center;gap:.6em;padding:.85em 1.8em;font-size:1.05rem;font-weight:700;transition:transform .18s,box-shadow .18s;display:inline-flex}.shuffle-btn:hover:not(:disabled),.cta-btn:hover:not(:disabled){box-shadow:0 14px 34px -10px color-mix(in srgb, var(--glow-a) 75%, transparent);transform:translateY(-2px)scale(1.02)}.shuffle-btn:active:not(:disabled),.cta-btn:active:not(:disabled){transform:translateY(0)scale(.99)}.cta-btn--ghost{color:var(--text);background:var(--surface);border:1px solid var(--border);box-shadow:none}.cta-btn--ghost:hover:not(:disabled){box-shadow:0 8px 20px -14px #00000059}.suggest-result{flex-direction:column;align-items:center;gap:1.1rem;width:100%;animation:.5s cubic-bezier(.16,1,.3,1) paletteReveal;display:flex}@keyframes paletteReveal{0%{opacity:0;transform:translateY(14px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.palette-strip-wrap--hero{width:100%;max-width:60rem;box-shadow:0 24px 60px -24px #00000059}.palette-strip--hero{border-radius:20px;height:22rem}.suggest-result__meta{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;display:flex}.chip{border:1px solid var(--border);background:var(--surface);border-radius:999px;align-items:center;gap:.35em;padding:.4em .9em;font-size:.85rem;font-weight:600;display:inline-flex}.chip--label{color:var(--text);background:color-mix(in srgb, var(--glow-a) 12%, var(--surface));border-color:color-mix(in srgb, var(--glow-a) 35%, var(--border))}.chip--ai{color:#1f7a4d;background:color-mix(in srgb, #1f7a4d 10%, var(--surface));border-color:color-mix(in srgb, #1f7a4d 30%, var(--border))}.chip--procedural{color:var(--text-muted)}.suggest-hint{font-size:.8rem}.palette-strip-slice--clickable{cursor:pointer}.palette-strip-hex{letter-spacing:.02em;opacity:.85;pointer-events:none;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8rem;font-weight:600;position:absolute;bottom:1rem;left:1rem;right:1rem}.progress-track{background:var(--border);border-radius:999px;width:100%;max-width:22rem;height:8px;overflow:hidden}.progress-fill{border-radius:inherit;background:linear-gradient(90deg, var(--glow-a), var(--glow-c));height:100%;transition:width .4s cubic-bezier(.16,1,.3,1)}.train-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;width:100%;max-width:30rem;display:flex}.pill-input{border:1px solid var(--border);background:var(--surface);font:inherit;color:var(--text);border-radius:999px;flex:14rem;padding:.85em 1.4em}.pill-input:focus-visible{outline:2px solid color-mix(in srgb, var(--glow-a) 60%, transparent);outline-offset:2px}.train-card{border:1px solid var(--border);background:var(--surface);border-radius:20px;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:34rem;padding:2rem;display:flex;box-shadow:0 24px 60px -30px #00000040}.train-card textarea{border-radius:16px}.done-icon{color:#fff;background:linear-gradient(120deg, var(--glow-a), var(--glow-c));width:3.4rem;height:3.4rem;box-shadow:0 12px 26px -10px color-mix(in srgb, var(--glow-a) 70%, transparent);border-radius:50%;justify-content:center;align-items:center;font-size:1.6rem;animation:.5s cubic-bezier(.16,1,.3,1) paletteReveal;display:inline-flex}.error-text{color:#c0392b;font-size:.9rem}