:root{
  --bg:#071f15;
  --bg-top:#0f5b37;
  --surface:rgba(7,35,23,0.78);
  --surface-2:rgba(0,0,0,0.22);
  --line:rgba(255,255,255,0.16);
  --text:rgba(255,255,255,0.92);
  --muted:rgba(255,255,255,0.74);
  --accent:#f6c453;
  --ok:#9ff8bf;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  min-height:100vh;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:
    linear-gradient(180deg,#0f5b37 0%,#0b462d 48%,#07261a 100%);
}
.container{
  width:min(980px, calc(100vw - 28px));
  margin:0 auto;
  padding:18px 0 34px;
}
.legal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.legal-title{
  margin:0;
  font-size:clamp(24px, 5vw, 38px);
  letter-spacing:0.02em;
}
.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:3px solid rgba(246,196,83,0.95);
  background:rgba(34,26,8,0.42);
  color:#fff2c6;
  font-size:11px;
  font-weight:900;
  padding:7px 12px;
}
.legal-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color:var(--text);
  border:1px solid rgba(255,255,255,0.22);
  border-radius:11px;
  padding:8px 11px;
  font-weight:700;
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,255,255,0.12), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(0,0,0,0.18));
}
.btn:hover{
  border-color:rgba(255,255,255,0.36);
}
.btn:focus{
  outline:none;
}
.btn:focus-visible{
  outline:2px solid rgba(246,196,83,0.78);
  outline-offset:2px;
}
.btn.primary{
  color:#fff6d5;
  border-color:rgba(246,196,83,0.74);
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,240,189,0.3), rgba(255,240,189,0) 58%),
    linear-gradient(180deg, rgba(246,196,83,0.38), rgba(168,118,25,0.28));
}
.card{
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  background:var(--surface);
  box-shadow:0 14px 28px rgba(0,0,0,0.32);
}
.card + .card{
  margin-top:12px;
}
h2{
  margin:0 0 8px;
  font-size:17px;
}
p,li{
  color:var(--muted);
  line-height:1.55;
  font-size:14px;
}
ul{
  margin:8px 0 0 18px;
  padding:0;
}
strong{color:var(--text)}
small{color:rgba(255,255,255,0.62)}
a{color:#fff3cc}
.license-block{
  margin-top:8px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,0.22);
  border-radius:12px;
  background:rgba(0,0,0,0.22);
  color:rgba(255,255,255,0.84);
  font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  white-space:pre-wrap;
  word-break:break-word;
}
.meta{
  margin-top:14px;
  color:rgba(255,255,255,0.62);
  font-size:12px;
}
.warn{
  border:1px solid rgba(255,183,183,0.4);
  border-radius:12px;
  background:rgba(122,27,27,0.2);
  color:#ffd8d8;
  padding:10px 11px;
  font-size:13px;
}
.ok{
  border:1px solid rgba(159,248,191,0.35);
  border-radius:12px;
  background:rgba(16,70,45,0.28);
  color:var(--ok);
  padding:10px 11px;
  font-size:13px;
}
@media (max-width:780px){
  .container{width:calc(100vw - 20px)}
  .card{padding:12px}
  p,li{font-size:13px}
}