/* Protokol legal pages (privacy, terms, EULA, delete account).
   Relies on tokens.css + base.css. Header/footer markup is shared by all four pages. */

/* ---- site header ---- */
.site-header{border-bottom:1px solid var(--line);background:var(--bg)}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:64px}
.site-logo{display:inline-flex;align-items:center;gap:var(--s-3);min-height:var(--tap);text-decoration:none;font:600 20px/1 var(--font-display);color:var(--ink)}
.site-logo svg{flex:none;border-radius:50%;box-shadow:0 0 0 1px var(--line-strong)}
.site-back{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--s-2);font:500 14px/1 var(--font-ui);color:var(--ink-2);text-decoration:none}
.site-back:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ---- page shell ---- */
.legal-page{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
.legal{flex:1;width:100%;max-width:calc(70ch + 2 * var(--gutter));margin:0 auto;padding:var(--s-8) var(--gutter) var(--s-9)}
.legal article{font-size:16px;line-height:1.7;color:var(--ink);overflow-wrap:break-word}

/* ---- typography ---- */
.legal h1,.legal h2,.legal h3{font-family:var(--font-display);color:var(--ink);text-wrap:balance}
.legal h1{font-size:clamp(30px,5vw + 12px,44px);line-height:1.1;font-weight:600;letter-spacing:-.015em;margin-bottom:var(--s-3)}
.legal h2{font-size:clamp(22px,2vw + 14px,28px);line-height:1.2;font-weight:600;letter-spacing:-.01em;margin:var(--s-9) 0 var(--s-4);padding-top:var(--s-6);border-top:1px solid var(--line)}
.legal h3{font-size:19px;line-height:1.3;font-weight:600;margin:var(--s-7) 0 var(--s-3)}
.legal h1+.legal-meta+h2,.legal h1+h2,.legal .legal-meta+h2{margin-top:var(--s-8)}
.legal p,.legal ul,.legal ol,.legal .table-wrap{margin:0 0 var(--s-4)}
.legal .legal-meta{font-size:14px;line-height:1.4;color:var(--ink-2);margin-bottom:var(--s-6)}
.legal .legal-meta strong{font-weight:500}
.legal strong{font-weight:600}
.legal a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;word-break:break-word}
.legal a:hover{text-decoration-thickness:2px}
.legal :target{scroll-margin-top:72px}
.legal h2:target,.legal h3:target,.legal p:target{background:var(--accent-soft);box-shadow:0 0 0 8px var(--accent-soft);border-radius:2px}

/* ---- lists (base.css resets list-style) ---- */
.legal ul{list-style:disc}
.legal ol{list-style:decimal}
.legal ul,.legal ol{padding-left:1.4em}
.legal li{margin:0 0 var(--s-2);padding-left:var(--s-1)}
.legal li::marker{color:var(--ink-3)}
.legal li>ul,.legal li>ol{margin:var(--s-2) 0 0}
.legal li>ul{list-style:circle}
.legal ul.toc{list-style:none;padding:0;margin:0 0 var(--s-6)}
.legal ul.toc li{margin:0;padding:0}
.legal ul.toc a{display:inline-block;padding:var(--s-1) 0;text-decoration:none}
.legal ul.toc a:hover{text-decoration:underline}

/* ---- tables: scroll horizontally on small screens ---- */
.legal table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-collapse:collapse;margin:var(--s-5) 0 var(--s-6);font-size:15px;line-height:1.5}
.legal th,.legal td{border:1px solid var(--line-strong);padding:var(--s-3);text-align:left;vertical-align:top;min-width:120px}
.legal th{background:var(--sunken);font-weight:600}
.legal tbody tr:nth-child(even) td{background:var(--surface)}
.legal table:focus-visible{outline-offset:-2px}

/* ---- site footer ---- */
.site-footer{border-top:1px solid var(--line);background:var(--surface)}
.site-footer__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-3) var(--s-6);padding-top:var(--s-6);padding-bottom:var(--s-6)}
.site-footer__copy{font-size:14px;color:var(--ink-2)}
.site-footer__links{display:flex;flex-wrap:wrap;gap:0 var(--s-5)}
.site-footer__links a{display:inline-flex;align-items:center;min-height:var(--tap);font-size:14px;color:var(--ink-2);text-decoration:none}
.site-footer__links a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

@media (max-width:600px){
  .legal{padding-top:var(--s-6);padding-bottom:var(--s-8)}
  .legal h2{margin-top:var(--s-8)}
  .site-footer__inner{flex-direction:column;align-items:flex-start}
}
@media print{
  .site-header,.site-footer,.skip{display:none}
  .legal{max-width:none;padding:0}
  .legal table{display:table}
}

/* ---- breadcrumb ---- */
.legal .crumbs{margin:calc(-1 * var(--s-5)) 0 var(--s-5)}
.legal .crumbs ol{padding:0;margin:0;list-style:none}
.legal .crumbs li{margin:0;padding:0}
.legal .crumbs a{color:var(--ink-2);text-decoration:underline}