@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap";:root{--bg-ink:#0f221a;--bg-moss:#173326;--surface:#f7f2e9;--surface-soft:#efe7d7;--accent:#b6672d;--accent-strong:#8f4d1f;--text-main:#1f271f;--text-muted:#546052;--shadow:0 28px 68px #0f221a6b, 0 8px 24px #0f221a38;--radius-lg:24px;--radius-md:14px}*{box-sizing:border-box}html,body,#root{min-height:100%}body{color:var(--text-main);background:radial-gradient(circle at 18% 24%, #b6672d47, transparent 45%), radial-gradient(circle at 82% 14%, #efe7d724, transparent 40%), linear-gradient(135deg, var(--bg-ink), var(--bg-moss));margin:0;font-family:Space Grotesk,Avenir Next,sans-serif}.app-shell{place-items:center;min-height:100vh;padding:2rem 1rem;display:grid}.panel{background:linear-gradient(180deg, var(--surface), var(--surface-soft));border-radius:var(--radius-lg);width:min(760px,100%);box-shadow:var(--shadow);border:1px solid #8f4d1f26;padding:2rem;animation:.5s ease-out rise-in}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:var(--accent-strong);margin:0;font-size:.72rem;font-weight:700}h1{margin:.35rem 0 0;font-family:DM Serif Display,Georgia,serif;font-size:clamp(2rem,5vw,3rem);line-height:1}.intro{max-width:62ch;color:var(--text-muted);margin:.95rem 0 1.25rem;line-height:1.6}label{margin-bottom:.45rem;font-weight:600;display:block}input{border-radius:var(--radius-md);width:100%;font:inherit;color:var(--text-main);background:#fffdfa;border:1px solid #54605259;outline:none;padding:.9rem 1rem;transition:border-color .16s,box-shadow .16s}input::placeholder{color:#546052b3}input:focus{border-color:var(--accent);box-shadow:0 0 0 4px #b6672d33}.result-box{border-radius:var(--radius-md);background:#17332612;border:1px dashed #17332657;margin-top:1rem;padding:.9rem 1rem}.result-label{text-transform:uppercase;letter-spacing:.1em;color:var(--accent-strong);margin:0;font-size:.71rem;font-weight:700}.slug-output{word-break:break-all;margin:.4rem 0 0;font-size:clamp(1.05rem,2.6vw,1.35rem);font-weight:600;line-height:1.4}.footnote{color:var(--text-muted);margin:1.1rem 0 0;font-size:.92rem}@keyframes rise-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width<=640px){.panel{border-radius:18px;padding:1.25rem}.intro,.footnote{font-size:.94rem}input,.result-box{padding:.8rem .85rem}}
