@font-face { font-family:'Bricolage Grotesque'; font-style:normal; font-weight:200 800; font-display:swap; src:url('/assets/ds/assets/fonts/bricolage-grotesque-var-latin.woff2') format('woff2'); }
:root { --ink:#1c1420; --mute:#6b6470; --line:rgba(28,20,32,.1); --pink:#ec4899; --pink-deep:#be185d; --bg:#fffdfb; --legal-display:'Bricolage Grotesque',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
* { box-sizing:border-box; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; color:var(--ink); background:var(--bg); line-height:1.7; -webkit-font-smoothing:antialiased; }
.legal-head { border-bottom:1px solid var(--line); position:sticky; top:0; background:rgba(255,253,251,.9); backdrop-filter:blur(8px); z-index:5; }
.legal-head__in { max-width:820px; margin:0 auto; padding:16px 22px; display:flex; align-items:center; justify-content:space-between; }
.legal-brand { display:flex; align-items:center; gap:9px; text-decoration:none; color:var(--ink); font-family:var(--legal-display); font-weight:800; font-size:18px; }
.legal-brand img { height:26px; }
.legal-head a.back { color:var(--mute); text-decoration:none; font-size:14px; font-weight:600; }
.legal-head a.back:hover { color:var(--pink-deep); }
main.legal { max-width:820px; margin:0 auto; padding:44px 22px 80px; }
main.legal h1 { font-family:var(--legal-display); font-weight:800; font-size:clamp(28px,5vw,36px); letter-spacing:-1px; margin:0 0 6px; }
.legal__meta { color:var(--mute); font-size:14px; margin:0 0 12px; }
.legal__note { background:rgba(236,72,153,.06); border:1px solid rgba(236,72,153,.18); border-radius:12px; padding:12px 16px; font-size:13.5px; color:var(--pink-deep); margin:0 0 32px; }
main.legal h2 { font-family:var(--legal-display); font-weight:700; font-size:20px; margin:34px 0 10px; letter-spacing:-.3px; }
main.legal p, main.legal li { color:#2c2632; font-size:15.5px; }
main.legal ul { padding-left:20px; margin:8px 0; }
main.legal li { margin:6px 0; }
main.legal a { color:var(--pink-deep); }
main.legal strong { font-weight:700; }
.legal-foot { border-top:1px solid var(--line); }
.legal-foot__in { max-width:820px; margin:0 auto; padding:22px; display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; color:var(--mute); font-size:13.5px; }
.legal-foot nav a { color:var(--mute); text-decoration:none; margin-left:16px; }
.legal-foot nav a:first-child { margin-left:0; }
.legal-foot a:hover { color:var(--pink-deep); }

/* ── 3-column docs layout (GitBook-style): left menu · content · "On this page" ── */
.legal-head__in, .legal-foot__in { max-width:1180px; }
.legal-layout { max-width:1180px; margin:0 auto; padding:0 22px; display:grid; gap:48px; grid-template-columns:230px minmax(0,1fr) 210px; align-items:start; }
.legal-layout main.legal { max-width:none; margin:0; padding:44px 0 80px; }
.legal-side { position:sticky; top:74px; align-self:start; padding-top:48px; max-height:calc(100vh - 74px); overflow:auto; }
.legal-side__title { font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--mute); margin:0 0 10px; }
.legal-nav nav, .legal-toc nav { display:flex; flex-direction:column; gap:1px; }
.legal-nav a { font-size:14px; color:var(--mute); text-decoration:none; padding:7px 11px; border-radius:8px; border-left:2px solid transparent; line-height:1.35; }
.legal-nav a:hover { background:rgba(28,20,32,.04); color:var(--ink); }
.legal-nav a.active { color:var(--pink-deep); font-weight:700; background:rgba(236,72,153,.07); border-left-color:var(--pink); }
.legal-toc a { font-size:13px; color:var(--mute); text-decoration:none; padding:5px 11px; border-left:2px solid var(--line); line-height:1.4; }
.legal-toc a:hover { color:var(--ink); }
.legal-toc a.on { color:var(--pink-deep); border-left-color:var(--pink); font-weight:600; }
@media (max-width:1040px){ .legal-toc { display:none; } .legal-layout { grid-template-columns:220px minmax(0,1fr); gap:40px; } }
@media (max-width:720px){ .legal-nav { display:none; } .legal-layout { grid-template-columns:1fr; padding:0 18px; } .legal-layout main.legal { padding:32px 0 64px; } }