:root {
    --bg: #03111e;
    --bg-2: #061a2d;
    --panel: rgba(8, 28, 48, .92);
    --panel-2: rgba(11, 37, 63, .94);
    --line: rgba(113, 181, 255, .24);
    --line-gold: rgba(255, 200, 61, .44);
    --text: #f4f8ff;
    --muted: #a9bbcf;
    --blue: #2196ff;
    --blue-2: #55b8ff;
    --gold: #ffd442;
    --gold-2: #ffb521;
    --red: #f04f4f;
    --green: #43d98d;
    --shadow: 0 22px 70px rgba(0,0,0,.38);
    --radius: 22px;
    --radius-sm: 14px;
    --shell: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--text);
    background:
        radial-gradient(circle at 12% -10%, rgba(18, 131, 255, .18), transparent 31rem),
        radial-gradient(circle at 92% 4%, rgba(255, 180, 31, .11), transparent 28rem),
        linear-gradient(180deg, #03111e 0%, #041522 48%, #020b13 100%);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
}
body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image:
        linear-gradient(rgba(110,180,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(110,180,255,.045) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(to bottom, black, transparent 78%);
}
a { color: var(--blue-2); text-decoration: none; }
a:hover { color: #8ed2ff; }
img { max-width: 100%; }
button, input { font: inherit; }
button { color: inherit; }
main { position: relative; z-index: 2; }
.shell { width: min(var(--shell), calc(100% - 40px)); margin: 0 auto; }
.shell.narrow { width: min(880px, calc(100% - 40px)); }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.muted { color: var(--muted); }

.page-energy { position: fixed; width: 28rem; height: 58rem; filter: blur(75px); opacity: .13; pointer-events: none; z-index: 0; }
.page-energy-left { left: -16rem; top: 24rem; background: #ff7a19; transform: rotate(-18deg); }
.page-energy-right { right: -16rem; top: 8rem; background: #0e8cff; transform: rotate(18deg); }

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(2, 14, 25, .88);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(107, 177, 244, .18);
    box-shadow: 0 8px 35px rgba(0,0,0,.25);
}
.site-header::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -1px; height: 1px;
    background: linear-gradient(90deg, transparent, var(--blue), var(--gold), transparent);
    opacity: .55;
}
.nav-shell { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: #fff; min-width: 0; }
.brand-logo { width: 58px; height: 58px; object-fit: contain; filter: drop-shadow(0 4px 14px rgba(36,145,255,.28)); }
.brand-copy { display: grid; gap: 2px; line-height: 1.05; }
.brand-copy strong { font-size: 15px; letter-spacing: .025em; }
.brand-copy small { color: #89a7c5; font-size: 11px; text-transform: uppercase; letter-spacing: .11em; }
.main-nav { display: flex; align-items: center; gap: 6px; }
.main-nav > a, .nav-button { color: #c4d6e8; border: 0; background: transparent; padding: 10px 12px; border-radius: 10px; font-size: 14px; cursor: pointer; }
.main-nav > a:hover, .nav-button:hover { color: white; background: rgba(78, 160, 238, .12); }
.main-nav .nav-cta { color: #0e1822; background: linear-gradient(180deg, #ffe776, var(--gold)); font-weight: 800; box-shadow: 0 7px 22px rgba(255, 199, 47, .22); }
.main-nav .nav-cta:hover { color: #0e1822; background: #ffe97d; }
.main-nav .staff-link { color: #ffd761; border: 1px solid rgba(255,215,97,.25); }
.nav-form { margin: 0; }
.nav-toggle { display: none; border: 1px solid var(--line); background: rgba(20,60,92,.5); border-radius: 10px; width: 42px; height: 42px; }

.hero { position: relative; padding: 74px 0 82px; overflow: hidden; }
.pokemon-hero { min-height: 650px; display: flex; align-items: center; }
.pokemon-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 25% 50%, rgba(25,132,255,.15), transparent 28rem),
        linear-gradient(135deg, transparent 0 47%, rgba(255,204,50,.035) 47% 48%, transparent 48% 100%);
}
.hero-orb { position: absolute; border-radius: 50%; filter: blur(4px); opacity: .5; }
.hero-orb-a { width: 520px; height: 520px; left: -230px; top: 90px; border: 1px solid rgba(255,126,31,.33); box-shadow: 0 0 90px rgba(255,104,22,.12) inset; }
.hero-orb-b { width: 620px; height: 620px; right: -280px; top: -70px; border: 1px solid rgba(41,153,255,.34); box-shadow: 0 0 100px rgba(0,126,255,.12) inset; }
.hero-grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 56px; }
.pokemon-hero-grid { grid-template-columns: .95fr 1.05fr; }
.hero-brand-stage { position: relative; min-height: 460px; display: grid; place-items: center; }
.hero-brand-stage::before {
    content: "";
    position: absolute;
    width: 74%; aspect-ratio: 1;
    border-radius: 50%;
    border: 2px solid rgba(102, 185, 255, .18);
    box-shadow:
        0 0 0 16px rgba(20,78,128,.08),
        0 0 0 34px rgba(20,78,128,.05),
        0 0 85px rgba(22,145,255,.2);
}
.logo-halo { position: absolute; width: 72%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(36,146,255,.2), transparent 68%); }
.hero-logo { position: relative; width: min(510px, 95%); filter: drop-shadow(0 30px 28px rgba(0,0,0,.52)); animation: heroFloat 5.8s ease-in-out infinite; }
@keyframes heroFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
.hero-badge-row { position: absolute; bottom: 6px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.type-badge { font-size: 10px; font-weight: 900; letter-spacing: .15em; padding: 7px 10px; border-radius: 999px; color: #081521; border: 1px solid rgba(255,255,255,.4); box-shadow: 0 6px 15px rgba(0,0,0,.22); }
.type-electric { background: #ffe04d; }
.type-water { background: #54b8ff; }
.type-fire { background: #ff7a4c; }
.hero-copy h1 { font-size: clamp(40px, 5.1vw, 68px); line-height: .99; margin: 14px 0 20px; letter-spacing: -.045em; max-width: 760px; text-wrap: balance; }
.hero-lead { color: #bcd0e2; font-size: 19px; line-height: 1.7; max-width: 690px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #7dc7ff; font-weight: 850; text-transform: uppercase; letter-spacing: .13em; font-size: 11px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px var(--green); }
.hero-actions { display: flex; gap: 12px; margin: 28px 0; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 20px; border-radius: 12px; border: 1px solid transparent; font-weight: 800; font-size: 14px; cursor: pointer; transition: transform .14s ease, box-shadow .14s ease, background .14s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: #07131d; background: linear-gradient(180deg, #ffe977, var(--gold)); border-color: #fff0a9; box-shadow: 0 9px 28px rgba(255,198,39,.22); }
.button-primary:hover { color: #07131d; box-shadow: 0 13px 34px rgba(255,198,39,.31); }
.button-secondary { color: #eef7ff; background: linear-gradient(180deg, rgba(37,121,200,.45), rgba(17,66,107,.45)); border-color: rgba(115,193,255,.38); box-shadow: 0 9px 28px rgba(0,84,163,.17); }
.button-secondary:hover { color: #fff; background: rgba(37,121,200,.55); }
.button-full { width: 100%; }
.text-link { font-weight: 800; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 10px; }
.hero-meta span { border: 1px solid var(--line); background: rgba(7,35,59,.75); padding: 9px 11px; border-radius: 999px; color: #b6c8d9; font-size: 12px; }
.hero-meta b { color: #fff; }

.section { position: relative; padding: 78px 0; }
.section-route::before { content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(16,63,101,.11), rgba(0,0,0,0)); border-top: 1px solid rgba(90,167,236,.1); }
.section-heading { position: relative; max-width: 790px; margin-bottom: 34px; }
.section-heading h2, .trainer-panel h2, .legal-callout h2 { font-size: clamp(30px, 4vw, 48px); letter-spacing: -.035em; line-height: 1.07; margin: 10px 0 14px; }
.section-heading p, .trainer-panel p, .legal-callout p { color: var(--muted); line-height: 1.75; font-size: 16px; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; position: relative; }
.feature-card, .prose-card, .account-card, .admin-panel, .admin-sidebar, .legal-document, .legal-gate, .empty-state, .download-card {
    background: linear-gradient(180deg, rgba(12,39,65,.93), rgba(6,25,43,.95));
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}
.feature-card { padding: 26px; border-radius: var(--radius); min-height: 235px; position: relative; overflow: hidden; }
.feature-card::after { content:""; position:absolute; width:120px; height:120px; border-radius:50%; right:-54px; bottom:-54px; border:1px solid rgba(255,215,71,.12); }
.feature-card h3 { font-size: 20px; margin: 18px 0 10px; }
.feature-card p { color: var(--muted); line-height: 1.65; margin: 0; font-size: 14px; }
.feature-icon { display: grid; place-items:center; width:44px; height:44px; border-radius: 50%; background: radial-gradient(circle, #f8e269 0 25%, #f4bd22 26% 100%); color:#0a1a2b; font-weight:900; box-shadow: 0 0 0 5px rgba(246,198,40,.08); }
.feature-ball, .download-ball { width: 44px; height: 44px; border-radius:50%; display:block; background: linear-gradient(#ed4d4d 0 45%, #111827 45% 55%, #f4f4f4 55%); border: 2px solid #dcecff; position:relative; box-shadow: 0 4px 16px rgba(0,0,0,.32); }
.feature-ball::after, .download-ball::after { content:""; position:absolute; width:12px; height:12px; border-radius:50%; background:white; border:3px solid #1b2634; left:50%; top:50%; transform:translate(-50%,-50%); }

.trainer-panel-section { padding-top: 32px; }
.trainer-panel { border-radius: 28px; border: 1px solid var(--line-gold); background: linear-gradient(110deg, rgba(16,55,91,.94), rgba(7,31,53,.96)); padding: 38px; display:grid; grid-template-columns:.9fr 1.1fr; gap: 36px; align-items:center; box-shadow: var(--shadow); position:relative; overflow:hidden; }
.trainer-panel::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 87% 40%, rgba(255,198,45,.09), transparent 30%); pointer-events:none; }
.account-flow { display:flex; align-items:stretch; gap:10px; position:relative; }
.account-flow > div { flex:1; border:1px solid rgba(113,181,255,.2); background:rgba(5,23,40,.58); padding:18px; border-radius:16px; min-width:0; }
.account-flow > div span { color:var(--gold); font-weight:900; font-size:11px; }
.account-flow b, .account-flow small { display:block; }
.account-flow b { margin:8px 0 6px; }
.account-flow small { color:var(--muted); line-height:1.45; }
.account-flow i { align-self:center; color:#6588a6; font-style:normal; }
.legal-callout-section { padding-top: 28px; }
.legal-callout { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px; padding:28px 30px; border-radius:22px; border:1px solid rgba(255,196,54,.28); background:rgba(37,28,9,.3); }
.legal-callout h2 { font-size: 27px; margin:5px 0 6px; }
.legal-callout p { margin:0; font-size:14px; }
.legal-icon { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:var(--gold); color:#141b23; font-weight:950; font-size:22px; box-shadow:0 0 22px rgba(255,201,42,.2); }

.page-hero { padding: 58px 0 50px; border-bottom:1px solid rgba(101,174,244,.13); background: linear-gradient(180deg, rgba(12,47,77,.45), rgba(4,21,35,.18)); }
.page-hero.compact h1 { font-size: clamp(35px, 5vw, 54px); line-height:1.03; margin:10px 0 14px; letter-spacing:-.04em; }
.page-hero p { color:var(--muted); line-height:1.7; max-width:750px; }
.page-hero-with-logo { display:flex; align-items:center; gap:25px; }
.page-hero-logo { width:112px; height:112px; object-fit:contain; filter:drop-shadow(0 12px 20px rgba(0,0,0,.34)); }
.content-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.prose-card { border-radius:var(--radius); padding:30px; }
.prose-card.wide { grid-column:1/-1; }
.prose-card h2 { margin:8px 0 14px; font-size:27px; }
.prose-card p { color:var(--muted); line-height:1.75; }
.card-kicker { color:var(--gold); text-transform:uppercase; letter-spacing:.13em; font-weight:850; font-size:10px; }
.principle-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.principle-grid div { border:1px solid var(--line); background:rgba(7,27,45,.58); border-radius:14px; padding:18px; }
.principle-grid b, .principle-grid span { display:block; }
.principle-grid span { color:var(--muted); line-height:1.55; margin-top:7px; font-size:14px; }
.legal-mini-card { border-color: rgba(255,196,54,.26); }

.auth-section { padding: 70px 20px 90px; min-height: calc(100vh - 76px); display:grid; place-items:start center; }
.pokemon-auth-section { background: radial-gradient(circle at 50% 25%, rgba(34,139,255,.12), transparent 34rem); }
.auth-card { width:min(520px,100%); padding:32px; border-radius:26px; background:linear-gradient(180deg,rgba(12,42,71,.97),rgba(4,22,38,.98)); border:1px solid rgba(113,181,255,.26); box-shadow:var(--shadow); position:relative; overflow:hidden; }
.auth-card::before { content:""; position:absolute; height:4px; left:0; right:0; top:0; background:linear-gradient(90deg,var(--red),var(--gold),var(--blue)); }
.auth-card-wide { width:min(760px,100%); }
.auth-logo-wrap { display:flex; justify-content:center; margin:-18px 0 4px; }
.auth-logo-wrap img { width:150px; max-height:150px; object-fit:contain; filter:drop-shadow(0 12px 18px rgba(0,0,0,.3)); }
.auth-intro { text-align:center; margin-bottom:24px; }
.auth-intro h1 { font-size:36px; margin:7px 0 10px; letter-spacing:-.04em; }
.auth-intro p { color:var(--muted); line-height:1.6; }
.form-stack { display:grid; gap:16px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { display:grid; gap:7px; }
.field-wide { grid-column:1/-1; }
.field label { font-size:13px; font-weight:800; color:#d9e7f5; }
.field input, .field select, .field textarea, .search-row input, .staff-action-card input, .staff-action-card select { width:100%; border-radius:12px; border:1px solid rgba(116,180,238,.26); background:#041626; color:#fff; padding:13px 14px; outline:none; }
.field input:focus, .field select:focus, .field textarea:focus, .search-row input:focus, .staff-action-card input:focus, .staff-action-card select:focus { border-color:#58b8ff; box-shadow:0 0 0 3px rgba(43,151,236,.12); }
.field small, .legal-check-panel small { color:#7995ae; font-size:11px; }
.field-error { color:#ff9292; font-size:12px; }
.auth-foot { text-align:center; color:var(--muted); margin:22px 0 0; font-size:13px; }
.auth-legal-mini { color:#7890a5; font-size:11px; line-height:1.55; text-align:center; margin:16px 0 0; }
.alert { padding:12px 14px; border-radius:12px; margin:0 0 16px; font-size:13px; }
.alert-error { background:rgba(125,26,33,.32); border:1px solid rgba(255,92,102,.35); color:#ffc0c5; }
.legal-check-panel { border:1px solid rgba(255,196,54,.24); background:rgba(55,40,10,.24); border-radius:14px; padding:16px; }
.check-row { display:flex; align-items:flex-start; gap:11px; color:#d8e4ef; line-height:1.55; font-size:13px; cursor:pointer; }
.check-row input { width:18px; height:18px; margin-top:2px; accent-color:#f2c52f; flex:0 0 auto; }

.account-layout { display:grid; grid-template-columns:1fr 1.3fr; gap:16px; }
.account-card { border-radius:var(--radius); padding:24px; }
.primary-card { display:flex; align-items:center; gap:18px; }
.account-avatar { width:72px; height:72px; border-radius:50%; display:grid; place-items:center; font-size:23px; font-weight:900; background:linear-gradient(145deg,#228ceb,#0f466f); border:3px solid rgba(255,221,79,.62); }
.primary-card h2 { margin:7px 0 3px; }
.primary-card p { color:var(--muted); margin:0; }
.details-card dl { margin:0; display:grid; gap:0; }
.details-card dl div { display:grid; grid-template-columns:130px 1fr; padding:11px 0; border-bottom:1px solid rgba(116,180,238,.1); }
.details-card dt { color:var(--muted); }
.details-card dd { margin:0; overflow-wrap:anywhere; }
.action-card h3 { margin-top:0; }
.action-card p { color:var(--muted); }
.staff-card { border-color:rgba(255,210,72,.25); }
.role-pill { display:inline-flex; border-radius:999px; padding:4px 8px; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; background:#1a486f; color:#bde4ff; }
.role-owner { background:#5e4714; color:#ffe18a; }
.role-admin { background:#5b2335; color:#ffc4d6; }
.role-moderator { background:#264b36; color:#b9ffd3; }

.legal-gate { border-radius:24px; padding:30px; border-color:rgba(255,198,51,.35); }
.legal-gate-head { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.legal-gate-head h2 { margin:4px 0 0; font-size:28px; }
.legal-gate > p { color:var(--muted); line-height:1.72; }
.legal-download-check { background:rgba(255,206,61,.07); border:1px solid rgba(255,206,61,.2); padding:15px; border-radius:14px; margin:18px 0 14px; }
.legal-version-inline { display:block; color:#7d94a9; margin-top:10px; font-size:11px; }
.download-list { display:grid; gap:14px; }
.download-card { border-radius:20px; padding:20px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px; }
.download-copy h2 { margin:5px 0 5px; font-size:20px; overflow-wrap:anywhere; }
.download-copy p { margin:0; color:var(--muted); font-size:13px; }
.download-note { color:#8198ad; text-align:center; margin-top:20px; font-size:12px; }
.download-note span { margin:0 6px; }
.empty-state { text-align:center; border-radius:24px; padding:44px 26px; }
.empty-state .download-ball { margin:0 auto 16px; }
.empty-state p { color:var(--muted); max-width:600px; margin:0 auto; line-height:1.65; }

.legal-page-section { padding-top:48px; }
.legal-document { max-width:900px; border-radius:24px; padding:38px; }
.legal-document h2 { font-size:22px; margin:31px 0 10px; color:#fff; }
.legal-document p { color:#bccddd; line-height:1.78; }
.legal-warning { padding:18px; border:1px solid rgba(255,196,54,.28); background:rgba(61,44,9,.23); border-radius:14px; color:#e8d8a0; line-height:1.65; }
.legal-version { margin-top:34px; padding-top:18px; border-top:1px solid var(--line); color:#7f97ac; font-size:12px; }

.admin-grid { display:grid; grid-template-columns:230px 1fr; gap:18px; }
.admin-sidebar { border-radius:20px; padding:18px; align-self:start; position:sticky; top:96px; }
.admin-identity { padding:12px; border-bottom:1px solid var(--line); display:grid; gap:4px; }
.admin-identity span { color:var(--gold); font-size:10px; font-weight:900; letter-spacing:.12em; }
.admin-identity small { color:var(--muted); font-size:10px; }
.admin-sidebar nav { display:grid; gap:5px; margin-top:14px; }
.admin-sidebar nav a, .admin-sidebar nav > span { padding:10px 11px; border-radius:10px; color:#b8cadb; font-size:13px; }
.admin-sidebar nav a.active { background:rgba(45,134,211,.18); color:#fff; }
.admin-sidebar .disabled { opacity:.45; display:flex; justify-content:space-between; }
.admin-main { display:grid; gap:18px; }
.admin-panel { border-radius:20px; padding:24px; }
.panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; }
.panel-head h2 { margin:4px 0 0; }
.readonly-badge { border:1px solid rgba(255,207,64,.26); color:#ffe287; background:rgba(85,62,11,.24); padding:6px 8px; border-radius:8px; font-size:9px; font-weight:900; letter-spacing:.11em; }
.search-row { display:flex; gap:10px; }
.search-row input { flex:1; }
.table-wrap { overflow:auto; margin-top:20px; }
.admin-table { width:100%; border-collapse:collapse; min-width:680px; }
.admin-table th, .admin-table td { text-align:left; padding:12px 10px; border-bottom:1px solid rgba(115,178,235,.11); font-size:12px; }
.admin-table th { color:#7995ad; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.admin-table td strong, .admin-table td small { display:block; }
.admin-table td small { color:#7590a7; margin-top:3px; }
.table-link { font-weight:800; }
.empty-inline { padding:20px 0; color:var(--muted); }
.inspector-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.inspector-grid > div { padding:14px; background:rgba(4,20,34,.5); border:1px solid rgba(111,174,232,.13); border-radius:12px; min-width:0; }
.inspector-grid small, .inspector-grid strong { display:block; }
.inspector-grid small { color:#7690a6; margin-bottom:5px; font-size:10px; text-transform:uppercase; }
.inspector-grid strong { overflow-wrap:anywhere; }
.small-mono { font-size:10px; }
.inspector-section { margin-top:22px; }
.inspector-section h3 { font-size:15px; }
.chip-list, .permission-list { display:flex; gap:7px; flex-wrap:wrap; }
.info-chip, .permission-list span { padding:7px 9px; border-radius:8px; background:rgba(31,89,135,.28); border:1px solid rgba(103,175,235,.15); color:#c5d9ea; font-size:11px; }
.info-chip em { color:#ffb1b1; font-style:normal; }

.site-footer { position:relative; z-index:2; background:#020a11; border-top:1px solid rgba(93,159,218,.13); padding:38px 0 24px; }
.footer-top-border { position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,#ff663e,#ffdb43,#22a5ff); opacity:.7; }
.footer-grid { display:flex; justify-content:space-between; gap:28px; align-items:center; }
.footer-brand { display:flex; align-items:center; gap:14px; max-width:540px; }
.footer-brand img { width:76px; height:76px; object-fit:contain; }
.footer-brand p { color:#6f879c; margin:5px 0 0; font-size:12px; }
.footer-links { display:flex; gap:18px; flex-wrap:wrap; }
.footer-links a { color:#9ab2c8; font-size:12px; }
.legal { border-top:1px solid rgba(112,175,232,.1); margin-top:26px; padding-top:20px; color:#6d8295; line-height:1.7; font-size:10px; }
.legal strong { color:#b9cad9; }
.legal a { margin-left:5px; font-weight:800; }

@media (max-width: 980px) {
    .hero-grid, .pokemon-hero-grid, .trainer-panel { grid-template-columns:1fr; }
    .hero-brand-stage { min-height:370px; order:0; }
    .hero-copy { order:1; text-align:center; }
    .hero-lead { margin-left:auto; margin-right:auto; }
    .hero-actions, .hero-meta { justify-content:center; }
    .feature-grid { grid-template-columns:1fr 1fr; }
    .admin-grid { grid-template-columns:1fr; }
    .admin-sidebar { position:static; }
    .admin-sidebar nav { grid-template-columns:repeat(2,1fr); }
    .account-layout { grid-template-columns:1fr; }
    .inspector-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width: 760px) {
    .shell, .shell.narrow { width:min(100% - 28px, var(--shell)); }
    .nav-toggle { display:block; }
    .brand-copy { display:none; }
    .brand-logo { width:52px; height:52px; }
    .main-nav { display:none; position:absolute; top:68px; left:14px; right:14px; padding:12px; border:1px solid var(--line); background:#061929; border-radius:16px; box-shadow:var(--shadow); flex-direction:column; align-items:stretch; }
    .main-nav.open { display:flex; }
    .main-nav > a, .nav-button { width:100%; text-align:left; }
    .pokemon-hero { min-height:0; padding-top:36px; }
    .hero-brand-stage { min-height:310px; }
    .hero-logo { width:min(390px,100%); }
    .hero-copy h1 { font-size:42px; }
    .feature-grid, .content-grid, .form-grid, .principle-grid { grid-template-columns:1fr; }
    .prose-card.wide, .field-wide { grid-column:auto; }
    .trainer-panel { padding:25px; }
    .account-flow { flex-direction:column; }
    .account-flow i { transform:rotate(90deg); }
    .legal-callout { grid-template-columns:auto 1fr; }
    .legal-callout .button { grid-column:1/-1; }
    .page-hero-with-logo { align-items:flex-start; }
    .page-hero-logo { width:88px; height:88px; flex:0 0 auto; }
    .download-card { grid-template-columns:auto 1fr; }
    .download-card .button { grid-column:1/-1; width:100%; }
    .footer-grid { flex-direction:column; align-items:flex-start; }
    .inspector-grid { grid-template-columns:1fr; }
    .admin-sidebar nav { grid-template-columns:1fr; }
}

@media (max-width: 520px) {
    .hero-copy h1 { font-size:36px; }
    .hero-actions .button { width:100%; }
    .feature-grid { grid-template-columns:1fr; }
    .hero-brand-stage { min-height:260px; }
    .hero-badge-row { bottom:-8px; }
    .page-hero-with-logo { display:block; }
    .page-hero-logo { width:90px; display:block; margin-bottom:10px; }
    .auth-section { padding:40px 12px 60px; }
    .auth-card { padding:24px 18px; }
    .legal-document { padding:24px 18px; }
    .legal-callout { grid-template-columns:1fr; }
    .legal-icon { margin-bottom:-5px; }
}


/* Website v0.4.0 staff authority + registration control */
.alert-success { background:rgba(24,104,69,.3); border:1px solid rgba(75,222,157,.3); color:#bff9da; }
.staff-access-panel { overflow:hidden; }
.staff-tier-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.staff-tier { padding:16px; border:1px solid rgba(110,175,235,.13); background:rgba(4,20,34,.55); border-radius:14px; }
.staff-tier strong { display:block; color:#d5e8f8; margin-bottom:7px; }
.staff-tier p { margin:0; color:#7893a9; font-size:11px; line-height:1.55; }
.staff-tier.current { border-color:rgba(255,211,75,.45); background:linear-gradient(145deg,rgba(81,63,11,.28),rgba(8,38,61,.62)); box-shadow:inset 0 0 0 1px rgba(255,220,107,.08); }
.staff-tier.current strong { color:#ffe390; }
.permission-note { color:#7e9ab0; font-size:11px; line-height:1.6; margin:16px 0 0; }
.registration-control-panel { border-color:rgba(63,178,255,.24); }
.system-status { display:inline-flex; align-items:center; gap:7px; border-radius:999px; padding:7px 10px; font-size:9px; font-weight:900; letter-spacing:.09em; }
.system-status i, .status-orb { width:8px; height:8px; border-radius:50%; display:inline-block; }
.system-status.online { color:#aef4d0; background:rgba(23,99,68,.28); border:1px solid rgba(69,211,148,.24); }
.system-status.online i, .status-orb.status-on { background:#55e9a3; box-shadow:0 0 12px rgba(85,233,163,.65); }
.system-status.offline { color:#ffc0c4; background:rgba(113,31,40,.27); border:1px solid rgba(255,91,103,.26); }
.system-status.offline i, .status-orb.status-off { background:#ff6977; box-shadow:0 0 12px rgba(255,105,119,.55); }
.staff-form { display:grid; grid-template-columns:1fr 2fr; gap:14px; margin-top:18px; }
.compact-form { grid-template-columns:1fr 1fr; }
.action-row { display:flex; align-items:center; justify-content:space-between; gap:15px; }
.action-row small { color:#7690a6; }
.registration-closed { display:flex; gap:13px; align-items:flex-start; padding:17px; border:1px solid rgba(255,91,103,.3); background:rgba(105,27,36,.25); border-radius:14px; margin-bottom:18px; }
.registration-closed .status-orb { margin-top:5px; flex:0 0 auto; }
.registration-closed strong { color:#ffd4d7; }
.registration-closed p { color:#c39ba0; margin:5px 0 0; line-height:1.55; }
.authority-warning { margin-top:18px; padding:13px 14px; border-radius:12px; background:rgba(94,72,17,.22); border:1px solid rgba(255,208,74,.2); color:#d7c17d; font-size:12px; line-height:1.55; }
.staff-action-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.staff-action-card { padding:14px; border:1px solid rgba(108,172,231,.14); background:rgba(3,18,31,.58); border-radius:13px; display:grid; gap:9px; }
.staff-action-card strong { color:#d8e7f5; font-size:12px; }
.staff-action-card input, .staff-action-card select { padding:10px 11px; font-size:11px; }
.staff-action-card.dangerous-card { border-color:rgba(255,89,101,.24); background:rgba(74,20,27,.2); }
.staff-action-card.owner-action { border-color:rgba(255,211,75,.24); background:rgba(74,57,11,.16); }
.button-small { padding:9px 11px; font-size:10px; }
.button-danger-soft { background:rgba(131,51,57,.5); color:#ffd1d5; border:1px solid rgba(255,102,112,.2); }
.button-danger { background:#922c38; color:#fff; border:1px solid rgba(255,111,121,.35); }
.history-list { margin-top:18px; border-top:1px solid var(--line); padding-top:16px; }
.history-list h4 { margin:0 0 10px; color:#bcd0e2; }
.history-row { display:grid; grid-template-columns:130px 1fr auto; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid rgba(109,169,222,.09); font-size:11px; }
.history-row span { color:#9ccbef; font-weight:800; }
.history-row strong { font-weight:600; color:#d2dfeb; }
.history-row small { color:#6f879d; }
.history-row em { color:#e1a5a5; font-style:normal; }
.owner-permission-panel { border-top:1px solid rgba(255,211,75,.18); padding-top:20px; }
.audit-list { display:grid; gap:8px; }
.audit-row { display:grid; grid-template-columns:190px 1fr auto; gap:14px; align-items:center; border:1px solid rgba(104,165,219,.1); background:rgba(4,19,32,.5); border-radius:11px; padding:11px 13px; }
.audit-row strong, .audit-row small { display:block; }
.audit-row strong { color:#bfe0f7; font-size:11px; }
.audit-row small, .audit-row time { color:#70899f; font-size:9px; }
.audit-row p { margin:0; color:#aebfce; font-size:11px; }
code { color:#9bd7ff; background:rgba(20,75,116,.25); padding:2px 5px; border-radius:5px; }

@media (max-width: 980px) {
    .staff-tier-grid { grid-template-columns:1fr; }
    .staff-action-grid { grid-template-columns:1fr 1fr; }
    .staff-form, .compact-form { grid-template-columns:1fr; }
    .audit-row { grid-template-columns:1fr auto; }
    .audit-row p { grid-column:1/-1; }
}
@media (max-width: 620px) {
    .staff-action-grid { grid-template-columns:1fr; }
    .history-row { grid-template-columns:1fr; gap:3px; }
    .action-row { align-items:flex-start; flex-direction:column; }
    .audit-row { grid-template-columns:1fr; }
}

/* Website v0.5.0 staff chat console preview */
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.staff-chat-section { padding-top:42px; }
.chat-console-hero p { max-width:850px; }
.chat-preview-warning { display:flex; align-items:flex-start; gap:14px; padding:15px 17px; margin-bottom:16px; border:1px solid rgba(255,208,74,.27); border-radius:14px; background:linear-gradient(135deg,rgba(86,63,14,.28),rgba(6,27,45,.9)); }
.chat-preview-warning strong { color:#ffe495; font-size:12px; letter-spacing:.06em; }
.chat-preview-warning p { margin:5px 0 0; color:#a9b8c4; font-size:12px; line-height:1.55; }
.chat-status-beacon { width:10px; height:10px; margin-top:4px; flex:0 0 auto; border-radius:50%; background:#ffce43; box-shadow:0 0 14px rgba(255,206,67,.55); }
.chat-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.chat-summary-grid article { min-width:0; padding:14px 15px; border:1px solid rgba(105,173,235,.16); border-radius:14px; background:rgba(5,23,39,.74); }
.chat-summary-grid span, .chat-summary-grid strong, .chat-summary-grid small { display:block; }
.chat-summary-grid span { color:#7095b2; font-size:9px; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.chat-summary-grid strong { margin:5px 0 3px; color:#e8f4ff; font-size:14px; }
.chat-summary-grid small { color:#6f879b; font-size:9px; line-height:1.45; }
.staff-chat-layout { display:grid; grid-template-columns:205px minmax(0,1fr) 275px; gap:12px; align-items:start; }
.chat-channel-panel, .chat-feed-panel, .chat-tools-panel > section { border:1px solid rgba(105,173,235,.18); border-radius:16px; background:linear-gradient(180deg,rgba(9,31,52,.95),rgba(4,19,33,.96)); box-shadow:0 16px 45px rgba(0,0,0,.25); }
.chat-channel-panel { padding:14px; position:sticky; top:92px; }
.chat-panel-title { display:grid; gap:4px; margin-bottom:12px; }
.chat-panel-title strong { color:#e1eef9; font-size:14px; }
.chat-channel-nav { display:grid; gap:5px; }
.chat-channel-nav a { min-width:0; display:grid; grid-template-columns:10px 1fr auto; align-items:center; gap:8px; min-height:38px; padding:8px 10px; color:#a9bfd2; border:1px solid transparent; border-radius:10px; font-size:11px; font-weight:750; }
.chat-channel-nav a small { color:#607d93; font-size:8px; text-transform:uppercase; letter-spacing:.08em; }
.chat-channel-nav a:hover { color:#fff; background:rgba(63,142,211,.12); }
.chat-channel-nav a.active { color:#fff0b2; background:rgba(64,92,118,.26); border-color:rgba(255,211,75,.22); }
.channel-dot { width:7px; height:7px; border-radius:50%; background:#87a8c2; }
.channel-global { --channel:#55b8ff; }
.channel-local { --channel:#72d8a8; }
.channel-trade { --channel:#ffd442; }
.channel-whispers { --channel:#b88cff; }
.channel-battle { --channel:#ff8277; }
.channel-system { --channel:#f0a8ff; }
.channel-all { --channel:#d5e3ef; }
.channel-dot.channel-global, .channel-dot.channel-local, .channel-dot.channel-trade, .channel-dot.channel-whispers, .channel-dot.channel-battle, .channel-dot.channel-system, .channel-dot.channel-all { background:var(--channel); box-shadow:0 0 9px color-mix(in srgb,var(--channel) 50%,transparent); }
.chat-visibility-note { margin-top:14px; padding-top:13px; border-top:1px solid rgba(105,173,235,.11); }
.chat-visibility-note strong { color:#9fc2dc; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.chat-visibility-note p { color:#69839a; font-size:9px; line-height:1.55; margin:6px 0 0; }
.chat-feed-panel { min-width:0; overflow:hidden; }
.chat-feed-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 17px 12px; }
.chat-feed-toolbar h2 { margin:3px 0 0; font-size:19px; }
.preview-pill { padding:6px 8px; border-radius:999px; border:1px solid rgba(255,211,75,.22); background:rgba(97,75,19,.24); color:#ffe18a; font-size:8px; font-weight:900; letter-spacing:.1em; }
.chat-search-form { display:flex; gap:8px; padding:0 17px 14px; border-bottom:1px solid rgba(105,173,235,.11); }
.chat-search-form input { min-width:0; flex:1; border-radius:10px; border:1px solid rgba(116,180,238,.22); background:#041626; color:#fff; padding:11px 12px; outline:none; }
.chat-search-form .button { min-height:40px; padding:0 14px; }
.chat-feed { display:grid; }
.chat-message-row { display:grid; grid-template-columns:58px 70px minmax(0,1fr) 30px; align-items:start; gap:9px; padding:12px 14px; border-bottom:1px solid rgba(105,173,235,.08); }
.chat-message-row:last-child { border-bottom:0; }
.chat-message-row:hover { background:rgba(32,93,143,.09); }
.chat-message-row.sensitive { background:linear-gradient(90deg,rgba(86,50,119,.08),transparent); }
.chat-message-row time { color:#668198; font-size:9px; padding-top:5px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.chat-channel-badge { display:inline-flex; justify-content:center; padding:4px 5px; border-radius:6px; border:1px solid color-mix(in srgb,var(--channel,#8eb4d0) 28%,transparent); background:color-mix(in srgb,var(--channel,#8eb4d0) 8%,transparent); color:var(--channel,#a8bfd2); font-size:8px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }
.chat-message-body { min-width:0; }
.chat-message-meta { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.chat-message-meta strong { color:#dcecf8; font-size:11px; overflow-wrap:anywhere; }
.chat-message-meta span { color:#607b91; font-size:7px; font-weight:900; letter-spacing:.09em; }
.chat-message-body p { margin:4px 0 0; color:#aebfcd; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
.chat-context-button { width:28px; height:28px; border-radius:8px; border:1px solid rgba(111,172,227,.12); background:rgba(21,55,82,.25); color:#58778f; }
.chat-context-button:disabled { cursor:not-allowed; opacity:.6; }
.chat-empty-state { padding:38px 18px; text-align:center; }
.chat-empty-state strong { color:#c8dce9; }
.chat-empty-state p { color:#71899d; margin:7px 0 0; font-size:11px; }
.chat-tools-panel { display:grid; gap:12px; }
.chat-tools-panel > section { padding:14px; }
.chat-tools-panel p { font-size:10px; line-height:1.55; }
.chat-disabled-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:12px; }
.chat-disabled-actions button { min-height:34px; border-radius:9px; border:1px solid rgba(105,173,235,.12); background:rgba(20,55,83,.22); color:#607f96; font-size:10px; font-weight:800; cursor:not-allowed; }
.chat-disabled-reason { display:block; margin-top:10px; color:#657e93; font-size:8px; line-height:1.5; }
.chat-auto-message-card .field { margin-bottom:10px; }
.chat-auto-message-card .field label { font-size:9px; }
.chat-auto-message-card select, .chat-auto-message-card textarea { width:100%; border-radius:9px; border:1px solid rgba(116,180,238,.15); background:#061826; color:#70889a; padding:9px 10px; font:inherit; font-size:10px; }
.chat-auto-message-card textarea { resize:vertical; min-height:76px; }
.chat-auto-message-card select:disabled, .chat-auto-message-card textarea:disabled, .chat-auto-message-card button:disabled { opacity:.68; cursor:not-allowed; }
.chat-schedule-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.chat-future-contract { margin-top:16px; }

@media (max-width: 1080px) {
    .chat-summary-grid { grid-template-columns:1fr 1fr; }
    .staff-chat-layout { grid-template-columns:190px minmax(0,1fr); }
    .chat-tools-panel { grid-column:1/-1; grid-template-columns:1fr 1fr; }
    .chat-tools-panel > section { min-width:0; }
}
@media (max-width: 760px) {
    .chat-summary-grid { grid-template-columns:1fr; }
    .staff-chat-layout { grid-template-columns:1fr; }
    .chat-channel-panel { position:static; }
    .chat-channel-nav { grid-template-columns:1fr 1fr; }
    .chat-tools-panel { grid-column:auto; grid-template-columns:1fr; }
    .chat-message-row { grid-template-columns:52px 62px minmax(0,1fr); }
    .chat-context-button { display:none; }
    .chat-search-form { flex-wrap:wrap; }
    .chat-search-form input { flex-basis:100%; }
}
@media (max-width: 480px) {
    .chat-channel-nav { grid-template-columns:1fr; }
    .chat-message-row { grid-template-columns:1fr; gap:4px; }
    .chat-message-row time { padding-top:0; }
    .chat-channel-badge { width:max-content; }
    .chat-schedule-grid, .chat-disabled-actions { grid-template-columns:1fr; }
}
