/* the outer page. Tokens first. The processor has its own sheet, processor.css, because its frame cannot load anything. */
@font-face{font-family:PlexMono;src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:PlexMono;src:url(/assets/fonts/ibm-plex-mono-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:PlexSans;src:url(/assets/fonts/ibm-plex-sans-latin-wght-normal.woff2) format("woff2");font-weight:100 700;font-display:swap}
:root{color-scheme:light dark;--bg:#efeee2;--card:#fbfaf1;--card2:#e3ead9;--ink:#20231f;--soft:#494f47;--link:#1d5d41;--line:#c9d6c2;--go:#1d5d41;--on-go:#ffffff;--bar:#e6efe0;--footbg:#20231f;--footink:#efeee2;--display:PlexMono,ui-monospace,monospace;--ui:PlexSans,system-ui,sans-serif;--h:42px;--btn:17px;--frame-a:440px;--frame-b:450px}
@media(prefers-color-scheme:dark){:root{--bg:#121714;--card:#1b221d;--card2:#22302a;--ink:#dcebdd;--soft:#b6c7b8;--link:#8fd9b2;--line:#34443a;--go:#8fd9b2;--on-go:#10261b;--bar:#223027;--footbg:#0b0f0c;--footink:#dcebdd}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.55 var(--ui);overflow-x:hidden}
a{color:var(--link);text-underline-offset:3px}h1,h2,h3,p,ul,ol{margin:0}ul,ol{list-style:none;padding:0}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--card);padding:8px;z-index:9}:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.page{max-width:1240px;margin:0 auto;padding:0 40px}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0 10px}
/* Legal L1: the brand is at least the H1's size */
.brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;font:600 var(--h)/1 var(--display);letter-spacing:-.02em}
.mark{width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.top nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-weight:600}
h1{font:600 var(--h)/1.08 var(--display);letter-spacing:-.02em}.one{font-size:20px;margin-top:14px}
.hero{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:48px;align-items:start;padding:18px 0 8px}
.law{font-size:15px;line-height:1.5;color:var(--soft);margin-top:14px}
.tool-col{display:grid;gap:0}
/* The frame has no bridge to this page, so its height is fixed here and it scrolls inside. */
.proc-frame{display:block;width:100%;border:0;background:transparent;box-shadow:0 2px 0 var(--line)}.pa .proc-frame{height:var(--frame-a)}.pb .proc-frame{height:var(--frame-b)}
/* Legal L5: the line sits directly above the button at the button's text size; never shrink, grey or move it. */
.price{background:var(--card2);padding:20px 22px;border-top:2px dashed var(--soft)}.pline{font:400 var(--btn)/1.45 var(--ui)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 20px;border:0;border-radius:2px;font:600 var(--btn)/1.25 var(--ui);cursor:pointer;box-shadow:4px 4px 0 var(--line);transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .18s}.btn:hover{transform:translate(-1px,-1px)}.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--line)}
.btn.go{width:100%;margin-top:10px;background:var(--go);color:var(--on-go);text-wrap:balance}.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}.btn.ghost:active{transform:scale(.97);box-shadow:inset 0 0 0 2px var(--ink)}
.notice{margin-top:12px;padding:14px;background:var(--card);font-size:var(--btn)}.notice[hidden]{display:none}.notice .btn{margin-top:10px}
.sec{padding:26px 0 0;border-top:2px dashed var(--line);margin-top:24px}.sec h2{font:600 26px/1.15 var(--display);margin-bottom:10px}.sec h3{font:600 19px/1.25 var(--ui);margin-bottom:4px}
.sec.price-sec .price{border-top:0}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.three li{background:var(--card);padding:18px;outline:1px solid var(--line)}.steps{display:grid;gap:8px}
.tag{font-weight:700;font-size:14px;margin:6px 0 8px}.ex{max-width:640px;margin-top:10px;background:var(--card);padding:14px 16px;outline:1px solid var(--line)}
.row{display:grid;grid-template-columns:62px 186px 1fr;gap:8px;padding:6px 4px;font-size:15px;line-height:1.35}.row:nth-child(odd){background:var(--bar)}.who,.when{font-family:var(--display);font-size:14px}.who{font-weight:600}.when{color:var(--soft)}
.fq{font:600 19px/1.3 var(--ui)}.fb{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.fine{margin-top:8px;font-size:15px;color:var(--soft)}
details{border-top:1px solid var(--line);padding:10px 0}summary{font-weight:700;cursor:pointer;min-height:32px}details p{margin-top:6px}.cross{padding:24px 0}
.prose{max-width:68ch;padding:8px 0 32px}.prose h1{margin-bottom:18px}.prose p{margin-bottom:14px}
.foot{margin-top:24px;padding:18px 0 28px;background:var(--footbg);color:var(--footink);font-size:15px}.foot a{color:var(--footink)}.foot p{margin-top:8px}.fl{display:flex;flex-wrap:wrap;gap:18px}.fl a{display:inline-flex;align-items:center;min-height:44px}.disc{font-size:14px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:760px){:root{--h:28px;--frame-a:432px;--frame-b:540px}body{font-size:16px}.page{padding:0 16px}.top{padding:10px 0 6px;flex-wrap:wrap;gap:0 16px}.top nav a{white-space:nowrap}.brand{gap:8px}.hero{display:flex;flex-direction:column;gap:14px;padding-top:8px}.one{font-size:17px;margin-top:8px}.lead-col{display:contents}.lead-col h1{order:1}.one{order:2}.tool-col{order:3;width:100%}.law{order:4;margin-top:0}.row{grid-template-columns:52px 1fr}.row .txt{grid-column:1/-1}.three{grid-template-columns:1fr;gap:10px}.sec h2{font-size:23px}.fb .btn{flex:1 1 100%}}
/* follow-up v3 (2026-11-11): header with both tools, home cards and steps, quiet planned-price buttons, email worked example */
.top{flex-wrap:wrap}.top nav{display:flex;gap:4px 22px;flex-wrap:wrap}.top nav a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.h-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:start;padding:28px 0 8px}
.h-hero h1{font-size:46px;max-width:17ch}
.h-tools{display:grid;gap:16px;margin-top:28px}
.h-card{display:grid;gap:4px;padding:20px 22px;background:var(--card);color:var(--ink);text-decoration:none;outline:1px solid var(--line);box-shadow:4px 4px 0 var(--line);transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .18s}
.h-card:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--line)}.h-card:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--line)}
.h-k{font:600 13px/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}
.h-t{font:600 22px/1.25 var(--display)}.h-d{color:var(--soft)}.h-go{margin-top:8px;font-weight:700;color:var(--link)}
.h-sheet{margin:6px 0 0}.h-sheet .sheet{max-width:none;margin:0;padding:18px 18px 22px;transform:rotate(-1.2deg);box-shadow:0 18px 40px rgba(32,35,31,.14)}
.h-sheet .row{grid-template-columns:56px 1fr;row-gap:2px}.h-sheet .row .when,.h-sheet .row .txt{grid-column:2}
.h-sh{font:600 13px/1.3 var(--display);color:var(--soft);margin-bottom:8px}.h-sheet .tag{margin-top:14px}
.h-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.h-steps li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;background:var(--card);padding:16px 18px;outline:1px solid var(--line)}
.h-steps b{font:600 28px/1 var(--display);color:var(--link)}.h-more{margin-top:14px}
.hw-steps{display:grid;gap:14px;margin:6px 0 18px;counter-reset:h}.hw-steps li{counter-increment:h;padding-left:40px;position:relative}.hw-steps li::before{content:counter(h);position:absolute;left:0;top:-2px;font:600 26px/1 var(--display);color:var(--link)}
.licence-intro{margin-bottom:16px}.licence-text h2{font:600 19px/1.3 var(--display);margin:22px 0 6px;white-space:normal}
.price .btn.ghost{width:100%;margin-top:10px}.price-move{max-width:640px}
details summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center}
.howto{display:grid;gap:6px;counter-reset:s}.howto li{counter-increment:s;padding-left:30px;position:relative}.howto li::before{content:counter(s);position:absolute;left:0;font:600 17px/1.55 var(--display);color:var(--link)}
.mail{max-width:640px;margin-top:10px;background:var(--card);padding:16px 18px;outline:1px solid var(--line)}
.mail dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0 0 10px;font-size:15px}.mail dt{font-weight:600;color:var(--soft)}.mail dd{margin:0}
.mail h3{font:600 19px/1.25 var(--ui);margin-bottom:8px}.mail .body{font-size:15px;margin:0 0 10px}
@media(min-width:861px){.pb .proc-frame{height:var(--frame-b-fit,520px)}}
@media(max-width:860px){.h-hero{grid-template-columns:1fr;gap:28px}.h-hero h1{font-size:36px}.h-steps{grid-template-columns:1fr}.h-sheet{order:2}}
@media(max-width:560px){.top{gap:6px 16px}.top nav{gap:0 18px}.top nav a{font-size:15px}.h-hero h1{font-size:32px}.h-sheet .sheet{transform:none}}

.licence-text{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%;font-size:.875rem;margin:0}.home-tools{display:flex;flex-wrap:wrap;gap:1rem}.home-tools a{display:inline-flex;align-items:center;min-height:44px;padding:12px}
