/* The mkoma legal pages on xplosion.studio (written by mkoma/tool/legal_pages.dart: edit it there, not on the site).
   The company site's colours and fonts, without its scroll animation: these pages are for reading. */
:root{
  --bg:#08080b;
  --bg-2:#111117;
  --text:#f5f5f7;
  --muted:#a4a4b2;
  --accent-1:#ff5a36;
  --accent-3:#00e5ff;
  --line:rgba(245,245,247,0.12);
  --font-head:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --gradient:linear-gradient(100deg, var(--accent-1), var(--accent-3));
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--bg); color:var(--text); font-family:var(--font-body);
  font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(70vw 50vh at 0% 0%, rgba(255,90,54,0.10), transparent 70%),
                   radial-gradient(70vw 50vh at 100% 100%, rgba(0,229,255,0.07), transparent 70%);
  background-attachment:fixed;
}
::selection{background:var(--accent-1); color:#fff;}
a{color:var(--accent-3); text-underline-offset:3px;}
a:hover{color:#7ff2ff;}

.legal-nav{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  max-width:820px; margin:0 auto; padding:1.5rem 16px;
}
.brand{display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--text);}
.wordmark{font-family:var(--font-head); font-weight:700; letter-spacing:.08em; font-size:.95rem;}
.wordmark em{font-style:normal; color:var(--muted); font-weight:500; margin-left:.25em;}
.legal-nav nav a{font-size:.9rem; color:var(--muted); text-decoration:none; border:1px solid var(--line); padding:.4rem .8rem; border-radius:999px;}
.legal-nav nav a:hover{color:var(--text); border-color:var(--muted);}

.doc{max-width:820px; margin:0 auto; padding:1rem 16px 3rem;}
.doc h1{
  font-family:var(--font-head); font-weight:700; font-size:clamp(2rem, 6vw, 3rem); line-height:1.1; margin:1.5rem 0 1rem;
  background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.doc h2{font-family:var(--font-head); font-weight:600; font-size:1.35rem; margin:2.4rem 0 .8rem; padding-top:1.4rem; border-top:1px solid var(--line);}
.doc h3{font-family:var(--font-head); font-weight:600; font-size:1.1rem; margin:1.6rem 0 .6rem;}
.doc p{margin:0 0 1rem;}
.doc .meta{color:var(--muted); font-size:.92rem;}
.doc .meta strong{color:var(--text);}
.doc ul{margin:0 0 1rem 1.2rem;}
.doc li{margin:0 0 .55rem;}
.doc strong{font-weight:600;}
.doc code{font-size:.88em; background:var(--bg-2); border:1px solid var(--line); border-radius:6px; padding:.05em .35em; overflow-wrap:anywhere;}
.table-wrap{overflow-x:auto; margin:0 0 1.2rem; border:1px solid var(--line); border-radius:12px;}
.doc table{border-collapse:collapse; width:100%; min-width:560px; font-size:.92rem;}
.doc th,.doc td{text-align:left; vertical-align:top; padding:.7rem .8rem; border-bottom:1px solid var(--line);}
.doc tr:last-child td{border-bottom:none;}
.doc th{font-family:var(--font-head); font-weight:600; background:var(--bg-2);}

.legal-foot{max-width:820px; margin:0 auto; padding:1.5rem 16px 2.5rem; border-top:1px solid var(--line); color:var(--muted); font-size:.88rem;}
.legal-foot p{margin:.3rem 0;}
.legal-foot a{color:var(--muted);}
.legal-foot a:hover{color:var(--text);}

@media print{
  body{background:#fff; color:#000;}
  .doc h1{color:#000; background:none;}
  a{color:#000;}
  .legal-nav nav,.legal-foot{display:none;}
}