/* OCT LEGAL · the footer line and the two legal pages, in the hub's own look. Same origin, no inline style. */

/* ── the footer line: the hub's glass pill (like its MUSIC OFF button), fixed, never adds a scrollbar ── */
.oct-legal{position:fixed;right:12px;bottom:10px;z-index:2147482000;display:flex;align-items:center;gap:14px;
  margin:0;padding:6px 14px;border-radius:999px;border:1px solid rgba(201,162,90,.22);
  background:rgba(28,16,13,.62);color:#b7a887;
  font:600 10px/1.4 Cinzel,"Trajan Pro",Georgia,serif;letter-spacing:1.4px;text-transform:uppercase;
  -webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);
  box-shadow:0 8px 22px rgba(0,0,0,.45);opacity:.82;transition:opacity .15s ease,color .15s ease;pointer-events:auto;white-space:nowrap}
.oct-legal:hover,.oct-legal:focus-within{opacity:1}
.oct-legal a{color:inherit!important;text-decoration:none!important;font:inherit!important;letter-spacing:inherit!important;
  text-transform:inherit!important;background:none!important;padding:0!important;border:0!important;transition:color .15s ease}
.oct-legal a:hover,.oct-legal a:focus-visible{color:#f0d69a!important;outline:none}
.oct-legal-c{display:none}
/* the place is chosen by /_oct/legal.js: bottom right, bottom left or bottom centre, whichever is free */
.oct-legal.ol-br{left:auto;right:12px;transform:none}
.oct-legal.ol-bl{right:auto;left:12px;transform:none}
.oct-legal.ol-bc{right:auto;left:50%;transform:translateX(-50%)}
.oct-legal.ol-tight{opacity:.6;padding:4px 11px;gap:11px;font-size:9px}
@media (max-width:640px){.oct-legal{right:auto;left:50%;transform:translateX(-50%);bottom:6px;gap:11px;font-size:9px;padding:5px 12px}}
@media print{.oct-legal{display:none!important}}

/* ── the two legal pages: the hub's door card ── */
body.lp{--ink:#f2e6cf;--dim:#b7a887;--ash:#8a7c62;--gold:#e0be6f;--gold2:#f0d69a;--line:rgba(201,162,90,.2);--rline:rgba(160,40,44,.35);
  margin:0;height:100vh;height:100dvh;overflow:hidden;display:grid;place-items:center;position:relative;
  background:#0a0505;color:var(--ink);font-family:"EB Garamond",Georgia,serif;-webkit-font-smoothing:antialiased}
html:has(body.lp){height:100%;background:#0a0505}
body.lp::before{content:"";position:fixed;inset:0;pointer-events:none;
  background:
    radial-gradient(62% 52% at 18% 2%, rgba(161,28,34,.22) 0%, rgba(161,28,34,.13) 24%, rgba(161,28,34,.05) 48%, transparent 84%),
    radial-gradient(56% 48% at 85% 4%, rgba(224,190,111,.13) 0%, rgba(224,190,111,.06) 32%, transparent 80%),
    radial-gradient(135% 105% at 50% -14%, transparent 38%, rgba(0,0,0,.10) 60%, rgba(0,0,0,.26) 78%, rgba(0,0,0,.44) 90%, rgba(0,0,0,.60) 100%)}
.lp *{box-sizing:border-box}
.lp-card{position:relative;width:min(640px,92vw);max-height:94dvh;overflow-y:auto;padding:28px 32px 22px;border-radius:18px;
  border:1px solid var(--line);border-top-color:var(--rline);background:rgba(26,15,12,.72);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);
  box-shadow:0 30px 80px rgba(0,0,0,.6);scrollbar-width:thin;scrollbar-color:rgba(201,162,90,.25) transparent}
.lp-crest{display:block;width:58px;height:58px;object-fit:contain;margin:0 auto 10px;filter:drop-shadow(0 4px 14px rgba(224,190,111,.3))}
.lp h1{font-family:Cinzel,serif;font-weight:700;font-size:18px;letter-spacing:3px;color:var(--gold2);text-align:center;margin:0 0 4px;
  text-shadow:0 2px 26px rgba(224,190,111,.22)}
.lp-d{text-align:center;color:var(--ash);font-size:12px;letter-spacing:.5px;margin:0 0 16px}
.lp-i{margin:0 0 14px;font-size:15.5px;line-height:1.55;color:var(--ink);text-align:center}
.lp details{border-top:1px solid var(--line)}
.lp details:last-of-type{border-bottom:1px solid var(--line)}
.lp summary{cursor:pointer;list-style:none;padding:11px 4px;display:flex;justify-content:space-between;align-items:center;
  font-family:Cinzel,serif;font-weight:600;color:var(--gold);font-size:12.5px;letter-spacing:1.6px;text-transform:uppercase;transition:color .15s}
.lp summary::-webkit-details-marker{display:none}
.lp summary::after{content:"+";color:var(--ash);font-family:"EB Garamond",Georgia,serif;font-size:19px;line-height:1;transition:transform .2s}
.lp details[open] summary::after{transform:rotate(45deg)}
.lp summary:hover{color:var(--gold2)}
.lp-b{padding:0 4px 13px;font-size:15.5px;line-height:1.55}
.lp-b p{margin:0 0 8px}
.lp-b ul{margin:0 0 8px;padding-left:18px}
.lp-b li{margin:0 0 6px}
.lp-b li::marker{color:var(--gold)}
.lp-b b{color:var(--gold2);font-weight:600}
.lp a{color:var(--gold2);text-decoration:underline;text-decoration-color:rgba(240,214,154,.4);text-underline-offset:2px}
.lp a:hover{text-decoration-color:var(--gold2)}
.lp-n{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;margin-top:16px;
  font-family:Cinzel,serif;font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase}
.lp-n a{color:var(--dim);text-decoration:none}
.lp-n a:hover{color:var(--gold2)}
@media (max-width:640px){.lp-card{padding:22px 18px 18px;border-radius:14px}.lp h1{font-size:16px;letter-spacing:2.4px}.lp-i,.lp-b{font-size:15px}}
