:root{color-scheme:dark light;--bg-0:#120608;--bg-1:#1a0a0e;--bg-2:#220e13;--pulse:#ff6b7f;--pulse-bright:#ffb3bd;--warm:#fff1ef;--deep:#4a1420;--text:#fbeceb;--text-soft:#d3a9ad;--text-faint:#9c7379;--panel-bg:rgba(56,22,30,.55);--panel-bg-strong:rgba(44,17,24,.74);--panel-border:rgba(255,179,189,.16);--panel-hi:hsla(0,0%,100%,.12);--hairline:rgba(255,179,189,.11);--shadow-sm:0 1px 2px rgba(0,0,0,.4);--shadow-md:0 12px 34px rgba(0,0,0,.46);--shadow-lg:0 30px 80px rgba(0,0,0,.58);--accent-grad:linear-gradient(120deg,var(--pulse-bright),var(--pulse));--nav-h:3.5rem;--radius:18px;--radius-sm:12px;--maxw:74rem;--ease:cubic-bezier(0.22,0.61,0.36,1);--ease-soft:cubic-bezier(0.4,0,0.2,1)}@media (prefers-color-scheme:light){:root{--bg-0:#fdf2f2;--bg-1:#f8e8e9;--bg-2:#f2dcde;--pulse:#c2314b;--pulse-bright:#e05a74;--warm:#fff;--deep:#7a2233;--text:#331014;--text-soft:#6a3540;--text-faint:#8c5b64;--panel-bg:hsla(0,0%,100%,.62);--panel-bg-strong:hsla(0,0%,100%,.8);--panel-border:rgba(140,50,70,.18);--panel-hi:hsla(0,0%,100%,.88);--hairline:rgba(140,50,70,.14);--shadow-sm:0 1px 2px rgba(90,30,45,.12);--shadow-md:0 12px 30px rgba(90,30,45,.16);--shadow-lg:0 26px 66px rgba(90,30,45,.22);--accent-grad:linear-gradient(120deg,#c2314b,#8f1f36)}}*,:after,:before{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg-1);color:var(--text);font-family:system-ui,sans-serif;line-height:1.6;margin:0;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body:before{background:radial-gradient(110% 85% at 74% -8%,rgba(255,107,127,.18),transparent 55%),radial-gradient(85% 65% at 6% 10%,rgba(190,70,100,.14),transparent 52%),radial-gradient(100% 120% at 50% 118%,rgba(74,20,32,.55),transparent 60%),linear-gradient(180deg,var(--bg-0),var(--bg-1) 42%,var(--bg-2));content:"";inset:0;position:fixed;z-index:-2}@media (prefers-color-scheme:light){body:before{background:radial-gradient(110% 85% at 78% -8%,rgba(224,90,116,.24),transparent 55%),radial-gradient(85% 65% at 5% 8%,rgba(240,150,165,.26),transparent 52%),linear-gradient(180deg,var(--bg-0),var(--bg-1) 45%,var(--bg-2))}}@media (min-width:860px){html{font-size:120%}}img{display:block;height:auto;max-width:100%}a{color:var(--pulse-bright)}code{background:var(--panel-bg);border:1px solid var(--hairline);border-radius:6px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;padding:.1em .42em;white-space:nowrap}.wrap{margin-inline:auto;width:min(100% - 2.5rem,var(--maxw))}.skip-link{background:var(--panel-bg-strong);border-radius:0 0 var(--radius-sm) 0;color:var(--text);left:-999px;padding:.6rem 1rem;position:absolute;top:0;z-index:100}.skip-link:focus{left:0}:focus-visible{border-radius:4px;outline:2px solid var(--pulse);outline-offset:3px}.nav{align-items:center;backdrop-filter:saturate(1.6) blur(18px);-webkit-backdrop-filter:saturate(1.6) blur(18px);background:var(--panel-bg-strong);border-bottom:1px solid var(--hairline);display:flex;height:var(--nav-h);position:sticky;top:0;z-index:50}@media (prefers-reduced-transparency:reduce){.nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--bg-0)}}.nav .wrap{display:flex;gap:1rem;justify-content:space-between}.brand,.nav .wrap{align-items:center}.brand{color:var(--text);display:inline-flex;font-weight:650;gap:.5rem;letter-spacing:-.01em;text-decoration:none;white-space:nowrap}.brand .mark{flex:none;height:1.4rem;width:1.4rem}.nav-links{align-items:center;display:flex;gap:.35rem}.nav-inner-links{display:none;gap:.15rem}@media (min-width:900px){.nav-inner-links{display:inline-flex}}.navlink{border-radius:999px;color:var(--text-soft);font-size:.86rem;padding:.4rem .62rem;text-decoration:none;transition:color .2s var(--ease-soft),background .2s var(--ease-soft)}.navlink:hover{background:var(--panel-bg);color:var(--text)}.lang-switch{align-items:center;border:1px solid var(--panel-border);border-radius:999px;color:var(--text-soft);display:inline-flex;font-size:.78rem;font-weight:650;letter-spacing:.02em;padding:.32rem .62rem;text-decoration:none;transition:color .2s var(--ease-soft),background .2s var(--ease-soft),border-color .2s var(--ease-soft);white-space:nowrap}.lang-switch:hover{background:var(--panel-bg);border-color:var(--panel-hi);color:var(--text)}.hero{padding:clamp(3rem,8vw,6rem) 0 clamp(2rem,5vw,3.5rem)}.hero .wrap{display:grid;gap:clamp(2rem,5vw,3.5rem)}@media (min-width:980px){.hero .wrap{align-items:center;grid-template-columns:1.05fr .95fr}}.badge{align-items:center;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:999px;color:var(--pulse-bright);display:inline-flex;font-size:.76rem;gap:.45rem;letter-spacing:.02em;padding:.3rem .75rem}.badge .dot{animation:beat 1.9s var(--ease-soft) infinite;background:var(--pulse);border-radius:50%;height:.42rem;width:.42rem}@keyframes beat{0%,to{opacity:1;transform:scale(1)}12%{opacity:.75;transform:scale(1.7)}24%{opacity:1;transform:scale(1)}36%{opacity:.8;transform:scale(1.45)}48%{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.badge .dot{animation:none}}h1{background:var(--accent-grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(2.4rem,7vw,4rem);letter-spacing:-.03em;line-height:1.08;margin:1rem 0 .4rem}.jp-name{font-size:1.02rem;letter-spacing:.04em;margin:0 0 1rem}.catch,.jp-name{color:var(--text-soft)}.catch{font-size:1.03rem;margin:0 0 1.4rem;max-width:34em}.hero-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.6rem}.tag{background:var(--panel-bg);border:1px solid var(--hairline);border-radius:999px;color:var(--text-soft);font-size:.76rem;padding:.28rem .7rem}.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem}.btn{align-items:center;border:1px solid transparent;border-radius:999px;display:inline-flex;font-size:.92rem;font-weight:600;gap:.45rem;padding:.68rem 1.25rem;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s var(--ease-soft)}.btn svg{height:1.05em;width:1.05em}.btn-primary{background:var(--accent-grad);box-shadow:var(--shadow-md);color:#2a0a11}.btn-primary:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn-ghost{background:var(--panel-bg);border-color:var(--panel-border);color:var(--text)}.btn-ghost:hover{background:var(--panel-bg-strong)}@media (prefers-reduced-motion:reduce){.btn:hover{transform:none}}.hero-figure{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);box-shadow:var(--shadow-lg);margin:0;padding:clamp(1rem,3vw,1.8rem)}.hero-figure svg{display:block;height:auto;width:100%}.hero-figure figcaption{color:var(--text-faint);font-size:.8rem;line-height:1.5;margin-top:.9rem}.section-pad{padding:clamp(3rem,8vw,5.5rem) 0}.section-alt{background:linear-gradient(180deg,transparent,var(--bg-2) 12%,var(--bg-2) 88%,transparent)}.eyebrow{color:var(--pulse);display:block;font-size:.76rem;letter-spacing:.16em;margin-bottom:.6rem;text-transform:uppercase}.sect-title{font-size:clamp(1.6rem,4vw,2.4rem);letter-spacing:-.02em;line-height:1.2;margin:0 0 .7rem}.sect-lead{color:var(--text-soft);margin:0 0 2.2rem;max-width:44em}.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease)}.reveal.in{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}.feature-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}.card{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.3rem 1.3rem 1.45rem;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease-soft)}.card:hover{border-color:var(--panel-hi);box-shadow:var(--shadow-md);transform:translateY(-3px)}@media (prefers-reduced-motion:reduce){.card:hover{transform:none}}.card .icon{background:linear-gradient(150deg,rgba(255,107,127,.18),rgba(255,107,127,.04));border:1px solid var(--hairline);border-radius:12px;color:var(--pulse-bright);display:grid;height:2.4rem;margin-bottom:.85rem;place-items:center;width:2.4rem}.card .icon svg{height:1.3rem;width:1.3rem}.card h3{font-size:1.02rem;letter-spacing:-.01em;margin:0 0 .4rem}.card p{color:var(--text-soft);font-size:.9rem;margin:0}.steps{counter-reset:step;display:grid;gap:.9rem}.step{align-items:start;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);display:grid;gap:1rem;grid-template-columns:2.4rem 1fr;padding:1.15rem 1.3rem}.step:before{background:var(--accent-grad);border-radius:50%;color:#2a0a11;content:counter(step);counter-increment:step;display:grid;font-size:.95rem;font-weight:700;height:2.4rem;place-items:center;width:2.4rem}.step h3{font-size:1rem;margin:.3rem 0 .35rem}.step p{color:var(--text-soft);font-size:.9rem;margin:0}.step p+p{margin-top:.5rem}.note{background:var(--panel-bg);border-left:3px solid var(--pulse);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--text-soft);font-size:.88rem;margin-top:1.2rem;padding:.9rem 1.1rem}.note strong{color:var(--text)}.table-scroll{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);overflow-x:auto;-webkit-overflow-scrolling:touch}table{border-collapse:collapse;font-size:.88rem;min-width:40rem;width:100%}caption{color:var(--text-faint);font-size:.82rem;padding:.9rem 1.1rem 0}caption,td,th{text-align:left}td,th{border-bottom:1px solid var(--hairline);padding:.7rem 1.1rem;vertical-align:top}thead th{background:var(--panel-bg-strong);color:var(--text);font-size:.82rem;font-weight:650;letter-spacing:.02em;position:sticky;top:0}tbody tr:last-child td,tbody tr:last-child th{border-bottom:0}tbody th{color:var(--text);font-weight:600;white-space:nowrap}td{color:var(--text-soft)}.sound-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));margin-bottom:1.6rem}.sound{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);padding:1.25rem 1.3rem 1.4rem}.sound .name{align-items:center;display:flex;font-size:.98rem;font-weight:650;gap:.5rem;margin-bottom:.15rem}.sound .sub{color:var(--pulse);font-size:.82rem;margin-bottom:.7rem}.sound p{color:var(--text-soft);font-size:.88rem;margin:0 0 .9rem}.sound dl{display:grid;font-size:.82rem;gap:.28rem .8rem;grid-template-columns:auto 1fr;margin:0}.sound dt{color:var(--text-faint);white-space:nowrap}.sound dd{color:var(--text-soft);margin:0}.default-chip{background:var(--accent-grad);border-radius:999px;color:#2a0a11;font-size:.68rem;font-weight:700;letter-spacing:.02em;padding:.12rem .5rem}.diagram{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius);overflow-x:auto;padding:clamp(1rem,3vw,1.7rem)}.diagram svg{display:block;height:auto;min-width:34rem;width:100%}.notes-list{display:grid;gap:.8rem}.note-item{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);display:grid;gap:.9rem;grid-template-columns:1.6rem 1fr;padding:1rem 1.15rem}.note-item svg{color:var(--pulse);height:1.3rem;margin-top:.1rem;width:1.3rem}.note-item h3{font-size:.96rem;margin:0 0 .3rem}.note-item p{color:var(--text-soft);font-size:.88rem;margin:0}@media (prefers-contrast:more){.card,.diagram,.hero-figure,.note-item,.sound,.step,.table-scroll{border-color:var(--text-soft)}}footer{background:var(--bg-0);border-top:1px solid var(--hairline);padding:2.6rem 0 3.2rem}.f-brand{font-weight:650;margin-bottom:.4rem}.f-meta{color:var(--text-faint);font-size:.85rem;margin:0 0 1.2rem;max-width:46em}.f-links{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;margin-bottom:1.2rem}.f-links a{color:var(--text-soft);font-size:.86rem;text-decoration:none}.f-links a:hover{color:var(--text);text-decoration:underline}.credit{color:var(--text-faint);font-size:.8rem;margin:0}