:root {
  --forest-1000: #050c08;
  --forest-950: #08110b;
  --forest-900: #0d1711;
  --forest-850: #101e16;
  --forest-800: #15281d;
  --forest-700: #23402d;
  --moss: #78934c;
  --lime: #add568;
  --lime-soft: #c6e48e;
  --amber: #e5ae63;
  --red: #e1766d;
  --paper: #f4f2e9;
  --sand: #e8e4d7;
  --white: #fff;
  --ink: #142018;
  --ink-soft: #5e6b63;
  --panel: #101712;
  --panel-raised: #151e18;
  --panel-line: rgba(255, 255, 255, .085);
  --line: rgba(20, 32, 24, .13);
  --shadow: 0 24px 70px rgba(5, 12, 8, .17);
  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 24px;
  --container: 1180px;
  --header: 80px;
  --sidebar: 248px;
  --ease: 180ms ease;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header) + 18px); }
body { margin: 0; color: var(--ink); background: var(--paper); font: 16px/1.6 Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; text-rendering: optimizeLegibility; }
body.menu-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { color: inherit; font: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; line-height: 1.07; letter-spacing: -.026em; }
code { font-family: "SFMono-Regular", Consolas, monospace; }
::selection { color: var(--forest-950); background: var(--lime); }
:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
[hidden] { display: none !important; }
.container { width: min(var(--container), calc(100% - 40px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 1000; top: 12px; left: 12px; padding: 10px 14px; color: var(--forest-950); background: var(--lime); border-radius: 7px; font-weight: 800; transform: translateY(-150%); transition: transform var(--ease); }
.skip-link:focus { transform: translateY(0); }

.brand { display: inline-flex; align-items: center; gap: 11px; }
.brand > span { display: grid; gap: 3px; line-height: 1; }
.brand strong { font-size: .98rem; letter-spacing: .18em; }
.brand small { color: var(--lime); font-size: .57rem; font-weight: 800; letter-spacing: .25em; }
.overline { display: flex; align-items: center; gap: 11px; margin-bottom: 20px; color: var(--lime); font-size: .69rem; font-weight: 850; letter-spacing: .19em; line-height: 1.2; text-transform: uppercase; }
.overline > span { width: 25px; height: 2px; background: currentColor; }
.overline.dark { color: #5f7a39; }
.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 9px; padding: 14px 21px; border: 1px solid transparent; border-radius: var(--radius-sm); font-size: .84rem; font-weight: 820; letter-spacing: .025em; transition: transform var(--ease), background var(--ease), border-color var(--ease), box-shadow var(--ease); }
.button:hover { transform: translateY(-2px); }
.button-accent { color: var(--forest-950); background: var(--lime); box-shadow: 0 12px 30px rgba(173, 213, 104, .2); }
.button-accent:hover { background: #bee27c; box-shadow: 0 16px 38px rgba(173, 213, 104, .29); }
.button-glass { color: var(--white); background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .22); backdrop-filter: blur(10px); }
.button-glass:hover { background: rgba(255, 255, 255, .12); }
.button-small { min-height: 42px; padding: 10px 16px; font-size: .76rem; }
.button-full { width: 100%; }
.text-button { color: rgba(255, 255, 255, .75); font-size: .8rem; font-weight: 760; }
.form-error, .form-message { min-height: 20px; margin: 0; color: #dc766d; font-size: .77rem; }
.form-message.success { color: #86bd62; }

/* Public header and hero */
.public-header { position: fixed; z-index: 100; inset: 0 0 auto; height: var(--header); color: var(--white); border-bottom: 1px solid transparent; transition: background var(--ease), border-color var(--ease), box-shadow var(--ease); }
.public-header.scrolled, .public-header.menu-visible { background: rgba(5, 12, 8, .94); border-bottom-color: rgba(255, 255, 255, .08); box-shadow: 0 15px 40px rgba(0, 0, 0, .17); backdrop-filter: blur(17px); }
.public-nav { display: grid; height: 100%; grid-template-columns: auto 1fr auto; align-items: center; gap: 45px; }
.public-links { display: flex; align-items: center; justify-content: center; gap: 30px; }
.public-links a { position: relative; color: rgba(255, 255, 255, .7); font-size: .78rem; font-weight: 720; transition: color var(--ease); }
.public-links a::after { position: absolute; right: 0; bottom: -10px; left: 0; height: 2px; background: var(--lime); content: ""; transform: scaleX(0); transition: transform var(--ease); }
.public-links a:hover { color: white; }
.public-links a:hover::after { transform: scaleX(1); }
.auth-links { display: flex; align-items: center; gap: 17px; }
.auth-links .profile-link { display: flex; align-items: center; gap: 9px; color: rgba(255, 255, 255, .8); font-size: .78rem; font-weight: 750; }
.auth-links .profile-link i { display: grid; width: 31px; height: 31px; place-items: center; color: var(--forest-950); background: var(--lime); border-radius: 50%; font-style: normal; font-size: .72rem; }
.mobile-menu { display: none; width: 45px; height: 43px; padding: 9px 10px; background: transparent; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; }
.mobile-menu > span { display: block; height: 2px; margin: 5px 0; background: white; transition: transform var(--ease), opacity var(--ease); }
.mobile-menu[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mobile-menu[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.mobile-menu[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.public-hero { position: relative; display: grid; min-height: max(760px, 100svh); align-items: center; overflow: hidden; color: white; background: var(--forest-1000); }
.hero-image, .hero-overlay, .hero-noise { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-image { object-fit: cover; transform: scale(1.015); }
.hero-overlay { background: linear-gradient(90deg, rgba(3,9,5,.95), rgba(3,9,5,.68) 48%, rgba(3,9,5,.3) 78%, rgba(3,9,5,.55)), linear-gradient(0deg, rgba(3,9,5,.88), transparent 48%); }
.hero-noise { opacity: .12; background: url("/assets/img/noise.svg"); pointer-events: none; }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) 350px; align-items: center; gap: clamp(50px, 8vw, 125px); padding-top: calc(var(--header) + 56px); padding-bottom: 90px; }
.hero-copy h1 { max-width: 850px; margin-bottom: 27px; font-size: clamp(3.5rem, 6.7vw, 7rem); font-weight: 630; line-height: .93; letter-spacing: -.052em; text-shadow: 0 10px 45px rgba(0,0,0,.32); }
.hero-copy h1 em { color: var(--lime); font-weight: 500; }
.hero-lead { max-width: 700px; margin-bottom: 33px; color: rgba(255,255,255,.72); font-size: clamp(1rem, 1.6vw, 1.15rem); }
.hero-buttons { display: flex; flex-wrap: wrap; gap: 11px; }
.hero-status { display: flex; align-items: center; gap: 10px; margin-top: 31px; color: rgba(255,255,255,.62); font-size: .73rem; }
.hero-status strong { color: rgba(255,255,255,.8); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }
.hero-status i { width: 1px; height: 14px; margin-inline: 3px; background: rgba(255,255,255,.22); }
.hero-status code { color: rgba(255,255,255,.9); }
.live-dot { display: inline-block; width: 8px; height: 8px; flex: 0 0 auto; background: var(--amber); border-radius: 50%; box-shadow: 0 0 0 4px rgba(229,174,99,.12); }
.live-dot.online { background: #87c769; box-shadow: 0 0 0 4px rgba(135,199,105,.12), 0 0 14px rgba(135,199,105,.52); }
.live-dot.offline { background: var(--red); box-shadow: 0 0 0 4px rgba(225,118,109,.12); }
.live-card { padding: 25px; color: white; background: rgba(11,20,14,.73); border: 1px solid rgba(255,255,255,.14); border-radius: var(--radius); box-shadow: 0 30px 80px rgba(0,0,0,.27); backdrop-filter: blur(18px); }
.live-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; color: rgba(255,255,255,.46); font-size: .59rem; font-weight: 850; letter-spacing: .15em; }
.status-pill { display: flex; align-items: center; gap: 8px; padding: 7px 9px; color: rgba(255,255,255,.72); background: rgba(255,255,255,.06); border-radius: 6px; font-size: .56rem; }
.status-pill .live-dot { width: 6px; height: 6px; box-shadow: none; }
.live-card h2 { margin-bottom: 4px; font-family: Inter, sans-serif; font-size: 1.22rem; }
.live-card > p { margin-bottom: 29px; color: rgba(255,255,255,.46); font-size: .72rem; }
.live-player-count { display: flex; align-items: end; gap: 9px; }
.live-player-count > strong { font-family: Georgia, serif; font-size: 3.5rem; line-height: .9; }
.live-player-count > span { display: grid; margin-bottom: 3px; color: rgba(255,255,255,.48); font-size: .65rem; }
.live-player-count b { color: rgba(255,255,255,.8); font-size: .78rem; }
.capacity-track { height: 4px; margin: 17px 0 25px; overflow: hidden; background: rgba(255,255,255,.1); border-radius: 9px; }
.capacity-track span { display: block; width: 0; height: 100%; background: var(--lime); border-radius: inherit; transition: width .5s ease; }
.live-card dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 0 23px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.08); }
.live-card dl div { min-width: 0; }
.live-card dt { color: rgba(255,255,255,.38); font-size: .53rem; font-weight: 760; letter-spacing: .07em; text-transform: uppercase; }
.live-card dd { margin: 4px 0 0; overflow: hidden; color: rgba(255,255,255,.8); font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.button-panel { width: 100%; min-height: 44px; color: var(--white); background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.12); font-size: .7rem; }
.button-panel:hover { background: rgba(255,255,255,.13); }
.hero-edge { position: absolute; z-index: 2; right: 0; bottom: -1px; left: 0; height: 35px; background: var(--paper); clip-path: polygon(0 72%, 63% 72%, 68% 0, 100% 0, 100% 100%, 0 100%); }

/* Public content */
.public-section { padding: clamp(80px, 9vw, 130px) 0; }
.section-title { margin-bottom: 47px; }
.section-title h2 { margin-bottom: 0; font-size: clamp(2.25rem, 4vw, 3.8rem); }
.title-split { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 65px; }
.title-split > p { margin-bottom: 6px; color: var(--ink-soft); }
.centered { max-width: 760px; margin-right: auto; margin-left: auto; text-align: center; }
.centered .overline { justify-content: center; }
.overview-section { background: linear-gradient(rgba(244,242,233,.95),rgba(244,242,233,.95)), url("/assets/img/topography.svg") center/540px; }
.platform-grid { display: grid; grid-template-columns: 1.3fr .85fr .85fr; gap: 16px; }
.platform-card { position: relative; min-height: 270px; padding: 31px; overflow: hidden; background: rgba(255,255,255,.6); border: 1px solid var(--line); border-radius: var(--radius); transition: transform var(--ease), background var(--ease), box-shadow var(--ease); }
.platform-card:hover { background: white; box-shadow: 0 18px 45px rgba(13,23,17,.09); transform: translateY(-4px); }
.platform-card.featured { grid-row: span 2; min-height: 556px; color: white; background: var(--forest-850); }
.platform-card.wide { grid-column: 2 / 4; display: grid; min-height: auto; grid-template-columns: auto 1fr 1.4fr; align-items: center; gap: 25px; }
.card-kicker { display: block; margin-bottom: 53px; color: #6d7b72; font-size: .58rem; font-weight: 850; letter-spacing: .15em; }
.featured .card-kicker { color: var(--lime); }
.platform-card h3 { margin-bottom: 12px; font-family: Inter, sans-serif; font-size: 1.15rem; }
.platform-card p { margin: 0; color: var(--ink-soft); font-size: .87rem; }
.platform-card.featured p { max-width: 450px; color: rgba(255,255,255,.58); }
.line-icon { display: grid; width: 38px; height: 38px; margin-bottom: 63px; place-items: center; color: #607a3d; background: rgba(120,147,76,.1); border-radius: 50%; font-size: 1.1rem; }
.wide .line-icon, .wide .card-kicker { margin: 0; }
.wide h3 { margin-bottom: 0; }
.mini-world { position: absolute; right: -50px; bottom: -40px; left: 30px; height: 270px; overflow: hidden; border-radius: 40% 0 0 0; opacity: .74; }
.mini-world::after { position: absolute; inset: 0; background: linear-gradient(180deg, var(--forest-850), transparent 65%); content: ""; }
.mini-world img { width: 100%; height: 100%; object-fit: cover; }

.stats-section { color: white; background: radial-gradient(circle at 5% 10%, rgba(173,213,104,.09), transparent 31%), var(--forest-950); }
.stats-layout { display: grid; grid-template-columns: .75fr 1.25fr; align-items: center; gap: clamp(60px, 9vw, 125px); }
.stats-intro h2 { margin-bottom: 23px; font-size: clamp(2.3rem, 4vw, 3.8rem); }
.stats-intro > p:not(.overline) { color: rgba(255,255,255,.57); }
.arrow-link { display: inline-flex; align-items: center; gap: 13px; margin-top: 15px; color: var(--lime); font-size: .78rem; font-weight: 800; }
.arrow-link span { font-size: 1.15rem; transition: transform var(--ease); }
.arrow-link:hover span { transform: translateX(5px); }
.leaderboard-card { background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius); box-shadow: 0 28px 70px rgba(0,0,0,.2); }
.leaderboard-head { display: flex; justify-content: space-between; padding: 18px 22px; color: rgba(255,255,255,.37); border-bottom: 1px solid rgba(255,255,255,.08); font-size: .55rem; font-weight: 850; letter-spacing: .13em; }
.leader-row { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 13px; padding: 16px 21px; border-bottom: 1px solid rgba(255,255,255,.06); }
.leader-row:last-child { border-bottom: 0; }
.leader-rank { color: rgba(255,255,255,.35); font-family: Georgia, serif; font-size: 1rem; }
.leader-player { display: flex; align-items: center; gap: 11px; min-width: 0; }
.leader-avatar { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; color: var(--forest-950); background: linear-gradient(135deg,var(--lime),#657d42); border-radius: 9px; font-size: .7rem; font-weight: 850; }
.leader-player div { min-width: 0; }
.leader-player strong { display: block; overflow: hidden; color: rgba(255,255,255,.85); font-size: .77rem; text-overflow: ellipsis; white-space: nowrap; }
.leader-player small { color: rgba(255,255,255,.36); font-size: .6rem; }
.leader-time { color: var(--lime-soft); font-family: "SFMono-Regular",Consolas,monospace; font-size: .68rem; }
.skeleton-row { height: 68px; margin: 1px 20px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent); background-size: 240% 100%; animation: shimmer 1.5s infinite; }
@keyframes shimmer { to { background-position: -240% 0; } }

.join-public { color: white; background: linear-gradient(115deg,var(--forest-800),var(--forest-950)); }
.join-public-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(60px,10vw,140px); }
.join-public h2 { margin-bottom: 28px; font-size: clamp(2.4rem,4vw,4rem); }
.server-address-box { display: flex; max-width: 520px; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 10px 10px 17px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.13); border-radius: 10px; }
.server-address-box > div { display: grid; min-width: 0; }
.server-address-box span { color: rgba(255,255,255,.37); font-size: .55rem; font-weight: 800; letter-spacing: .12em; }
.server-address-box code { overflow: hidden; color: rgba(255,255,255,.88); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.server-address-box button { padding: 12px 16px; color: var(--forest-950); background: var(--lime); border: 0; border-radius: 7px; font-size: .69rem; font-weight: 850; }
.direct-address-copy { margin: 12px 0 0; color: rgba(255,255,255,.4); font-size: .67rem; }
.direct-address-copy code { color: rgba(255,255,255,.68); }
.public-steps { display: grid; margin: 0; padding: 0; list-style: none; }
.public-steps li { position: relative; display: grid; grid-template-columns: 52px 1fr; gap: 22px; padding: 5px 0 39px; }
.public-steps li:not(:last-child)::after { position: absolute; top: 54px; bottom: 4px; left: 25px; width: 1px; background: rgba(173,213,104,.25); content: ""; }
.public-steps li > span { position: relative; z-index: 1; display: grid; width: 52px; height: 52px; place-items: center; color: var(--forest-950); background: var(--lime); border: 6px solid var(--forest-800); border-radius: 50%; font-size: .72rem; font-weight: 900; }
.public-steps h3 { margin: 4px 0 6px; font-family: Inter,sans-serif; font-size: 1rem; }
.public-steps p { margin: 0; color: rgba(255,255,255,.52); font-size: .82rem; }
.rules-public { background: var(--paper); }
.rules-public-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; }
.rules-public article { min-height: 235px; padding: 25px; background: rgba(255,255,255,.53); border: 1px solid var(--line); border-radius: 12px; }
.rules-public b { display: block; margin-bottom: 50px; color: #78934c; font-family: Georgia,serif; font-size: 1.6rem; }
.rules-public h3 { font-family: Inter,sans-serif; font-size: 1rem; }
.rules-public p { margin: 0; color: var(--ink-soft); font-size: .8rem; }
.public-cta { padding: 66px 0; color: white; background: var(--forest-700); }
.public-cta-inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 25px; }
.public-cta-inner span { color: var(--lime); font-size: .58rem; font-weight: 850; letter-spacing: .16em; }
.public-cta-inner h2 { margin: 5px 0 0; font-size: clamp(1.8rem,3vw,2.7rem); }
.public-footer { padding: 52px 0 23px; color: rgba(255,255,255,.5); background: var(--forest-1000); }
.public-footer-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 55px; padding-bottom: 38px; }
.public-footer-top > p { max-width: 510px; margin: 0 auto; font-size: .7rem; text-align: center; }
.public-footer nav { display: flex; gap: 20px; font-size: .72rem; font-weight: 700; }
.public-footer nav a:hover { color: white; }
.public-footer-bottom { display: flex; justify-content: space-between; padding-top: 19px; border-top: 1px solid rgba(255,255,255,.07); font-size: .58rem; letter-spacing: .09em; text-transform: uppercase; }
.toast { position: fixed; z-index: 1000; right: 22px; bottom: 22px; max-width: min(420px,calc(100% - 28px)); padding: 13px 17px; color: white; background: var(--forest-800); border: 1px solid rgba(255,255,255,.12); border-radius: 9px; box-shadow: 0 18px 50px rgba(0,0,0,.28); font-size: .76rem; font-weight: 700; opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity var(--ease), transform var(--ease); }
.toast.show { opacity: 1; transform: none; }
.toast.error { border-color: rgba(225,118,109,.4); }

/* Authentication */
.auth-body { min-height: 100svh; color: var(--ink); background: #eeece4; }
.auth-layout { display: grid; min-height: 100svh; grid-template-columns: minmax(430px, .92fr) minmax(540px, 1.08fr); }
.auth-visual { position: relative; min-height: 100svh; overflow: hidden; color: white; background: var(--forest-950); }
.auth-visual > img, .auth-visual-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.auth-visual > img { object-fit: cover; }
.auth-visual-shade { background: linear-gradient(180deg,rgba(3,9,5,.55),rgba(3,9,5,.86)), linear-gradient(90deg,rgba(3,9,5,.4),transparent); }
.auth-brand { position: absolute; z-index: 1; top: 32px; left: 38px; }
.auth-quote { position: absolute; z-index: 1; right: 9%; bottom: 9%; left: 9%; max-width: 560px; }
.auth-quote > span { color: var(--lime); font-size: .64rem; font-weight: 850; letter-spacing: .17em; }
.auth-quote blockquote { margin: 17px 0 22px; font: 500 clamp(2rem,3.5vw,3.6rem)/1.08 Georgia,serif; letter-spacing: -.04em; }
.auth-quote p { color: rgba(255,255,255,.43); font-size: .6rem; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.auth-form-side { position: relative; display: grid; padding: 75px 50px 50px; place-items: center; }
.back-link { position: absolute; top: 31px; right: 37px; color: var(--ink-soft); font-size: .72rem; font-weight: 700; }
.auth-card { width: min(450px,100%); }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 45px; border-bottom: 1px solid var(--line); }
.auth-tabs a { position: relative; padding: 13px 5px; color: #7b857e; font-size: .72rem; font-weight: 800; text-align: center; }
.auth-tabs a.active { color: var(--ink); }
.auth-tabs a.active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: #5d7a38; content: ""; }
.auth-heading { margin-bottom: 30px; text-align: center; }
.auth-heading span { color: #668542; font-size: .59rem; font-weight: 850; letter-spacing: .17em; }
.auth-heading h1 { margin: 11px 0 10px; font-size: clamp(2.5rem,4vw,3.4rem); }
.auth-heading p { color: var(--ink-soft); font-size: .8rem; }
.auth-form { display: grid; gap: 17px; }
.auth-form label, .profile-form label, .broadcast-card label, .settings-form label { display: grid; gap: 7px; }
.auth-form label > span, .profile-form label > span, .broadcast-card label > span, .settings-form label > span { color: #5f6963; font-size: .61rem; font-weight: 820; letter-spacing: .06em; text-transform: uppercase; }
.auth-form input, .profile-form input, .broadcast-card input, .broadcast-card textarea, .settings-form input, .settings-form select { width: 100%; min-height: 48px; padding: 12px 14px; color: var(--ink); background: rgba(255,255,255,.55); border: 1px solid rgba(20,32,24,.17); border-radius: 8px; outline: 0; transition: background var(--ease), border-color var(--ease), box-shadow var(--ease); }
.auth-form input:focus, .profile-form input:focus, .broadcast-card input:focus, .broadcast-card textarea:focus, .settings-form input:focus, .settings-form select:focus { background: white; border-color: #78934c; box-shadow: 0 0 0 3px rgba(120,147,76,.11); }
.auth-divider { display: flex; align-items: center; gap: 14px; margin: 26px 0; color: #8b938e; font-size: .64rem; }
.auth-divider::before, .auth-divider::after { height: 1px; flex: 1; background: var(--line); content: ""; }
.steam-button { display: flex; min-height: 50px; align-items: center; justify-content: center; gap: 11px; color: white; background: #171d22; border-radius: 8px; font-size: .79rem; font-weight: 780; transition: background var(--ease), transform var(--ease); }
.steam-button:hover { background: #252d34; transform: translateY(-2px); }
.steam-button svg { width: 22px; fill: none; stroke: white; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.auth-terms { margin: 20px 25px 0; color: #8a928d; font-size: .61rem; text-align: center; }

/* Panel shell */
.panel-body { min-height: 100vh; color: rgba(255,255,255,.85); background: #0a0e0b; }
.panel-shell { display: grid; min-height: 100vh; grid-template-columns: var(--sidebar) 1fr; }
.panel-sidebar { position: fixed; z-index: 60; inset: 0 auto 0 0; display: flex; width: var(--sidebar); flex-direction: column; padding: 25px 18px 20px; background: #090e0b; border-right: 1px solid var(--panel-line); }
.panel-brand { margin: 0 10px 27px; color: white; }
.server-mini { display: flex; align-items: center; gap: 11px; margin: 0 2px 28px; padding: 13px 12px; background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 9px; }
.server-mini > div { display: grid; min-width: 0; }
.server-mini strong { overflow: hidden; color: rgba(255,255,255,.77); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.server-mini small { color: rgba(255,255,255,.36); font-size: .56rem; }
.panel-nav { display: grid; gap: 3px; }
.panel-nav > p { margin: 25px 12px 8px; color: rgba(255,255,255,.22); font-size: .52rem; font-weight: 850; letter-spacing: .15em; }
.panel-nav a { display: flex; align-items: center; gap: 12px; min-height: 42px; padding: 10px 12px; color: rgba(255,255,255,.48); border-radius: 7px; font-size: .7rem; font-weight: 690; transition: color var(--ease), background var(--ease); }
.panel-nav a > span { display: grid; width: 20px; place-items: center; color: rgba(255,255,255,.38); font-size: .88rem; }
.panel-nav a:hover { color: rgba(255,255,255,.8); background: rgba(255,255,255,.035); }
.panel-nav a.active { color: var(--lime-soft); background: rgba(173,213,104,.09); }
.panel-nav a.active > span { color: var(--lime); }
.sidebar-user { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px; margin-top: auto; padding: 14px 10px 0; border-top: 1px solid var(--panel-line); }
.user-avatar, .top-avatar { display: grid; width: 34px; height: 34px; place-items: center; color: var(--forest-950); background: linear-gradient(135deg,var(--lime),#668443); border-radius: 9px; font-size: .7rem; font-weight: 900; }
.sidebar-user > div:nth-child(2) { display: grid; min-width: 0; }
.sidebar-user strong { overflow: hidden; color: rgba(255,255,255,.73); font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user small { color: rgba(255,255,255,.31); font-size: .52rem; text-transform: uppercase; }
.sidebar-user button { color: rgba(255,255,255,.35); background: transparent; border: 0; }
.panel-main { grid-column: 2; min-width: 0; }
.panel-topbar { position: sticky; z-index: 40; top: 0; display: flex; height: 78px; align-items: center; justify-content: space-between; gap: 25px; padding: 0 32px; background: rgba(10,14,11,.9); border-bottom: 1px solid var(--panel-line); backdrop-filter: blur(16px); }
.panel-topbar > div:first-of-type { display: grid; }
.panel-topbar span { color: rgba(255,255,255,.25); font-size: .49rem; font-weight: 850; letter-spacing: .12em; }
.panel-topbar h1 { margin: 1px 0 0; font-family: Inter,sans-serif; font-size: .9rem; font-weight: 750; letter-spacing: -.01em; }
.sidebar-toggle { display: none; color: white; background: transparent; border: 0; font-size: 1.2rem; }
.topbar-actions { display: flex; align-items: center; gap: 13px; }
.topbar-actions > button { display: flex; align-items: center; gap: 8px; padding: 9px 11px; color: rgba(255,255,255,.37); background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 7px; font-size: .52rem; font-weight: 800; }
.topbar-actions code { color: rgba(255,255,255,.68); font-size: .62rem; }
.top-avatar { width: 34px; height: 34px; }
.panel-content { padding: 33px; }
.panel-view { max-width: 1450px; margin: 0 auto; }
.welcome-row { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.welcome-row p { margin-bottom: 3px; color: rgba(255,255,255,.37); font-size: .7rem; }
.welcome-row p strong { color: var(--lime-soft); }
.welcome-row h2, .view-toolbar h2 { margin: 0; color: rgba(255,255,255,.9); font-family: Inter,sans-serif; font-size: 1.5rem; }
.button-panel-light { min-height: 39px; padding: 9px 14px; color: var(--forest-950); background: var(--lime); font-size: .67rem; }
.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; margin-bottom: 13px; }
.metric-grid article { position: relative; min-height: 135px; padding: 21px; background: var(--panel-raised); border: 1px solid var(--panel-line); border-radius: 10px; }
.metric-grid p { margin: 0 0 12px; color: rgba(255,255,255,.27); font-size: .5rem; font-weight: 850; letter-spacing: .12em; }
.metric-grid strong { display: block; overflow: hidden; color: rgba(255,255,255,.88); font-size: 1.55rem; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.metric-grid small { color: rgba(255,255,255,.31); font-size: .58rem; }
.metric-icon { position: absolute; top: 18px; right: 18px; display: grid; width: 29px; height: 29px; place-items: center; color: rgba(173,213,104,.73); background: rgba(173,213,104,.08); border-radius: 7px; font-size: .7rem; }
.metric-icon.online { color: #83c564; }
.dashboard-grid { display: grid; grid-template-columns: 1.65fr .85fr; gap: 13px; }
.panel-card { background: var(--panel-raised); border: 1px solid var(--panel-line); border-radius: 10px; }
.chart-card { min-height: 355px; padding: 22px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.card-head span, .view-toolbar p { display: block; margin: 0 0 3px; color: rgba(255,255,255,.25); font-size: .49rem; font-weight: 850; letter-spacing: .13em; }
.card-head h3 { margin: 0; color: rgba(255,255,255,.8); font-family: Inter,sans-serif; font-size: .82rem; }
.card-head > a, .card-head > button { color: var(--lime); background: transparent; border: 0; font-size: .58rem; font-weight: 750; }
.chart-legend { display: flex; align-items: center; gap: 7px; color: rgba(255,255,255,.36); font-size: .55rem; }
.chart-legend i { width: 8px; height: 8px; background: var(--lime); border-radius: 50%; }
.chart-wrap { height: 260px; }
.chart-wrap svg { width: 100%; height: 100%; overflow: visible; }
.chart-grid-line { stroke: rgba(255,255,255,.06); stroke-width: 1; }
.chart-area { fill: url(#activityGradient); }
.chart-line { fill: none; stroke: var(--lime); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; vector-effect: non-scaling-stroke; }
.connection-card { padding: 22px; }
.connection-card dl { display: grid; margin: 0; }
.connection-card dl div { padding: 15px 0; border-top: 1px solid var(--panel-line); }
.connection-card dt { color: rgba(255,255,255,.28); font-size: .54rem; }
.connection-card dd { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 4px 0 0; color: rgba(255,255,255,.72); font-size: .67rem; }
.connection-card button { color: var(--lime); background: transparent; border: 0; font-size: .55rem; }
.recent-players { min-height: 250px; padding: 22px; }
.compact-player { display: grid; grid-template-columns: 32px 1fr auto; align-items: center; gap: 10px; padding: 11px 0; border-top: 1px solid var(--panel-line); }
.compact-player .leader-avatar { width: 32px; height: 32px; border-radius: 8px; }
.compact-player div { display: grid; min-width: 0; }
.compact-player strong { overflow: hidden; color: rgba(255,255,255,.67); font-size: .63rem; text-overflow: ellipsis; white-space: nowrap; }
.compact-player small, .compact-player > span { color: rgba(255,255,255,.28); font-size: .52rem; }
.compact-player > span.online { color: #86c367; }
.quick-actions { padding: 22px; }
.quick-actions > div:last-child { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.quick-actions button, .quick-actions a { padding: 11px; color: rgba(255,255,255,.64); background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 7px; font-size: .58rem; text-align: center; }
.quick-actions a { grid-column: 1/-1; color: var(--lime); }
.panel-skeleton { height: 55px; background: linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent); background-size: 220% 100%; border-top: 1px solid var(--panel-line); animation: shimmer 1.5s infinite; }
.view-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.view-toolbar > span, .agent-status { color: rgba(255,255,255,.32); font-size: .58rem; }
.view-toolbar input { width: 260px; padding: 10px 13px; color: rgba(255,255,255,.75); background: var(--panel-raised); border: 1px solid var(--panel-line); border-radius: 7px; outline: 0; font-size: .65rem; }

/* Player intelligence and leaderboards */
.telemetry-notice { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 16px; margin-bottom: 13px; padding: 15px 17px; background: rgba(214,168,78,.055); border: 1px solid rgba(214,168,78,.17); border-radius: 9px; }
.telemetry-notice > span { grid-row: span 2; padding: 7px 9px; color: #e0b469; background: rgba(214,168,78,.09); border-radius: 6px; font-size: .47rem; font-weight: 850; letter-spacing: .11em; }
.telemetry-notice strong { color: rgba(255,255,255,.68); font-size: .66rem; }
.telemetry-notice p { margin: 0; color: rgba(255,255,255,.34); font-size: .56rem; }
.telemetry-notice.complete { background: rgba(132,195,103,.05); border-color: rgba(132,195,103,.17); }
.telemetry-notice.complete > span { color: #91cd74; background: rgba(132,195,103,.09); }
.leaderboard-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; margin-bottom: 13px; }
.leaderboard-card { min-width: 0; padding: 18px; }
.leaderboard-card .card-head { margin-bottom: 11px; }
.leaderboard-row { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 9px 0; border-top: 1px solid var(--panel-line); }
.leaderboard-row > i { display: grid; width: 22px; height: 22px; place-items: center; color: rgba(255,255,255,.38); background: rgba(255,255,255,.035); border-radius: 5px; font-size: .53rem; font-style: normal; }
.leaderboard-row:first-child > i { color: #17200f; background: var(--lime); }
.leaderboard-row span { min-width: 0; overflow: hidden; color: rgba(255,255,255,.6); font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.leaderboard-row strong { color: var(--lime); font-size: .62rem; }
.leaderboard-empty { margin: 12px 0 2px; color: rgba(255,255,255,.3); font-size: .56rem; line-height: 1.55; }

/* Profile, tables and admin */
.profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.profile-card { grid-row: span 2; padding: 26px; }
.profile-hero { display: flex; align-items: center; gap: 19px; padding-bottom: 28px; border-bottom: 1px solid var(--panel-line); }
.large-avatar { display: grid; width: 72px; height: 72px; place-items: center; color: var(--forest-950); background: linear-gradient(135deg,var(--lime),#607a3e); border-radius: 18px; font-size: 1.4rem; font-weight: 900; }
.profile-hero span { color: var(--lime); font-size: .51rem; font-weight: 850; letter-spacing: .14em; }
.profile-hero h2 { margin: 4px 0; font-family: Inter,sans-serif; font-size: 1.3rem; }
.profile-hero p { margin: 0; color: rgba(255,255,255,.34); font-size: .61rem; }
.profile-form { display: grid; gap: 15px; margin-top: 27px; }
.profile-form input, .broadcast-card input, .broadcast-card textarea, .settings-form input, .settings-form select { color: rgba(255,255,255,.72); background: rgba(255,255,255,.035); border-color: var(--panel-line); }
.profile-form input:focus, .broadcast-card input:focus, .broadcast-card textarea:focus, .settings-form input:focus, .settings-form select:focus { color: white; background: rgba(255,255,255,.055); }
.steam-card, .game-stats-card { padding: 25px; }
.steam-connected { display: grid; grid-template-columns: 54px 1fr; align-items: center; gap: 14px; }
.steam-connected img { width: 54px; height: 54px; border-radius: 10px; }
.steam-connected strong { display: block; font-size: .75rem; }
.steam-connected a { color: var(--lime); font-size: .58rem; }
.steam-actions { grid-column: 1/-1; display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.steam-connected .steam-actions button { width: fit-content; padding: 0; color: var(--lime); background: transparent; border: 0; font-size: .57rem; }
.steam-connected .steam-actions [data-unlink-steam] { color: #d37d75; }
.steam-empty { text-align: center; }
.steam-empty p { color: rgba(255,255,255,.36); font-size: .68rem; }
.steam-empty a { min-height: 40px; color: white; background: #20272d; }
.profile-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
.profile-stats div { padding: 14px; background: rgba(255,255,255,.025); border: 1px solid var(--panel-line); border-radius: 8px; }
.profile-stats span { display: block; color: rgba(255,255,255,.28); font-size: .49rem; text-transform: uppercase; }
.profile-stats strong { color: rgba(255,255,255,.74); font-size: .85rem; }
.profile-telemetry { margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--panel-line); }
.profile-telemetry summary { color: var(--lime); cursor: pointer; font-size: .57rem; }
.profile-telemetry .telemetry-grid { grid-template-columns: repeat(2,1fr); margin-top: 12px; }
.table-card { overflow: hidden; }
.data-table-wrap { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th { padding: 14px 17px; color: rgba(255,255,255,.25); background: rgba(255,255,255,.018); border-bottom: 1px solid var(--panel-line); font-size: .48rem; font-weight: 850; letter-spacing: .11em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.data-table td { padding: 14px 17px; color: rgba(255,255,255,.53); border-bottom: 1px solid rgba(255,255,255,.045); font-size: .6rem; white-space: nowrap; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: rgba(255,255,255,.02); }
.player-detail-row { cursor: pointer; }
.player-detail-row:focus-visible { outline: 2px solid var(--lime); outline-offset: -2px; }
.table-player { display: flex; align-items: center; gap: 9px; }
.table-player .leader-avatar { width: 29px; height: 29px; border-radius: 7px; }
.status-label { display: inline-flex; align-items: center; gap: 6px; }
.status-label i { width: 6px; height: 6px; background: rgba(255,255,255,.28); border-radius: 50%; }
.status-label.online { color: #84c367; }
.status-label.online i { background: #84c367; box-shadow: 0 0 8px rgba(132,195,103,.55); }
.role-select { padding: 6px 8px; color: rgba(255,255,255,.7); background: #101712; border: 1px solid var(--panel-line); border-radius: 6px; font-size: .58rem; }
.control-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.control-card, .broadcast-card, .action-history { padding: 24px; }
.control-card > p { color: rgba(255,255,255,.34); font-size: .65rem; }
.control-buttons { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin-top: 20px; }
.control-buttons button { min-height: 43px; color: rgba(255,255,255,.64); background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 7px; font-size: .61rem; font-weight: 700; }
.control-buttons button:hover { background: rgba(255,255,255,.065); }
.control-buttons .warning { color: #e1b66a; border-color: rgba(225,182,106,.2); }
.control-buttons .danger, .confirm-dialog .danger { color: #e3837a; border-color: rgba(227,131,122,.22); }
.broadcast-card form { display: grid; gap: 13px; }
.broadcast-card textarea { min-height: 105px; resize: vertical; }
.action-history, .backup-history, .capability-card, .command-helper { grid-column: 1/-1; }
.backup-history, .capability-card, .command-helper { padding: 24px; }
.backup-history .card-head > button { color: var(--lime); background: transparent; border: 0; font-size: .58rem; }
.backup-item { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 14px; padding: 12px 0; color: rgba(255,255,255,.42); border-top: 1px solid var(--panel-line); font-size: .57rem; }
.backup-item strong { overflow: hidden; color: rgba(255,255,255,.65); text-overflow: ellipsis; white-space: nowrap; }
.capability-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.capability-grid > div { display: grid; grid-template-columns: 29px 1fr; align-items: start; gap: 10px; padding: 14px; background: rgba(255,255,255,.022); border: 1px solid var(--panel-line); border-radius: 8px; }
.capability-grid i { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 7px; font-size: .7rem; font-style: normal; font-weight: 850; }
.capability-grid span { display: grid; gap: 4px; }
.capability-grid strong { color: rgba(255,255,255,.67); font-size: .62rem; }
.capability-grid small { color: rgba(255,255,255,.31); font-size: .53rem; line-height: 1.5; }
.capability-grid .supported i { color: #8fd071; background: rgba(132,195,103,.09); }
.capability-grid .limited i { color: #e0b469; background: rgba(214,168,78,.09); }
.capability-grid .blocked i { color: #df8178; background: rgba(221,121,112,.09); }
.command-helper > p { margin: -6px 0 17px; color: rgba(255,255,255,.34); font-size: .59rem; }
.command-helper form { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 9px; }
.command-helper label { display: grid; gap: 6px; }
.command-helper label span { color: rgba(255,255,255,.28); font-size: .49rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.command-helper select, .command-helper input { min-height: 40px; padding: 9px 11px; color: rgba(255,255,255,.68); background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 7px; font-size: .59rem; }
.command-helper .button { min-height: 40px; }
.command-helper > code { display: block; margin-top: 11px; padding: 11px; color: var(--lime); background: rgba(0,0,0,.19); border: 1px solid var(--panel-line); border-radius: 7px; font-size: .62rem; }
.action-item { display: grid; grid-template-columns: 90px 1fr auto; align-items: center; gap: 15px; padding: 12px 0; border-top: 1px solid var(--panel-line); font-size: .58rem; }
.action-item > b { color: rgba(255,255,255,.65); text-transform: uppercase; }
.action-item > span { color: rgba(255,255,255,.32); }
.action-item > i { padding: 5px 7px; color: #d9b367; background: rgba(217,179,103,.07); border-radius: 5px; font-style: normal; text-transform: uppercase; }
.action-item > i.succeeded { color: #84c367; background: rgba(132,195,103,.07); }
.action-item > i.failed { color: #dd7970; background: rgba(221,121,112,.07); }
.confirm-dialog { width: min(450px,calc(100% - 30px)); padding: 0; color: rgba(255,255,255,.8); background: var(--panel-raised); border: 1px solid rgba(255,255,255,.13); border-radius: 12px; box-shadow: 0 30px 90px rgba(0,0,0,.55); }
.confirm-dialog::backdrop { background: rgba(2,6,3,.72); backdrop-filter: blur(4px); }
.confirm-dialog form { padding: 27px; }
.confirm-dialog form > span { color: #dc8077; font-size: .52rem; font-weight: 850; letter-spacing: .14em; }
.confirm-dialog h3 { margin: 10px 0; font-family: Inter,sans-serif; font-size: 1.2rem; }
.confirm-dialog p { color: rgba(255,255,255,.4); font-size: .67rem; }
.confirm-dialog label { display: grid; gap: 6px; margin: 20px 0; }
.confirm-dialog label span { color: rgba(255,255,255,.35); font-size: .55rem; }
.confirm-dialog input { padding: 11px; color: white; background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 7px; }
.confirm-dialog form > div { display: flex; justify-content: flex-end; gap: 8px; }
.confirm-dialog button { padding: 10px 13px; color: rgba(255,255,255,.65); background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 7px; font-size: .62rem; }
.confirm-dialog button:disabled { opacity: .35; cursor: not-allowed; }
.player-dialog { width: min(980px,calc(100% - 28px)); max-height: calc(100svh - 40px); padding: 0; overflow: auto; color: rgba(255,255,255,.8); background: #0d140f; border: 1px solid rgba(255,255,255,.13); border-radius: 13px; box-shadow: 0 30px 90px rgba(0,0,0,.6); }
.player-dialog::backdrop { background: rgba(2,6,3,.78); backdrop-filter: blur(5px); }
.player-dialog > header { position: sticky; z-index: 2; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 25px; background: rgba(13,20,15,.95); border-bottom: 1px solid var(--panel-line); backdrop-filter: blur(14px); }
.player-dialog header span, .detail-section-head span { color: rgba(255,255,255,.27); font-size: .49rem; font-weight: 850; letter-spacing: .13em; }
.player-dialog h3 { margin: 3px 0 0; font-family: Inter,sans-serif; font-size: 1.15rem; }
.player-dialog header button { display: grid; width: 34px; height: 34px; place-items: center; color: rgba(255,255,255,.55); background: rgba(255,255,255,.04); border: 1px solid var(--panel-line); border-radius: 7px; font-size: 1.1rem; }
.player-detail-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; padding: 22px 25px 0; }
.player-detail-summary div, .telemetry-grid div { min-width: 0; padding: 13px; background: rgba(255,255,255,.025); border: 1px solid var(--panel-line); border-radius: 8px; }
.player-detail-summary span, .telemetry-grid span { display: block; overflow: hidden; margin-bottom: 3px; color: rgba(255,255,255,.27); font-size: .48rem; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.player-detail-summary strong, .telemetry-grid strong { display: block; overflow-wrap: anywhere; color: rgba(255,255,255,.73); font-size: .66rem; }
.player-dialog > section { padding: 25px; border-bottom: 1px solid var(--panel-line); }
.detail-section-head { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-bottom: 13px; }
.detail-section-head h4 { margin: 0; font-family: Inter,sans-serif; font-size: .78rem; }
.telemetry-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.player-dialog details { margin: 0; padding: 20px 25px 25px; }
.player-dialog summary { color: var(--lime); cursor: pointer; font-size: .6rem; }
.player-dialog pre { max-height: 360px; padding: 15px; overflow: auto; color: rgba(255,255,255,.62); background: rgba(0,0,0,.23); border: 1px solid var(--panel-line); border-radius: 8px; font-size: .58rem; white-space: pre-wrap; }
.settings-form { padding: 26px; }
.settings-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 17px; }
.settings-grid label.secret-field { grid-column: span 2; }
.settings-form small { color: rgba(255,255,255,.26); font-size: .5rem; }
.settings-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--panel-line); }
.settings-footer p { margin: 0; overflow: hidden; color: rgba(255,255,255,.25); font-family: Consolas,monospace; font-size: .52rem; text-overflow: ellipsis; white-space: nowrap; }

/* v1.2-v1.4 operations, analytics and SaveData research */
.range-select { min-height: 38px; padding: 8px 12px; color: rgba(255,255,255,.68); background: #101712; border: 1px solid var(--panel-line); border-radius: 7px; font-size: .6rem; }
.analytics-grid, .reliability-grid, .savedata-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.analytics-chart-card, .policy-card, .resource-chart-card, .incident-card, .notification-card, .savedata-run-card, .savedata-reports-card, .savedata-result-card { padding: 24px; }
.analytics-leaders, .incident-card, .notification-card, .savedata-result-card { grid-column: 1/-1; }
.bar-chart { display: flex; min-height: 260px; align-items: end; gap: 5px; padding: 25px 3px 5px; overflow-x: auto; border-bottom: 1px solid var(--panel-line); }
.bar-chart > div { display: grid; min-width: 15px; height: 220px; flex: 1; grid-template-rows: 1fr auto; align-items: end; gap: 8px; }
.bar-chart i { display: block; min-height: 4px; background: linear-gradient(180deg,var(--lime),rgba(173,213,104,.17)); border-radius: 3px 3px 0 0; box-shadow: 0 0 12px rgba(173,213,104,.08); }
.bar-chart span { overflow: hidden; color: rgba(255,255,255,.23); font-size: .42rem; text-align: center; }
.activity-heatmap { display: grid; gap: 5px; padding-top: 21px; overflow-x: auto; }
.heatmap-row { display: grid; min-width: 560px; grid-template-columns: 30px repeat(24,1fr); gap: 3px; align-items: center; }
.heatmap-row span { color: rgba(255,255,255,.3); font-size: .48rem; }
.heatmap-row i { aspect-ratio: 1; background: rgba(173,213,104,calc(.035 + var(--heat) * .8)); border: 1px solid rgba(173,213,104,calc(.04 + var(--heat) * .25)); border-radius: 2px; }
.activity-heatmap footer { display: flex; min-width: 530px; justify-content: space-between; margin-left: 30px; color: rgba(255,255,255,.22); font-size: .43rem; }
.resource-chart-card svg { width: 100%; height: 260px; overflow: visible; }
.resource-grid line { stroke: rgba(255,255,255,.055); stroke-width: 1; }
.resource-cpu, .resource-ram { fill: none; stroke-width: 3; vector-effect: non-scaling-stroke; }
.resource-cpu { stroke: #d6a84e; }
.resource-ram { stroke: var(--lime); }
.policy-list { display: grid; gap: 8px; margin: 18px 0; }
.policy-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 12px; background: rgba(255,255,255,.025); border: 1px solid var(--panel-line); border-radius: 7px; }
.policy-list span { color: rgba(255,255,255,.33); font-size: .57rem; }
.policy-list strong { color: rgba(255,255,255,.68); font-size: .58rem; text-align: right; }
.policy-card > button, .savedata-reports-card button, .moderation-form button, .backup-actions button { padding: 8px 10px; color: var(--lime); background: rgba(173,213,104,.045); border: 1px solid rgba(173,213,104,.14); border-radius: 6px; font-size: .54rem; }
.incident-card > div:last-child { display: grid; }
.incident { display: grid; grid-template-columns: 9px 1fr; gap: 11px; padding: 13px 0; border-top: 1px solid var(--panel-line); }
.incident > i { width: 7px; height: 7px; margin-top: 5px; background: #789b63; border-radius: 50%; }
.incident.warning > i { background: #d6a84e; }
.incident.critical > i { background: #dd7970; box-shadow: 0 0 8px rgba(221,121,112,.35); }
.incident.recovery > i { background: var(--lime); }
.incident strong { color: rgba(255,255,255,.72); font-size: .62rem; }
.incident p { margin: 4px 0; color: rgba(255,255,255,.38); font-size: .56rem; }
.incident span { color: rgba(255,255,255,.23); font-size: .49rem; }
.notification-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; padding: 11px 0; border-top: 1px solid var(--panel-line); font-size: .55rem; }
.notification-row strong { color: rgba(255,255,255,.62); }
.notification-row span { color: #d6a84e; text-transform: uppercase; }
.notification-row span.sent { color: var(--lime); }
.notification-row span.failed { color: #dd7970; }
.notification-row small { color: rgba(255,255,255,.24); }
.card-note { margin: -7px 0 12px; color: rgba(255,255,255,.33); font-size: .56rem; line-height: 1.6; }
.backup-item { grid-template-columns: minmax(0,1fr) auto auto; align-items: center; }
.backup-item > span:first-child { display: grid; gap: 3px; min-width: 0; }
.backup-item small { color: rgba(255,255,255,.25); font-size: .48rem; }
.backup-actions { display: flex; gap: 5px; }
.savedata-run-card > p { color: rgba(255,255,255,.36); font-size: .6rem; line-height: 1.65; }
.savedata-run-card form, .player-admin-form { display: grid; gap: 12px; margin-top: 18px; }
.savedata-run-card label, .player-admin-form label { display: grid; gap: 6px; color: rgba(255,255,255,.36); font-size: .54rem; }
.savedata-run-card select, .player-admin-form input, .player-admin-form textarea, .moderation-form select, .moderation-form input { width: 100%; padding: 10px; color: rgba(255,255,255,.7); background: #0b110d; border: 1px solid var(--panel-line); border-radius: 6px; font-size: .58rem; }
.player-admin-form .check-line { display: flex; align-items: center; gap: 7px; }
.player-admin-form .check-line input { width: auto; }
.moderation-form { display: grid; grid-template-columns: 180px 1fr auto; gap: 8px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--panel-line); }
.moderation-history { display: grid; margin-top: 16px; }
.moderation-history > div { padding: 10px 0; border-top: 1px solid var(--panel-line); }
.moderation-history strong { color: var(--lime); font-size: .55rem; text-transform: uppercase; }
.moderation-history span { margin-left: 10px; color: rgba(255,255,255,.24); font-size: .49rem; }
.moderation-history p { margin: 5px 0 0; color: rgba(255,255,255,.42); font-size: .56rem; }
.savedata-reports-card > div:last-child { display: grid; }
.savedata-report-row { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 15px; padding: 12px 0; color: inherit; background: transparent; border: 0; border-top: 1px solid var(--panel-line); text-align: left; }
.savedata-report-row > span { display: grid; gap: 3px; }
.savedata-report-row strong { color: rgba(255,255,255,.66); font-size: .58rem; }
.savedata-report-row small { color: rgba(255,255,255,.25); font-size: .48rem; }
.savedata-report-row i { color: #d6a84e; font-size: .5rem; font-style: normal; text-transform: uppercase; }
.savedata-report-row i.completed { color: var(--lime); }
.savedata-report-row i.failed { color: #dd7970; }
.savedata-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.savedata-summary > div { padding: 12px; background: rgba(255,255,255,.025); border: 1px solid var(--panel-line); border-radius: 7px; }
.savedata-summary span { display: block; color: rgba(255,255,255,.25); font-size: .47rem; text-transform: uppercase; }
.savedata-summary strong { display: block; margin-top: 4px; overflow-wrap: anywhere; color: rgba(255,255,255,.67); font-size: .57rem; }
.research-notice { padding: 12px; color: #d6a84e; background: rgba(214,168,78,.04); border: 1px solid rgba(214,168,78,.12); border-radius: 7px; font-size: .55rem; line-height: 1.6; }
.savedata-entry-list { display: grid; gap: 7px; }
.savedata-entry-list details { padding: 11px; background: rgba(255,255,255,.02); border: 1px solid var(--panel-line); border-radius: 7px; }
.savedata-entry-list summary { display: flex; justify-content: space-between; gap: 15px; cursor: pointer; }
.savedata-entry-list summary strong { color: rgba(255,255,255,.66); font-size: .56rem; overflow-wrap: anywhere; }
.savedata-entry-list summary span { color: rgba(255,255,255,.27); font-size: .5rem; }
.savedata-entry-list dl { display: grid; grid-template-columns: 110px 1fr; gap: 8px; margin-top: 14px; font-size: .52rem; }
.savedata-entry-list dt { color: rgba(255,255,255,.25); }
.savedata-entry-list dd { margin: 0; color: rgba(255,255,255,.54); overflow-wrap: anywhere; }
.savedata-entry-list code { display: inline-block; margin: 2px; padding: 3px 5px; color: #a9d77c; background: rgba(0,0,0,.22); border-radius: 3px; }

/* Public server status */
.status-page-body { min-height: 100vh; color: rgba(255,255,255,.84); background: #08100b radial-gradient(circle at 70% 0,rgba(173,213,104,.07),transparent 34%); }
.status-container { width: min(1180px,calc(100% - 40px)); margin-inline: auto; }
.status-header { border-bottom: 1px solid rgba(255,255,255,.07); }
.status-header > div { display: flex; min-height: 82px; align-items: center; justify-content: space-between; gap: 25px; }
.status-header nav { display: flex; align-items: center; gap: 22px; }
.status-header nav > a:not(.button) { color: rgba(255,255,255,.48); font-size: .68rem; }
.status-main { padding-block: 65px 90px; }
.status-hero { display: flex; align-items: end; justify-content: space-between; gap: 50px; padding-bottom: 42px; }
.status-hero p, .status-card header span, .status-public-metrics article > span { color: var(--lime); font-size: .52rem; font-weight: 850; letter-spacing: .14em; }
.status-hero h1 { margin: 8px 0; font-size: clamp(3.2rem,7vw,6.4rem); line-height: .92; }
.status-hero > div:first-child > span { color: rgba(255,255,255,.38); font-size: .7rem; }
.status-overall { display: flex; min-width: 300px; align-items: center; gap: 14px; padding: 18px 20px; background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.09); border-radius: 10px; }
.status-overall > i { width: 12px; height: 12px; background: #d6a84e; border-radius: 50%; box-shadow: 0 0 15px rgba(214,168,78,.35); }
.status-overall.online > i { background: var(--lime); box-shadow: 0 0 15px rgba(173,213,104,.45); }
.status-overall.offline > i { background: #dd7970; box-shadow: 0 0 15px rgba(221,121,112,.4); }
.status-overall span { display: grid; gap: 3px; }
.status-overall strong { font-size: .72rem; }
.status-overall small { color: rgba(255,255,255,.34); font-size: .55rem; }
.status-public-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 18px; }
.status-public-metrics article { display: grid; min-height: 145px; align-content: center; gap: 8px; padding: 24px; background: #111a14; border: 1px solid rgba(255,255,255,.075); border-radius: 10px; }
.status-public-metrics article > span { color: rgba(255,255,255,.28); }
.status-public-metrics strong { font-family: Georgia,serif; font-size: 1.7rem; }
.status-public-metrics small { color: rgba(255,255,255,.3); font-size: .55rem; }
.status-layout { display: grid; grid-template-columns: 1.35fr .65fr; gap: 14px; }
.status-card { padding: 27px; background: #111a14; border: 1px solid rgba(255,255,255,.075); border-radius: 10px; }
.status-card > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.status-card header span { color: rgba(255,255,255,.25); }
.status-card h2 { margin: 5px 0 0; font-family: Inter,sans-serif; font-size: .95rem; }
.status-uptime-card { grid-column: 1/-1; }
.status-legend { display: flex; align-items: center; gap: 6px; }
.status-legend i { width: 7px; height: 7px; background: var(--lime); border-radius: 50%; }
.uptime-days { display: grid; grid-template-columns: repeat(30,1fr); gap: 4px; }
.uptime-days i { height: 50px; background: rgba(255,255,255,.055); border-radius: 3px; }
.uptime-days i.healthy { background: var(--lime); }
.uptime-days i.warning { background: #d6a84e; }
.uptime-days i.critical { background: #dd7970; }
.status-uptime-card > footer { display: flex; justify-content: space-between; margin-top: 9px; color: rgba(255,255,255,.25); font-size: .5rem; }
.service-list { display: grid; }
.service-list > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 0; border-top: 1px solid rgba(255,255,255,.07); }
.service-list > div > span { display: flex; align-items: center; gap: 10px; }
.service-list i { width: 7px; height: 7px; background: #d6a84e; border-radius: 50%; }
.service-list i.online { background: var(--lime); }
.service-list i.offline { background: #dd7970; }
.service-list strong { font-size: .62rem; }
.service-list small { color: rgba(255,255,255,.33); font-size: .52rem; }
.status-incident-card > div:last-child { display: grid; }
.public-incident { display: grid; grid-template-columns: 9px 1fr; gap: 10px; padding: 15px 0; border-top: 1px solid rgba(255,255,255,.07); }
.public-incident > i { width: 7px; height: 7px; margin-top: 5px; background: #d6a84e; border-radius: 50%; }
.public-incident.critical > i { background: #dd7970; }
.public-incident.recovery > i { background: var(--lime); }
.public-incident strong, .no-incidents strong { font-size: .62rem; }
.public-incident p, .no-incidents p { margin: 5px 0; color: rgba(255,255,255,.36); font-size: .55rem; line-height: 1.55; }
.public-incident span { color: rgba(255,255,255,.23); font-size: .49rem; }
.no-incidents { display: flex; align-items: center; gap: 14px; padding: 20px 0; }
.no-incidents > i { display: grid; width: 35px; height: 35px; color: var(--lime); background: rgba(173,213,104,.07); border-radius: 50%; place-items: center; font-style: normal; }
.status-footer { padding: 27px 0; color: rgba(255,255,255,.3); border-top: 1px solid rgba(255,255,255,.07); font-size: .56rem; }
.status-footer > div { display: flex; justify-content: space-between; }
.status-footer a { color: rgba(255,255,255,.42); }

/* Read-only web console */
.console-card { overflow: hidden; }
.console-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding: 15px 17px; background: rgba(255,255,255,.018); border-bottom: 1px solid var(--panel-line); }
.console-filters, .console-actions { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; }
.console-filters label { display: grid; gap: 5px; }
.console-filters label > span { color: rgba(255,255,255,.28); font-size: .48rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.console-filters select, .console-filters input { min-height: 36px; padding: 8px 10px; color: rgba(255,255,255,.68); background: #0b110d; border: 1px solid var(--panel-line); border-radius: 6px; outline: 0; font-size: .58rem; }
.console-filters input { width: min(320px,32vw); }
.console-actions button { min-height: 36px; padding: 8px 10px; color: rgba(255,255,255,.54); background: rgba(255,255,255,.035); border: 1px solid var(--panel-line); border-radius: 6px; font-size: .55rem; }
.console-actions button.active { color: #e0b469; border-color: rgba(224,180,105,.22); }
.console-banner { display: flex; align-items: center; gap: 10px; padding: 11px 17px; color: rgba(255,255,255,.38); background: rgba(173,213,104,.035); border-bottom: 1px solid var(--panel-line); }
.console-banner > i { width: 7px; height: 7px; background: #8aca6c; border-radius: 50%; box-shadow: 0 0 10px rgba(138,202,108,.4); }
.console-banner > div { display: flex; gap: 8px; }
.console-banner strong { color: #8aca6c; font-size: .55rem; }
.console-banner span { font-size: .54rem; }
.console-banner code { color: rgba(255,255,255,.62); }
.console-output { min-height: 500px; max-height: calc(100svh - 350px); padding: 16px 0; overflow: auto; color: rgba(225,235,227,.68); background: #050906; font-family: Consolas,"Cascadia Mono",monospace; font-size: .61rem; line-height: 1.62; }
.console-line { display: grid; grid-template-columns: 66px 1fr; gap: 10px; padding: 1px 17px; white-space: pre-wrap; overflow-wrap: anywhere; }
.console-line:hover { background: rgba(255,255,255,.025); }
.console-line > span:first-child { color: rgba(255,255,255,.22); font-size: .48rem; text-transform: uppercase; }
.console-line.error { color: #e48a82; background: rgba(221,121,112,.025); }
.console-line.warning { color: #e2b96f; }
.console-line.player { color: #a9d77c; }
.console-line.network { color: #83b9d6; }
.console-line.web { color: #b09bdc; }
.console-empty { padding: 25px; color: rgba(255,255,255,.28); text-align: center; }
.console-card > footer { display: flex; justify-content: space-between; gap: 15px; padding: 10px 17px; color: rgba(255,255,255,.25); background: rgba(255,255,255,.018); border-top: 1px solid var(--panel-line); font-family: Consolas,monospace; font-size: .49rem; }
.panel-loader { display: grid; min-height: 100vh; place-content: center; justify-items: center; gap: 15px; color: rgba(255,255,255,.42); background: #090e0b; font-size: .68rem; }
.panel-loader img { animation: pulse 1.6s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .5; transform: scale(.97); } }

/* Legal and error */
.legal-body { padding: 60px 20px; background: var(--paper); }
.legal-card { max-width: 820px; margin: auto; }
.legal-card .brand { margin-bottom: 70px; }
.legal-card h1 { margin-bottom: 45px; font-size: clamp(3rem,7vw,5.5rem); }
.legal-card section { padding: 25px 0; border-top: 1px solid var(--line); }
.legal-card h2 { margin-bottom: 10px; font-family: Inter,sans-serif; font-size: 1.05rem; }
.legal-card section p { color: var(--ink-soft); }
.error-body { display: grid; min-height: 100svh; padding: 30px; place-items: center; color: white; background: linear-gradient(rgba(5,12,8,.75),rgba(5,12,8,.95)),url("/assets/img/hero-landscape.svg") center/cover; }
.error-body main { max-width: 700px; text-align: center; }
.error-body img { margin: 0 auto 18px; }
.error-body span { color: var(--lime); font-size: .61rem; font-weight: 850; letter-spacing: .17em; }
.error-body h1 { margin: 8px 0 17px; font-size: clamp(3.3rem,9vw,7rem); }
.error-body p { margin-bottom: 30px; color: rgba(255,255,255,.58); }

/* Responsive */
@media (max-width: 1100px) {
  .public-nav { gap: 24px; }
  .public-links { gap: 19px; }
  .hero-grid { grid-template-columns: 1fr 310px; gap: 45px; }
  .platform-grid { grid-template-columns: 1fr 1fr; }
  .platform-card.featured { grid-column: span 2; grid-row: auto; min-height: 400px; }
  .platform-card.wide { grid-column: span 2; }
  .rules-public-grid { grid-template-columns: 1fr 1fr; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .settings-grid { grid-template-columns: 1fr 1fr; }
  .leaderboard-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
  :root { --header: 70px; }
  .mobile-menu { display: block; justify-self: end; }
  .public-nav { grid-template-columns: auto 1fr auto; }
  .public-links { position: fixed; top: var(--header); right: 0; bottom: 0; left: 0; display: grid; align-content: start; gap: 0; padding: 25px 20px; background: rgba(5,12,8,.98); opacity: 0; pointer-events: none; transform: translateY(-10px); transition: opacity var(--ease),transform var(--ease); }
  .public-links.open { opacity: 1; pointer-events: auto; transform: none; }
  .public-links a { padding: 16px 10px; border-bottom: 1px solid rgba(255,255,255,.07); font-size: .95rem; }
  .auth-links { display: none; }
  .hero-grid { grid-template-columns: 1fr; padding-top: calc(var(--header) + 65px); }
  .live-card { display: none; }
  .title-split, .stats-layout, .join-public-grid { grid-template-columns: 1fr; gap: 45px; }
  .title-split > p { max-width: 650px; }
  .public-cta-inner { grid-template-columns: auto 1fr; }
  .public-cta-inner .button { grid-column: 1/-1; width: fit-content; margin-left: 101px; }
  .public-footer-top { grid-template-columns: 1fr; gap: 25px; text-align: center; }
  .public-footer-top .brand, .public-footer nav { justify-content: center; }
  .auth-layout { grid-template-columns: 1fr; }
  .auth-visual { display: none; }
  .panel-shell { grid-template-columns: 1fr; }
  .panel-sidebar { transform: translateX(-100%); transition: transform var(--ease); }
  .panel-sidebar.open { box-shadow: 20px 0 70px rgba(0,0,0,.55); transform: none; }
  .panel-main { grid-column: 1; }
  .sidebar-toggle { display: block; }
  .panel-content { padding: 23px; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .profile-grid, .control-grid { grid-template-columns: 1fr; }
  .profile-card { grid-row: auto; }
  .telemetry-grid { grid-template-columns: repeat(2,1fr); }
  .console-toolbar { align-items: stretch; flex-direction: column; }
  .console-filters input { width: min(430px,60vw); }
  .command-helper form { grid-template-columns: 1fr 1fr; }
  .command-helper form .button { grid-column: 1/-1; }
}

@media (max-width: 650px) {
  .container { width: min(var(--container),calc(100% - 28px)); }
  .public-section { padding: 74px 0; }
  .public-hero { min-height: 720px; }
  .hero-copy h1 { font-size: clamp(3.1rem,15vw,5rem); }
  .hero-buttons { display: grid; }
  .hero-buttons .button { width: 100%; }
  .hero-status { display: grid; grid-template-columns: auto 1fr; }
  .hero-status i { display: none; }
  .hero-status code { grid-column: 2; }
  .platform-grid { grid-template-columns: 1fr; }
  .platform-card.featured, .platform-card.wide { grid-column: auto; }
  .platform-card.wide { display: block; }
  .platform-card.wide .line-icon { margin-bottom: 30px; }
  .platform-card.wide .card-kicker { margin-bottom: 10px; }
  .rules-public-grid { grid-template-columns: 1fr; }
  .server-address-box { display: grid; }
  .server-address-box button { width: 100%; }
  .public-cta-inner { grid-template-columns: 1fr; text-align: center; }
  .public-cta-inner > img { margin: auto; }
  .public-cta-inner .button { width: 100%; margin-left: 0; }
  .public-footer-bottom { display: grid; justify-content: center; gap: 7px; text-align: center; }
  .auth-form-side { padding: 70px 20px 35px; }
  .back-link { top: 22px; right: 20px; }
  .panel-topbar { padding: 0 17px; }
  .panel-topbar > div:first-of-type { display: none; }
  .topbar-actions > button { display: none; }
  .panel-content { padding: 17px; }
  .welcome-row { align-items: start; }
  .metric-grid { grid-template-columns: 1fr; }
  .metric-grid article { min-height: 120px; }
  .profile-stats { grid-template-columns: 1fr; }
  .player-detail-summary, .telemetry-grid, .profile-telemetry .telemetry-grid { grid-template-columns: 1fr; }
  .settings-grid { grid-template-columns: 1fr; }
  .settings-grid label.secret-field { grid-column: auto; }
  .settings-footer { display: grid; }
  .settings-footer .button { width: 100%; }
  .control-buttons { grid-template-columns: 1fr; }
  .action-item { grid-template-columns: 70px 1fr; }
  .action-item > i { grid-column: 2; width: fit-content; }
  .view-toolbar { align-items: start; }
  .view-toolbar input { width: 170px; }
  .leaderboard-grid, .capability-grid { grid-template-columns: 1fr; }
  .telemetry-notice { grid-template-columns: 1fr; }
  .telemetry-notice > span { grid-row: auto; width: fit-content; }
  .console-filters, .console-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .console-filters label:last-child { grid-column: 1/-1; }
  .console-filters input { width: 100%; }
  .console-banner > div { display: grid; }
  .console-output { min-height: 420px; }
  .console-line { grid-template-columns: 48px 1fr; padding-right: 11px; padding-left: 11px; }
  .console-card > footer { flex-wrap: wrap; }
  .command-helper form { grid-template-columns: 1fr; }
  .command-helper form .button { grid-column: auto; }
  .toast { right: 14px; bottom: 14px; left: 14px; max-width: none; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (max-width: 900px) {
  .analytics-grid, .reliability-grid, .savedata-grid, .status-layout { grid-template-columns: 1fr; }
  .analytics-leaders, .incident-card, .notification-card, .savedata-result-card, .status-uptime-card { grid-column: 1; }
  .status-public-metrics { grid-template-columns: 1fr 1fr; }
  .status-hero { align-items: stretch; flex-direction: column; }
  .status-overall { min-width: 0; }
  .moderation-form { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
  .status-container { width: min(100% - 24px,1180px); }
  .status-header nav > a:not(.button) { display: none; }
  .status-main { padding-block: 40px 60px; }
  .status-public-metrics { grid-template-columns: 1fr; }
  .status-hero h1 { font-size: 3.6rem; }
  .status-card { padding: 19px; }
  .uptime-days { gap: 2px; }
  .uptime-days i { height: 36px; }
  .savedata-summary { grid-template-columns: 1fr; }
  .savedata-entry-list summary { display: grid; }
  .savedata-entry-list dl { grid-template-columns: 1fr; }
  .backup-item { grid-template-columns: 1fr auto; }
  .backup-actions { grid-column: 1/-1; }
}