/* ============================================================
   Lucky Loki — shared styles for legal / policy pages
   ============================================================ */
:root{
  --bg:#0A0910; --bg-2:#0E0C17; --surface:#141221;
  --line:rgba(186,167,255,.10); --line-strong:rgba(186,167,255,.22);
  --text:#EDEAF7; --text-2:#ABA3C4; --text-3:#8D85A6;
  --violet:#6E56CF; --violet-hi:#7C3AED; --violet-soft:#BAA7FF;
  --jade:#1FD8A4; --danger:#FF7A7A;
  --r-sm:10px; --r-md:16px; --r-lg:24px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.001ms!important}}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:Inter,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;
  font-size:17px;line-height:1.72;-webkit-font-smoothing:antialiased;
}
a{color:var(--violet-soft)}
a:hover{color:#D9CEFF}
:focus-visible{outline:2px solid var(--jade);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:"Avenir Next",Inter,"Segoe UI",sans-serif;font-weight:600;line-height:1.2;letter-spacing:-.02em;margin:0}
p,ul,ol{margin:0}

.wrap{width:100%;max-width:820px;margin-inline:auto;padding-inline:22px}
.skip{position:absolute;left:-9999px;top:0;background:var(--violet);color:#fff;padding:12px 20px;border-radius:0 0 10px 0;z-index:100;font-weight:600}
.skip:focus{left:0}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(8,8,12,.86);backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;gap:20px;height:66px;max-width:1180px;margin-inline:auto;padding-inline:22px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--text);font-family:"Avenir Next",Inter,"Segoe UI",sans-serif;font-weight:700;font-size:18px;letter-spacing:-.02em}
.brand:hover{color:var(--text)}
.brand img{width:32px;height:32px;border-radius:9px;flex:none}
.nav-back{margin-left:auto;font-size:14.5px;color:var(--text-2);text-decoration:none;font-weight:500}
.nav-back:hover{color:var(--text)}

/* header */
.page-head{padding:clamp(48px,7vw,86px) 0 34px;position:relative;overflow:hidden}
.page-head::before{content:"";position:absolute;width:640px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(110,86,207,.34),transparent 66%);filter:blur(90px);top:-260px;left:-140px;pointer-events:none}
.crumbs{font-size:13.5px;color:var(--text-3);margin-bottom:18px;position:relative}
.crumbs a{color:var(--text-3);text-decoration:none}
.crumbs a:hover{color:var(--text-2)}
h1{font-size:clamp(31px,5vw,48px);letter-spacing:-.03em;position:relative}
.page-head .lede{color:var(--text-2);font-size:clamp(16.5px,1.7vw,19px);margin-top:20px;max-width:60ch;position:relative}
.meta{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13.5px;color:var(--text-3);position:relative}
.meta b{color:var(--text-2);font-weight:500}

/* body */
.doc{padding:10px 0 clamp(64px,8vw,110px)}
.doc h2{font-size:clamp(22px,2.8vw,29px);margin:52px 0 16px;scroll-margin-top:88px}
.doc h3{font-size:19px;margin:32px 0 12px}
.doc p{color:var(--text-2);margin:0 0 16px}
.doc strong{color:var(--text);font-weight:600}
.doc ul,.doc ol{color:var(--text-2);padding-left:22px;margin:0 0 18px}
.doc li{margin-bottom:10px}
.doc li::marker{color:var(--jade)}
.doc hr{border:none;border-top:1px solid var(--line);margin:44px 0}

/* callouts */
.note{
  border-radius:var(--r-md);border:1px solid var(--line-strong);background:var(--surface);
  padding:22px 24px;margin:26px 0;color:var(--text-2);font-size:16px
}
.note p:last-child{margin-bottom:0}
.note strong{color:var(--text)}
.note-amber{border-color:rgba(186,167,255,.28);background:rgba(110,86,207,.09)}
.note-amber strong{color:var(--violet-soft)}
.note-red{border-color:rgba(255,122,122,.32);background:rgba(255,122,122,.06)}
.note-red strong{color:#FFA3A3}
.note-mint{border-color:rgba(31,216,164,.3);background:rgba(31,216,164,.06)}
.note-mint strong{color:var(--jade)}

/* toc */
.toc{border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-2);padding:22px 24px;margin:34px 0 8px}
.toc .toc-label{font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--text-3);margin:0 0 14px;font-weight:600;font-family:"Avenir Next",Inter,"Segoe UI",sans-serif}
.toc ol{padding-left:20px;margin:0;color:var(--text-2);font-size:15.5px}
.toc li{margin-bottom:8px}
.toc a{text-decoration:none;color:var(--text-2)}
.toc a:hover{color:var(--violet-soft)}

/* prohibited grid */
.pgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:26px 0}
@media(max-width:700px){.pgrid{grid-template-columns:1fr}}
.pcard{border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-2);padding:22px}
.pcard h3{font-size:16.5px;margin:0 0 10px;display:flex;gap:10px;align-items:center}
.pcard .x{width:24px;height:24px;border-radius:7px;background:rgba(255,122,122,.12);border:1px solid rgba(255,122,122,.32);color:var(--danger);display:grid;place-items:center;font-size:12px;font-weight:700;flex:none}
.pcard ul{margin:0;padding-left:20px;font-size:15px}
.pcard li{margin-bottom:7px}

/* form */
form{margin-top:12px}
.field{margin-bottom:22px}
label{display:block;font-weight:600;font-size:15.5px;margin-bottom:8px;font-family:"Avenir Next",Inter,"Segoe UI",sans-serif}
label .req{color:var(--jade);margin-left:3px}
.hint{color:var(--text-3);font-size:14px;margin:-4px 0 10px}
input[type=text],input[type=email],input[type=url],textarea,select{
  width:100%;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-sm);
  color:var(--text);padding:13px 15px;font:inherit;font-size:16px;transition:border-color .2s,background .2s
}
textarea{min-height:130px;resize:vertical;line-height:1.6}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--violet-soft);background:#12101F}
input::placeholder,textarea::placeholder{color:var(--text-3)}
select{appearance:none;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D85A6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:18px;padding-right:44px}
.check{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px;color:var(--text-2);font-size:15.5px}
.check input{margin-top:4px;width:18px;height:18px;flex:none;accent-color:var(--violet)}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:"Avenir Next",Inter,"Segoe UI",sans-serif;font-weight:600;font-size:15.5px;
  padding:14px 26px;border-radius:999px;text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:transform .25s var(--ease),box-shadow .25s,background .25s,border-color .25s
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--violet-hi),var(--violet));color:#fff;box-shadow:0 12px 34px -12px rgba(110,86,207,.85)}
.btn-primary:hover{color:#fff}
.btn-ghost{background:rgba(255,255,255,.05);border-color:var(--line-strong);color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.1);color:var(--text)}

/* footer */
footer{border-top:1px solid var(--line);background:var(--bg-2);padding:44px 0 38px;font-size:14.5px}
.f-in{max-width:1180px;margin-inline:auto;padding-inline:22px}
.f-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-bottom:22px}
.f-links a{color:var(--text-2);text-decoration:none}
.f-links a:hover{color:var(--text)}
.f-disclosure{
  padding:18px 20px;border-radius:var(--r-md);border:1px solid rgba(31,216,164,.24);
  background:rgba(31,216,164,.05);color:var(--text-2);font-size:14px;line-height:1.6
}
.f-disclosure strong{color:var(--jade)}
.f-bottom{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);color:var(--text-3);font-size:13.5px}
