/* Shared shell for the legal pages (terms / privacy / refund).
   Same tokens as index.html so the pages read as one site, but standalone —
   these must load even if the storefront's inline app script never runs. */
:root{
  --bg:#070f0c; --bg2:#0a1411; --panel:#0d1915; --panel-2:#122019;
  --line:#1d2c26; --line-2:#2a3f36;
  --mint:#35e0a2; --mint-dim:#8fd9bd; --mint-deep:#17835c;
  --text:#eaf6f0; --muted:#9db5aa;
  --disp:"Oswald",system-ui,sans-serif;
  --body:"Barlow",system-ui,sans-serif;
  --r:10px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{background:var(--bg)}
body{
  font-family:var(--body);font-size:17px;line-height:1.65;color:var(--text);
  background:
    radial-gradient(900px 520px at 50% -140px, rgba(53,224,162,.10), transparent 70%),
    var(--bg);
  min-height:100vh;display:flex;flex-direction:column;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--mint);text-decoration:none;border-bottom:1px solid rgba(53,224,162,.32)}
a:hover{border-bottom-color:var(--mint)}

/* header */
.lhead{border-bottom:1px solid var(--line);background:rgba(7,15,12,.85)}
.lhead-in{max-width:820px;margin:0 auto;padding:16px 20px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:10px;border:0}
.brand img{width:30px;height:30px;border-radius:7px;display:block}
.brand span{font-family:var(--disp);font-weight:700;font-size:19px;letter-spacing:1.4px;text-transform:uppercase;color:var(--text)}
.brand span i{color:var(--mint);font-style:normal}
.lhead .back{margin-left:auto;font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:1.6px;text-transform:uppercase}

/* body */
main{flex:1;max-width:820px;margin:0 auto;padding:38px 20px 56px;width:100%}
h1{font-family:var(--disp);font-weight:700;font-size:32px;letter-spacing:1.4px;text-transform:uppercase;line-height:1.15}
.updated{margin-top:8px;color:var(--muted);font-size:14px}
.lede{margin-top:20px;padding:16px 18px;border:1px solid var(--line-2);border-left:3px solid var(--mint);
  border-radius:var(--r);background:var(--panel);color:var(--mint-dim)}
h2{font-family:var(--disp);font-weight:600;font-size:20px;letter-spacing:1.2px;text-transform:uppercase;
  margin:34px 0 10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
h3{font-family:var(--disp);font-weight:600;font-size:16px;letter-spacing:1px;text-transform:uppercase;margin:22px 0 6px;color:var(--mint-dim)}
p{margin:10px 0}
ul,ol{margin:10px 0 10px 22px}
li{margin:6px 0}
strong{color:#fff;font-weight:600}
.note{margin:18px 0;padding:14px 16px;border:1px solid var(--line-2);border-radius:var(--r);background:var(--panel-2)}
.note.warn{border-color:rgba(255,193,94,.38);background:rgba(255,193,94,.06)}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px;display:block;overflow-x:auto}
th,td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
th{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:1.2px;text-transform:uppercase;background:var(--panel-2);color:var(--mint-dim)}

/* footer */
.lfoot{border-top:1px solid var(--line);background:var(--bg2)}
.lfoot-in{max-width:820px;margin:0 auto;padding:22px 20px;color:var(--muted);font-size:14px}
.lfoot-in nav{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:10px;
  font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:1.4px;text-transform:uppercase}
@media(max-width:600px){ body{font-size:16px} h1{font-size:26px} main{padding-top:28px} }