:root{color-scheme:light;font-family:Space Grotesk,Avenir,Segoe UI,sans-serif;background:radial-gradient(circle at 20% 20%,rgba(38,90,120,.2),transparent 55%),radial-gradient(circle at 80% 10%,rgba(120,77,149,.18),transparent 60%),linear-gradient(135deg,#0b0c10,#111827 45%,#0f172a);color:#e5e7eb}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,textarea{font-family:inherit}.page{min-height:100vh;padding:3rem clamp(1.5rem,4vw,4rem)}.shell{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:clamp(1.5rem,3vw,3rem);align-items:start}.menu{background:#0f172aa6;border:1px solid rgba(148,163,184,.2);border-radius:24px;padding:2rem;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 30px 60px #0206178c}.menu-header h1{margin:0 0 1.5rem;font-size:1.6rem}.menu-item{width:100%;padding:.85rem 1rem;border-radius:16px;border:1px solid transparent;background:transparent;color:inherit;text-align:left;font-weight:600;cursor:pointer}.menu-item.is-active{background:#38bdf81f;border-color:#38bdf859}.panel{background:#ffffff0a;border:1px solid rgba(148,163,184,.2);border-radius:32px;padding:2.5rem;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 40px 90px #0f172a8c}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.panel-header h2{margin:.4rem 0 0;font-size:clamp(1.6rem,2.5vw,2.3rem)}.tag{padding:.35rem .75rem;border-radius:999px;border:1px solid rgba(148,163,184,.35);font-size:.75rem;text-transform:uppercase;letter-spacing:.12em}.panel-body{display:grid;gap:1.5rem}.field{display:grid;gap:.6rem;font-size:.9rem;color:#cbd5f5}textarea{background:#0f172aa6;border:1px solid rgba(148,163,184,.3);border-radius:16px;padding:1rem;color:#e2e8f0;resize:vertical;min-height:120px}textarea:focus{outline:2px solid rgba(56,189,248,.7);border-color:transparent}.actions{display:flex;flex-wrap:wrap;gap:.75rem}.primary,.ghost,.copy{border-radius:999px;padding:.7rem 1.6rem;border:1px solid transparent;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.primary{background:linear-gradient(120deg,#38bdf8,#6366f1);color:#0b1120;box-shadow:0 10px 30px #38bdf859}.ghost{background:#0f172acc;border-color:#94a3b866;color:#e2e8f0}.primary:hover,.ghost:hover,.copy:hover{transform:translateY(-1px)}.feedback{padding:.75rem 1rem;border-radius:12px;background:#0f172acc;border:1px solid rgba(148,163,184,.2);color:#a7f3d0}.feedback.error{color:#fecaca;border-color:#f8717166;background:#7f1d1d33}.output{position:relative}.copy{position:absolute;right:1rem;top:1rem;background:#0f172ad9;border-color:#94a3b866;color:#e2e8f0;padding:.35rem .9rem;font-size:.8rem}.copy:disabled{opacity:.5;cursor:not-allowed;transform:none}.eyebrow{letter-spacing:.2em;font-size:.7rem;text-transform:uppercase;color:#94a3b8;margin:0}@media (max-width: 900px){.shell{grid-template-columns:1fr}}