:root{
  --char-900:#1A1614; --char-800:#231D1C; --char-700:#332B27;
  --slate-900:#11151A; --slate-700:#2A2F38; --slate-500:#4C515D;
  --cream-100:#F2ECE4; --cream-200:#E3D9CE; --greige-300:#C7B5A8;
  --wood-600:#8A5A33;  --wood-800:#4A2E18;
  --ember-500:#F5821F; --ember-600:#D96A15; --copper-400:#AF8365;
  --bone-100:#F4F1EC;  --ink-900:#14100E;   --steel-400:#8A8F98;

  --display:"Plus Jakarta Sans", system-ui, sans-serif;
  --body:"Inter", system-ui, sans-serif;

  --gut:max(6vw, 1.5rem);
  --head-h:78px;

  --band:76rem;
  --doc:40rem;
  --measure:min(56ch, 32em);
  --pre-col:43rem;

  --nf-ink:var(--bone-100);
  --nf-ink-soft:var(--greige-300);
  --nf-faint:var(--steel-400);
  --nf-accent:var(--ember-500);
  --nf-accent-ink:var(--ember-500);
  --nf-on-accent:var(--ink-900);
  --nf-focus:var(--ember-500);
  --nf-line:var(--char-700);
  --nf-line-strong:var(--copper-400);
  --nf-underline:rgba(245,130,31,.62);
  --nf-mono:var(--display);
  --nf-display:var(--display);
}

*,*::before,*::after{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--head-h) + 1.5rem);
  -webkit-text-size-adjust:100%;
}
body{
  margin:0;
  background:var(--char-900);
  color:var(--bone-100);
  font:400 1rem/1.65 var(--body);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:800;
  letter-spacing:-.045em;
  line-height:1.02;
  margin:0 0 1rem;
  text-wrap:balance;
}
p{margin:0 0 1rem}
::selection{background:var(--ember-500);color:var(--ink-900)}

*,input,textarea,button,pre{border-radius:0}

:focus-visible{outline:2px solid var(--ember-500);outline-offset:4px}

main:focus{outline:none}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

.wrap{width:min(var(--band),100%);margin-inline:auto;padding-inline:var(--gut)}

.netbar,.sitefoot{
  width:min(var(--band),100%);
  margin-inline:auto;
  --nf-gutter:var(--gut);
}

@media (max-width:720px){
  .netbar-chip{white-space:normal;padding-block:4px}
}

.eyebrow{
  font:700 var(--fs-micro)/1.3 var(--display);
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--ember-500);
  margin:0 0 1rem;
}

.rule{height:1px;background:var(--char-700);border:0;margin:0}

.btn{
  display:inline-flex;align-items:stretch;
  width:max-content;min-height:60px;
  background:var(--bone-100);color:var(--ink-900);
  font:700 var(--fs-micro)/1 var(--display);
  letter-spacing:.16em;text-transform:uppercase;
  border:0;padding:0;cursor:pointer;text-decoration:none;overflow:hidden;
}
.btn>span:first-child{
  display:flex;align-items:center;padding:.8rem 1.25rem;
  transition:transform .25s;
}
.btn__chip{
  display:grid;place-items:center;
  width:60px;min-width:60px;background:var(--ember-500);
  transition:width .25s, background .25s;
}
.btn__chip svg{width:23px;height:23px;transition:transform .25s}
.btn:hover>span:first-child{transform:translateX(3px)}
.btn:hover .btn__chip{background:var(--ember-600);width:68px}
.btn:hover .btn__chip svg{transform:translateX(4px)}

.btn--ghost{
  background:transparent;color:var(--bone-100);
  border:1px solid var(--ember-500);
  align-items:center;padding:0 1.4rem;position:relative;isolation:isolate;
}
.btn--ghost>span:first-child{padding:.8rem 0}
.btn--ghost::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--ember-500);
  transform:scaleX(0);transform-origin:left;
  transition:transform .25s;
}
.btn--ghost:hover{color:var(--ink-900)}
.btn--ghost:hover::before{transform:scaleX(1)}

.site-header{
  position:sticky;top:0;z-index:60;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  height:var(--head-h);padding:0 3.5vw;
  background:rgba(26,22,20,.96);
  border-bottom:1px solid rgba(244,241,236,.16);
  backdrop-filter:saturate(140%) blur(6px);
  -webkit-backdrop-filter:saturate(140%) blur(6px);
}
.site-header .wordmark{
  display:block;width:fit-content;max-width:100%;
  padding-block:5px;
  font:800 .96rem/1.15 var(--display);letter-spacing:.14em;
  text-decoration:none;color:var(--bone-100);
  transition:color .25s, letter-spacing .25s;
}
.site-header .wordmark span{color:var(--ember-500)}
.site-header .wordmark:hover{letter-spacing:.18em}
.site-header nav{display:flex;gap:2rem}
.site-header nav a{
  position:relative;text-decoration:none;color:var(--bone-100);
  display:inline-flex;align-items:center;min-height:24px;
  font:700 var(--fs-micro)/1 var(--display);letter-spacing:.16em;text-transform:uppercase;
}
.site-header nav a::after{
  content:"";position:absolute;left:0;right:.16em;bottom:-.25rem;height:1px;
  background:var(--ember-500);transform:scaleX(0);transform-origin:left;
  transition:transform .25s;
}
.site-header nav a:hover::after{transform:scaleX(1)}
.site-header .btn{justify-self:end;min-height:42px}
.site-header .btn__chip{width:42px;min-width:42px}
.site-header .btn:hover .btn__chip{width:50px}

.kanji{position:absolute;fill:var(--ember-500);pointer-events:none;z-index:0}
.kanji--hero{width:min(20vw,215px);height:auto;right:3vw;top:16%;opacity:.11}
.kanji--foot{width:min(62vw,620px);height:auto;right:-2vw;left:auto;bottom:-26%;opacity:.06}

.hero{
  position:relative;overflow:hidden;
  padding:clamp(4rem,11vh,7.5rem) 0 clamp(3.5rem,8vh,5.5rem);
  border-bottom:1px solid var(--char-700);
}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 40%, rgba(17,21,26,0) 0%, rgba(17,21,26,.5) 100%);
}
.hero .wrap{position:relative;z-index:2}
.hero h1{font-size:clamp(2.9rem,7vw,6rem);line-height:.96;margin-bottom:1.2rem}
.hero h1 span{display:block}
.hero__lede{
  color:var(--greige-300);font-size:clamp(1.02rem,1.5vw,1.2rem);
  max-width:var(--measure);margin-bottom:2.2rem;
}
.hero__actions{display:flex;flex-wrap:wrap;gap:.85rem;margin-bottom:2.6rem}

.trust{
  display:flex;flex-wrap:wrap;align-items:center;
  border-top:1px solid var(--char-700);padding-top:1.1rem;
  font:700 var(--fs-micro)/1.4 var(--display);letter-spacing:.16em;text-transform:uppercase;
  color:var(--steel-400);
}
.trust li{list-style:none;padding:0 1.15rem}
.trust li:first-child{padding-left:0}
.trust li+li{border-left:1px solid var(--char-700)}
.trust{margin:0;padding-inline:0}

.sec{padding:clamp(3.5rem,9vh,6rem) 0;border-bottom:1px solid var(--char-700);position:relative}
.sec__head{max-width:var(--doc);margin-bottom:2.6rem}
.sec__head h2{font-size:clamp(2rem,4.2vw,3.2rem);margin-bottom:.9rem}
.sec__head p{color:var(--greige-300);margin:0;max-width:var(--measure)}

.vid{position:relative}
.vid__frame{
  position:relative;width:100%;aspect-ratio:16/9;
  background:var(--char-800);border:1px solid var(--char-700);
  overflow:hidden;
}
.vid__facade{
  position:absolute;inset:0;width:100%;height:100%;
  padding:0;border:0;background:none;cursor:pointer;display:block;
}
.vid__facade img{width:100%;height:100%;object-fit:cover}
.vid__facade::after{
  content:"";position:absolute;inset:0;
  background:rgba(26,22,20,0);transition:background .25s;
}
.vid__facade:hover::after{background:rgba(26,22,20,.18)}
.vid__play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;align-items:stretch;pointer-events:none;
}
.vid__play span{
  background:var(--bone-100);color:var(--ink-900);
  font:700 var(--fs-micro)/1 var(--display);letter-spacing:.16em;text-transform:uppercase;
  display:flex;align-items:center;padding:0 1.3rem;min-height:60px;
}
.vid__play i{
  display:grid;place-items:center;width:60px;background:var(--ember-500);
  transition:width .25s, background .25s;
}
.vid__facade:hover .vid__play i{width:68px;background:var(--ember-600)}
.vid__blocked{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  max-width:calc(100% - 2rem);box-sizing:border-box;
  background:var(--bone-100);color:var(--ink-900);
  font:700 var(--fs-micro)/1.4 var(--display);letter-spacing:.12em;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;text-align:center;
  padding:1rem 1.3rem;min-height:60px;pointer-events:none;
}
.vid__facade[hidden],.vid__play[hidden],.vid__blocked[hidden]{display:none}
.vid__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid__meta{
  display:flex;flex-wrap:wrap;gap:1.4rem;justify-content:space-between;
  align-items:baseline;margin-top:1.1rem;
  color:var(--steel-400);font-size:.9rem;
}
.vid__meta a{
  color:var(--ember-500);text-underline-offset:3px;
  display:inline-flex;align-items:center;min-height:24px;
}
.vid__note{color:var(--steel-400);font-size:.86rem;margin:.7rem 0 0;max-width:var(--measure)}

.pipe{display:grid;gap:1px;background:var(--char-700);border:1px solid var(--char-700)}
@media (min-width:820px){.pipe{grid-template-columns:1fr 1fr}}
.pipe__step{background:var(--char-900);padding:1.9rem 1.7rem}
.pipe__n{
  font:800 2.6rem/1 var(--display);letter-spacing:-.04em;
  color:var(--ember-500);margin-bottom:.7rem;
}
.pipe__step h3{font-size:1.32rem;margin-bottom:.5rem}
.pipe__tool{
  font:700 var(--fs-micro)/1 var(--display);letter-spacing:.16em;text-transform:uppercase;
  color:var(--steel-400);margin-bottom:.9rem;
}
.pipe__step p{color:var(--greige-300);font-size:.95rem;margin:0;max-width:var(--measure)}

.prompts-list{margin-top:clamp(2.5rem,6vh,4rem)}
.prompt{border:1px solid var(--char-700);background:var(--char-800);margin-bottom:2.2rem}
.prompt:last-child{margin-bottom:0}
.prompt__top{
  display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-start;
  justify-content:space-between;
  padding:1.5rem 1.6rem;border-bottom:1px solid var(--char-700);
}
.prompt__id{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.prompt__n{
  font:800 1.9rem/1 var(--display);letter-spacing:-.04em;color:var(--ember-500);
}
.prompt__title{font-size:1.3rem;margin:0}
.prompt__tool{
  font:700 var(--fs-micro)/1 var(--display);letter-spacing:.16em;text-transform:uppercase;
  color:var(--steel-400);
}
.prompt__facts{
  display:flex;gap:1.1rem;flex-wrap:wrap;margin:.55rem 0 0;
  font:700 var(--fs-micro)/1.4 var(--display);letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel-400);
}
.prompt__facts span{color:var(--steel-400)}
.prompt__desc{
  color:var(--greige-300);font-size:.95rem;padding:1.3rem 1.6rem 0;margin:0;
  box-sizing:content-box;max-width:var(--measure);
}

.copy{flex-shrink:0}
.copy[data-copied="1"]{background:var(--ember-500)}
.copy[data-copied="1"] .btn__chip{background:var(--ink-900)}
.copy[data-copied="1"] .btn__chip svg{stroke:var(--ember-500)}

.prompt__body{position:relative;padding:1.3rem 1.6rem 1.6rem}
.prompt pre{
  margin:0;max-height:30rem;overflow:auto;
  max-width:min(100%, var(--pre-col));
  background:var(--char-900);border:1px solid var(--char-700);
  padding:1.25rem 1.35rem;
  font:400 .845rem/1.62 var(--body);
  color:var(--bone-100);
  white-space:pre-wrap;overflow-wrap:anywhere;tab-size:2;
}
.prompt pre::-webkit-scrollbar{width:10px}
.prompt pre::-webkit-scrollbar-track{background:var(--char-800)}
.prompt pre::-webkit-scrollbar-thumb{background:var(--steel-400)}
.prompt pre::-webkit-scrollbar-thumb:hover{background:var(--copper-400)}
.prompt pre{scrollbar-width:thin;scrollbar-color:var(--steel-400) var(--char-800)}
.prompt__fade{
  position:absolute;left:1.6rem;right:auto;bottom:1.6rem;
  width:min(100% - 3.2rem, var(--pre-col));height:2.2rem;
  pointer-events:none;opacity:1;transition:opacity .25s;
  background:linear-gradient(to top, rgba(26,22,20,.5) 0%, rgba(26,22,20,0) 100%);
}
.prompt__body[data-end="1"] .prompt__fade{opacity:0}
.prompt__foot{
  display:flex;flex-wrap:wrap;gap:.9rem;justify-content:space-between;align-items:center;
  padding:0 1.6rem 1.5rem;color:var(--steel-400);font-size:.82rem;
}

.result{
  background:var(--cream-100);color:var(--ink-900);
  border-bottom:1px solid var(--greige-300);
  padding:clamp(3.5rem,9vh,6rem) 0;
}
.result .eyebrow{color:var(--wood-800)}
.result h2{font-size:clamp(2rem,4.2vw,3.2rem);margin-bottom:1rem}
.result p{color:var(--wood-800);max-width:var(--measure)}
.result__grid{display:grid;gap:2.2rem;align-items:center}
@media (min-width:900px){.result__grid{grid-template-columns:1.05fr .95fr;gap:3.4rem}}
.result__card{
  border:1px solid var(--greige-300);background:var(--cream-200);
  padding:1.5rem;
}
.result__card dl{display:grid;grid-template-columns:auto 1fr;gap:.55rem 1.4rem;margin:0}
.result__card dt{
  font:700 var(--fs-micro)/1.6 var(--display);letter-spacing:.16em;text-transform:uppercase;
  color:var(--wood-800);
}
.result__card dd{margin:0;font-size:.93rem;color:var(--ink-900)}
.result .btn{background:var(--ink-900);color:var(--bone-100);margin-top:1.6rem}

.site-footer{position:relative;overflow:hidden;background:var(--char-900)}
.footer-main{padding-block:clamp(3rem,7vh,4.5rem) 2.5rem;position:relative;z-index:2}
.footer-main h2{font-size:clamp(1.7rem,3.4vw,2.6rem);margin-bottom:.8rem}
.footer-main p{color:var(--steel-400);max-width:var(--measure)}
.footer-main a.mail{
  color:var(--bone-100);text-decoration:none;
  border-bottom:1px solid var(--ember-500);padding-bottom:2px;
}
.footer-note{
  color:var(--steel-400);font-size:.8rem;padding-bottom:2.2rem;
  position:relative;z-index:2;max-width:var(--measure);
}

[data-reveal]{opacity:0;transform:translateY(20px)}
[data-reveal].is-in{opacity:1;transform:none;transition:opacity .4s ease-out, transform .4s ease-out}
.no-js [data-reveal]{opacity:1;transform:none}

@media (max-width:900px){
  .site-header{grid-template-columns:1fr auto;padding:0 var(--gut)}
  .site-header nav{display:none}
  .kanji--hero{opacity:.07;right:-14vw;top:14%}
}
@media (max-width:700px){
  .trust{gap:.5rem 1.4rem}
  .trust li{padding:0}
  .trust li+li{border-left:0}
}
@media (max-width:560px){
  .site-header .btn>span:first-child{padding:.7rem .85rem}
  .hero__actions .btn{width:100%;justify-content:space-between}
  .trust li{padding:0 .8rem}
  .prompt pre{font-size:.8rem;padding:1rem}
  .prompt__top,.prompt__desc,.prompt__body,.prompt__foot{padding-inline:1rem}
  .prompt__fade{left:1rem;right:auto;width:min(100% - 2rem, var(--pre-col));bottom:1rem}
}

@media (prefers-contrast:more){
  .hero__lede,.sec__head p,.pipe__step p,.prompt__desc,.vid__note,.vid__meta,.footer-main p,
  .footer-note,.trust,.prompt__foot,.prompt__facts,.prompt__facts span,.prompt__tool,.pipe__tool,
  .netbar,.netbar-sep,.netbar-role,.netbar-year,.netbar-link,.sitefoot,.foot-label,.foot-base,
  .foot-note,main.policy p,main.policy li,main.nf p,main.nf ul a{color:var(--bone-100)}
  .prompt__fade{opacity:0}
}

@media (forced-colors:active){
  .prompt__fade{display:none}
  .btn,.btn--ghost,.netbar-chip,.vid__facade{border:1px solid}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  [data-reveal]{opacity:1;transform:none}
}

@media print{
  .site-header,.vid,.hero__actions,.copy,.skip,.netbar,.sitefoot{display:none}
  body{background:#fff;color:#000}
  .prompt pre{max-height:none;overflow:visible;border:1px solid #999;color:#000;background:#fff;max-width:none}
  .prompt__fade{display:none}
}
.yt-pk{--yt-display:var(--display);--yt-display-weight:800;--yt-display-tracking:-.03em;--yt-body:var(--body);--yt-ui:var(--display);--yt-focus:var(--nf-focus);--yt-radius:0px;--yt-label-weight:800;--yt-band-gap:0}
