/* Terms of Service and Privacy Policy. Builds on home.css (tokens, nav, buttons, footer, keyframes rise/fadeup). */

/* Switching between Terms and Privacy cross-fades the page and slides the yellow tab (where supported). */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.45s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-group(legal-tab){animation-duration:.5s;animation-timing-function:cubic-bezier(.22,1,.36,1)}

/* centered frame shared by the hero and the document */
.legal-frame{width:100%;max-width:1080px;margin-inline:auto}

/* reading progress */
.legal-progress{position:fixed;top:0;left:0;right:0;z-index:60;height:2px;pointer-events:none}
.legal-progress i{display:block;height:100%;background:var(--duck);transform-origin:left;transform:scaleX(0);box-shadow:0 0 12px rgb(255 207 38 / .5)}

/* ---------- hero ---------- */
.legal-hero{position:relative;isolation:isolate;overflow:hidden;padding-top:calc(var(--nav-h) + clamp(88px,10vw,148px));padding-bottom:clamp(56px,7vw,96px)}
.legal-hero-inner{display:flex;flex-direction:column;align-items:center;text-align:center}
.legal-title{margin-top:0;font-size:clamp(46px,7.6vw,124px);letter-spacing:-.055em;line-height:1;view-transition-name:legal-title}
.legal-title .line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.legal-title .line>span{display:block}
.legal-meta{margin-top:22px;font:400 14px/1.5 var(--font-mono);color:var(--paper-faint)}
.legal-meta time{color:var(--paper-dim)}
.legal-switch{position:relative;display:inline-flex;gap:4px;margin-top:32px;padding:4px;background:var(--ink-2);clip-path:var(--notch);box-shadow:inset 0 1px 0 rgb(241 236 224 / .05)}
.legal-switch a{position:relative;isolation:isolate;padding:11px 20px;font-size:15px;font-weight:500;color:var(--paper-dim);text-decoration:none;transition:color .3s var(--ease)}
.legal-switch a:hover{color:var(--paper)}
.legal-switch a[aria-current]{color:var(--ink)}
.tab-pill{position:absolute;inset:0;z-index:-1;background:var(--duck);view-transition-name:legal-tab}
.legal-switch a:not([aria-current])::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink-3);opacity:0;transition:opacity .3s var(--ease)}
.legal-switch a:not([aria-current]):hover::before{opacity:1}

/* intro motion */
.js .legal-title .line>span{transform:translateY(105%);animation:rise 1.15s var(--ease) .1s forwards}
.js .lh-fade{opacity:0;animation:fadeup 1s var(--ease) forwards}
.lh-d1{animation-delay:.05s!important}.lh-d2{animation-delay:.45s!important}.lh-d3{animation-delay:.6s!important}
.vt .legal-title .line>span,.vt .lh-fade{animation:none;transform:none;opacity:1}

/* ---------- document ---------- */
.legal-doc{padding-bottom:clamp(88px,10vw,152px)}
.legal-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(40px,5vw,72px);padding-top:48px;border-top:1px solid var(--line)}
.legal-main{min-width:0}

/* table of contents with a sliding marker */
.legal-toc{align-self:start;position:sticky;top:calc(var(--nav-h) + 40px);max-height:calc(100vh - var(--nav-h) - 72px);overflow-y:auto;scrollbar-width:none}
.legal-toc::-webkit-scrollbar{display:none}
.legal-toc details{position:relative;display:flex;flex-direction:column}
.legal-toc details::before{content:"";position:absolute;left:0;top:38px;bottom:0;width:1px;background:var(--line)}
.legal-toc summary{margin-bottom:14px;font-size:15px;font-weight:500;color:var(--paper);list-style:none;cursor:default}
.legal-toc summary::-webkit-details-marker{display:none}
.toc-bar{position:absolute;left:0;top:0;width:2px;height:0;background:var(--duck);border-radius:2px;opacity:0;
  transition:transform .55s var(--ease),height .55s var(--ease),opacity .3s}
.toc-bar.on{opacity:1}
.legal-toc a{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px;padding:6px 8px 6px 14px;
  font-size:14px;line-height:1.35;color:var(--paper-faint);text-decoration:none;transition:color .3s var(--ease),transform .4s var(--ease)}
.legal-toc a span{padding-top:1px;font:400 12px/1.4 var(--font-mono);transition:color .3s var(--ease)}
.legal-toc a:hover{color:var(--paper);transform:translateX(2px)}
.legal-toc a.active{color:var(--paper)}
.legal-toc a.active span{color:var(--duck)}

/* document text */
.legal-body{font-size:17px;line-height:1.75}
.legal-body>p:first-child{margin-bottom:28px;font-size:clamp(19px,1.6vw,22px);line-height:1.55;letter-spacing:-.01em;color:var(--paper)}
.legal-body p{margin:0 0 16px;color:var(--paper-dim)}
.legal-body h2{display:flex;align-items:baseline;gap:16px;margin:60px 0 16px;padding-top:28px;border-top:1px solid var(--line);
  font-size:clamp(24px,2.2vw,30px);font-weight:500;letter-spacing:-.035em;line-height:1.2;color:var(--paper);scroll-margin-top:calc(var(--nav-h) + 40px)}
.legal-body h2:first-of-type{margin-top:12px}
.legal-body h2 .n{flex:none;font:400 14px/1 var(--font-mono);letter-spacing:0;color:var(--duck)}
.legal-body h3{margin:32px 0 10px;font-size:19px;font-weight:500;letter-spacing:-.02em;color:var(--paper)}
.legal-body ul,.legal-body ol{margin:0 0 18px;padding-left:1.3em;color:var(--paper-dim)}
.legal-body li{margin-bottom:8px;padding-left:4px}
.legal-body li::marker{color:var(--duck)}
.legal-body strong{font-weight:500;color:var(--paper)}
.legal-body a,.legal-next a{color:var(--paper);text-decoration:none;background:linear-gradient(var(--duck),var(--duck)) 0 100% / 100% 1px no-repeat;
  padding-bottom:1px;transition:color .3s var(--ease),background-size .4s var(--ease)}
.legal-body a:hover{color:var(--ink);background-size:100% 100%}
.legal-body .legal-caps{font-size:15px;letter-spacing:.01em}
.legal-body table{width:100%;margin:0 0 18px;border-collapse:collapse;font-size:15px}
.legal-body th,.legal-body td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;color:var(--paper-dim)}
.legal-body th{font-weight:500;color:var(--paper)}

/* a section heading briefly lights up when you jump to it */
.legal-body h2.flash .n{animation:num-flash 1.2s var(--ease)}
@keyframes num-flash{0%,100%{color:var(--duck)}25%{color:var(--ink);background:var(--duck);box-shadow:0 0 0 6px var(--duck)}}

/* questions box and next link */
.legal-cta{display:flex;flex-direction:column;gap:14px;margin-top:72px;padding:clamp(28px,3.4vw,44px);background:var(--ink-2);clip-path:var(--cut);box-shadow:inset 0 1px 0 rgb(241 236 224 / .06)}
.legal-cta h2{font-size:clamp(26px,2.6vw,36px);font-weight:500;letter-spacing:-.04em;line-height:1.1}
.legal-cta p{max-width:52ch;color:var(--paper-dim)}
.legal-cta .btn-row{margin-top:8px}
.legal-next{display:flex;justify-content:flex-end;gap:10px;margin-top:28px;font-size:15px;color:var(--paper-faint)}
.legal-next a{display:inline-flex;align-items:center;gap:8px;font-weight:500;background-size:0 1px}
.legal-next a:hover{color:var(--duck);background-size:100% 1px}
.legal-next svg{width:14px;height:14px;transition:transform .4s var(--ease)}
.legal-next a:hover svg{transform:translateX(4px)}

/* scroll reveal (added by legal.js) */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* back to top */
.to-top{position:fixed;right:calc(max(16px, var(--gutter)) + env(safe-area-inset-right,0px));bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:40;
  display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;background:var(--ink-3);color:var(--paper);cursor:pointer;
  clip-path:var(--notch);box-shadow:inset 0 3px 0 var(--ghost-hi),inset 0 -4px 0 var(--ghost-lo);
  opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .4s var(--ease),transform .4s var(--ease),background-color .3s,color .3s}
.to-top.show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:var(--duck);color:var(--ink);box-shadow:inset 0 3px 0 var(--duck-hi),inset 0 -4px 0 var(--duck-deep)}
.to-top svg{width:18px;height:18px;transition:transform .4s var(--ease)}
.to-top:hover svg{transform:translateY(-2px)}

/* ---------- small screens ---------- */
@media (max-width:860px){
  .legal-grid{grid-template-columns:minmax(0,1fr);gap:32px;padding-top:32px}
  .legal-toc{position:static;max-height:none;overflow:visible;padding:16px 18px;background:var(--ink-2);clip-path:var(--cut)}
  .legal-toc details::before,.toc-bar{display:none}
  .legal-toc summary{display:flex;justify-content:space-between;margin:0;cursor:pointer}
  .legal-toc summary::after{content:"+";color:var(--duck);font-family:var(--font-mono);transition:transform .3s var(--ease)}
  .legal-toc details[open] summary{margin-bottom:10px}
  .legal-toc details[open] summary::after{transform:rotate(45deg)}
  .legal-toc a{padding-left:0}
  .legal-next{justify-content:flex-start}
}
@media (max-width:520px){
  .legal-switch a{padding:10px 14px;font-size:14px}
}

@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .js .legal-title .line>span,.js .lh-fade,.js .rv{animation:none;transform:none;opacity:1;transition:none}
  .toc-bar,.legal-toc a,.to-top{transition:none}
}