@font-face{font-family:'General Sans';src:url('/GeneralSans-Variable.woff2') format('woff2-variations');font-weight:200 700;font-display:swap;}
@font-face{font-family:'Manrope';src:url('/Manrope-Variable.woff2') format('woff2-variations');font-weight:200 800;font-display:swap;}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;background:#fffef6;color:#1a1a1a;color-scheme:light;font-family:'Manrope',system-ui,sans-serif;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
@view-transition{navigation:auto;}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s;animation-timing-function:cubic-bezier(.2,.7,.25,1);}
::view-transition-group(root),::view-transition-image-pair(root){background-color:#fffef6;}
::view-transition-old(root){animation-name:hp-fade-out;}
::view-transition-new(root){animation-name:hp-fade-in;}
@keyframes hp-fade-out{to{opacity:0;transform:translateY(-8px);}}
@keyframes hp-fade-in{from{opacity:0;transform:translateY(8px);}}
@keyframes art-rise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}

.hpn-nav{position:fixed;top:24px;left:50%;transform:translateX(-50%);width:calc(100% - 48px);max-width:1080px;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:rgba(255,254,246,0.26);border-radius:16px;z-index:100;transition:background-color .35s ease, backdrop-filter .35s ease, border-color .35s ease, box-shadow .35s ease;backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%);border:1px solid rgba(255,255,255,0.30);box-shadow:0 2px 14px rgba(0,0,0,0.04);}
.hpn-nav.nav-glass{background:rgba(255,254,246,0.55);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);border:1px solid rgba(0,0,0,0.06);box-shadow:0 6px 24px rgba(0,0,0,0.05);}
.hpn-logo-link{display:flex;align-items:center;position:relative;z-index:2;}
.hpn-logo{height:30px;width:auto;display:block;}
.hpn-nav-links{position:absolute;left:50%;top:50%;transform:translate(calc(-50% - 55px),-50%);display:flex;align-items:center;gap:32px;}
.hpn-nav-link{font-size:14px;font-weight:500;color:#1a1a1a;white-space:nowrap;transition:color .2s ease;}
.hpn-nav-link:hover{color:#6F7FAD;}
.hpn-right{display:flex;align-items:center;gap:12px;position:relative;z-index:2;}
.hopin-login-btn{display:inline-flex;align-items:center;gap:8px;background:#6F7FAD;color:#fff;text-decoration:none;font-family:'Manrope',sans-serif;font-size:14px;font-weight:500;padding:10px 22px;border-radius:8px;transition:all 0.25s ease;box-shadow:0 1px 3px rgba(111,127,173,0.3);}
.hopin-login-btn:hover{background:#5A6A94;transform:translateY(-1px);box-shadow:0 4px 12px rgba(111,127,173,0.35);}
.hopin-login-btn .dot-grid{display:inline-grid;grid-template-columns:repeat(2,4px);gap:2px;margin-left:4px;transition:transform 0.5s cubic-bezier(0.22,1,0.36,1);}
.hopin-login-btn:hover .dot-grid{transform:rotate(45deg);}
.hopin-login-btn .dot-item{width:4px;height:4px;background:#fff;border-radius:1px;}
.hopin-login-btn:hover .dot-item{animation:dotShiver 1.5s ease-in-out infinite;}
.hopin-login-btn:hover .dot-item:nth-child(2){animation-delay:0.08s;}
.hopin-login-btn:hover .dot-item:nth-child(3){animation-delay:0.16s;}
.hopin-login-btn:hover .dot-item:nth-child(4){animation-delay:0.24s;}
@keyframes dotShiver{0%{transform:translate(0,0);}20%{transform:translate(0.3px,-0.2px);}40%{transform:translate(-0.2px,0.3px);}60%{transform:translate(0.2px,0.2px);}80%{transform:translate(-0.3px,-0.2px);}100%{transform:translate(0,0);}}
.hopin-social{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:7px;transition:transform .2s ease, background .2s ease;text-decoration:none;}
.hopin-social img{display:block;width:22px;height:22px;object-fit:contain;filter:grayscale(1);opacity:0.55;transition:filter .3s ease, opacity .3s ease;}
.hopin-social:hover img{filter:none;opacity:1;}
.hopin-social:hover{background:rgba(0,0,0,0.04);transform:translateY(-1px);}

::selection{background:#d1d5e1!important;color:#000!important;}
::-moz-selection{background:#d1d5e1!important;color:#000!important;}
.hopin-noise{position:fixed;inset:0;width:100%;height:100%;opacity:0.13;pointer-events:none;z-index:5;background:url('/noise.avif') top left repeat;-webkit-user-select:none;user-select:none;}

.article{max-width:800px;margin:0 auto;padding:150px 24px 120px;position:relative;z-index:10;}
.back{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:#6F7FAD;margin-bottom:28px;font-weight:500;}
.back:hover{color:#5A6A94;}
.meta{display:flex;gap:10px;align-items:center;font-size:13px;color:#999;margin-bottom:16px;animation:art-rise .7s cubic-bezier(.2,.7,.25,1) .08s both;}
.meta .cat{color:#6F7FAD;font-weight:500;}
.meta .dot{width:3px;height:3px;border-radius:50%;background:#ccc;}
.article h1{font-family:'General Sans',sans-serif;font-size:clamp(36px,5vw,56px);font-weight:500;line-height:1.08;letter-spacing:-0.025em;margin:0 0 16px;animation:art-rise .7s cubic-bezier(.2,.7,.25,1) .15s both;}
.article .byline{font-size:14px;color:#777;margin:0 0 44px;animation:art-rise .7s cubic-bezier(.2,.7,.25,1) .22s both;}
.article h2{font-family:'General Sans',sans-serif;font-size:clamp(22px,3vw,30px);font-weight:560;line-height:1.18;letter-spacing:-0.018em;margin:44px 0 14px;color:#1a1a1a;}
.article h3{font-family:'General Sans',sans-serif;font-size:20px;font-weight:560;line-height:1.25;letter-spacing:-0.01em;margin:28px 0 10px;color:#1a1a1a;}
.article p{font-size:17px;line-height:1.7;color:#3a3a3a;margin:0 0 20px;animation:art-rise .7s cubic-bezier(.2,.7,.25,1) .25s both;}
.article ul,.article ol{margin:0 0 24px;padding-left:22px;color:#3a3a3a;font-size:17px;line-height:1.7;}
.article li{margin:0 0 10px;}
.article p a,.article li a{color:#6F7FAD;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .2s ease;}
.article p a:hover,.article li a:hover{color:#5A6A94;text-decoration-thickness:2px;}
.legal-note{margin:30px 0;padding:18px 20px;border-left:3px solid #6F7FAD;background:rgba(111,127,173,0.08);border-radius:0 8px 8px 0;color:#303030;}
.legal-note p{margin:0;font-size:16px;line-height:1.65;}
.legal-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:22px 0 32px;}
.legal-primary{display:inline-flex;align-items:center;justify-content:center;background:#6F7FAD;color:#fff!important;text-decoration:none!important;font-size:15px;font-weight:600;padding:12px 20px;border-radius:8px;box-shadow:0 1px 3px rgba(111,127,173,0.3);transition:background .25s ease,transform .25s ease,box-shadow .25s ease;}
.legal-primary:hover{background:#5A6A94;transform:translateY(-1px);box-shadow:0 4px 12px rgba(111,127,173,0.35);}
.legal-secondary{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(26,26,26,0.14);color:#1a1a1a!important;text-decoration:none!important;font-size:15px;font-weight:600;padding:11px 18px;border-radius:8px;background:rgba(255,255,255,0.34);transition:border-color .25s ease,color .25s ease,background .25s ease;}
.legal-secondary:hover{border-color:#6F7FAD;color:#5A6A94!important;background:rgba(111,127,173,0.06);}
.legal-footer{margin-top:56px;padding-top:24px;border-top:1px solid rgba(26,26,26,0.1);display:flex;flex-wrap:wrap;gap:14px 22px;color:#777;font-size:14px;}
.legal-footer a{color:#6F7FAD;font-weight:500;}
.contact-line{font-weight:600;color:#1a1a1a;}

@media (max-width:980px){
  .hpn-nav-links{gap:20px;transform:translate(calc(-50% - 34px),-50%);}
  .hpn-nav-link{font-size:13px;}
}
@media (max-width:780px){
  .hpn-nav{width:calc(100% - 32px);padding:0 16px;height:56px;}
  .hpn-nav-links{display:none;}
  .hpn-logo{height:26px;}
  .hopin-social{display:none;}
  .hopin-login-btn{padding:9px 16px;font-size:13px;border-radius:7px;}
  .article{padding:118px 24px 88px;}
  .article h1{font-size:clamp(34px,11vw,48px);}
  .article p,.article ul,.article ol{font-size:16px;line-height:1.68;}
}

/* ------------------------------------------------------------------
   Developer / agent documentation pages (/docs, /api, /about, /contact).
   Generated by tools/agent-surface/build.mjs from the same source as
   their .md siblings, so they use code blocks and tables that the legal
   pages never needed. Scoped under .article so nothing else moves.
   ------------------------------------------------------------------ */
.article code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:0.88em;background:rgba(26,26,26,0.055);border:1px solid rgba(26,26,26,0.07);border-radius:5px;padding:1px 5px;color:#2b2b2b;overflow-wrap:anywhere;}
.article pre{margin:0 0 24px;padding:16px 18px;background:#1e2029;border-radius:10px;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.article pre code{display:block;background:none;border:0;padding:0;border-radius:0;color:#e6e6ec;font-size:14px;line-height:1.6;white-space:pre;overflow-wrap:normal;}
/* Wide tables scroll inside their own box; the page body never does. */
.article .table-scroll{margin:0 0 26px;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid rgba(26,26,26,0.1);border-radius:10px;}
.article table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.55;color:#3a3a3a;}
.article th,.article td{text-align:left;padding:12px 16px;border-bottom:1px solid rgba(26,26,26,0.08);vertical-align:top;}
.article th{font-weight:600;color:#1a1a1a;background:rgba(26,26,26,0.03);white-space:nowrap;}
.article tbody tr:last-child td{border-bottom:0;}
.article td a{color:#6F7FAD;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere;}
.article h4{font-family:'General Sans',sans-serif;font-size:17px;font-weight:600;margin:24px 0 8px;color:#1a1a1a;}
@media (max-width:780px){
  .article pre code{font-size:13px;}
  .article table{font-size:14px;}
  .article th,.article td{padding:10px 12px;}
}