:root{
  --bg:#08131a;
  --bg-soft:#0f2029;
  --card:#102832;
  --card-2:#153644;
  --text:#ecf6f7;
  --muted:#a5c1c6;
  --line:rgba(255,255,255,.10);
  --accent:#5fd0b0;
  --accent-2:#7fd6ff;
  --accent-3:#8fe388;
  --warn:#ffd58f;
  --danger:#ffb5b5;
  --shadow:0 18px 46px rgba(0,0,0,.34);
  --radius:24px;
  --radius-sm:16px;
  --max:1100px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(1200px 500px at 20% -10%, rgba(95,208,176,.14), transparent 55%),
    radial-gradient(900px 500px at 90% 0%, rgba(127,214,255,.12), transparent 50%),
    linear-gradient(180deg, #071118 0%, #0a1820 100%);
  min-height:100vh;
}
a{color:inherit}
.shell{max-width:var(--max); margin:0 auto; padding:24px 20px 56px}
.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px; padding:8px 0 20px;
}
.brand{display:flex; align-items:center; gap:14px; text-decoration:none}
.logo{
  width:46px; height:46px; border-radius:15px;
  background:
    radial-gradient(circle at 50% 44%, rgba(255,255,255,.08), transparent 58%),
    #071118 url("/assets/halinor-logo.png") center/118% auto no-repeat;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 8px 24px rgba(0,0,0,.26);
  position:relative;
}
.brand-text h1{margin:0; font-size:1.12rem; font-weight:700; letter-spacing:.01em;}
.brand-text p{margin:2px 0 0; color:var(--muted); font-size:.92rem;}
.nav{display:flex; flex-wrap:wrap; gap:10px;}
.nav a{
  text-decoration:none; color:var(--muted); font-size:.94rem; padding:10px 14px; border-radius:999px;
  border:1px solid var(--line); background:rgba(255,255,255,.03);
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--text); border-color:rgba(255,255,255,.18)}
.back-row{margin:6px 0 16px;}
.back-btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:999px; text-decoration:none;
  border:1px solid var(--line); background:rgba(255,255,255,.03); color:var(--muted); font-size:.94rem;
}
.back-btn:hover{color:var(--text); border-color:rgba(255,255,255,.18)}
.hero{
  display:grid; grid-template-columns:1.2fr .8fr; gap:22px; align-items:stretch; margin-top:10px;
}
.card{
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter: blur(12px);
}
.hero-main{padding:34px;}
.kicker{
  display:inline-flex; align-items:center; gap:10px; padding:8px 12px;
  border-radius:999px; background:rgba(95,208,176,.11); border:1px solid rgba(95,208,176,.25);
  color:#bdf3e2; font-size:.9rem; font-weight:600;
}
.hero h2{margin:18px 0 12px; font-size:clamp(2rem, 5vw, 3.6rem); line-height:1.02; letter-spacing:-.02em;}
.hero p{margin:0; color:var(--muted); font-size:1.05rem; line-height:1.65;}
.hero-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:24px;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:0 18px; border-radius:16px; text-decoration:none; font-weight:700;
  border:1px solid transparent; cursor:pointer; font:inherit;
}
.btn-primary{
  background:linear-gradient(135deg, #4bc7a9 0%, #3f7bd3 100%);
  color:white; box-shadow:0 10px 26px rgba(59,117,189,.28);
}
.btn-secondary{
  background:rgba(255,255,255,.05); color:var(--text); border-color:var(--line);
}
.btn-soft{
  background:rgba(95,208,176,.10); color:#c9f8ea; border-color:rgba(95,208,176,.22);
}
.hero-side{padding:22px; display:grid; gap:14px;}
.metric{
  padding:18px 18px 16px; border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border:1px solid var(--line);
}
.metric strong{display:block; font-size:1.4rem; margin-bottom:6px}
.metric span{color:var(--muted); line-height:1.45}
.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:22px;}
.info{padding:22px;}
.info h3{margin:0 0 10px; font-size:1.1rem}
.info p{margin:0; color:var(--muted); line-height:1.6}
.section{margin-top:26px;}
.section-head{display:flex; align-items:end; justify-content:space-between; gap:14px; margin-bottom:14px;}
.section-head h3{margin:0; font-size:1.45rem;}
.section-head p{margin:6px 0 0; color:var(--muted);}
.list{display:grid; gap:12px;}
.list .row{display:flex; gap:14px; align-items:flex-start; padding:18px 18px; border-top:1px solid var(--line);}
.list .row:first-child{border-top:none}
.dot{
  width:12px; height:12px; border-radius:999px; margin-top:7px;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  box-shadow:0 0 0 6px rgba(95,208,176,.10); flex:0 0 auto;
}
.row h4{margin:0 0 6px; font-size:1rem}
.row p{margin:0; color:var(--muted); line-height:1.58}
.footer{
  margin-top:30px; padding:20px 6px 4px; color:var(--muted); font-size:.94rem;
  display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between;
}
.footer nav{display:flex; flex-wrap:wrap; gap:10px}
.footer nav a{text-decoration:none; color:var(--muted)}
.page{max-width:860px; margin:0 auto;}
.page .card{padding:28px}
.page h2{margin:0 0 12px; font-size:2rem}
.page h3{margin:22px 0 10px; font-size:1.06rem}
.page p, .page li, .page address{color:var(--muted); line-height:1.7}
.page ul{padding-left:1.2rem}
.notice{
  margin:16px 0 0; padding:14px 16px; border-radius:18px; font-size:.95rem;
  border:1px solid rgba(127,214,255,.18); background:rgba(127,214,255,.08); color:#d6f5ff;
}
.notice.warn{
  border-color:rgba(255,213,143,.18); background:rgba(255,213,143,.08); color:#fff0cf;
}
.notice.err{
  border-color:rgba(255,181,181,.18); background:rgba(255,181,181,.08); color:#ffe1e1;
}
.invite-wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:22px;}
.code-box{
  margin-top:16px; display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:16px 18px; border-radius:18px; background:rgba(255,255,255,.035); border:1px solid var(--line);
}
.code{font-size:1.55rem; letter-spacing:.14em; font-weight:800; font-variant-numeric:tabular-nums;}
.muted{color:var(--muted)}
.meta-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; margin-top:16px;}
.meta{padding:14px; border-radius:16px; background:rgba(255,255,255,.03); border:1px solid var(--line);}
.meta span{display:block; color:var(--muted); font-size:.9rem; margin-bottom:6px}
.meta strong{display:block; font-size:1rem}
.copy-badge{display:inline-block; margin-left:8px; font-size:.84rem; color:#c7ffe8;}
.small{font-size:.94rem}
hr.sep{border:none; border-top:1px solid var(--line); margin:22px 0;}
.contact-card{margin-top:18px; padding:18px; border-radius:18px; border:1px solid var(--line); background:rgba(255,255,255,.03);}
.contact-card h3{margin-top:0}
.contact-card address{font-style:normal}

.rule-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:14px 0 4px}
.rule-box{padding:16px; border-radius:18px; background:rgba(255,255,255,.03); border:1px solid var(--line)}
.rule-box h4{margin:0 0 8px; font-size:1rem}
.rule-box p{margin:0; color:var(--muted); line-height:1.6}
@media (max-width: 720px){.rule-grid{grid-template-columns:1fr}}

@media (max-width: 920px){.hero, .invite-wrap, .grid{grid-template-columns:1fr}}
@media (max-width: 640px){
  .shell{padding:18px 14px 46px}
  .hero-main, .hero-side, .page .card{padding:22px}
  .topbar{align-items:flex-start; flex-direction:column}
  .nav{width:100%}
  .nav a{flex:1 1 auto; text-align:center}
  .hero h2{font-size:2.15rem}
  .meta-grid{grid-template-columns:1fr}
}
.download-hero{display:flex; gap:18px; align-items:center; margin-bottom:20px}
.download-logo{
  width:96px; height:96px; border-radius:28px; flex:0 0 auto;
  background:#071118 url("/assets/halinor-logo.png") center/116% auto no-repeat;
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 14px 34px rgba(0,0,0,.30);
}
.download-page .kicker{margin-bottom:10px}
.download-page h2{margin-bottom:10px}
.download-actions{margin-top:8px; margin-bottom:4px}
.compact-list .row{padding-left:0; padding-right:0}
@media (max-width: 640px){.download-hero{align-items:flex-start}.download-logo{width:74px;height:74px;border-radius:22px}}