:root{--bg:#090b10;--panel:#11151e;--panel2:#141925;--stroke:#252b37;--muted:#9da4b4;--white:#f5f5f7;--purple:#a985ff;--cyan:#28d8f0;--shadow:0 16px 64px #0007}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--white);background:var(--bg);font:15px/1.6 system-ui,-apple-system,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 max(5vw,20px);border-bottom:1px solid #20242b;position:sticky;top:0;background:#090b10f5;z-index:10;backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:-.7px;font-size:18px}.brand img{width:45px;height:45px;object-fit:contain}.brand-purple{color:var(--purple)}.topbar nav{display:flex;gap:24px;align-items:center;font-size:13px;color:#bcc3cf}.topbar nav a:hover,.topbar nav a.active{color:white}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:8px;border:1px solid transparent;padding:11px 19px;font-weight:650;font-size:13px;transition:.2s;background:var(--purple);color:#08070e}.btn:hover{transform:translateY(-1px);filter:brightness(1.09)}.btn-outline{background:transparent;border-color:#464856;color:white}.btn-cyan{background:var(--cyan);color:#041014}.btn-purple{background:var(--purple);color:#09070e}.shell{width:min(1180px,90%);margin:auto}.hero{min-height:615px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.28em;color:var(--purple);font-weight:750}.hero h1{font-size:clamp(64px,8vw,114px);line-height:1;letter-spacing:-.07em;margin:22px 0;font-weight:850;max-width:650px}.gradient{background:linear-gradient(105deg,#fff 40%,#ad91ff);background-clip:text;color:transparent}.hero p{font-size:19px;color:#c5c8d1;max-width:500px}.hero .subcopy{font-size:14px;color:var(--muted)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}.mark-frame{min-height:480px;position:relative;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 52% 46%,#39255933,transparent 58%)}.mark-frame:after{content:"";position:absolute;width:80%;height:1px;background:linear-gradient(90deg,transparent,#63537b,transparent);bottom:30px}.mark-frame img{width:min(420px,85%);filter:drop-shadow(0 25px 40px #0008);border-radius:50%}.section{padding:64px 0;border-top:1px solid #252a34}.section-title{font-size:clamp(26px,3.4vw,38px);line-height:1.12;letter-spacing:-.04em;margin:0 0 12px}.section-lead{color:var(--muted);margin:0 0 32px;max-width:650px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.card{background:var(--panel);border:1px solid var(--stroke);border-radius:13px;padding:24px;min-width:0}.card h3{margin:3px 0 6px;font-size:18px;letter-spacing:-.02em}.card p{margin:0;color:var(--muted);font-size:14px}.label{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--purple);font-weight:800}.link{color:var(--purple);font-size:13px;font-weight:650}.project-card{display:grid;grid-template-columns:1fr 1fr;gap:20px;overflow:hidden;padding:0}.project-copy{padding:36px}.project-image{background:linear-gradient(90deg,#11151e66,#11151e10),url('/assets/smp-banner.png') center/cover;min-height:260px}.project-card h3{font-size:30px;letter-spacing:-.04em}.social-band{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:30px;border:1px solid var(--stroke);border-radius:14px;background:var(--panel)}.footer{padding:30px 5%;display:flex;justify-content:space-between;gap:20px;color:#858c9d;border-top:1px solid #1f2530;font-size:12px}.smp-mode{--purple:#28d8f0}.smp-hero{min-height:430px;display:flex;align-items:flex-end;padding:65px 0;background:linear-gradient(90deg,#070b11f2 4%,#080d17a8 55%,#060d1750),url('/assets/smp-banner.png') center/cover}.smp-hero h1{font-size:clamp(48px,6vw,76px);line-height:1.04;letter-spacing:-.055em;margin:16px 0}.smp-hero p{max-width:650px;color:#e5e8ed}.statusline{display:flex;gap:14px;flex-wrap:wrap;padding-top:20px}.chip{padding:11px 16px;border:1px solid #284750;border-radius:8px;background:#0a1a20eb;font-size:13px}.chip b{color:var(--cyan)}.smp-mode .label,.smp-mode .link,.smp-mode .eyebrow{color:var(--cyan)}.smp-mode .btn-primary{background:var(--cyan);color:#031116}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{border:1px solid #19343b;border-radius:12px;padding:22px;background:linear-gradient(140deg,#121a23,#0d131a)}.feature .symbol{color:var(--cyan);font-size:23px;margin-bottom:10px}.feature h3{margin:0 0 8px}.feature p{color:var(--muted);font-size:14px;margin:0}.rule-item{border-bottom:1px solid var(--stroke);padding:20px 0}.rule-item h3{margin:0 0 4px}.rule-item p{color:var(--muted);margin:0}.data-table{border-collapse:collapse;width:100%;background:var(--panel);border-radius:12px;overflow:hidden}.data-table th,.data-table td{padding:15px 20px;text-align:left;border-bottom:1px solid var(--stroke)}.data-table th{color:var(--cyan)}.quiet{color:var(--muted);font-size:13px}.notice{border:1px solid #3d354e;padding:17px 20px;border-radius:12px;background:#1b1724;color:#dbcee9}.loading{padding:80px;text-align:center;color:var(--muted)}@media(max-width:850px){.topbar{height:auto;min-height:70px;padding:12px 5%;flex-wrap:wrap}.topbar nav{order:3;overflow:auto;width:100%;gap:15px;white-space:nowrap}.nav-action{display:none}.hero{grid-template-columns:1fr;gap:0;padding:70px 0 30px}.hero h1{font-size:clamp(56px,12vw,85px)}.mark-frame{min-height:260px}.mark-frame img{width:260px}.cards,.feature-grid{grid-template-columns:1fr 1fr}.project-card{grid-template-columns:1fr}.project-image{min-height:210px}.social-band{flex-wrap:wrap}}@media(max-width:520px){.cards,.feature-grid{grid-template-columns:1fr}.section{padding:45px 0}.hero h1{font-size:55px}.footer{flex-direction:column}}

/* Player handbook */
.guide-search{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:24px}.guide-search label{flex-basis:100%;font-size:13px;color:var(--muted)}.guide-search input,.guide-search select{background:#121b23;border:1px solid #284650;border-radius:8px;color:#fff;padding:12px 14px;max-width:100%}.guide-search input{flex:1;min-width:240px}.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.guide-card{display:block;background:#111922;border:1px solid #25454c;border-radius:13px;padding:24px;transition:transform .15s,border-color .15s}.guide-card:hover{transform:translateY(-2px);border-color:var(--cyan)}.guide-card[hidden]{display:none}.guide-tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);font-weight:750}.guide-card h3{font-size:20px;margin:12px 0 8px}.guide-card p,.handbook-article p{color:var(--muted)}.guide-link{color:var(--cyan);font-size:13px;font-weight:700}.handbook-article{max-width:830px;background:#111922;border:1px solid #25454c;border-radius:14px;padding:clamp(20px,4vw,40px)}.handbook-article h3{margin:28px 0 10px}.guide-steps{list-style:none;padding:0}.guide-steps li{display:flex;align-items:flex-start;gap:14px;margin:14px 0;color:#d9e5e9}.step-number{flex-shrink:0;background:#10343d;border:1px solid #285965;color:var(--cyan);width:28px;height:28px;text-align:center;border-radius:50%;font-size:13px;font-weight:700}.guide-search select{min-width:180px}@media(max-width:840px){.guide-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.guide-grid{grid-template-columns:1fr}}

/* Handbook 0.4: contextual command reference */
.command-list{display:grid;gap:10px;margin:14px 0 28px}.command-row{display:grid;grid-template-columns:minmax(140px,240px) 1fr;gap:20px;align-items:start;padding:15px 17px;border:1px solid rgba(100,200,240,.18);background:rgba(8,20,31,.42);border-radius:12px}.command-row code{color:#6feaff;white-space:normal;overflow-wrap:anywhere;font-size:.91rem}.command-row span{color:#d7e3ee}.command-row[hidden]{display:none}.command-row p{margin:5px 0 0}.command-row a{color:#7ddcf8}@media(max-width:600px){.command-row{grid-template-columns:1fr;gap:7px}}

/* v0.6 - restrained main navigation, animated cyan SMP section, page fades */
.primary-nav{display:flex;gap:25px;align-items:center;justify-content:center;min-width:0}
.primary-nav>a{white-space:nowrap}
.smp-nav-group{display:inline-flex;align-items:stretch;border:1px solid #27d7edaa;border-radius:9px;background:#0b212a55;white-space:nowrap;transition:border-color .2s,box-shadow .2s,background .2s}
.smp-nav-group:hover,.smp-nav-group.selected{border-color:#28d8f0;box-shadow:0 0 18px #28d8f022;background:#102b32}
.primary-nav .smp-nav-link{color:#98e7f2;padding:8px 4px 8px 13px;font-weight:700}
.smp-nav-toggle{border:0;background:none;color:#79dfea;padding:4px 13px;font-size:23px;line-height:1;cursor:pointer}
.smp-nav-toggle span{display:inline-block;transition:transform .25s}
.smp-nav-toggle[aria-expanded=true] span{transform:rotate(180deg)}
.smp-subnav{position:sticky;top:82px;z-index:9;display:grid;grid-template-rows:0fr;visibility:hidden;opacity:0;border-bottom:1px solid transparent;background:#07131bea;backdrop-filter:blur(18px);transition:grid-template-rows .27s ease,opacity .22s ease,border-color .22s,visibility .27s}
.smp-subnav.expanded{grid-template-rows:1fr;visibility:visible;opacity:1;border-bottom-color:#1b5663}
.smp-subnav-inner{overflow:hidden;min-height:0;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;padding:0 15px;transition:padding .27s ease}
.smp-subnav.expanded .smp-subnav-inner{padding:11px 15px}
.smp-subnav a{font-size:13px;color:#abcad0;padding:7px 15px;border-radius:7px;transition:background .2s,color .2s}
.smp-subnav a:hover,.smp-subnav a.active{background:#16404c;color:#4ee9fa}
#app{transition:opacity .16s ease,transform .16s ease;will-change:opacity,transform}
#app.page-exit{opacity:0;transform:translateY(8px)}
#app.page-enter{opacity:0;transform:translateY(9px)}
@media(max-width:1040px){.topbar{height:auto;min-height:82px;flex-wrap:wrap;padding:13px 4%}.primary-nav{order:3;width:100%;justify-content:flex-start;overflow-x:auto;padding:0 0 3px;gap:17px}.smp-subnav{top:116px}}
@media(max-width:600px){.topbar{gap:8px}.topbar .nav-action{margin-left:auto}.brand{font-size:15px}.brand img{height:34px;width:34px}.smp-subnav{top:118px}.smp-subnav-inner{justify-content:flex-start}.primary-nav{gap:13px}.primary-nav .smp-nav-link{font-size:12px}}
@media(prefers-reduced-motion:reduce){#app,.smp-subnav,.smp-subnav-inner,.smp-nav-toggle span,.smp-nav-group{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* StraightEdgeRik v0.6.2 — cyan outline navigation on the second row */
.smp-subnav { background: rgba(7, 17, 24, .97); border-bottom: 1px solid transparent; transition: opacity .18s ease, grid-template-rows .18s ease, visibility .18s, border-color .18s; }
.smp-subnav.expanded { border-bottom-color: rgba(40,216,240,.32); }
.smp-subnav-inner { gap: 10px; }
.smp-subnav a {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px 17px;
  border: 1px solid rgba(40,216,240,.66);
  border-radius: 8px;
  background: rgba(11,37,46,.45);
  color: #a5f3fc;
  font-size: 13px;
  font-weight: 650;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.smp-subnav a:hover, .smp-subnav a:focus-visible, .smp-subnav a.active {
  border-color: #28d8f0;
  background: rgba(40,216,240,.16);
  color: #fff;
}
.smp-subnav a:focus-visible { outline: 2px solid #a5f3fc; outline-offset: 3px; }
@media(max-width:600px) { .smp-subnav-inner { justify-content: flex-start; } .smp-subnav a { padding: 8px 12px; } }
@media(prefers-reduced-motion:reduce) { .smp-subnav a { transition: none; } }


/* StraightEdgeRikSMP unified navigation button */
.smp-nav-link {
    appearance: none;
    font: inherit;
    cursor: pointer;
    background: transparent;
    color: #67e8f9;
    border: 1px solid #22d3ee;
    border-radius: 8px;
    padding: 10px 16px;
    transition: background .18s ease, border-color .18s ease;
}

.smp-nav-link:hover,
.smp-nav-link:focus-visible {
    background: rgba(34, 211, 238, .12);
}

.smp-nav-toggle {
    display: none !important;
}


/* Compact Minecraft banner on subpages only */
body.smp-detail-page .smp-hero {
    padding: 30px 0 !important;
    min-height: 0 !important;
}

body.smp-detail-page .smp-hero .shell {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.smp-detail-page .smp-hero h1 {
    font-size: clamp(26px, 3vw, 40px) !important;
    line-height: 1.15;
    margin: 6px 0 !important;
}

/* Remove repeated introduction and actions on subpages */
body.smp-detail-page .smp-hero p,
body.smp-detail-page .smp-hero .actions,
body.smp-detail-page .smp-hero .statusline {
    display: none !important;
}

/* Keep the section identifier visible */
body.smp-detail-page .smp-hero .eyebrow {
    margin-bottom: 6px !important;
}

/* Reduce the gap before actual page content */
body.smp-detail-page .smp-hero + .section {
    padding-top: 28px !important;
}

@media (max-width: 650px) {
    body.smp-detail-page .smp-hero {
        padding: 22px 0 !important;
    }
}

/* SMP detail banners v0.6.3 */
body.smp-detail-page .smp-hero {
    min-height: 0 !important;
    padding: 30px 0 !important;
}
body.smp-detail-page .smp-hero .shell {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
body.smp-detail-page .smp-hero h1 {
    font-size: clamp(28px, 3.5vw, 46px) !important;
    line-height: 1.15;
    margin: 8px 0 !important;
}
body.smp-detail-page .smp-hero p,
body.smp-detail-page .smp-hero .actions,
body.smp-detail-page .smp-hero .statusline {
    display: none !important;
}
body.smp-detail-page .smp-hero + .section {
    padding-top: 28px !important;
}
@media(max-width:650px) {
    body.smp-detail-page .smp-hero {
        padding: 22px 0 !important;
    }
}
.primary-nav .smp-nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
}


/* StraightEdgeRik Hub v0.7 - Twitch Streaming */
.twitch-section {
    scroll-margin-top: 145px;
}

.twitch-heading {
    margin-bottom: 26px;
}

.twitch-player-frame {
    width: 100%;
    aspect-ratio: 16 / 9;
    min-height: 300px;
    border: 1px solid rgba(167,139,250,.42);
    border-radius: 14px;
    overflow: hidden;
    background: #101018;
    box-shadow: 0 12px 40px rgba(0,0,0,.25);
}

.twitch-player-frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 300px;
    border: 0;
}

.twitch-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    margin-top: 22px;
}

.twitch-bottom h3 {
    margin: 0 0 8px;
}

.twitch-bottom p {
    margin: 0;
}

.twitch-small-screen {
    display: none;
}

@media (max-width: 420px) {
    .twitch-player-frame {
        display: none;
    }
    .twitch-small-screen {
        display: block;
        margin-top: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .twitch-section {
        scroll-behavior: auto;
    }
}


/* StraightEdgeRik Hub v0.7.1 — Community */
.community-section {
    scroll-margin-top: 145px;
}

.community-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin-top: 30px;
}

.community-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 290px;
    padding: 32px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,.12);
}

.community-discord {
    background: linear-gradient(145deg,#211a35,#101018);
    border-color: rgba(167,139,250,.35);
}

.community-minecraft {
    background: linear-gradient(145deg,#102b34,#10151b);
    border-color: rgba(34,211,238,.4);
}

.community-label {
    font-size: 12px;
    letter-spacing: .13em;
    font-weight: 700;
    color: #c4b5fd;
}

.community-minecraft .community-label {
    color: #67e8f9;
}

.community-card h3 {
    font-size: clamp(24px,2.5vw,32px);
    margin: 22px 0 12px;
}

.community-card p {
    color: #b5bdc9;
    line-height: 1.7;
    margin: 0 0 28px;
}

.community-card .btn {
    margin-top: auto;
}

@media (max-width: 760px) {
    .community-grid {
        grid-template-columns: 1fr;
    }
    .community-card {
        min-height: 245px;
        padding: 24px;
    }
}


/* StraightEdgeRik Hub — About Section */
.about-section {
    scroll-margin-top: 145px;
}

.about-panel {
    max-width: 980px;
    padding: clamp(28px, 5vw, 56px);
    border-radius: 16px;
    border: 1px solid rgba(167,139,250,.25);
    background: linear-gradient(140deg,#171322,#0d1018);
}

.about-panel .section-title {
    margin: 12px 0 24px;
}

.about-panel p {
    color: #c4c4d0;
    font-size: 16px;
    line-height: 1.85;
    margin: 0 0 18px;
}

.about-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 28px;
}

.about-tags span {
    color: #cdbbff;
    background: #201a2e;
    border: 1px solid rgba(167,139,250,.15);
    border-radius: 7px;
    padding: 8px 12px;
    font-size: 12px;
}

/* StraightEdgeRik Hub v0.8 Minecraft live status */
.smp-live-section {padding:28px 0 10px}
.smp-live-card {
  background:linear-gradient(145deg,#10262f,#0c131b);
  border:1px solid rgba(34,211,238,.4);
  border-radius:16px;
  padding:clamp(22px,4vw,36px);
}
.smp-live-card h2 {margin:10px 0 25px}
.smp-live-stats {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-bottom:20px;
}
.smp-live-stats>div,.smp-connect>div {
  background:rgba(0,0,0,.2);
  padding:18px;
  border-radius:10px;
}
.smp-live-stats span,.smp-connect span {
  display:block;
  font-size:13px;
  color:#a9bec7;
  margin-bottom:8px;
}
.smp-live-stats strong {
  display:block;
  font-size:clamp(21px,3vw,30px);
  color:#f4fbff;
}
.smp-live-stats .mc-online {color:#67e8f9}
.smp-connect {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.smp-connect strong {
  display:block;
  color:#f4fbff;
  overflow-wrap:anywhere;
  margin-bottom:12px;
}
.smp-copy {
  background:transparent;
  border:1px solid #22d3ee;
  border-radius:7px;
  color:#67e8f9;
  padding:8px 14px;
  cursor:pointer;
}
.smp-copy:hover {background:rgba(34,211,238,.12)}
.smp-live-note {margin:16px 0 0}
@media(max-width:650px){
  .smp-live-stats,.smp-connect {grid-template-columns:1fr}
}

/* SER mobile navigation v0.9 */
.mobile-menu-button {
  display:none;
}

@media(max-width:760px){
  .topbar {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:12px 5%;
    height:auto;
    min-height:70px;
  }

  .brand {
    min-width:0;
    font-size:clamp(13px,3.4vw,17px);
  }

  .mobile-menu-button {
    display:block;
    border:1px solid #655184;
    background:#171421;
    color:#e7dcff;
    border-radius:8px;
    padding:10px 16px;
    min-height:44px;
    font-weight:700;
  }

  .topbar .primary-nav {
    display:none !important;
    grid-column:1/-1;
    order:initial;
    width:100%;
    overflow:visible;
    white-space:normal;
    flex-direction:column;
    align-items:stretch;
    gap:5px;
    padding:10px 0 6px;
  }

  .topbar.mobile-nav-open .primary-nav {
    display:flex !important;
  }

  .primary-nav>a {
    display:block;
    padding:12px 10px;
    min-height:44px;
    border-radius:8px;
  }

  .primary-nav .smp-nav-group {
    display:flex;
    width:100%;
    margin-top:6px;
  }

  .primary-nav .smp-nav-link {
    width:100%;
    min-height:44px;
    justify-content:center;
  }

  .smp-subnav {
    position:relative !important;
    top:auto !important;
  }

  .smp-subnav-inner {
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
    padding:10px 5%;
  }

  .smp-subnav a {
    min-height:44px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .shell {
    width:92%;
  }

  .hero {
    padding:35px 0 20px;
  }

  .hero h1 {
    font-size:clamp(38px,10vw,65px);
    overflow-wrap:anywhere;
  }

  .smp-hero h1 {
    font-size:clamp(30px,7vw,52px);
    overflow-wrap:anywhere;
  }

  .data-table {
    display:block;
    overflow-x:auto;
    max-width:100%;
  }

  .actions .btn {
    min-height:44px;
  }
}
