/* Frame Medic · styles.css
   One stylesheet for the whole site, cached once for every page.
   Each page sets classes on <html>: "fm" plus p-home, p-docs or p-legal.
   Rules are scoped to the pages that use them: .p-home …, :is(.p-home,.p-legal) … when two pages share a rule,
   .fm … when all three do (media-query overrides stay with their own page, after its base rules).
   Titles use Panchang; text uses Arial, like mpmstudiosolver.com. */

/* ---------- Fonts: Panchang (Fontshare, FFL licence), titles only ---------- */
@font-face { font-family:Panchang; src:url('assets/fonts/Panchang-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:Panchang; src:url('assets/fonts/Panchang-Medium.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:Panchang; src:url('assets/fonts/Panchang-Semibold.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:Panchang; src:url('assets/fonts/Panchang-Bold.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:Panchang; src:url('assets/fonts/Panchang-Extrabold.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }

/* ---------- Animations ---------- */
@keyframes jiggle { 25% { transform:translate(2px,-1px) rotate(-1deg); } 50% { transform:translate(-2px,1px) rotate(1deg); } 75% { transform:translate(1px,1px); } }
@keyframes fill { to { width:100%; } }
@keyframes pop { from { transform:scale(0) rotate(-30deg); } }
@keyframes burst { to { transform:translate(var(--dx),var(--dy)) rotate(200deg); opacity:0; } }
@keyframes bump { 40% { transform:scale(1.12) rotate(-2deg); } }

/* ======================================================================
   Home page (index.html)
   ====================================================================== */

/* Layout: MPM Studio Solver's frame (rules, split hero, ruled rows) with a toy viewport in the middle of the page. */
:root.p-home { --bg:#1c1c1c; --surface:#232123; --surface-2:#2a272a; --ink:#f4eef1; --muted:#c3b9be; --dim:#978d92; --line:#ffffff1f; --pink:#ff2e9b; --pink-hi:#ff7cc0; --violet:#5d00ff; --violet-hi:#b49cff; --blue:#0019ff; --lime:#ceff05; --on:#1c1c1c; --on-pink:#ffffff; --f-brand:Panchang,'Arial Black',Arial,sans-serif; --f-text:Arial,Helvetica,sans-serif; --f-small:Arial,Helvetica,sans-serif; --f-mono:Arial,Helvetica,sans-serif; --gut:56px; color-scheme:dark; }
html.fm, .fm * { box-sizing:border-box; }
.fm [hidden] { display:none !important; }
html.p-home { scroll-behavior:smooth; scroll-padding-top:40px; }
.p-home body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--f-text); font-weight:400; font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased; isolation:isolate; }
.fm a { color:inherit; text-decoration:none; }
:is(.p-home,.p-legal) button { font:inherit; color:inherit; }
.p-home a:focus-visible, .p-home button:focus-visible, .p-home summary:focus-visible, .p-home figure:focus-visible { outline:2px solid var(--pink); outline-offset:6px; }
.fm ::selection { background:var(--pink); color:var(--on-pink); }
:is(.p-home,.p-legal) .ambient { position:fixed; inset:0; pointer-events:none; z-index:-1; }
@media (max-width:700px) {
  .p-home .ambient { display:none; }
}
:is(.p-home,.p-legal) .ambient canvas { position:absolute; inset:0; width:100%; height:100%; image-rendering:pixelated; }
:is(.p-home,.p-legal) .wrap { width:min(1240px,100%); margin-inline:auto; padding-left:max(var(--gut), env(safe-area-inset-left,0px)); padding-right:max(var(--gut), env(safe-area-inset-right,0px)); }
:is(.p-home,.p-legal) .rule { position:relative; }
:is(.p-home,.p-legal) .rule::before { content:""; position:absolute; top:0; left:max(var(--gut), env(safe-area-inset-left,0px)); right:max(var(--gut), env(safe-area-inset-right,0px)); border-top:1px solid var(--line); }

/* header */
:is(.p-home,.p-legal) .header { min-height:124px; display:flex; align-items:center; justify-content:space-between; gap:30px; position:relative; }
:is(.p-home,.p-legal) .header::after { content:""; position:absolute; left:max(var(--gut), env(safe-area-inset-left,0px)); right:max(var(--gut), env(safe-area-inset-right,0px)); bottom:0; border-bottom:1px solid var(--line); }
:is(.p-home,.p-legal) .brand-group { display:flex; flex-direction:column; gap:10px; align-items:flex-start; flex-shrink:0; }
:is(.p-home,.p-legal) .brand { display:block; line-height:0; transition:transform .25s cubic-bezier(.3,1.6,.5,1); }
:is(.p-home,.p-legal) .brand:hover { transform:rotate(-2deg) scale(1.03); }
:is(.p-home,.p-legal) .brand img { display:block; width:226px; height:auto; }
:is(.p-home,.p-legal) .studio-credit { font-family:var(--f-small); color:var(--dim); font-size:12px; line-height:1.2; }
:is(.p-home,.p-legal) .studio-credit strong { color:var(--ink); font-weight:600; }
:is(.p-home,.p-legal) .studio-credit:hover strong { color:var(--pink); }
.p-home nav { display:flex; gap:26px; align-items:center; font-family:var(--f-brand); font-weight:600; font-size:10px; line-height:1.2; }
.p-home nav a { position:relative; }
.p-home nav > a:not(.nav-cta):not(.nav-doc)::after { content:""; position:absolute; left:0; right:100%; bottom:-6px; height:3px; background:var(--pink); transition:right .25s; }
.p-home nav > a:not(.nav-cta):not(.nav-doc):hover::after { right:0; }
:is(.p-home,.p-legal) .nav-doc { border:1px solid var(--violet); padding:13px 18px; }
:is(.p-home,.p-legal) .nav-doc:hover { border-color:var(--violet-hi); color:#ddd2ff; }
.p-home .nav-cta { padding:13px 18px; }

/* hero */
.p-home .hero { padding-block:84px 84px; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:44px; align-items:center; }
.p-home .hero-copy { min-width:0; }
.p-home .hero h1 { margin:0 0 30px; font-family:var(--f-brand); font-size:clamp(30px,3.6vw,50px); font-weight:700; line-height:1.17; letter-spacing:-.045em; text-wrap:balance; }
.p-home .hero h1 em { color:var(--pink); font-style:normal; display:inline-block; }
.p-home .hero h1 em:hover { animation:jiggle .5s steps(4) 1; }
.p-home .hero-platforms { margin:-6px 0 22px; font-family:var(--f-brand); font-weight:600; font-size:clamp(12px,1.15vw,15px); line-height:1.7; letter-spacing:-.03em; }
.p-home .hero-platforms span { color:var(--dim); margin-inline:4px; }
.p-home .hero-platforms mark { display:inline-block; padding:1px 5px 2px; background:var(--pink); color:var(--on-pink); line-height:1.65; }
.p-home .intro { max-width:640px; margin:0; color:#d2c8cd; font-size:18px; line-height:1.7; }
.p-home .actions { margin-top:32px; display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.p-home .slogan { margin:26px 0 0; font-family:var(--f-brand); font-weight:600; font-size:11px; letter-spacing:.01em; color:var(--dim); }
.p-home .slogan b { color:var(--lime); font-weight:600; }
.p-home .hero-emblem { margin:0; width:100%; max-width:500px; justify-self:end; position:relative; aspect-ratio:1; cursor:grab; }
.p-home .hero-emblem:active { cursor:grabbing; }
.p-home .hero-emblem canvas { position:absolute; inset:0; width:100%; height:100%; display:block; opacity:0; transition:opacity .6s; }
.p-home .hero-emblem .emblem-fallback { position:absolute; inset:15%; width:70%; height:70%; object-fit:contain; filter:drop-shadow(0 30px 60px rgba(255,46,155,.3)); }
.p-home .logo-ready canvas { opacity:1; }
.p-home .logo-ready .emblem-fallback { visibility:hidden; }
.p-home .spin-hint { position:absolute; right:6%; bottom:2%; font-family:var(--f-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); transition:color .2s; }
.p-home .hero-emblem:hover .spin-hint { color:var(--pink-hi); }

/* buttons */
.p-home .button { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:17px 23px; border:0; font-family:var(--f-brand); font-size:11px; font-weight:600; line-height:1.2; cursor:pointer; transition:transform .15s; }
.p-home .button:active { transform:translateY(2px); }
.p-home .primary { background:var(--pink); color:var(--on-pink); }
.p-home .primary:hover { background:var(--pink-hi); }
.p-home .ghost { border:1px solid #6e6468; background:transparent; }
.p-home .ghost:hover { border-color:var(--pink); color:var(--pink-hi); }
.p-home .button:disabled { opacity:.6; cursor:progress; }
.p-home .glitch-cta { position:relative; overflow:hidden; isolation:isolate; }
.p-home .glitch-cta.nav-cta { background:var(--pink); color:var(--on-pink); }
.p-home .cta-label { position:relative; z-index:2; }
.p-home .cta-pixels { position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; }
.p-home .pixel-ready .cta-label { color:transparent; }

/* sections */
.p-home .section { padding-block:70px 76px; }
.p-home h2 { max-width:940px; margin:0; font-family:var(--f-brand); font-size:clamp(22px,2.5vw,32px); font-weight:700; line-height:1.3; letter-spacing:-.045em; text-wrap:balance; }
.p-home h3 { margin:0 0 12px; font-family:var(--f-brand); font-size:15px; line-height:1.6; letter-spacing:-.02em; font-weight:600; }
.p-home .section-intro { max-width:740px; margin:22px 0 40px; color:var(--muted); font-size:16px; line-height:1.75; }
.p-home .highlight { background:var(--pink); color:var(--on-pink); padding:1px 5px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.p-home .features article { display:grid; grid-template-columns:1fr 1.7fr; gap:60px; padding:26px 0; border-top:1px solid var(--line); }
.p-home .features h3 { margin:0; }
.p-home .features h3 mark { display:inline-block; padding:3px 7px; transition:transform .2s cubic-bezier(.3,1.8,.5,1), box-shadow .2s; }
.p-home .features article:hover h3 mark { transform:rotate(-2.5deg) translateY(-2px); box-shadow:4px 4px 0 var(--blue); }
.p-home .features article:nth-child(1) h3 mark { background:var(--pink); color:var(--on-pink); }
.p-home .features article:nth-child(2) h3 mark { background:var(--violet); color:#fff; }
.p-home .features article:nth-child(3) h3 mark { background:var(--lime); color:var(--on); }
.p-home .features p, .p-home .compute-summary p, .p-home .perf-details p, .p-home .workflow-list p { margin:0; color:var(--muted); font-size:15px; line-height:1.75; }
.p-home .after-note { max-width:740px; margin:28px 0 0; color:var(--muted); font-size:15px; line-height:1.75; }
.p-home .perf-grid { display:grid; grid-template-columns:1fr 1.7fr; gap:60px; }
.p-home .compute-summary { padding-right:25px; }
.p-home .perf-details article { padding:24px 0; border-top:1px solid var(--line); }
.p-home .perf-details article:first-child { padding-top:0; border-top:0; }
.p-home .perf-details article:last-child { padding-bottom:0; }
.p-home .note { font-family:var(--f-small); color:var(--dim); font-size:13px; line-height:1.75; }

/* toy viewport */
.p-home .toy-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:28px; align-items:stretch; }
.p-home .toy { position:relative; border:1px solid #1d1d1d; border-radius:8px; overflow:hidden; background:#1d1d1d; display:flex; flex-direction:column; min-height:400px; }
.p-home .toy-bar { display:flex; align-items:center; gap:4px; padding:5px 8px; background:#303030; border-bottom:1px solid #1d1d1d; font-family:var(--f-small); font-size:11.5px; line-height:1.3; color:#e5e5e5; }
.p-home .toy-bar > span { white-space:nowrap; }
.p-home .bl-spacer { flex:1; }
.p-home .bl-shade-label { font-size:11px; color:#a8a8a8; margin-right:6px; }
.p-home .bl-shading { display:inline-flex; background:#282828; border:1px solid #3a3a3a; border-radius:5px; overflow:hidden; }
.p-home .bl-shading button { width:30px; height:24px; display:grid; place-items:center; border:0; background:transparent; cursor:pointer; padding:0; }
.p-home .bl-shading button + button { border-left:1px solid #3a3a3a; }
.p-home .bl-shading button:hover { background:#454545; }
.p-home .bl-shading button.on { background:#4772b3; }
.p-home .bl-shading i { width:12px; height:12px; border-radius:50%; display:block; position:relative; }
.p-home .sh-wire { border:1.5px solid #e0e0e0; }
.p-home .sh-wire::after { content:""; position:absolute; inset:-1.5px 3px; border:1.5px solid #e0e0e0; border-radius:50%; }
.p-home .sh-solid { background:radial-gradient(circle at 35% 35%,#fff,#a8a8a8 70%); }
.p-home .sh-mat { background:conic-gradient(#ff7cc0 0 25%,#f0f0f0 0 50%,#ff7cc0 0 75%,#f0f0f0 0); }
.p-home .sh-ren { background:radial-gradient(circle at 35% 30%,#fff 0 14%,#9a9a9a 32%,#2a2a2a 75%); }
.p-home .toy-relief { padding:3px 8px; border-radius:4px; background:#282828; border:1px solid #3a3a3a; font-family:var(--f-mono); font-size:10px; letter-spacing:0.028em; color:#9a9a9a; transition:background .3s,color .3s; }
.p-home .toy-relief.on { background:var(--pink); color:var(--on-pink); }
.p-home .toy-stage { position:relative; flex:1; min-height:300px; overflow:hidden; }
.p-home #toy-canvas, .p-home #toy-gl { position:absolute; inset:0; width:100%; height:100%; display:block; }
.p-home #toy-gl { opacity:0; transition:opacity .4s; }
.p-home .gl-ready #toy-gl { opacity:1; }
.p-home .gl-ready #toy-canvas { visibility:hidden; }
.p-home .bl-text { position:absolute; left:12px; top:10px; display:flex; flex-direction:column; font-family:var(--f-small); font-size:11.5px; line-height:1.45; color:#e6e6e6; text-shadow:0 1px 2px rgba(0,0,0,.7); pointer-events:none; }
.p-home .bl-text [data-stats] { margin-top:6px; }
.p-home .bl-fps { color:#e6e6e6; }
.p-home .bl-fps.slow { color:#ff4d4d; }
.p-home .bl-fps.meh { color:#ffd84d; }
.p-home .bl-hint { position:absolute; left:12px; bottom:12px; padding:4px 8px; background:rgba(29,29,29,.8); border-radius:4px; font-family:var(--f-small); font-size:11px; color:#d0d0d0; pointer-events:none; transition:opacity .4s; }
.p-home .bl-hint.gone { opacity:0; }
.p-home .hint-touch { display:none; }
@media (hover:none) {
  .p-home .hint-desk { display:none; }
  .p-home .hint-touch { display:inline; }
}
.p-home #toy-gl { cursor:grab; touch-action:none; }
.p-home #toy-gl:active { cursor:grabbing; }
.p-home .bl-timeline { background:#282828; border-top:1px solid #1d1d1d; font-family:var(--f-small); font-size:11px; color:#d0d0d0; user-select:none; }
.p-home .bl-transport { display:flex; align-items:center; gap:6px; padding:4px 8px; border-bottom:1px solid #1d1d1d; background:#303030; }
.p-home .bl-transport button { min-width:26px; height:22px; border:1px solid #3a3a3a; border-radius:4px; background:#282828; color:#e5e5e5; font-size:10px; cursor:pointer; }
.p-home .bl-transport button:hover { background:#454545; }
.p-home .bl-transport button[data-play] { background:#4772b3; border-color:#4772b3; }
.p-home .bl-cur { min-width:38px; padding:2px 8px; border-radius:4px; background:#1d1d1d; font-family:var(--f-mono); text-align:center; }
.p-home .bl-range { margin-left:auto; color:#9a9a9a; }
.p-home .bl-ruler { position:relative; height:34px; margin:0 14px; cursor:ew-resize; touch-action:none; }
.p-home .bl-ruler .tick { position:absolute; top:0; bottom:0; width:1px; background:#3c3c3c; font-family:var(--f-mono); font-size:9px; color:#8a8a8a; text-indent:4px; line-height:14px; }
.p-home .bl-ruler .tick.minor { background:#333; }
.p-home .bl-ruler .key { position:absolute; top:19px; width:7px; height:7px; margin-left:-3.5px; background:#e5c900; border:1px solid #111; transform:rotate(45deg); }
.p-home .bl-playhead { position:absolute; top:0; bottom:0; left:0; width:2px; margin-left:-1px; background:#4772b3; z-index:2; pointer-events:none; }
.p-home .bl-playhead span { position:absolute; top:0; left:50%; transform:translateX(-50%); min-width:26px; padding:1px 5px; background:#4772b3; border-radius:4px; font-family:var(--f-mono); font-size:10px; color:#fff; text-align:center; }
.p-home .bl-relief { color:#ffb8dc; }
.p-home .toy[data-state=healed] .bl-relief { color:var(--lime); }
.p-home .bl-gizmo { position:absolute; right:10px; top:10px; width:60px; height:60px; pointer-events:none; }
.p-home .toy-hud { position:absolute; right:12px; bottom:12px; display:flex; gap:8px; }
.p-home .vital-box { min-width:96px; padding:8px 12px; background:rgba(20,19,20,.82); border:1px solid #3a3438; transition:border-color .3s; }
.p-home .vital-box small { display:block; font-family:var(--f-mono); font-size:9.5px; letter-spacing:0.049em; color:var(--dim); line-height:1.5; }
.p-home .vital-box b { display:block; font-family:var(--f-mono); font-size:26px; line-height:1.15; font-variant-numeric:tabular-nums; }
.p-home .toy[data-health=bad] .vital-box b { color:var(--pink); }
.p-home .toy[data-health=ok] .vital-box b { color:var(--ink); }
.p-home .toy[data-health=good] .vital-box b { color:var(--lime); }
.p-home .toy[data-health=good] .vital-box { border-color:#6d8a00; }
.p-home .toy-line { height:58px; border-top:1px solid #1d1d1d; background:#1c1c1c; position:relative; }
.p-home #toy-line { position:absolute; inset:0; width:100%; height:100%; }
.p-home .toy-panel { position:relative; display:flex; flex-direction:column; gap:18px; padding:24px; border:1px solid var(--line); background:rgba(28,28,28,.86); backdrop-filter:blur(6px); }
.p-home .toy-panel h3 { font-size:16px; margin:0; }
.p-home .toy-panel p { margin:0; color:var(--muted); font-size:14px; line-height:1.7; }
.p-home .heal-steps { list-style:none; margin:0; padding:0; display:grid; gap:2px; counter-reset:s; }
.p-home .heal-steps li { counter-increment:s; position:relative; display:flex; gap:12px; align-items:center; padding:9px 10px; font-size:13px; line-height:1.4; color:var(--dim); background:#211f21; overflow:hidden; }
.p-home .heal-steps li::before { content:counter(s,decimal-leading-zero); font-family:var(--f-mono); font-size:10.5px; color:#6e6468; width:20px; flex-shrink:0; }
.p-home .heal-steps li::after { content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--pink); }
.p-home .heal-steps li.run { color:var(--ink); }
.p-home .heal-steps li.run::after { animation:fill .8s linear forwards; }
.p-home .heal-steps li.ok { color:var(--ink); }
.p-home .heal-steps li.ok::before { content:"✓"; color:var(--lime); font-size:13px; animation:pop .35s cubic-bezier(.3,1.8,.5,1); }
.p-home .heal-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:auto; }
.p-home .heal-result { padding:14px 16px; background:#1d2400; border:1px solid #6d8a00; animation:pop .4s cubic-bezier(.3,1.6,.5,1); }
.p-home .heal-result b { font-family:var(--f-mono); font-size:22px; color:var(--lime); font-variant-numeric:tabular-nums; }
.p-home .heal-result small { display:block; font-family:var(--f-small); color:var(--muted); font-size:12.5px; margin-top:2px; }
.p-home .px { position:absolute; width:8px; height:8px; pointer-events:none; animation:burst .85s cubic-bezier(.2,.7,.3,1) forwards; }
.p-home .toy-note { margin:16px 0 0; }

/* measured strip */
.p-home .vitals { margin-top:44px; border:1px solid var(--line); background:rgba(28,28,28,.82); display:grid; grid-template-columns:auto minmax(0,1fr) auto; }
.p-home .vital { padding:20px 24px; display:flex; flex-direction:column; gap:6px; justify-content:center; }
.p-home .vital-label { font-family:var(--f-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); line-height:1.4; }
.p-home .vital-value { font-family:var(--f-mono); font-weight:700; font-size:30px; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.1; }
.p-home .vital-value small { font-size:13px; font-weight:400; color:var(--dim); margin-left:4px; }
.p-home .vital.before .vital-value { color:var(--pink); }
.p-home .vital.after .vital-value { color:var(--lime); }
.p-home .vital + .vital-trace, .p-home .vital-trace + .vital { border-left:1px solid var(--line); }
.p-home .vital-trace { position:relative; min-height:96px; }
.p-home .vital-trace canvas { position:absolute; inset:0; width:100%; height:100%; }
.p-home .vitals-caption { margin:14px 0 0; }
.p-home .workflow-list { display:grid; grid-template-columns:repeat(3,1fr); gap:42px; }
.p-home .workflow-list h3::before { content:""; display:block; width:13px; height:13px; margin-bottom:14px; background:var(--pink); border-radius:3px; transition:transform .4s cubic-bezier(.3,1.6,.5,1), background .2s; }
.p-home .workflow-list article:hover h3::before { transform:rotate(225deg) scale(1.3); background:var(--lime); }

/* availability */
.p-home .availability { padding-block:65px 40px; }
.p-home .availability-grid { display:grid; grid-template-columns:1.4fr 1fr; gap:60px; align-items:start; }
.p-home .availability h2 { font-size:clamp(22px,2.3vw,30px); }
.p-home .release-label { margin:18px 0 0; color:var(--muted); font-size:15px; line-height:1.6; }
.p-home .release-label b { color:var(--ink); font-weight:600; }
.p-home .licences { margin-top:40px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.p-home .licence { padding:22px 22px 6px 0; transition:background .2s; }
.p-home .licence + .licence { padding-left:22px; border-left:1px solid var(--line); }
.p-home .licence:hover { background:linear-gradient(180deg,rgba(255,46,155,.07),transparent 70%); }
.p-home .licence h3 { font-size:14px; margin-bottom:8px; }
.p-home .licence h3 span { font-family:var(--f-mono); font-weight:400; font-size:10px; letter-spacing:0.042em; color:var(--pink); margin-left:6px; vertical-align:1px; }
.p-home .licence ul { margin:0; padding:0; list-style:none; color:var(--muted); font-size:14px; line-height:1.7; }
.p-home .licence li { padding-left:16px; text-indent:-16px; }
.p-home .licence li::before { content:"+ "; display:inline-block; width:16px; text-indent:0; color:var(--pink); font-family:var(--f-mono); }
.p-home .availability-grid .note { max-width:350px; margin-bottom:0; }
.p-home .requirements { margin-top:45px; border-top:1px solid var(--line); }
.p-home .requirements summary { padding:22px 0; cursor:pointer; list-style:none; font-size:14px; display:flex; justify-content:space-between; gap:20px; }
.p-home .requirements summary::-webkit-details-marker { display:none; }
.p-home .requirements summary span { color:var(--pink); font-size:18px; transition:transform .25s; }
.p-home .requirements[open] summary span { transform:rotate(45deg); }
.p-home .requirements-content { max-width:900px; padding-bottom:15px; }
.p-home .requirements-content p { font-size:14px; line-height:1.8; color:var(--muted); }
.p-home .requirements-content strong { color:var(--ink); font-weight:600; }
.p-home footer { padding-block:28px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; font-family:var(--f-small); color:var(--dim); font-size:13px; }
:is(.p-home,.p-legal) footer a:hover { color:var(--ink); }
.p-home footer .sib a { color:var(--ink); }
.p-home footer .sib a:hover { color:var(--lime); }
.p-home .foot-links { display:flex; gap:22px; }
:is(.p-home,.p-legal) .skip { position:fixed; top:-100px; left:20px; padding:15px; background:var(--pink); color:var(--on-pink); z-index:5; }
:is(.p-home,.p-legal) .skip:focus { top:15px; }

/* rank chip */
.p-home .rank-chip { position:fixed; z-index:20; right:max(18px, calc(env(safe-area-inset-right,0px) + 12px)); bottom:max(18px, calc(env(safe-area-inset-bottom,0px) + 12px)); display:flex; align-items:center; gap:10px; padding:9px 12px; background:rgba(20,19,20,.9); border:1px solid #3a3438; backdrop-filter:blur(8px); font-family:var(--f-mono); font-size:10px; letter-spacing:.1em; color:var(--dim); text-transform:uppercase; }
.p-home .rank-chip .rank-name { color:var(--ink); }
.p-home .rank-chip.max .rank-name { color:var(--lime); }
.p-home .pips { display:flex; gap:3px; }
.p-home .pip { width:7px; height:7px; background:#3a3438; transition:background .3s; }
.p-home .pip.on { background:var(--pink); }
.p-home .rank-chip.max .pip.on { background:var(--lime); }
.p-home .rank-chip.bump { animation:bump .5s cubic-bezier(.3,1.8,.5,1); }
.p-home .rank-toast { position:fixed; z-index:21; right:max(18px, calc(env(safe-area-inset-right,0px) + 12px)); bottom:max(66px, calc(env(safe-area-inset-bottom,0px) + 60px)); width:min(300px,calc(100vw - 36px)); padding:12px 14px; background:var(--bg); border:1px solid var(--pink); box-shadow:5px 5px 0 var(--pink); opacity:0; transform:translateY(10px); transition:opacity .25s, transform .3s cubic-bezier(.3,1.6,.5,1); }
.p-home .rank-toast.show { opacity:1; transform:none; }
.p-home .rank-toast[data-tone=lime] { border-color:var(--lime); box-shadow:5px 5px 0 var(--lime); }
.p-home .rank-toast[data-tone=blue] { border-color:var(--blue); box-shadow:5px 5px 0 var(--blue); }
.p-home .rank-toast b { display:block; font-family:var(--f-brand); font-size:11.5px; font-weight:700; line-height:1.4; }
.p-home .rank-toast span { display:block; font-family:var(--f-small); font-size:13px; color:var(--muted); line-height:1.5; margin-top:2px; }
@media (max-width:1000px) {
  :root.p-home { --gut:32px; }
  .p-home nav { gap:18px; }
  .p-home nav > a:not(.nav-cta):not(.nav-doc) { display:none; }
  .p-home .features article, .p-home .perf-grid { grid-template-columns:1fr 1.5fr; gap:36px; }
  .p-home .workflow-list { gap:28px; }
  .p-home .toy-grid { grid-template-columns:1fr; }
}
@media (max-width:900px) {
  .p-home .hero { grid-template-columns:1fr; gap:30px; }
  .p-home .hero-emblem { width:min(72%,380px); justify-self:center; order:-1; }
  .p-home .vitals { grid-template-columns:1fr 1fr; }
  .p-home .vital-trace { grid-column:1 / -1; grid-row:2; border-top:1px solid var(--line); border-left:0 !important; }
  .p-home .vital.after { border-left:1px solid var(--line); }
  .p-home .licences { grid-template-columns:1fr; }
  .p-home .licence, .p-home .licence + .licence { padding:20px 0 4px; border-left:0; }
  .p-home .licence + .licence { border-top:1px solid var(--line); }
}
@media (max-width:650px) {
  :root.p-home { --gut:30px; }
  .p-home .header { min-height:112px; gap:20px; flex-wrap:wrap; padding-block:22px; }
  .p-home .brand img { width:180px; }
  .p-home nav { width:100%; gap:12px; }
  .p-home .nav-cta, .p-home .nav-doc { padding:12px 10px; font-size:8.5px; line-height:1.5; text-align:center; flex:1; }
  .p-home .hero { padding-block:36px 56px; }
  .p-home .hero-emblem { width:min(80%,300px); }
  .p-home .hero h1 { font-size:clamp(23px,6.6vw,34px); line-height:1.22; margin-bottom:22px; }
  .p-home .intro { font-size:16px; }
  .p-home .section { padding-block:45px 48px; }
  .p-home .section-intro { font-size:15px; margin:20px 0 30px; }
  .p-home .features p, .p-home .compute-summary p, .p-home .perf-details p, .p-home .workflow-list p, .p-home .after-note { font-size:14px; }
  .p-home h2 { font-size:20px; }
  .p-home .features article, .p-home .perf-grid { grid-template-columns:1fr; gap:12px; }
  .p-home .perf-grid { gap:28px; }
  .p-home .compute-summary { padding-right:0; }
  .p-home .perf-details article:first-child { border-top:1px solid var(--line); padding-top:24px; }
  .p-home .workflow-list { grid-template-columns:1fr; gap:28px; }
  .p-home .vital { padding:16px; }
  .p-home .vital-value { font-size:24px; }
  .p-home .availability-grid { grid-template-columns:1fr; gap:26px; }
  .p-home .toy { min-height:380px; }
  .p-home .toy-stage { min-height:280px; }
  .p-home .toy-panel { padding:20px; }
  .p-home .bl-text { font-size:10px; }
  .p-home .bl-shade-label { display:none; }
  .p-home .bl-range { display:none; }
  .p-home .bl-hint { font-size:9.5px; left:8px; bottom:8px; max-width:55%; }
  .p-home .bl-gizmo { width:46px; height:46px; }
  .p-home .rank-chip { padding:7px 10px; font-size:9px; opacity:0; transform:translateY(8px); transition:opacity .3s, transform .3s; pointer-events:none; }
  .p-home .rank-chip.peek { opacity:1; transform:none; }
  .p-home .rank-chip > span:first-child { display:none; }
  .p-home .vital-box { min-width:58px; padding:4px 8px; }
  .p-home .vital-box b { font-size:17px; }
  .p-home .vital-box small { font-size:8.5px; }
  .p-home .toy-hud { right:8px; bottom:8px; gap:6px; }
}
@media (max-width:380px) {
  :root.p-home { --gut:24px; }
  .p-home .brand img { width:160px; }
  .p-home .nav-cta, .p-home .nav-doc { font-size:8px; padding:11px 6px; }
}
@media (prefers-reduced-motion:reduce) {
  html.p-home { scroll-behavior:auto; }
  html.p-home, .p-home *, .p-home *::before, .p-home *::after { animation:none !important; transition:none !important; }
}

/* ======================================================================
   Documentation (documentation/index.html)
   ====================================================================== */

/* Layout: three columns (manual tree, page, outline) under a sticky topbar, like the MPM manual, in Frame Medic pink. */
:root.p-docs { --bg:#1c1c1c; --bar:#1c1c1cf2; --soft:#242223; --soft-2:#2b2729; --ink:#f1ebee; --muted:#b7adb2; --dim:#8c8287; --faint:#5f575b; --line:#352f32; --pink:#ff2e9b; --pink-hi:#ff7cc0; --pink-wash:#ff2e9b14; --violet:#5d00ff; --violet-hi:#b49cff; --lime:#ceff05; --on:#1c1c1c; --on-pink:#ffffff; --f-display:Panchang,'Arial Black',Arial,sans-serif; --f-body:Arial,Helvetica,sans-serif; --f-small:Arial,Helvetica,sans-serif; --f-mono:Arial,Helvetica,sans-serif; --f-code:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; --top:74px; color-scheme:dark; }
html.p-docs { scroll-padding-top:calc(var(--top) + 24px); scroll-behavior:smooth; }
.p-docs body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--f-body); font-size:15px; line-height:1.7; -webkit-font-smoothing:antialiased; }
.p-docs body::before { content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:60; background:var(--bg); }
.p-docs button, .p-docs input { font:inherit; color:inherit; }
.p-docs button { cursor:pointer; }
.p-docs :focus-visible { outline:2px solid var(--pink); outline-offset:3px; }
.p-docs svg.i { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; flex-shrink:0; }
.p-docs .skip { position:fixed; top:-100px; left:20px; padding:12px; background:var(--pink); color:var(--on-pink); z-index:90; }
.p-docs .skip:focus { top:12px; }

/* topbar */
.p-docs .topbar { position:sticky; top:env(safe-area-inset-top,0px); z-index:50; height:var(--top); display:flex; align-items:center; gap:22px; padding-left:max(28px, env(safe-area-inset-left,0px)); padding-right:max(28px, env(safe-area-inset-right,0px)); border-bottom:1px solid var(--line); background:var(--bar); backdrop-filter:blur(14px); }
.p-docs .brand { display:block; line-height:0; flex-shrink:0; transition:transform .25s cubic-bezier(.3,1.6,.5,1); }
.p-docs .brand:hover { transform:rotate(-2deg) scale(1.04); }
.p-docs .brand img { display:block; width:142px; height:auto; }
.p-docs .divider { width:1px; height:20px; background:var(--line); }
.p-docs .doc-label { font-family:var(--f-small); font-size:13px; color:var(--muted); }
.p-docs .search-trigger { margin-left:auto; font-family:var(--f-small); height:38px; width:290px; display:flex; align-items:center; gap:10px; padding:0 10px; border:1px solid var(--line); background:var(--soft); color:var(--dim); font-size:12.5px; text-align:left; }
.p-docs .search-trigger:hover { border-color:#5a4f55; color:var(--muted); }
.p-docs .search-trigger kbd { margin-left:auto; }
.p-docs .version { display:flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:11px; color:var(--muted); white-space:nowrap; }
.p-docs .version i { width:6px; height:6px; background:var(--lime); }
.p-docs .version b { font-weight:400; font-size:9.5px; letter-spacing:.12em; color:var(--pink); border:1px solid #6a1f47; padding:1px 6px; }
.p-docs .site-link { font-family:var(--f-small); font-size:12.5px; color:var(--muted); white-space:nowrap; }
.p-docs .site-link:hover { color:var(--pink-hi); }
.p-docs .menu-toggle { display:none; width:38px; height:38px; border:1px solid var(--line); background:var(--soft); align-items:center; justify-content:center; }
.p-docs kbd { font-family:var(--f-code); font-size:10.5px; line-height:19px; padding:0 6px; border:1px solid #4d4549; border-bottom-width:2px; background:var(--soft-2); color:var(--ink); white-space:nowrap; }

/* layout */
.p-docs .layout { display:grid; grid-template-columns:264px minmax(0,1fr) 200px; max-width:1680px; margin:0 auto; }
.p-docs .sidebar { position:sticky; top:calc(var(--top) + env(safe-area-inset-top,0px)); height:calc(100dvh - var(--top) - env(safe-area-inset-top,0px)); overflow-y:auto; overscroll-behavior:contain; border-right:1px solid var(--line); padding:28px 18px 24px max(22px, env(safe-area-inset-left,0px)); scrollbar-width:thin; scrollbar-color:#4a4146 transparent; }
.p-docs .sidebar-label { display:flex; justify-content:space-between; margin:0 10px 24px; font-family:var(--f-mono); font-size:10px; letter-spacing:0.056em; color:var(--muted); }
.p-docs .sidebar-label span { color:var(--faint); }
.p-docs .nav-group { margin-bottom:20px; }
.p-docs .nav-heading { display:flex; align-items:baseline; gap:9px; padding:0 10px 7px; font-family:var(--f-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); }
.p-docs .nav-heading .num { color:var(--pink); }
.p-docs .nav-link { display:block; padding:6px 10px 6px 16px; font-family:var(--f-small); font-size:13px; color:#c9bfc4; border-left:2px solid transparent; line-height:1.5; transition:background .15s,color .15s; }
.p-docs .nav-link:hover { background:var(--soft); color:#fff; }
.p-docs .nav-link.active { border-left-color:var(--pink); background:var(--pink-wash); color:var(--pink-hi); }
.p-docs .sidebar-footer { font-family:var(--f-small); margin-top:28px; padding:20px 10px 0; border-top:1px solid var(--line); font-size:11px; color:var(--dim); line-height:1.9; }
.p-docs .sidebar-footer a:hover { color:var(--pink-hi); }
.p-docs main { min-width:0; padding:32px 56px 80px; }
.p-docs .page-outline { position:sticky; top:calc(var(--top) + env(safe-area-inset-top,0px)); align-self:start; padding:36px max(16px, env(safe-area-inset-right,0px)) 24px 8px; }
.p-docs .outline-label { font-family:var(--f-mono); font-size:10px; letter-spacing:0.056em; color:var(--muted); margin-bottom:12px; }
.p-docs #outline a { font-family:var(--f-small); display:block; padding:4px 0 4px 12px; border-left:1px solid var(--line); font-size:12.5px; color:var(--dim); line-height:1.45; }
.p-docs #outline a:hover { color:var(--ink); }
.p-docs #outline a.on { color:var(--pink-hi); border-left-color:var(--pink); }
.p-docs .back-top { font-family:var(--f-small); display:inline-block; margin-top:18px; font-size:12px; color:var(--dim); }
.p-docs .back-top:hover { color:var(--ink); }
.p-docs .nav-backdrop { display:none; }

/* page */
.p-docs .page { max-width:820px; }
.p-docs .crumbs { font-family:var(--f-small); font-size:13px; color:var(--dim); margin-bottom:26px; display:flex; gap:8px; flex-wrap:wrap; }
.p-docs .crumbs a:hover { color:var(--ink); }
.p-docs .crumbs span[aria-hidden] { color:var(--faint); }
.p-docs .page .eyebrow { font-family:var(--f-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--pink); margin:0 0 14px; }
.p-docs .page h1 { margin:0; font-family:var(--f-display); font-weight:700; font-size:clamp(26px,3vw,40px); line-height:1.18; letter-spacing:-.035em; text-wrap:balance; }
.p-docs .page .lead { margin:18px 0 0; font-size:18px; line-height:1.65; color:var(--muted); max-width:62ch; }
.p-docs .page h2 { margin:0 0 14px; font-family:var(--f-display); font-size:19px; font-weight:600; letter-spacing:-.025em; line-height:1.3; display:flex; align-items:baseline; gap:10px; text-wrap:balance; }
.p-docs .page h2 a.anchor { color:var(--faint); font-family:var(--f-mono); font-size:15px; opacity:0; transition:opacity .15s; }
.p-docs .page h2:hover a.anchor, .p-docs .page h2 a.anchor:focus-visible { opacity:1; }
.p-docs .page section { padding-top:42px; margin-top:42px; border-top:1px solid var(--line); }
.p-docs .page section:first-of-type { margin-top:38px; }
.p-docs .page p { margin:0 0 14px; max-width:64ch; color:#d6ccd1; }
.p-docs .page strong { color:var(--ink); font-weight:600; }
.p-docs .page em { color:var(--ink); font-style:normal; border-bottom:1px dotted var(--dim); }
.p-docs .page a:not(.btn):not(.anchor):not(.card) { color:var(--pink-hi); border-bottom:1px solid #ff2e9b55; }
.p-docs .page a:not(.btn):not(.anchor):not(.card):hover { border-bottom-color:var(--pink); }
.p-docs .page ul { margin:0 0 14px; padding-left:0; list-style:none; max-width:68ch; }
.p-docs .page ul li { position:relative; padding:8px 0 8px 26px; border-bottom:1px solid var(--line); color:#d6ccd1; }
.p-docs .page ul li::before { content:""; position:absolute; left:2px; top:16px; width:9px; height:9px; background:var(--pink); border-radius:2px; }
.p-docs code { font-family:var(--f-code); font-size:13px; background:var(--soft-2); padding:1px 5px; color:var(--ink); word-break:break-word; }
.p-docs .ui { font-family:var(--f-small); font-weight:600; color:var(--ink); background:var(--soft-2); border:1px solid #3d363a; padding:0 6px; white-space:nowrap; font-size:.94em; }
.p-docs .sw { display:inline-block; width:10px; height:10px; margin-right:6px; vertical-align:0; }
.p-docs .sw.pink { background:var(--pink); }
.p-docs .sw.lime { background:var(--lime); }
.p-docs .sw.white { background:#f2f2f2; }
.p-docs .sw.violet { background:var(--violet); }

/* blocks */
.p-docs .note { margin:18px 0; padding:16px 18px; border:1px solid var(--line); background:var(--soft); max-width:68ch; color:var(--muted); }
.p-docs .note strong { display:flex; align-items:center; gap:8px; margin-bottom:4px; font-family:var(--f-mono); font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--pink-hi); }
.p-docs .note strong::before { content:""; width:8px; height:8px; background:currentColor; }
.p-docs .note.tip strong { color:var(--violet-hi); }
.p-docs .note.safe strong { color:var(--lime); }
.p-docs .steps { list-style:none; margin:4px 0 16px; padding:0; counter-reset:s; max-width:68ch; }
.p-docs .steps li { counter-increment:s; display:grid; grid-template-columns:44px minmax(0,1fr); gap:6px; padding:12px 0; border-bottom:1px solid var(--line); color:#d6ccd1; }
.p-docs .steps li:first-child { border-top:1px solid var(--line); }
.p-docs .steps li::before { content:counter(s,decimal-leading-zero); font-family:var(--f-mono); font-size:12px; color:var(--pink); padding-top:3px; }
.p-docs .table-wrap { overflow-x:auto; margin:6px 0 18px; border:1px solid var(--line); }
.p-docs table { border-collapse:collapse; width:100%; font-size:14px; line-height:1.6; }
.p-docs th { text-align:left; font-family:var(--f-mono); font-weight:400; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); background:var(--soft); padding:10px 14px; border-bottom:1px solid var(--line); white-space:nowrap; }
.p-docs td { padding:11px 14px; border-bottom:1px solid var(--line); vertical-align:top; color:#d6ccd1; }
.p-docs tr:last-child td { border-bottom:0; }
.p-docs td:first-child { color:var(--ink); font-weight:500; white-space:nowrap; }
.p-docs .params { margin:6px 0 18px; border-top:1px solid var(--line); }
.p-docs .param { display:grid; grid-template-columns:minmax(170px,220px) minmax(0,1fr); gap:6px 22px; padding:14px 0; border-bottom:1px solid var(--line); }
.p-docs .param-name { font-weight:700; font-size:14.5px; color:var(--ink); line-height:1.5; }
.p-docs .param-val { display:inline-block; margin-top:4px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--pink-hi); border:1px solid #5e1d40; padding:0 6px; }
.p-docs .param-desc { color:#cfc5ca; font-size:14.5px; line-height:1.7; }

/* overview */
.p-docs .banner { position:relative; aspect-ratio:2.6 / 1; max-width:100%; border:1px solid var(--line); overflow:hidden; background:var(--bg); margin-bottom:34px; }
.p-docs .banner canvas { position:absolute; inset:0; width:100%; height:100%; image-rendering:pixelated; }
.p-docs .banner::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,var(--bg) 0%,rgba(28,28,28,.88) 38%,rgba(28,28,28,0) 66%); }
.p-docs .banner-in { position:absolute; inset:0; z-index:1; pointer-events:none; padding:clamp(18px,3.4vw,34px); display:flex; flex-direction:column; justify-content:space-between; }
.p-docs .banner-label { font-family:var(--f-mono); font-size:11px; letter-spacing:0.07em; color:var(--muted); }
.p-docs .banner-logo { width:min(380px,58%); height:auto; display:block; }
.p-docs .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.p-docs .btn { display:inline-flex; align-items:center; gap:16px; min-height:48px; padding:0 20px; font-family:var(--f-display); font-weight:600; font-size:11.5px; border:1px solid transparent; }
.p-docs .btn.primary { background:var(--pink); color:var(--on-pink); }
.p-docs .btn.primary:hover { background:var(--pink-hi); }
.p-docs .btn.ghost { border-color:#4a4146; background:var(--soft); }
.p-docs .btn.ghost:hover { border-color:var(--pink); }
.p-docs .page h2.cards-title { margin:56px 0 16px; font-size:19px; }
.p-docs .cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.p-docs .card { display:flex; flex-direction:column; gap:6px; padding:18px; border:1px solid var(--line); background:var(--soft); transition:border-color .15s,background .15s; }
.p-docs .card:hover { border-color:var(--pink); background:#2a2427; }
.p-docs .card .num { font-family:var(--f-mono); font-size:11px; color:var(--pink); letter-spacing:0.035em; }
.p-docs .card b { font-family:var(--f-display); font-size:13.5px; font-weight:600; letter-spacing:-.01em; }
.p-docs .card span:last-child { font-family:var(--f-small); font-size:13px; color:var(--dim); line-height:1.55; }
.p-docs .pager { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:64px; }
.p-docs .pager a { display:flex; flex-direction:column; gap:4px; padding:16px 18px; border:1px solid var(--line); }
.p-docs .pager a:hover { border-color:var(--pink); }
.p-docs .pager a.next { text-align:right; grid-column:2; }
.p-docs .pager small { font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); }
.p-docs .pager b { font-family:var(--f-display); font-weight:600; font-size:12.5px; }

/* search */
.p-docs dialog { width:min(640px,calc(100% - 32px)); max-height:min(560px,80dvh); margin:12vh auto auto; padding:0; border:1px solid #4a4146; background:var(--bg); color:var(--ink); box-shadow:0 30px 80px rgba(0,0,0,.6); }
.p-docs dialog::backdrop { background:rgba(12,10,11,.72); backdrop-filter:blur(3px); }
.p-docs .search-top { display:flex; align-items:center; gap:10px; padding:0 14px; border-bottom:1px solid var(--line); }
.p-docs .search-top input { font-family:var(--f-small); flex:1; height:56px; border:0; background:transparent; outline:none; font-size:16px; }
.p-docs .search-top button { border:1px solid var(--line); background:var(--soft); font-family:var(--f-mono); font-size:10.5px; padding:2px 8px; }
.p-docs #search-results { font-family:var(--f-small); max-height:400px; overflow-y:auto; padding:8px; }
.p-docs .result { display:block; padding:10px 12px; border-left:2px solid transparent; }
.p-docs .result.sel { background:var(--pink-wash); border-left-color:var(--pink); }
.p-docs .result b { display:block; font-family:var(--f-body); font-weight:700; font-size:14px; }
.p-docs .result small { display:block; font-size:12.5px; color:var(--dim); margin-top:2px; }
.p-docs .result mark { background:transparent; color:var(--pink-hi); }
.p-docs .empty { font-family:var(--f-small); padding:22px 12px; color:var(--dim); font-size:14px; }
.p-docs .search-help { display:flex; justify-content:space-between; gap:12px; padding:10px 14px; border-top:1px solid var(--line); font-family:var(--f-mono); font-size:10.5px; color:var(--dim); }
.p-docs .sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
@media (max-width:1220px) {
  .p-docs .layout { grid-template-columns:250px minmax(0,1fr); }
  .p-docs .page-outline { display:none; }
  .p-docs main { padding:30px 40px 70px; }
}
@media (max-width:900px) {
  .p-docs .menu-toggle { display:inline-flex; }
  .p-docs .divider, .p-docs .doc-label, .p-docs .site-link { display:none; }
  .p-docs .search-trigger { width:auto; flex:0 1 220px; }
  .p-docs .layout { grid-template-columns:minmax(0,1fr); }
  .p-docs .sidebar { position:fixed; z-index:45; left:0; top:calc(var(--top) + env(safe-area-inset-top,0px)); width:min(300px,86vw); background:var(--bg); transform:translateX(-102%); transition:transform .22s ease; }
  .p-docs .sidebar.open { transform:none; }
  .p-docs .nav-backdrop:not([hidden]) { display:block; position:fixed; inset:0; z-index:44; background:rgba(10,8,9,.6); }
  .p-docs main { padding:24px max(30px, env(safe-area-inset-right,0px)) 64px max(30px, env(safe-area-inset-left,0px)); }
}
@media (max-width:560px) {
  .p-docs .topbar { gap:12px; padding-left:max(20px, env(safe-area-inset-left,0px)); padding-right:max(20px, env(safe-area-inset-right,0px)); }
  .p-docs .brand img { width:112px; }
  .p-docs .search-trigger span.lbl { display:none; }
  .p-docs .search-trigger kbd { display:none; }
  .p-docs .search-trigger { flex:1 1 auto; }
  .p-docs .version b { display:none; }
  .p-docs .banner { aspect-ratio:1.5 / 1; }
  .p-docs .banner::after { background:linear-gradient(180deg,rgba(28,28,28,.2) 0%,rgba(28,28,28,.92) 70%); }
  .p-docs .banner-in { justify-content:flex-end; gap:12px; }
  .p-docs .param { grid-template-columns:1fr; }
  .p-docs .pager { grid-template-columns:1fr; }
  .p-docs .pager a.next { grid-column:1; }
  .p-docs .lead { font-size:17px; }
}
@media (prefers-reduced-motion:reduce) {
  html.p-docs { scroll-behavior:auto; }
  .p-docs .sidebar { transition:none; }
}

/* ======================================================================
   Mentions légales (mentions-legales.html)
   ====================================================================== */

/* Layout: the home page frame (header rule, wrap, footer), a sticky numbered index beside a single reading column. */
:root.p-legal { --bg:#1c1c1c; --surface:#232123; --surface-2:#2a272a; --ink:#f4eef1; --muted:#c3b9be; --dim:#978d92; --line:#ffffff1f; --pink:#ff2e9b; --pink-hi:#ff7cc0; --violet:#5d00ff; --violet-hi:#b49cff; --lime:#ceff05; --on-pink:#ffffff; --f-brand:Panchang,'Arial Black',Arial,sans-serif; --f-text:Arial,Helvetica,sans-serif; --f-small:Arial,Helvetica,sans-serif; --f-mono:Arial,Helvetica,sans-serif; --gut:56px; color-scheme:dark; }
html.p-legal { scroll-behavior:smooth; scroll-padding-top:32px; }
.p-legal body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--f-text); font-weight:400; font-size:15px; line-height:1.75; -webkit-font-smoothing:antialiased; isolation:isolate; }
.p-legal a:focus-visible, .p-legal button:focus-visible { outline:2px solid var(--pink); outline-offset:5px; }
@media (max-width:700px) {
  .p-legal .ambient { display:none; }
}

/* header (same as the home page) */
.p-legal nav { display:flex; gap:22px; align-items:center; font-family:var(--f-brand); font-weight:600; font-size:10px; line-height:1.2; }
.p-legal .nav-cta { padding:13px 18px; background:var(--pink); color:var(--on-pink); }
.p-legal .nav-cta:hover { background:var(--pink-hi); }

/* title */
.p-legal .intro { padding-block:72px 48px; }
.p-legal .eyebrow { margin:0 0 18px; font-family:var(--f-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--pink); }
.p-legal h1 { margin:0; font-family:var(--f-brand); font-size:clamp(28px,3.6vw,48px); font-weight:700; line-height:1.15; letter-spacing:-.045em; text-wrap:balance; }
.p-legal h1 span { display:block; margin-top:10px; font-size:.42em; font-weight:600; letter-spacing:-.02em; color:var(--muted); }
.p-legal .lead { max-width:68ch; margin:28px 0 0; color:var(--muted); font-size:17px; line-height:1.7; }

/* body: index + reading column */
.p-legal .legal { display:grid; grid-template-columns:230px minmax(0,1fr); gap:64px; padding-block:48px 90px; align-items:start; }
.p-legal .toc { position:sticky; top:28px; }
.p-legal .toc-label { margin:0 0 14px; font-family:var(--f-mono); font-size:10px; letter-spacing:.1em; color:var(--dim); text-transform:uppercase; }
.p-legal .toc ol { list-style:none; margin:0; padding:0; counter-reset:toc; }
.p-legal .toc li { counter-increment:toc; }
.p-legal .toc a { display:grid; grid-template-columns:28px 1fr; padding:7px 0 7px 12px; border-left:1px solid var(--line); font-family:var(--f-small); font-size:13px; line-height:1.4; color:var(--dim); transition:color .15s, border-color .15s; }
.p-legal .toc a::before { content:counter(toc,decimal-leading-zero); font-family:var(--f-mono); font-size:10.5px; color:#6e6468; padding-top:1px; }
.p-legal .toc a:hover { color:var(--ink); }
.p-legal .toc a.on { color:var(--pink-hi); border-left-color:var(--pink); }
.p-legal .toc a.on::before { color:var(--pink); }
.p-legal .content { min-width:0; max-width:760px; }
.p-legal .content section { padding-block:34px; border-top:1px solid var(--line); }
.p-legal .content section:first-child { border-top:0; padding-top:0; }
.p-legal h2 { display:flex; align-items:baseline; gap:14px; margin:0 0 18px; font-family:var(--f-brand); font-size:clamp(17px,1.6vw,21px); font-weight:700; line-height:1.35; letter-spacing:-.035em; text-wrap:balance; }
.p-legal h2 .n { font-family:var(--f-mono); font-size:12px; font-weight:400; letter-spacing:0.021em; color:var(--pink); flex-shrink:0; }
.p-legal h3 { margin:26px 0 10px; font-family:var(--f-brand); font-size:13.5px; font-weight:600; letter-spacing:-.02em; line-height:1.5; }
.p-legal .content p { margin:0 0 14px; max-width:66ch; color:#d6ccd1; }
.p-legal .content p:last-child { margin-bottom:0; }
.p-legal .content strong { color:var(--ink); font-weight:600; }
.p-legal .content em { font-style:normal; color:var(--ink); }
.p-legal .content a.ext { color:var(--pink-hi); border-bottom:1px solid #ff2e9b55; overflow-wrap:anywhere; }
.p-legal .content a.ext:hover { border-bottom-color:var(--pink); }

/* identity sheets */
.p-legal .sheet { margin:4px 0 18px; border:1px solid var(--line); background:rgba(28,28,28,.92); }
.p-legal .sheet-title { padding:14px 18px; border-bottom:1px solid var(--line); font-family:var(--f-brand); font-size:15px; font-weight:700; letter-spacing:-.02em; }
.p-legal .sheet dl { margin:0; }
.p-legal .sheet .row { display:grid; grid-template-columns:200px minmax(0,1fr); gap:6px 20px; padding:11px 18px; border-top:1px solid var(--line); }
.p-legal .sheet .row:first-child { border-top:0; }
.p-legal .sheet dt { font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); line-height:2.1; }
.p-legal .sheet dd { margin:0; color:var(--ink); font-size:15px; line-height:1.7; overflow-wrap:anywhere; }
.p-legal .sheet dd .num { font-family:var(--f-mono); font-size:15px; font-variant-numeric:tabular-nums; letter-spacing:0.007em; }
.p-legal .contact { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.p-legal .copy { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border:1px solid #4a4146; background:var(--surface-2); font-family:var(--f-small); font-size:12px; line-height:1.3; color:var(--muted); cursor:pointer; }
.p-legal .copy:hover { border-color:var(--pink); color:var(--ink); }
.p-legal .copy[data-done] { border-color:var(--lime); color:var(--lime); }
.p-legal .platforms { list-style:none; margin:6px 0 18px; padding:0; display:grid; gap:2px; }
.p-legal .platforms li { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; padding:12px 16px; background:var(--surface); }
.p-legal .platforms b { font-weight:600; }
.p-legal .platforms small { font-family:var(--f-small); font-size:12.5px; color:var(--dim); }
.p-legal .aside { margin:18px 0; padding:16px 18px; border-left:3px solid var(--violet); background:var(--surface); }
.p-legal .aside p { color:var(--muted); }
.p-legal .aside .tag { display:block; margin-bottom:4px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--violet-hi); }
.p-legal .rights { list-style:none; margin:6px 0 16px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.p-legal .rights li { padding:5px 12px; border:1px solid #4a4146; font-size:13px; font-weight:700; line-height:1.5; }
.p-legal .points { list-style:none; margin:4px 0 0; padding:0; }
.p-legal .points li { position:relative; padding:12px 0 12px 26px; border-top:1px solid var(--line); color:#d6ccd1; }
.p-legal .points li:first-child { border-top:0; }
.p-legal .points li::before { content:""; position:absolute; left:2px; top:21px; width:9px; height:9px; background:var(--pink); border-radius:2px; }
.p-legal footer { padding-block:28px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 20px; font-family:var(--f-small); color:var(--dim); font-size:13px; line-height:1.5; }
.p-legal footer .here { color:var(--ink); }
@media (max-width:1000px) {
  :root.p-legal { --gut:32px; }
  .p-legal .legal { grid-template-columns:1fr; gap:8px; padding-top:24px; }
  .p-legal .toc { position:static; margin-bottom:24px; }
  .p-legal .toc ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:16px; }
}
@media (max-width:650px) {
  :root.p-legal { --gut:30px; }
  .p-legal body { font-size:14px; }
  .p-legal .header { min-height:112px; gap:20px; flex-wrap:wrap; padding-block:22px; }
  .p-legal .brand img { width:180px; }
  .p-legal nav { width:100%; gap:12px; }
  .p-legal .nav-cta, .p-legal .nav-doc { padding:12px 10px; font-size:8.5px; line-height:1.5; text-align:center; flex:1; }
  .p-legal .intro { padding-block:44px 28px; }
  .p-legal h1 span { font-size:.5em; }
  .p-legal .toc ol { grid-template-columns:1fr; }
  .p-legal .sheet .row { grid-template-columns:1fr; gap:0; }
  .p-legal .sheet dt { line-height:1.8; }
}
@media (max-width:380px) {
  :root.p-legal { --gut:24px; }
  .p-legal .brand img { width:160px; }
  .p-legal .nav-cta, .p-legal .nav-doc { font-size:8px; padding:11px 6px; }
}
@media (prefers-reduced-motion:reduce) {
  html.p-legal { scroll-behavior:auto; }
  html.p-legal, .p-legal *, .p-legal *::before, .p-legal *::after { transition:none !important; }
}
