:root{--brand-pink:#de6f99;--brand-pink-pale:#f4b7d6;--brand-yellow:#fff8ca;--brand-blue:#9abcf9;--bg:#fdfbf9;--bg-subtle:#f5f1ed;--bg-input:#fff;--border:#e8e0e4;--text:#1a1614;--text-muted:#7a7068;--text-dim:#a89e94;--accent:#de6f99;--accent-hover:#c45a84;--accent-subtle:#fdf2f8;--accent-secondary:#9abcf9;--accent-secondary-hover:#7aa0e0;--highlight:#fff8ca;--text-on-accent:#fff;--text-link:var(--accent);--status-published:#22c55e;--status-published-bg:#86efac26;--hero-glow-pink:#f4b7d64d;--hero-glow-blue:#9abcf933;--font-mono:"SF Mono","Fira Code","Cascadia Code",monospace;--color-input:#93c5fd;--color-output:#86efac;--color-response:#fbbf24;--color-log:#f87171;--color-state:#c4b5fd;--color-error:#f87171;--color-success:#86efac;--color-warning:#b45309;--color-tool:#a78bfa;--bg-tint-input:#eef1f9;--bg-tint-tool:#f1edf8;--bg-tint-success:#ecf5f0;--bg-tint-error:#f9edee;--bg-tint-warning:#fbf0dc}[data-theme=dark]{--bg:#0f0d0c;--bg-subtle:#1a1614;--bg-input:#2a2522;--border:#3d3733;--text:#f5f1ed;--text-muted:#a89e94;--text-dim:#7a7068;--accent:#f4b7d6;--accent-hover:#de6f99;--accent-subtle:#3d1526;--accent-secondary:#9abcf9;--accent-secondary-hover:#b8d0fb;--highlight:#fff8ca;--text-on-accent:#1a1614;--text-link:var(--accent);--status-published:#4ade80;--status-published-bg:#4ade801f;--hero-glow-pink:#de6f9914;--hero-glow-blue:#9abcf90f;--color-warning:#fbbf24;--bg-tint-input:#1c1e26;--bg-tint-tool:#1e1826;--bg-tint-success:#141e18;--bg-tint-error:#261416;--bg-tint-warning:#2a2010}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-moz-text-size-adjust:100%;text-size-adjust:100%;height:100%}body{background:var(--bg);min-height:100dvh;color:var(--text);flex-direction:column;font-family:system-ui,-apple-system,sans-serif;display:flex}button{background:var(--accent);color:var(--text-on-accent);cursor:pointer;border:none;border-radius:6px;padding:8px 16px;font-size:13px;font-weight:500}button:hover{background:var(--accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}a{color:inherit;text-decoration:none}input,textarea{background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:6px;font-family:inherit;font-size:16px}@media (min-width:769px){input,textarea{font-size:14px}}input:focus,textarea:focus{border-color:var(--accent);outline:none}@media (max-width:768px){body:has([data-mobile-bottom-nav]){padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}}