.tp{position:relative;isolation:isolate;overflow:hidden;overflow:clip;padding:var(--s5) 0 var(--s6)}
.tp .circ{position:absolute;z-index:-1;right:-8vw;top:3%;width:24vw;max-width:340px;aspect-ratio:1;border-radius:50%;background:var(--yel);mix-blend-mode:multiply}
.tp .ht{position:absolute;z-index:-1;left:-10vw;bottom:2%;width:34vw;max-width:480px;aspect-ratio:1;border-radius:50%;background-image:var(--dot-b);background-size:14px 14px;-webkit-mask-image:radial-gradient(circle,#000 10%,transparent 70%);mask-image:radial-gradient(circle,#000 10%,transparent 70%)}
.tp h1{font-family:var(--disp);font-weight:400;line-height:.92;letter-spacing:.015em;color:var(--blue);text-shadow:.045em .04em 0 var(--yel);transform:rotate(var(--rb));transform-origin:left bottom;margin-bottom:var(--s3)}
.mono-l{display:inline-block;background:var(--ink);color:var(--paper);font:600 0.875rem/1.35 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:var(--s1) var(--s2);margin-bottom:var(--s2)}
.lede{background:var(--paper);border:var(--bh) solid var(--ink);box-shadow:var(--off) var(--off) 0 var(--blue);padding:var(--s2) var(--s3);font:500 clamp(1.0625rem,1.5vw,1.25rem)/1.45 var(--body)}
.btn,.of-subscribe-link{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:var(--s2) var(--s4);font:600 1.125rem/1.1 var(--body);text-decoration:none;border:var(--b) solid var(--ink);box-shadow:var(--off-s) var(--off-s) 0 var(--ink);background:var(--blue);color:var(--yel);cursor:pointer;transform:none;transition:transform .1s,box-shadow .1s,background .1s}
.btn:active,.of-subscribe-link:active{transform:translate(4px,4px);box-shadow:var(--off-a) var(--off-a) 0 var(--ink)}
.btn.ghost,.backbtn{background:transparent;color:var(--blue);border:var(--b) solid var(--blue);box-shadow:none;border-radius:999px;min-height:48px;padding:0 var(--s3);font:600 1.0625rem/1.1 var(--body);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.btn.ghost:active,.backbtn:active{transform:translateY(2px);box-shadow:none}
@media (hover:hover){.btn:hover,.of-subscribe-link:hover{transform:translate(-2px,-2px);box-shadow:var(--off) var(--off) 0 var(--ink);background:var(--ink)}
.btn.ghost:hover,.backbtn:hover{background:var(--yel);transform:none;box-shadow:none;color:var(--blue)}
}
.tp .ht{display:none}
@media (min-width:1200px){.tp .ht{display:block}
}
.btn:focus-visible,.of-subscribe-link:focus-visible{box-shadow:var(--off-s) var(--off-s) 0 var(--ink),0 0 0 8px var(--yel)}
.btn:disabled{background:#CFC9B6;color:#3D3D3D;box-shadow:none;cursor:not-allowed}
.txtlink,.src a,.intro a{color:var(--ink);text-decoration:underline;text-decoration-thickness:var(--b);text-underline-offset:5px;text-decoration-color:var(--blue)}
@media (hover:hover){.txtlink:hover,.src a:hover,.intro a:hover{background:var(--yel);color:var(--blue)}
}
.of-subscribe{background:var(--yel);border:var(--bh) solid var(--ink);box-shadow:var(--off) var(--off) 0 var(--blue);padding:var(--s3);margin:var(--s4) 0 var(--s4);text-align:left}
.of-subscribe-title{font:400 2rem/1 var(--disp);letter-spacing:.04em;color:var(--blue);margin:0 0 var(--s1);text-shadow:.04em .04em 0 var(--paper)}
.of-subscribe-body{font:500 1.0625rem/1.5 var(--body);color:var(--ink);margin:0 0 var(--s2);max-width:34em}
.of-subscribe-link{min-height:48px;padding:0 var(--s3);font-size:1.0625rem}
@media (max-width:480px){.btn,.of-subscribe-link{width:100%}
.of-subscribe{padding:var(--s2)}
}
.col,.container{position:relative}
.tnum{display:inline-flex;align-items:center;justify-content:center;min-width:88px;height:64px;padding:0 var(--s2);margin-bottom:var(--s2);background:var(--yel);border:var(--b) solid var(--blue);color:var(--blue);transform:rotate(var(--rc)); -webkit-mask:radial-gradient(circle 9px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 9px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 9px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 9px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat}
.tnum b{font:400 2.75rem/1 var(--disp);letter-spacing:.04em;text-shadow:.06em .06em 0 var(--paper)}
.more{background:var(--paper);border-top:var(--bh) solid var(--ink);padding:var(--s4) 0 var(--s4)}
.more h2{font:600 0.875rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:var(--s2)}
.more ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:var(--s2)}
.more li{display:flex}
.more a{width:100%}
.more a{display:flex;align-items:stretch;min-height:56px;text-decoration:none;color:var(--ink);background:var(--paper-hi);border:var(--b) solid var(--ink);box-shadow:var(--off-s) var(--off-s) 0 var(--blue);transition:transform .1s,box-shadow .1s,background .1s}
.more .mn{display:flex;align-items:center;justify-content:center;min-width:52px;padding:0 var(--s1);background:var(--yel);border-right:var(--b) dashed var(--blue);font:400 1.5rem/1 var(--disp);letter-spacing:.04em;color:var(--blue)}
.more .nm{display:flex;align-items:center;padding:var(--s1) var(--s2);font:600 1rem/1.25 var(--body)}
.more a:active{transform:translate(4px,4px);box-shadow:var(--off-a) var(--off-a) 0 var(--blue)}
@media (hover:hover){.more a:hover{background:var(--yel);transform:translate(-2px,-2px);box-shadow:var(--off) var(--off) 0 var(--blue)}
}
.col{max-width:900px;margin:0 auto}
.intro{max-width:40em;margin-bottom:var(--s5)}
.intro p{font:500 clamp(1.0625rem,1.4vw,1.1875rem)/1.65 var(--body);margin:0 0 var(--s2)}
.intro p:last-child{margin-bottom:0}
.intro .src{font:500 0.9375rem/1.55 var(--body);margin-top:var(--s3);border-left:var(--bh) solid var(--blue);padding-left:var(--s2)}
.full-rule{border:0;border-top:var(--b) solid var(--ink);margin:0 0 var(--s4)}
.container{max-width:760px;margin:0 auto}
.header{margin-bottom:var(--s3)}
.header h1{font-size:clamp(2.5rem,7.4vw,5rem)}
.subtitle{font:500 clamp(1.0625rem,1.6vw,1.25rem)/1.5 var(--body);max-width:38em;margin-bottom:var(--s2)}
.privacy{display:inline-block;background:var(--yel);border:var(--b) solid var(--ink);font:600 0.9375rem/1.3 var(--body);padding:var(--s1) var(--s2)}
.attribution{font:500 1rem/1.55 var(--body);border-left:var(--bh) solid var(--blue);padding-left:var(--s2);max-width:42em;margin-top:var(--s2)}
.attribution a{color:var(--ink);text-decoration:underline;text-decoration-thickness:var(--b);text-underline-offset:5px;text-decoration-color:var(--blue);overflow-wrap:anywhere}
.header.hidden .subtitle,.header.hidden .privacy,.header.hidden .attribution{display:none}
.header.hidden h1{font-size:clamp(1.75rem,4vw,2.75rem);margin-bottom:var(--s2);text-shadow:.04em .04em 0 var(--yel)}
.header.hidden{margin-bottom:var(--s1)}
.prog li{flex:1;display:flex;align-items:center;justify-content:center;height:52px;background:var(--paper-hi);color:var(--blue);border:var(--b) solid var(--ink);margin-left:-3px;font:400 1.875rem/1 var(--disp);letter-spacing:.04em;position:relative}
.prog li:first-child{margin-left:0}
.prog li+li{border-left:var(--b) dashed var(--ink)}
.container:has(#s1.on) .prog li:nth-child(1){background:var(--blue);color:var(--yel)}
.container:has(#s2.on) .prog li:nth-child(-n+1){background:var(--yel);color:var(--blue)}
.container:has(#s2.on) .prog li:nth-child(2){background:var(--blue);color:var(--yel)}
.container:has(#s3.on) .prog li:nth-child(-n+2){background:var(--yel);color:var(--blue)}
.container:has(#s3.on) .prog li:nth-child(3){background:var(--blue);color:var(--yel)}
.container:has(#s4.on) .prog li:nth-child(-n+3){background:var(--yel);color:var(--blue)}
.container:has(#s4.on) .prog li:nth-child(4){background:var(--blue);color:var(--yel)}
.container:has(#s5.on) .prog li:nth-child(-n+4){background:var(--yel);color:var(--blue)}
.container:has(#s5.on) .prog li:nth-child(5){background:var(--blue);color:var(--yel)}
.qstep{display:none;background:var(--paper-hi);border:var(--bh) solid var(--ink);box-shadow:var(--off-h) var(--off-h) 0 var(--blue);padding:var(--s4)}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.qstep.on{display:block;animation:fadeIn .15s ease-out}
[tabindex="-1"]:focus{outline:none}
.qstep{overflow-wrap:anywhere}
.q-label,.r-label{display:inline-block;background:var(--ink);color:var(--paper);font:600 0.875rem/1.35 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:6px var(--s2);margin-bottom:var(--s2)}
.q-text{font:600 clamp(1.375rem,3vw,1.875rem)/1.25 var(--body);margin-bottom:var(--s2)}
.q-help,.q-hint{font:500 1.0625rem/1.5 var(--body);margin-bottom:var(--s2)}
.row{display:flex;align-items:center;justify-content:space-between;margin-top:var(--s3);gap:var(--s2)}
.row .btn{margin-left:auto}
.backbtn{margin-top:var(--s1)}
.backbtn i{font-style:normal;margin-right:6px}
i.ti-arrow-left::before{content:"\2190"}
i.ti-refresh::before{content:"\21BA"}
.opt{position:relative;display:block;background:#fff;border:var(--b) solid var(--ink);box-shadow:var(--off-s) var(--off-s) 0 var(--blue);padding:var(--s2) 56px var(--s2) var(--s2);margin:0 var(--s1) var(--s2) 0;min-height:64px;cursor:pointer;user-select:none;transition:transform .1s,background .1s,box-shadow .1s}
.opt::after{content:"\203A";position:absolute;right:var(--s2);top:50%;transform:translateY(-52%);font:600 2rem/1 var(--body);color:var(--blue)}
.opt p{margin:0}
.opt-title{font:600 1.1875rem/1.3 var(--body)}
.opt-desc{font:500 1rem/1.4 var(--body);margin-top:2px}
.opt:active{transform:translate(4px,4px);box-shadow:var(--off-a) var(--off-a) 0 var(--blue)}
.opt.sel{background:var(--yel)}
.opt.sel::after{content:"\2713";color:var(--ink)}
.opt:focus-visible{outline:4px solid var(--ink);outline-offset:3px;box-shadow:var(--off-s) var(--off-s) 0 var(--blue),0 0 0 8px var(--yel)}
@media (hover:hover){.opt:hover{background:var(--yel);transform:translate(-2px,-2px);box-shadow:var(--off) var(--off) 0 var(--blue)}
}
.r-head,.r-method{font:600 clamp(1.75rem,4.4vw,2.625rem)/1.15 var(--body);color:var(--blue);letter-spacing:-.01em;margin-bottom:var(--s2)}
.r-body,.r-what,.r-why,.r-timeline{font:500 1.1875rem/1.6 var(--body);margin-bottom:var(--s2);max-width:40em}
.r-flag,.r-note{font:600 1.0625rem/1.5 var(--body);background:#fff;border:var(--b) solid var(--ink);box-shadow:inset var(--off) 0 0 var(--yel);padding:var(--s1) var(--s2) var(--s1) calc(var(--s2) + var(--off));margin:0 0 var(--s3)}
.summary-box{background:var(--yel);border:var(--bh) solid var(--ink);box-shadow:var(--off) var(--off) 0 var(--blue);padding:var(--s3);margin:var(--s3) 0}
.summary-title{font:600 0.875rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:var(--s1)}
.summary-body{font:500 1.1875rem/1.55 var(--body);color:var(--ink)}
.summary-body strong{font-weight:600}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:var(--s2)}
.divider{border:0;border-top:var(--b) solid var(--ink);margin:var(--s4) 0 var(--s2)}
.footer{font:500 1rem/1.5 var(--body)}
.footer a{color:var(--ink);text-decoration:underline;text-decoration-thickness:var(--b);text-underline-offset:5px;text-decoration-color:var(--blue)}
@media (max-width:480px){.qstep{padding:var(--s2);box-shadow:var(--off) var(--off) 0 var(--blue)}
.row{flex-direction:column-reverse;align-items:stretch}
.row .btn{margin-left:0}
.row .backbtn,.actions .btn.ghost,.backbtn{width:100%}
.actions{flex-direction:column;align-items:stretch}
.opt{margin-right:var(--s1)}
}
.tag{display:inline-block;background:var(--yel);border:var(--b) solid var(--ink);font:600 1rem/1.3 var(--body);padding:4px var(--s2);margin-bottom:var(--s2)}
.r-method{display:block;margin-bottom:var(--s2)}
.cost-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3);margin:var(--s3) 0}
.cbox{background:#fff;border:var(--b) solid var(--ink);box-shadow:var(--off-s) var(--off-s) 0 var(--blue);padding:var(--s2)}
.cbox-label{font:600 0.875rem/1.35 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:var(--s1)}
.cbox-cost{font:600 clamp(1.5rem,3.2vw,2.125rem)/1.15 var(--body);font-variant-numeric:tabular-nums;color:var(--blue);margin-bottom:var(--s1);overflow-wrap:anywhere}
.cbox-tool{font:500 1rem/1.5 var(--body)}
.r-timeline{font-weight:600}
.echo-box,.artifact-box{border:var(--b) solid var(--ink);padding:var(--s3);margin:var(--s3) 0}
.echo-box{background:#fff;box-shadow:var(--off-s) var(--off-s) 0 var(--blue)}
.echo-label{display:inline-block;background:var(--ink);color:var(--paper);font:600 0.875rem/1.35 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:6px var(--s2);margin-bottom:var(--s2)}
.echo-row{font:500 1.0625rem/1.5 var(--body);padding:var(--s1) 0 var(--s2);border-bottom:var(--b) dashed var(--blue)}
.echo-row:last-child{border-bottom:0;padding-bottom:0}
.echo-row b{display:block;font:600 0.875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin-bottom:2px}
.artifact-box{background:var(--yel);border-width:var(--bh);box-shadow:var(--off) var(--off) 0 var(--blue)}
.artifact-title{font:600 1.375rem/1.25 var(--body);margin-bottom:var(--s1)}
.artifact-body{font:500 1.1875rem/1.55 var(--body);max-width:40em}
.download-btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:var(--s2) var(--s3);font:600 1.125rem/1.1 var(--body);text-decoration:none;border:var(--b) solid var(--ink);box-shadow:var(--off-s) var(--off-s) 0 var(--ink);background:var(--blue);color:var(--yel);transition:transform .1s,box-shadow .1s,background .1s}
.download-btn:active{transform:translate(4px,4px);box-shadow:var(--off-a) var(--off-a) 0 var(--ink)}
.download-btn:focus-visible{box-shadow:var(--off-s) var(--off-s) 0 var(--ink),0 0 0 8px var(--yel)}
@media (hover:hover){.download-btn:hover{transform:translate(-2px,-2px);box-shadow:var(--off) var(--off) 0 var(--ink);background:var(--ink)}
}
@media (max-width:560px){.cost-grid{grid-template-columns:1fr}
.echo-box,.artifact-box,.download-strip{padding:var(--s2)}
}