:root{color-scheme:light dark;--color-bg:#fff7e8;--color-fg:#2e1606;--color-muted:#6b5a4d;--color-surface:#fff;--color-border:#f0e0d0;--color-code-bg:#f3e7da;--color-accent:#8b3d1a;--color-accent-soft:#d9743e;--color-cta-bg:var(--color-accent);--color-cta-bg-hover:var(--color-accent-soft);--space-half:.125rem;--space-one:.25rem;--space-two:.5rem;--space-three:1rem;--space-four:1.5rem;--space-five:2rem;--space-six:4rem;--radius-xs:4px;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-full:999px;--shadow-sm:0 2px 6px #2e16061a;--duration-fast:.12s;--duration-base:.2s;--duration-slow:.32s;--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--font-size-sm:clamp(.85rem, .82rem + .2vw, .95rem);--font-size-h3:clamp(1rem, .95rem + .3vw, 1.125rem);--font-size-h2:clamp(1.25rem, 1.15rem + .5vw, 1.5rem);--font-size-h1:clamp(1.75rem, 1.5rem + 1.2vw, 2.25rem);--max-width:720px;--color-noodle:#fff8c7;--color-noodle-shadow:#ffeaa2}@media (prefers-color-scheme:dark){:root{--color-bg:#17110d;--color-fg:#f5ece0;--color-muted:#c9bcab;--color-surface:#2a2118;--color-border:#3d2f24;--color-code-bg:#3a2c22;--color-accent:#ff8a4c;--color-accent-soft:#ff8a4c;--color-cta-bg:#a8461a;--color-cta-bg-hover:#b8511f;--shadow-sm:0 2px 6px #0000004d}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}details::details-content{transition-duration:.01ms!important}.ramen-hero-steam path{opacity:.42;animation-name:none;transform:none}}@media (prefers-contrast:more){:root{--color-border:var(--color-fg);--color-muted:var(--color-fg)}a{text-decoration-thickness:2px}.card{box-shadow:none;border-width:2px}}*{box-sizing:border-box}body{background:var(--color-bg);color:var(--color-fg);margin:0;font-family:Hiragino Sans,Yu Gothic,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.7}main{max-width:var(--max-width);padding:var(--space-five) var(--space-four) var(--space-six);margin:0 auto}header.site-header{max-width:var(--max-width);padding:var(--space-five) var(--space-four) 0;margin:0 auto}.site-header a{color:inherit;text-decoration:none}h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}h1{font-size:var(--font-size-h1);margin-bottom:var(--space-one)}h2{font-size:var(--font-size-h2);margin-top:var(--space-six);border-bottom:2px solid var(--color-accent-soft);padding-bottom:var(--space-one)}h3{font-size:var(--font-size-h3);margin-top:var(--space-five);margin-bottom:var(--space-two)}a{color:var(--color-accent)}a:focus-visible,button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.subtitle{color:var(--color-muted);font-size:var(--font-size-h3);margin-top:0}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-four) var(--space-five);margin:var(--space-four) 0}.card h2,.card h3{border:none;margin-top:0;padding:0}.card-cta{border-color:var(--color-accent-soft)}.cta-primary{background:var(--color-cta-bg);color:#fff;padding:var(--space-two) var(--space-four);border-radius:var(--radius-full);transition:background-color var(--duration-base) ease;font-weight:600;text-decoration:none;display:inline-block}.cta-primary:hover{background:var(--color-cta-bg-hover)}.cta-primary:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.site-nav{gap:var(--space-three);margin-bottom:var(--space-two);display:flex}.site-nav a{text-decoration:none}.site-nav a[aria-current=page]{color:var(--color-fg);text-decoration:underline;text-decoration-color:var(--color-accent-soft);text-underline-offset:3px;font-weight:600;text-decoration-thickness:2px}details{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);margin:var(--space-three) 0;overflow:hidden}summary{cursor:pointer;padding:var(--space-three) var(--space-four);font-weight:600;list-style:none}summary::-webkit-details-marker{display:none}summary:after{content:"+";float:right;color:var(--color-accent);transition:transform var(--duration-base) ease}details[open] summary:after{transform:rotate(45deg)}details::details-content{interpolate-size:allow-keywords;block-size:0;transition:block-size var(--duration-base) ease, content-visibility var(--duration-base) ease allow-discrete;overflow:hidden}details[open]::details-content{block-size:auto}.faq-answer{padding:0 var(--space-four) var(--space-three);color:var(--color-muted);margin:0}.skip-link{top:-3rem;left:var(--space-three);background:var(--color-cta-bg);color:#fff;padding:var(--space-two) var(--space-three);border-radius:0 0 var(--radius-sm) var(--radius-sm);z-index:10;transition:top var(--duration-base) ease-in-out;position:absolute}.skip-link:focus{top:0}footer.site-footer{max-width:var(--max-width);padding:var(--space-five) var(--space-four) var(--space-six);color:var(--color-muted);font-size:var(--font-size-sm);margin:0 auto}code{background:var(--color-code-bg);padding:var(--space-half) var(--space-one);border-radius:var(--radius-xs)}.noodle-scene{margin:var(--space-five) 0 var(--space-four);justify-content:center;display:flex}.noodle-illustration{width:min(220px,60vw);height:auto}.noodle-bowl{fill:var(--color-surface);stroke:var(--color-accent);stroke-width:3px}.noodle-bowl-rim{fill:none;stroke:var(--color-accent);stroke-width:3px}.noodle-strand{fill:none;stroke:var(--color-noodle);stroke-width:6px;stroke-linecap:round;transform-box:fill-box;transform-origin:50% 0;animation:noodle-droop .9s var(--ease-spring) both}.noodle-strand-2{stroke:var(--color-noodle-shadow);animation-delay:.15s}.noodle-strand-3{animation-delay:.3s}@keyframes noodle-droop{0%{opacity:0;transform:scaleY(.25)}60%{opacity:1;transform:scaleY(1.08)}to{opacity:1;transform:scaleY(1)}}.noodle-actions{text-align:center}.ramen-hero{margin:0 0 var(--space-four);justify-content:center;display:flex}.ramen-hero-illustration{width:min(160px,45vw);height:auto}.ramen-hero-steam path{transform-box:fill-box;transform-origin:50% 100%;opacity:0;animation:2.6s ease-in-out infinite steam-sway}.ramen-hero-steam .steam-2{animation-delay:.6s}.ramen-hero-steam .steam-3{animation-delay:1.2s}@keyframes steam-sway{0%{opacity:.5;transform:translateY(0)translate(0)scaleX(1)}50%{opacity:.26;transform:translateY(-6px)translate(1.4px)scaleX(1.15)}to{opacity:0;transform:translateY(-12px)translate(-1.2px)scaleX(1.3)}}
