:root {
  --bg: #0b1019;
  --surface: #111a28;
  --surface-2: #172437;
  --surface-3: #1d2b40;
  --text: #edf2f7;
  --muted: #9aa8ba;
  --muted-2: #6f7d91;
  --line: rgba(197, 210, 230, .12);
  --accent: #d9b66c;
  --accent-2: #f1dba4;
  --accent-ink: #271e0e;
  --green: #83b6a0;
  --danger: #db8d82;
  --shadow: 0 18px 48px rgba(0,0,0,.24);
  --radius: 18px;
  --font-scale: 1;
}

:root[data-theme="sheikah"] { --bg:#0b1019; --surface:#111a28; --surface-2:#172437; --surface-3:#20324a; --accent:#65b5d5; --accent-2:#b1e0ef; --accent-ink:#071c25; }
:root[data-theme="zonai"] { --bg:#101810; --surface:#19241b; --surface-2:#233326; --surface-3:#304432; --accent:#b9bf76; --accent-2:#e0dfa0; --accent-ink:#20240d; }
:root[data-theme="twilight"] { --bg:#120d1b; --surface:#1c1527; --surface-2:#2a1f38; --surface-3:#3b2a4d; --accent:#b78bd7; --accent-2:#e0c3f4; --accent-ink:#21112c; }
:root[data-theme="hyrule"] { --bg:#17130e; --surface:#241d14; --surface-2:#34291a; --surface-3:#493921; --accent:#d9b66c; --accent-2:#f1dba4; --accent-ink:#271e0e; }
:root[data-accent="blue"] { --accent:#65b5d5; --accent-2:#b1e0ef; --accent-ink:#071c25; }
:root[data-accent="green"] { --accent:#8bbd8b; --accent-2:#c8e3b9; --accent-ink:#142416; }
:root[data-accent="gold"] { --accent:#d9b66c; --accent-2:#f1dba4; --accent-ink:#271e0e; }
:root[data-text-size="small"] { --font-scale:.92; }
:root[data-text-size="large"] { --font-scale:1.08; }

* { box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:calc(16px * var(--font-scale)); }
body { margin:0; min-width:320px; background:var(--bg); color:var(--text); font-family:'DM Sans',system-ui,sans-serif; line-height:1.5; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex="0"]:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
button:disabled { opacity:.45; cursor:not-allowed; }
::selection { background:var(--accent); color:var(--accent-ink); }

.app-shell { min-height:100vh; display:flex; flex-direction:column; }
.topbar { height:78px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 34px; border-bottom:1px solid var(--line); background:rgba(8,13,21,.7); backdrop-filter:blur(16px); position:sticky; top:0; z-index:20; }
.brand-button { display:flex; align-items:center; gap:13px; border:0; background:transparent; color:var(--text); text-align:left; padding:4px 0; }
.brand-button strong { display:block; font:1.04rem 'Marcellus',serif; letter-spacing:.02em; }
.brand-button small { display:block; margin-top:1px; font-size:.57rem; letter-spacing:.2em; color:var(--muted-2); }
.brand-mark { display:inline-flex; width:39px; height:35px; flex:0 0 auto; color:var(--accent); }
.brand-mark svg { width:100%; height:100%; }
.brand-mark.mini { width:22px; height:19px; }
.top-actions { display:flex; align-items:center; gap:12px; }
.version-pill { color:var(--muted-2); border:1px solid var(--line); padding:4px 8px; border-radius:99px; font-size:.7rem; }
.online-indicator { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:.73rem; }
.online-indicator i { width:7px; height:7px; border-radius:50%; background:#80bc95; box-shadow:0 0 10px #80bc9566; }
.online-indicator.offline i { background:#d69a6b; box-shadow:none; }

.layout { flex:1; display:grid; grid-template-columns:246px minmax(0,1fr); min-height:calc(100vh - 126px); }
.sidebar { border-right:1px solid var(--line); padding:28px 16px 20px; display:flex; flex-direction:column; background:rgba(8,13,21,.25); }
.sidebar-caption,.eyebrow { font-size:.65rem; font-weight:700; letter-spacing:.19em; color:var(--accent); text-transform:uppercase; }
.sidebar-caption { padding:0 14px 12px; color:var(--muted-2); }
.sidebar nav { display:grid; gap:5px; }
.nav-link { width:100%; display:flex; align-items:center; gap:12px; border:1px solid transparent; background:transparent; color:var(--muted); padding:11px 13px; border-radius:11px; text-align:left; font-size:.84rem; transition:background .18s,color .18s,border .18s; }
.nav-link:hover { background:var(--surface); color:var(--text); }
.nav-link.active { color:var(--accent-2); background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 15%,transparent),transparent); border-color:color-mix(in srgb,var(--accent) 20%,transparent); }
.nav-icon { width:19px; text-align:center; font-size:1.05rem; color:var(--accent); }
.nav-link em { margin-left:auto; font-style:normal; font-size:.55rem; letter-spacing:.12em; color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 45%,transparent); padding:2px 5px; border-radius:4px; }
.sidebar-bottom { margin-top:auto; padding:20px 12px 0; border-top:1px solid var(--line); color:var(--muted-2); }
.sidebar-bottom p { max-width:175px; margin:9px 0 12px; font: .83rem/1.55 'Marcellus',serif; color:var(--muted); }
.sidebar-bottom > span { font-size:.52rem; letter-spacing:.13em; }
.main-content { min-width:0; max-width:1440px; width:100%; margin:0 auto; padding:35px clamp(22px,4vw,62px) 64px; }
.footer { display:flex; justify-content:space-between; gap:20px; padding:15px 30px; border-top:1px solid var(--line); color:var(--muted-2); font-size:.67rem; }
.compact-nav .layout { grid-template-columns:194px minmax(0,1fr); }
.compact-nav .nav-link { padding:9px 10px; font-size:.78rem; }

.hero-panel { position:relative; overflow:hidden; min-height:338px; border:1px solid color-mix(in srgb,var(--accent) 26%,transparent); border-radius:24px; padding:46px clamp(25px,5vw,66px); display:flex; align-items:center; background:radial-gradient(ellipse at 75% 50%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 50%),linear-gradient(110deg,var(--surface) 5%,color-mix(in srgb,var(--surface-2) 85%,var(--bg))); box-shadow:var(--shadow); }
.hero-copy { max-width:610px; position:relative; z-index:2; }
.hero-copy h1 { font:clamp(2rem,4vw,3.25rem)/1.13 'Marcellus',serif; margin:13px 0 16px; letter-spacing:-.025em; }
.hero-copy h1 span { color:var(--accent-2); }
.hero-copy p { max-width:520px; color:var(--muted); margin:0 0 25px; font-size:.93rem; }
.hero-buttons { display:flex; flex-wrap:wrap; gap:10px; }
.hero-emblem { position:absolute; right:10%; top:50%; transform:translateY(-50%); width:min(31%,300px); color:var(--accent); opacity:.84; display:grid; justify-items:center; filter:drop-shadow(0 0 40px color-mix(in srgb,var(--accent) 20%,transparent)); }
.hero-mark { width:100%; height:auto; }
.hero-emblem .emblem-caption { text-align:center; font-size:.59rem; letter-spacing:.35em; line-height:1.7; margin-top:-12px; color:var(--accent-2); }
.hero-decoration { position:absolute; border:1px solid color-mix(in srgb,var(--accent) 13%,transparent); transform:rotate(45deg); pointer-events:none; }
.deco-one { width:270px;height:270px;right:3%;top:-175px; }
.deco-two { width:190px;height:190px;right:9%;bottom:-140px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; border-radius:10px; border:1px solid transparent; padding:11px 17px; font-weight:700; font-size:.8rem; text-decoration:none; transition:transform .16s,background .16s,border-color .16s; }
.button:hover { transform:translateY(-1px); }
.button-primary { color:var(--accent-ink); background:var(--accent); border-color:var(--accent); }
.button-primary:hover { background:var(--accent-2); }
.button-outline { color:var(--text); background:transparent; border-color:var(--line); }
.button-outline:hover { border-color:var(--accent); color:var(--accent-2); }
.button-quiet { color:var(--muted); background:transparent; border-color:transparent; }
.button-glass { color:var(--accent-2); background:rgba(255,255,255,.035); border-color:color-mix(in srgb,var(--accent) 27%,transparent); }
.button-small { padding:8px 11px; font-size:.7rem; }
.button-danger-quiet { color:var(--danger); background:transparent; border:1px solid color-mix(in srgb,var(--danger) 25%,transparent); }

.stats-strip { display:grid; grid-template-columns:repeat(4,1fr); margin:20px 0 39px; padding:16px 0; border-bottom:1px solid var(--line); }
.stats-strip > div { padding:0 20px; border-right:1px solid var(--line); }
.stats-strip > div:first-child { padding-left:4px; }
.stats-strip > div:last-child { border:0; }
.stats-strip strong { display:block; font:1.45rem 'Marcellus',serif; color:var(--accent-2); }
.stats-strip span { display:block; font-size:.68rem; color:var(--muted-2); }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:15px; margin:32px 0 17px; }
.section-heading h2,.page-heading h1 { font:clamp(1.7rem,3vw,2.35rem)/1.2 'Marcellus',serif; margin:4px 0 0; }
.text-button { padding:4px 0; background:none; border:0; color:var(--accent); font-weight:700; font-size:.76rem; }
.text-button:hover { color:var(--accent-2); }
.department-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:11px; }
.department-card { min-height:158px; position:relative; display:flex; flex-direction:column; align-items:flex-start; text-align:left; padding:16px; border:1px solid var(--line); border-radius:14px; color:var(--text); background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--surface-2) 65%,var(--bg))); transition:transform .18s,border-color .18s; }
.department-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--accent) 48%,transparent); }
.department-icon { display:grid; place-items:center; width:35px;height:35px; border-radius:10px; color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,transparent); font-size:1.18rem; margin-bottom:13px; }
.department-count { position:absolute; right:13px;top:15px; font-size:.58rem;color:var(--muted-2); }
.department-card strong { font-size:.82rem; margin-bottom:5px; }
.department-card small { color:var(--muted-2); font-size:.65rem; line-height:1.4; }
.home-feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; margin-top:25px; }
.feature-card { display:flex; align-items:flex-start; gap:18px; text-align:left; border:1px solid var(--line); border-radius:16px; color:var(--text); padding:23px; background:var(--surface); }
.feature-card:hover { border-color:color-mix(in srgb,var(--accent) 45%,transparent); }
.feature-arena { background:radial-gradient(circle at 0 100%,rgba(160,70,55,.13),transparent 55%),var(--surface); }
.feature-chronicle { background:radial-gradient(circle at 100% 0,rgba(82,127,153,.17),transparent 55%),var(--surface); }
.feature-symbol { display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:13px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font-size:1.35rem; }
.feature-card h2 { margin:4px 0 7px;font:1.35rem 'Marcellus',serif; }
.feature-card p { margin:0 0 14px;color:var(--muted);font-size:.76rem; }
.feature-link { color:var(--accent);font-size:.73rem;font-weight:700; }
.notice-line { display:flex; align-items:flex-start; gap:10px; margin:26px 0 0; padding:13px 15px; border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.018); color:var(--muted); }
.notice-line p { margin:0;font-size:.72rem; }
.notice-line strong { color:var(--text); }
.notice-icon { flex:0 0 18px; display:grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid var(--accent);color:var(--accent);font:700 .7rem serif; }

.page-heading { display:flex; align-items:end; justify-content:space-between; gap:25px; margin:2px 0 28px; }
.page-heading p { margin:9px 0 0; color:var(--muted); max-width:670px; font-size:.86rem; }
.heading-actions { flex:0 0 auto; }
.search-panel { display:flex; align-items:center; gap:12px; margin:0 0 14px; }
.search-box { display:flex;align-items:center;gap:10px;flex:1; min-width:0; padding:0 14px;height:48px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--accent); }
.search-box span { font-size:1.3rem; }
.search-box input { flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--text);font-size:.82rem; }
.search-box input::placeholder { color:var(--muted-2); }
.view-switch { display:flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:10px;background:var(--surface); }
.view-switch button { width:34px;height:32px;border:0;border-radius:6px;color:var(--muted);background:transparent; }
.view-switch button.selected { color:var(--accent-ink);background:var(--accent); }
.filter-row { display:flex; gap:7px; overflow:auto; padding:3px 0 12px; scrollbar-width:thin; }
.filter-chip { white-space:nowrap;padding:7px 11px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--muted);font-size:.67rem; }
.filter-chip.selected { color:var(--accent-2);background:color-mix(in srgb,var(--accent) 13%,transparent);border-color:color-mix(in srgb,var(--accent) 48%,transparent); }
.results-head { display:flex;justify-content:space-between;gap:15px;margin:10px 0 13px;color:var(--muted-2);font-size:.66rem; }
.entry-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px; }
.entry-card { overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--surface);transition:transform .18s,border-color .18s;cursor:pointer; }
.entry-card:hover { transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 42%,transparent); }
.entry-art { height:128px;position:relative;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--accent) 19%,transparent),transparent 65%),linear-gradient(135deg,var(--surface-2),var(--surface-3));color:var(--accent);font-size:2.3rem; }
.entry-art img { width:100%;height:100%;object-fit:cover; }
.favorite-mini { position:absolute;right:9px;top:9px;width:29px;height:29px;border:1px solid rgba(255,255,255,.13);border-radius:50%;background:rgba(8,12,18,.68);color:var(--muted);font-size:1rem; }
.favorite-mini.is-favorite { color:var(--accent); }
.entry-info { padding:13px 14px 11px; }
.entry-meta { display:flex;justify-content:space-between;gap:8px;color:var(--muted-2);font-size:.57rem; }
.entry-meta span:first-child { color:var(--accent); }
.entry-info h3 { margin:9px 0 5px;font:1.02rem 'Marcellus',serif; }
.entry-info p { display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px;margin:0 0 12px;color:var(--muted);font-size:.68rem; }
.entry-card-bottom { display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:9px;color:var(--muted-2);font-size:.58rem; }
.entry-card-bottom b { color:var(--accent);font-size:.9rem; }
.list-view { grid-template-columns:1fr; }
.entry-list { display:flex;align-items:stretch;min-height:100px; }
.entry-list .entry-art { width:120px;height:auto;min-height:100px;flex:0 0 120px; }
.entry-list .entry-info { flex:1;min-width:0; }
.entry-list .entry-info p { min-height:0; }
.empty-state { display:grid;justify-items:center;text-align:center;padding:55px 20px;border:1px dashed var(--line);border-radius:15px;color:var(--muted); }
.empty-state > span { font-size:2rem;color:var(--accent); }
.empty-state h3 { margin:8px 0 4px;color:var(--text);font:1.25rem 'Marcellus',serif; }
.empty-state p { margin:0 0 16px;font-size:.78rem; }

.catalog-summary { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:21px; }
.catalog-summary > div { padding:17px;border:1px solid var(--line);border-radius:13px;background:var(--surface); }
.catalog-summary strong { display:block;color:var(--accent-2);font:1.35rem 'Marcellus',serif; }
.catalog-summary span { color:var(--muted-2);font-size:.67rem; }
.catalog-list { display:grid;gap:10px; }
.console-group { border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden; }
.console-group summary { display:flex;align-items:center;gap:14px;padding:16px 18px;cursor:pointer;list-style:none; }
.console-group summary::-webkit-details-marker { display:none; }
.console-symbol { display:grid;place-items:center;width:41px;height:41px;border-radius:11px;background:var(--surface-3);color:var(--accent);font-size:1.15rem; }
.console-group summary small,.console-group summary strong { display:block; }
.console-group summary small { color:var(--muted-2);font-size:.62rem; }
.console-group summary strong { font:1rem 'Marcellus',serif; }
.console-group summary em { margin-left:auto;color:var(--muted-2);font-style:normal;font-size:.66rem; }
.console-group summary b { color:var(--accent); }
.game-list { border-top:1px solid var(--line);padding:4px 17px 9px 73px; }
.game-row { display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--line); }
.game-row:last-child { border:0; }
.game-disc { color:var(--accent); }
.game-row div { min-width:0; }
.game-row strong,.game-row small { display:block; }
.game-row strong { font-size:.77rem; }
.game-row small { color:var(--muted-2);font-size:.62rem; }
.game-row time { margin-left:auto;color:var(--muted-2);font-size:.68rem; }

.timeline-origin { display:flex;align-items:flex-start;gap:18px;max-width:680px;margin:0 auto 35px;padding:21px;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,transparent),var(--surface)); }
.timeline-node { display:grid;place-items:center;flex:0 0 45px;height:45px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-size:1.4rem; }
.timeline-origin h2 { margin:3px 0;font:1.45rem 'Marcellus',serif; }
.timeline-origin p { margin:5px 0 12px;color:var(--muted);font-size:.75rem; }
.official-tag { display:inline-block;padding:4px 7px;border-radius:5px;background:color-mix(in srgb,var(--green) 12%,transparent);color:var(--green);font-size:.54rem;font-weight:700;letter-spacing:.09em; }
.timeline-branches { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;position:relative; }
.branch-card { border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:18px;position:relative; }
.branch-line { height:4px;width:35px;background:var(--accent);border-radius:5px;margin-bottom:13px; }
.branch-card:nth-child(2) .branch-line { background:#83b6a0; }
.branch-card:nth-child(3) .branch-line { background:#ae92d4; }
.branch-kicker { font-size:.56rem;letter-spacing:.15em;color:var(--muted-2); }
.branch-content h3 { margin:6px 0;font:1.08rem 'Marcellus',serif; }
.branch-content p { min-height:66px;margin:0 0 13px;color:var(--muted);font-size:.68rem; }
.branch-games { display:flex;flex-wrap:wrap;gap:5px; }
.branch-games span { padding:5px 7px;border:1px solid var(--line);border-radius:6px;color:var(--muted);font-size:.58rem; }
.timeline-events-head { margin-top:35px; }
.history-card { display:grid;grid-template-columns:90px 1fr auto;gap:18px;align-items:center;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--surface);margin-bottom:9px; }
.history-date { color:var(--accent);font:1rem 'Marcellus',serif; }
.history-card h3 { margin:0 0 4px;font:1.03rem 'Marcellus',serif; }
.history-card p { margin:0 0 5px;color:var(--muted);font-size:.68rem; }

.arena-mode-switch { display:flex;justify-content:space-between;align-items:center;gap:14px;padding:15px 17px;border:1px solid var(--line);border-radius:13px;background:var(--surface); }
.arena-mode-switch strong { display:block;margin-top:3px;font:1.1rem 'Marcellus',serif; }
.mode-buttons { display:flex;gap:5px;padding:4px;border:1px solid var(--line);border-radius:10px;background:var(--bg); }
.mode-buttons button { border:0;border-radius:7px;padding:8px 15px;background:transparent;color:var(--muted);font-size:.72rem;font-weight:700; }
.mode-buttons button.active { background:var(--surface-3);color:var(--accent-2); }
.mode-buttons button.chaos-active { background:#6e2930;color:#fff0e9; }
.mode-buttons button.intelligence-active { background:#244c68;color:#eaf6ff; }
.tactical-report { margin:14px 0;padding:14px;border:1px solid color-mix(in srgb,#4c91bd 45%,var(--line));border-radius:12px;background:color-mix(in srgb,#4c91bd 8%,var(--surface)); }
.tactical-report h3 { margin:0 0 8px;font-family:Marcellus,serif; }
.tactical-report p { margin:7px 0;font-size:.83rem;line-height:1.45; }
.tactical-report small { display:block;margin-top:8px;color:var(--muted);line-height:1.4; }
.tactical-bonuses { display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;font-size:.72rem;font-weight:700;color:var(--accent-2); }
.mode-description { margin:10px 0 16px;padding:12px 15px;border-left:3px solid var(--accent);background:color-mix(in srgb,var(--accent) 7%,transparent);color:var(--muted);font-size:.73rem; }
.mode-description strong { color:var(--text); }
.chaos-description { border-color:#d77c76;background:rgba(145,49,49,.1); }
.arena-selectors { display:grid;grid-template-columns:1fr 54px 1fr;align-items:stretch;gap:12px; }
.fighter-panel { min-width:0;padding:18px;border:1px solid var(--line);border-radius:15px;background:var(--surface); }
.fighter-left { border-top:2px solid var(--accent); }
.fighter-right { border-top:2px solid #ad8dcf; }
.fighter-overline { color:var(--muted-2);font-size:.58rem;letter-spacing:.16em;font-weight:700; }
.fighter-avatar { width:48px;height:48px;display:grid;place-items:center;margin:10px 0;border-radius:14px;background:var(--surface-3);color:var(--accent);font-size:1.55rem; }
.fighter-panel select { width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font-size:.78rem; }
.fighter-panel > p { min-height:40px;margin:8px 0 13px;color:var(--muted);font-size:.67rem; }
.arena-vs { align-self:start;margin-top:112px;display:grid;place-items:center;width:45px;height:45px;border:1px solid var(--line);border-radius:50%;background:var(--surface-2);color:var(--accent);font:1rem 'Marcellus',serif; }
.equipment-picker { border-top:1px solid var(--line);padding-top:12px;max-height:360px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--muted-2) transparent; }
.picker-title { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px; }
.picker-title strong { font-size:.7rem; }
.picker-title span { color:var(--muted-2);font-size:.6rem; }
.equipment-option { display:flex;align-items:center;gap:9px;padding:8px 6px;border-bottom:1px solid var(--line);cursor:pointer; }
.equipment-option:last-child { border:0; }
.equipment-option input { position:absolute;opacity:0;pointer-events:none; }
.equipment-check { display:grid;place-items:center;width:17px;height:17px;border:1px solid var(--muted-2);border-radius:5px;color:transparent;font-size:.65rem; }
.equipment-option input:checked + .equipment-check { background:var(--accent);border-color:var(--accent);color:var(--accent-ink); }
.equipment-option b,.equipment-option small { display:block; }
.equipment-option b { font-size:.67rem; }
.equipment-option small { color:var(--muted-2);font-size:.57rem; }
.muted-note { color:var(--muted-2);font-size:.66rem; }
.arena-actions { display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 22px; }
.arena-empty { display:grid;justify-items:center;text-align:center;padding:30px 15px;border:1px dashed var(--line);border-radius:14px;background:rgba(255,255,255,.012); }
.arena-empty > span { color:var(--accent);font-size:1.6rem; }
.arena-empty h3 { margin:5px 0;font:1.2rem 'Marcellus',serif; }
.arena-empty p { margin:0;color:var(--muted);font-size:.72rem; }
.result-panel { padding:21px;border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:16px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 6%,var(--surface)),var(--surface)); }
.result-heading { display:flex;justify-content:space-between;align-items:start;gap:12px; }
.result-heading h2 { margin:4px 0;font:1.45rem 'Marcellus',serif; }
.result-mode { padding:5px 8px;border:1px solid var(--line);border-radius:6px;color:var(--accent);font-size:.55rem;letter-spacing:.12em;white-space:nowrap; }
.score-duel { display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;text-align:center;padding:19px 0;border-bottom:1px solid var(--line); }
.score-duel > div:not(.versus) small,.score-duel > div:not(.versus) span { display:block;color:var(--muted);font-size:.66rem; }
.score-duel > div:not(.versus) strong { display:block;margin:2px 0;color:var(--accent-2);font:2.2rem 'Marcellus',serif; }
.versus { color:var(--muted-2);font-size:.72rem; }
.chance-bars { display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:16px 0 20px; }
.chance-bars span { display:flex;justify-content:space-between;gap:8px;margin-bottom:6px;color:var(--muted);font-size:.64rem; }
.chance-bars b { color:var(--text); }
.chance-bars > div > div { height:7px;overflow:hidden;border-radius:8px;background:var(--surface-3); }
.chance-bars i { display:block;height:100%;border-radius:8px;background:var(--accent); }
.chance-bars > div:last-child i { background:#a88cc8; }
.subsection-title { margin:22px 0 11px;font:1rem 'Marcellus',serif; }
.compare-table { display:grid;gap:7px; }
.compare-row { display:grid;grid-template-columns:150px 28px minmax(60px,1fr) 28px;align-items:center;gap:8px; }
.compare-row > span { color:var(--muted);font-size:.65rem; }
.compare-value { text-align:center;color:var(--muted-2);font-size:.64rem; }
.compare-value.lead { color:var(--accent-2);font-weight:700; }
.compare-track { height:7px;position:relative;display:flex;justify-content:space-between;gap:2px;background:var(--surface-3);border-radius:10px;overflow:hidden; }
.compare-track i,.compare-track b { display:block;height:100%;background:var(--accent);border-radius:9px; }
.compare-track b { background:#a88cc8; }
.gear-summary { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:19px;padding-top:13px;border-top:1px solid var(--line); }
.gear-summary strong,.gear-summary span { display:block; }
.gear-summary strong { font-size:.68rem; }
.gear-summary span { color:var(--muted);font-size:.62rem; }
.disclaimer,.warning-note { color:var(--muted-2);font-size:.61rem;margin:15px 0 0; }
.warning-note { color:#e0b07b; }

.challenge-types { display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:17px; }
.challenge-type { appearance:none;display:flex;flex-direction:column;gap:5px;min-height:108px;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:border-color .15s ease,transform .15s ease,background .15s ease; }
.challenge-type > span { color:var(--accent);font-size:1.1rem; }
.challenge-type b { font-size:.67rem; }
.challenge-type small { margin-top:auto;color:var(--muted-2);font-size:.56rem; }
.challenge-type.featured,.challenge-type:hover { border-color:color-mix(in srgb,var(--accent) 58%,transparent);background:var(--surface-2); }
.challenge-type:active { transform:translateY(1px); }
.challenge-type:focus-visible { outline:2px solid var(--accent);outline-offset:2px; }
.music-challenge-card { width:100%;max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin; }
.music-challenge-card h2 { margin:8px 0;font:1.2rem/1.3 'Marcellus',serif; }
.music-source-note { color:var(--muted);font-size:.65rem; }
.official-audio-frame { width:100%;aspect-ratio:16/9;max-height:190px;margin:9px 0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#000; }
.official-audio-frame iframe { display:block;width:100%;height:100%;border:0; }
.music-player-hint { margin:4px 0 8px;color:var(--muted);font-size:.62rem;text-align:center; }
.official-audio-placeholder { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:130px;margin:10px 0;padding:15px;border:1px dashed var(--line);border-radius:10px;background:var(--surface-2);text-align:center; }
.official-audio-placeholder > span { color:var(--accent);font-size:1.4rem; }
.official-audio-placeholder strong { font-size:.74rem; }
.official-audio-placeholder p { max-width:330px;margin:0;color:var(--muted);font-size:.61rem; }
.music-source-link { margin:8px 0 0;text-align:center;font-size:.62rem; }
.music-source-link a { color:var(--accent-2); }
.image-question-frame { display:grid;place-items:center;width:100%;height:130px;margin:8px auto;overflow:hidden;border-radius:10px;background:var(--surface-2); }
.image-question-frame img { width:100%;height:100%;object-fit:contain; }
.image-question-frame span { color:var(--muted);font-size:.7rem; }
.quiz-layout { display:grid;grid-template-columns:.8fr 1.2fr;gap:14px; }
.quiz-side-info,.quiz-main { padding:22px;border:1px solid var(--line);border-radius:15px;background:var(--surface); }
.quiz-side-info h2 { margin:6px 0;font:1.45rem 'Marcellus',serif; }
.quiz-side-info > p { color:var(--muted);font-size:.75rem; }
.quiz-record { display:grid;grid-template-columns:1fr;gap:8px;margin-top:25px; }
.quiz-record > div { display:flex;justify-content:space-between;align-items:center;padding:9px 11px;border-radius:8px;background:var(--surface-2); }
.quiz-record span { color:var(--muted);font-size:.66rem; }
.quiz-record strong { color:var(--accent-2);font:1rem 'Marcellus',serif; }
.quiz-main { display:flex;align-items:center;justify-content:center;min-height:330px; }
.quiz-start,.quiz-finish { width:100%;max-width:440px;text-align:center; }
.quiz-medallion { display:grid;place-items:center;width:56px;height:56px;margin:0 auto 14px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:50%;color:var(--accent);font-size:1.5rem; }
.quiz-start h2,.quiz-finish h2 { margin:7px 0;font:1.65rem 'Marcellus',serif; }
.quiz-start p,.quiz-finish p { color:var(--muted);font-size:.72rem; }
.quiz-start select { display:block;width:100%;max-width:230px;margin:7px auto 15px;padding:9px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text); }
.field-label { color:var(--muted-2);font-size:.65rem; }
.quiz-progress-line { display:flex;justify-content:space-between;color:var(--muted-2);font-size:.6rem;letter-spacing:.1em; }
.quiz-progress { height:5px;margin:7px 0 23px;background:var(--surface-3);border-radius:9px;overflow:hidden; }
.quiz-progress i { display:block;height:100%;background:var(--accent); }
.quiz-card { width:100%; }
.quiz-card h2 { margin:8px 0 17px;font:1.35rem/1.35 'Marcellus',serif; }
.answer-grid { display:grid;grid-template-columns:1fr 1fr;gap:8px; }
.answer-option { display:flex;align-items:center;gap:9px;min-height:47px;padding:9px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2);color:var(--text);text-align:left;font-size:.68rem; }
.answer-option span { display:grid;place-items:center;width:22px;height:22px;flex:0 0 22px;border-radius:6px;background:var(--surface-3);color:var(--accent);font-size:.62rem;font-weight:700; }
.answer-option.correct { border-color:#6ca785;background:rgba(89,151,111,.12); }
.answer-option.incorrect { border-color:#b96e67;background:rgba(185,110,103,.12); }
.answer-feedback { margin-top:13px;padding:13px;border-radius:9px;background:var(--surface-2); }
.answer-feedback strong { font-size:.75rem; }
.answer-feedback p { color:var(--muted);font-size:.67rem; }
.feedback-good strong { color:#8fcea6; }
.feedback-bad strong { color:#e49b91; }
.finish-actions { display:flex;justify-content:center;gap:8px;margin-top:17px; }

.collection-overview { display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative;margin-bottom:15px;padding:22px 25px;border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);border-radius:15px;background:linear-gradient(110deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),var(--surface)); }
.collection-overview strong { display:block;margin:6px 0;font:2.3rem 'Marcellus',serif;color:var(--accent-2); }
.collection-overview strong small { color:var(--muted-2);font-size:1rem; }
.collection-overview p { margin:0;color:var(--muted);font-size:.7rem; }
.collection-overview > div:first-child { width:70%; }
.collection-progress { height:7px;max-width:470px;margin:13px 0 5px;border-radius:9px;background:var(--surface-3);overflow:hidden; }
.collection-progress i { display:block;height:100%;background:var(--accent);border-radius:9px; }
.collection-overview > div:first-child > span { color:var(--muted-2);font-size:.61rem; }
.collection-art { font-size:5rem;color:var(--accent);opacity:.23;transform:rotate(-12deg);margin-right:7%; }
.collection-list { display:grid;gap:8px; }
.collection-item { display:flex;align-items:center;gap:13px;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface); }
.collection-item.collected { border-color:color-mix(in srgb,var(--green) 40%,transparent); }
.collectible-icon { display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:11px;background:var(--surface-3);color:var(--accent);font-size:1.2rem; }
.collection-text { flex:1;min-width:0; }
.collection-text h3 { margin:0;font:.98rem 'Marcellus',serif; }
.collection-text p { margin:3px 0;color:var(--muted);font-size:.65rem; }
.collection-text small { color:var(--muted-2);font-size:.58rem; }
.collection-check { display:flex;align-items:center;gap:7px;white-space:nowrap;color:var(--muted);font-size:.65rem; }
.collection-check input { accent-color:var(--accent); }
.icon-button { width:32px;height:32px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--accent); }

.systems-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:12px; }
.system-card { min-height:234px;padding:19px;border:1px solid var(--line);border-radius:14px;background:var(--surface); }
.system-icon { display:grid;place-items:center;width:40px;height:40px;margin-bottom:14px;border-radius:11px;background:var(--surface-3);color:var(--accent);font-size:1.2rem; }
.system-card h2 { margin:6px 0;font:1.2rem 'Marcellus',serif; }
.system-card > p { color:var(--muted);font-size:.68rem;min-height:39px; }
.system-card .button { margin-top:7px; }
.guess-clues { min-height:55px;padding:8px;border-radius:8px;background:var(--surface-2);color:var(--muted);font-size:.65rem; }
.guess-clues p { margin:4px 0; }
.guess-clues > span { color:var(--muted-2); }
.guess-answer { margin-top:8px;color:var(--accent-2);font-size:.7rem; }
.guess-actions { display:flex;gap:5px;flex-wrap:wrap;margin-top:7px; }
.guess-actions .button { margin:0;padding:7px 9px;font-size:.62rem; }
.daily-entry { display:flex;align-items:center;gap:10px;padding:10px;margin:9px 0;border-radius:9px;background:var(--surface-2); }
.daily-entry > span { font-size:1.2rem;color:var(--accent); }
.daily-entry strong,.daily-entry small { display:block; }
.daily-entry strong { font-size:.72rem; }
.daily-entry small { color:var(--muted-2);font-size:.58rem; }
.system-card .text-button { margin-top:5px; }

.theme-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:17px; }
.theme-card { min-height:155px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:16px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--text); }
.theme-card > span { display:grid;place-items:center;width:37px;height:37px;margin-bottom:11px;border-radius:10px;background:var(--surface-3);color:var(--accent);font-size:1.1rem; }
.theme-card strong { font:1rem 'Marcellus',serif; }
.theme-card small { margin:4px 0 10px;color:var(--muted-2);font-size:.61rem; }
.theme-card em { margin-top:auto;color:var(--muted);font-style:normal;font-size:.6rem; }
.theme-card.active { border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent); }
.theme-card.active em { color:var(--accent); }
.theme-sheikah > span { color:#65b5d5; }.theme-zonai > span { color:#b9bf76; }.theme-twilight > span { color:#b78bd7; }.theme-hyrule > span { color:#d9b66c; }
.settings-panel { display:grid;gap:0;border:1px solid var(--line);border-radius:14px;background:var(--surface); }
.settings-section { padding:21px;border-bottom:1px solid var(--line); }
.settings-section:last-child { border:0; }
.settings-section h2 { margin:0;font:1.16rem 'Marcellus',serif; }
.settings-section > div:first-child > p { margin:4px 0 15px;color:var(--muted);font-size:.69rem; }
.setting-row,.toggle-row { display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 0;border-top:1px solid var(--line); }
.setting-row strong,.setting-row small,.toggle-row strong,.toggle-row small { display:block; }
.setting-row strong,.toggle-row strong { font-size:.73rem; }
.setting-row small,.toggle-row small { color:var(--muted-2);font-size:.62rem; }
.setting-row select { min-width:145px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font-size:.68rem; }
.toggle-row { cursor:pointer; }
.toggle-row input { position:absolute;opacity:0; }
.toggle-row i { width:39px;height:22px;flex:0 0 39px;border-radius:99px;background:var(--surface-3);position:relative;transition:background .2s; }
.toggle-row i:after { content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:var(--muted);transition:transform .2s,background .2s; }
.toggle-row input:checked + i { background:color-mix(in srgb,var(--accent) 40%,transparent); }
.toggle-row input:checked + i:after { transform:translateX(17px);background:var(--accent); }
.data-actions { display:flex;gap:8px;flex-wrap:wrap;margin:15px 0; }
.upload-button { cursor:pointer; }
.about-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:8px; }
.about-grid > div { padding:11px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2); }
.about-grid span,.about-grid strong { display:block; }
.about-grid span { color:var(--muted-2);font-size:.58rem; }
.about-grid strong { margin-top:3px;font-size:.68rem; }
.limits-list { padding-left:18px;color:var(--muted);font-size:.7rem; }
.limits-list li { margin:7px 0; }

.modal-backdrop,.welcome-screen { position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(4,7,12,.78);backdrop-filter:blur(10px);overflow:auto; }
.modal-card { position:relative;width:min(680px,100%);max-height:92vh;overflow:auto;padding:25px;border:1px solid color-mix(in srgb,var(--accent) 32%,transparent);border-radius:17px;background:var(--surface);box-shadow:0 25px 80px rgba(0,0,0,.5); }
.modal-close { position:absolute;right:14px;top:12px;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;background:var(--surface-2);color:var(--muted);font-size:1.3rem; }
.detail-hero { display:flex;align-items:center;gap:17px;padding-right:25px; }
.detail-hero > img,.detail-hero > span { display:grid;place-items:center;width:100px;height:100px;flex:0 0 100px;object-fit:cover;border-radius:13px;background:var(--surface-3);color:var(--accent);font-size:2.5rem; }
.detail-hero h2 { margin:4px 0;font:1.5rem 'Marcellus',serif; }
.detail-hero p { margin:0;color:var(--muted);font-size:.69rem; }
.detail-summary { margin:17px 0;padding:13px;border-left:3px solid var(--accent);background:var(--surface-2);color:var(--muted);font-size:.75rem; }
.detail-facts { display:grid;grid-template-columns:1fr 1fr;gap:8px; }
.detail-facts > div { padding:11px;border:1px solid var(--line);border-radius:9px; }
.detail-facts strong { color:var(--accent-2);font-size:.65rem; }
.detail-facts p { margin:4px 0 0;color:var(--muted);font-size:.67rem; }
.stats-list { display:grid;gap:7px; }
.stat-row { display:grid;grid-template-columns:145px 1fr 25px;align-items:center;gap:8px; }
.stat-row span { color:var(--muted);font-size:.62rem; }
.stat-track { height:6px;border-radius:8px;background:var(--surface-3);overflow:hidden; }
.stat-track i { display:block;height:100%;background:var(--accent);border-radius:8px; }
.stat-row b { text-align:right;color:var(--accent-2);font-size:.62rem; }
.detail-actions { display:flex;gap:8px;flex-wrap:wrap;margin-top:20px;padding-top:16px;border-top:1px solid var(--line); }
.form-modal { width:min(560px,100%); }
.form-modal h2 { margin:5px 0;font:1.5rem 'Marcellus',serif; }
.form-modal > p { margin:4px 0 16px;color:var(--muted);font-size:.7rem; }
.form-modal form { display:grid;gap:10px; }
.form-modal form > label:not(.checkbox-field) { display:grid;gap:4px;color:var(--muted);font-size:.65rem; }
.form-modal input,.form-modal select,.form-modal textarea { width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font-size:.75rem; }
.form-modal textarea { resize:vertical; }
.checkbox-field { display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.68rem; }
.checkbox-field input { width:auto;accent-color:var(--accent); }
.form-actions { display:flex;justify-content:flex-end;gap:8px;margin-top:8px; }
.surprise-modal { width:min(480px,100%);text-align:center; }
.surprise-modal .quiz-medallion { margin-top:17px; }
.surprise-modal h2 { font:1.35rem 'Marcellus',serif; }
.surprise-modal p { color:var(--muted);font-size:.72rem; }
.surprise-answer { padding:10px;border-radius:8px;background:var(--surface-2); }
.welcome-screen { z-index:60;background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 36%),rgba(4,7,12,.94); }
.welcome-card { width:min(520px,100%);padding:35px 30px;text-align:center;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);border-radius:22px;background:linear-gradient(145deg,var(--surface),var(--bg));box-shadow:var(--shadow); }
.welcome-mark { width:92px;height:80px;margin:0 auto 18px; }
.welcome-card h1 { margin:10px 0;font:clamp(2rem,7vw,3.15rem)/1.13 'Marcellus',serif; }
.welcome-card h1 span { color:var(--accent-2); }
.welcome-card p { max-width:390px;margin:12px auto 18px;color:var(--muted);font-size:.82rem; }
.welcome-theme-row { display:flex;align-items:center;justify-content:center;gap:8px;margin:18px 0;color:var(--muted);font-size:.68rem; }
.welcome-theme-row > span:first-child { color:var(--accent); }
.welcome-color { width:9px;height:9px;border-radius:50%;background:#65b5d5; }
.welcome-card .button { width:min(260px,100%);margin:5px auto 13px; }
.welcome-card > small { display:block;color:var(--muted-2);font-size:.59rem; }
#toast-host { position:fixed;right:18px;bottom:18px;z-index:100;display:grid;gap:7px; }
.toast { max-width:min(370px,calc(100vw - 36px));padding:12px 15px;border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);border-radius:10px;background:var(--surface-3);color:var(--text);box-shadow:var(--shadow);font-size:.72rem;animation:toast-in .2s ease-out; }
@keyframes toast-in { from { opacity:0;transform:translateY(8px); } to { opacity:1;transform:translateY(0); } }
.no-motion *, .no-motion *:before, .no-motion *:after { animation:none!important;transition:none!important;scroll-behavior:auto!important; }

@media (max-width:1100px) {
  .department-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .entry-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .systems-grid { grid-template-columns:repeat(2,1fr); }
  .challenge-types { grid-template-columns:repeat(3,1fr); }
  .hero-emblem { right:5%;width:27%; }
}
@media (max-width:820px) {
  .topbar { height:68px;padding:0 18px; }
  .brand-mark { width:32px;height:29px; }
  .brand-button strong { font-size:.87rem; }
  .brand-button small { font-size:.49rem; }
  .online-indicator { display:none; }
  .layout,.compact-nav .layout { grid-template-columns:1fr; }
  .sidebar { position:sticky;top:68px;z-index:15;display:block;padding:7px 10px;border-right:0;border-bottom:1px solid var(--line);background:rgba(8,13,21,.92);backdrop-filter:blur(12px); }
  .sidebar-caption,.sidebar-bottom { display:none; }
  .sidebar nav { display:flex;gap:5px;overflow-x:auto;scrollbar-width:none; }
  .sidebar nav::-webkit-scrollbar { display:none; }
  .nav-link { width:auto;flex:0 0 auto;padding:8px 10px;font-size:.68rem;white-space:nowrap; }
  .nav-link em { display:none; }
  .nav-icon { width:auto;font-size:.88rem; }
  .main-content { padding:25px 18px 48px; }
  .hero-panel { min-height:290px;padding:32px 27px; }
  .hero-emblem { right:2%;width:25%;opacity:.38; }
  .department-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .timeline-branches { grid-template-columns:1fr; }
  .branch-content p { min-height:0; }
  .arena-selectors { grid-template-columns:1fr; }
  .arena-vs { margin:0 auto;width:39px;height:39px; }
  .quiz-layout { grid-template-columns:1fr; }
  .quiz-record { grid-template-columns:repeat(3,1fr); }
  .quiz-record > div { display:grid;text-align:center; }
  .theme-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px) {
  .topbar { padding:0 12px; }
  .brand-button { gap:8px; }
  .brand-mark { width:27px;height:25px; }
  .brand-button strong { font-size:.76rem; }
  .brand-button small { font-size:.43rem;letter-spacing:.13em; }
  .version-pill { display:none; }
  .top-actions .button { padding:7px 9px;font-size:.64rem; }
  .main-content { padding:21px 13px 40px; }
  .page-heading { display:block;margin-bottom:20px; }
  .heading-actions { margin-top:14px; }
  .hero-panel { min-height:340px;padding:25px 20px; }
  .hero-copy { max-width:100%; }
  .hero-copy h1 { font-size:2.15rem; }
  .hero-copy p { max-width:95%;font-size:.81rem; }
  .hero-emblem { top:22%;right:0;width:38%;opacity:.13; }
  .hero-buttons .button { padding:10px 11px;font-size:.7rem; }
  .stats-strip { grid-template-columns:repeat(2,1fr);row-gap:15px;margin:15px 0 29px; }
  .stats-strip > div { padding:0 12px; }
  .stats-strip > div:nth-child(2) { border:0; }
  .stats-strip strong { font-size:1.22rem; }
  .department-grid { gap:8px; }
  .department-card { min-height:145px;padding:12px; }
  .department-card strong { font-size:.74rem; }
  .department-card small { font-size:.6rem; }
  .department-count { font-size:.52rem;right:8px;top:10px; }
  .home-feature-grid { grid-template-columns:1fr; }
  .feature-card { padding:17px; }
  .footer { display:block;padding:12px 15px;font-size:.59rem; }
  .footer span { display:block;margin:3px 0; }
  .entry-grid { grid-template-columns:1fr 1fr;gap:8px; }
  .entry-art { height:100px; }
  .entry-info { padding:10px; }
  .entry-info h3 { font-size:.87rem; }
  .entry-meta { display:block; }
  .entry-meta span { display:block; }
  .entry-info p { font-size:.61rem; }
  .entry-card-bottom { font-size:.51rem; }
  .results-head span:last-child { display:none; }
  .search-panel { gap:7px; }
  .view-switch button { width:30px; }
  .catalog-summary { grid-template-columns:1fr 1fr; }
  .catalog-summary > div:last-child { grid-column:span 2; }
  .game-list { padding-left:18px; }
  .history-card { grid-template-columns:1fr auto;gap:5px 12px; }
  .history-date { grid-column:1 / -1;font-size:.75rem; }
  .history-card > .official-tag { grid-column:2;grid-row:2; }
  .history-card > div:nth-child(2) { grid-column:1; }
  .arena-mode-switch { align-items:flex-start;flex-direction:column; }
  .mode-buttons { width:100%; }
  .mode-buttons button { flex:1; }
  .fighter-panel { padding:14px; }
  .arena-actions .button { flex:1 1 auto; }
  .result-panel { padding:14px; }
  .result-heading h2 { font-size:1.15rem; }
  .score-duel { grid-template-columns:1fr 35px 1fr; }
  .score-duel > div:not(.versus) small { font-size:.58rem; }
  .score-duel > div:not(.versus) strong { font-size:1.8rem; }
  .chance-bars { gap:10px; }
  .chance-bars span { font-size:.55rem; }
  .compare-row { grid-template-columns:105px 22px minmax(30px,1fr) 22px;gap:5px; }
  .compare-row > span { font-size:.58rem; }
  .gear-summary { gap:8px; }
  .challenge-types { grid-template-columns:repeat(2,1fr); }
  .quiz-side-info,.quiz-main { padding:16px; }
  .answer-grid { grid-template-columns:1fr; }
  .collection-overview { padding:17px; }
  .collection-overview > div:first-child { width:85%; }
  .collection-art { position:absolute;right:-5px;font-size:4rem; }
  .collection-item { flex-wrap:wrap;gap:9px; }
  .collection-text { flex-basis:calc(100% - 55px); }
  .collection-check { margin-left:48px; }
  .systems-grid { grid-template-columns:1fr; }
  .system-card { min-height:0; }
  .theme-grid { gap:8px; }
  .theme-card { min-height:147px;padding:12px; }
  .theme-card strong { font-size:.9rem; }
  .about-grid { grid-template-columns:1fr 1fr; }
  .data-actions { display:grid; }
  .data-actions .button { width:100%; }
  .detail-facts { grid-template-columns:1fr; }
  .detail-hero > img,.detail-hero > span { width:70px;height:70px;flex-basis:70px; }
  .detail-hero h2 { font-size:1.2rem; }
  .modal-card { padding:20px 15px; }
  .stat-row { grid-template-columns:115px 1fr 22px; }
}
.hide-descriptions .entry-info p { display:none; }
.duel-scoreboard { display:flex;justify-content:center;gap:10px;margin:14px 0; }
.duel-scoreboard span { display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);color:var(--muted);font-size:.68rem; }
.duel-scoreboard strong { color:var(--accent-2);font:1rem 'Marcellus',serif; }
.advanced-fields { margin:4px 0;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2); }
.advanced-fields summary { cursor:pointer;color:var(--accent-2);font-size:.69rem;font-weight:700; }
.advanced-fields summary small { color:var(--muted-2);font-weight:400; }
.stat-editor-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-top:10px; }
.stat-editor-grid label { display:flex;align-items:center;justify-content:space-between;gap:6px;color:var(--muted);font-size:.61rem; }
.stat-editor-grid input { width:70px;padding:6px 7px; }
.form-hint { margin:7px 0;color:var(--muted-2);font-size:.59rem; }
.compatibility-list { display:grid;gap:6px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line); }
.compatibility-list > strong { color:var(--muted);font-size:.64rem; }
.compatibility-list label { display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.63rem; }
.compatibility-list input { width:auto;accent-color:var(--accent); }

/* v0.2 — navegação mobile em tela fixa, retrato e conteúdo paginado */
.home-hero { position:relative; flex:0 0 clamp(128px,20vh,175px); overflow:hidden; display:flex; align-items:center; padding:17px 18px; border:1px solid color-mix(in srgb,var(--accent) 30%,transparent); border-radius:16px; background:linear-gradient(120deg,var(--surface) 0%,var(--surface-2) 100%); box-shadow:var(--shadow); }
.home-hero-copy { position:relative;z-index:2;max-width:75%; }
.home-hero .eyebrow { font-size:.55rem;letter-spacing:.17em; }
.home-hero h1 { margin:5px 0 4px;font:clamp(1.4rem,5vw,2.1rem)/1.06 'Marcellus',serif; }
.home-hero h1 span { color:var(--accent-2); }
.home-hero p { margin:0 0 9px;max-width:350px;color:#d6deea;font-size:.66rem;line-height:1.35; }
.home-hero .hero-buttons { gap:6px; }
.home-hero .button { padding:7px 9px;font-size:.61rem;border-radius:8px; }
.home-hero-seal { position:absolute;right:12px;top:50%;transform:translateY(-50%);width:72px;color:var(--accent);opacity:.9;filter:drop-shadow(0 3px 12px #000); }
.home-stats { display:grid;grid-template-columns:repeat(3,1fr);flex:0 0 40px;border-bottom:1px solid var(--line); }
.home-stats > div { display:flex;align-items:center;justify-content:center;gap:7px;border-right:1px solid var(--line); }
.home-stats > div:last-child { border:0; }
.home-stats strong { color:var(--accent-2);font:1.05rem 'Marcellus',serif; }
.home-stats small { color:var(--muted-2);font-size:.57rem; }
.mobile-section-title { display:flex;align-items:center;justify-content:space-between;flex:0 0 21px;color:var(--muted-2);font-size:.57rem;font-weight:800;letter-spacing:.16em; }
.mobile-section-title .text-button { font-size:.62rem; }
.home-departments { flex:1;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:minmax(64px,auto);gap:6px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y; }
.home-departments .department-card { min-height:0;padding:8px 10px;justify-content:center;overflow:hidden;background:var(--surface); }
.home-departments .department-card::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 40%,rgba(0,0,0,.15));pointer-events:none; }
.home-departments .department-icon { position:absolute;left:9px;top:8px;width:22px;height:22px;margin:0;border-radius:7px;font-size:.85rem; }
.home-departments .department-count { top:10px;right:9px;z-index:1;padding:2px 5px;border-radius:5px;background:rgba(0,0,0,.42);color:#fff;font-size:.52rem; }
.home-departments .department-card strong { position:relative;z-index:1;margin:23px 0 0;font-size:.68rem;line-height:1.15;max-width:94%; }
.home-departments .department-card small { display:none; }
.bottom-nav { display:none; }
.screen-page { min-height:0; }
.entry-image-fallback { position:absolute;inset:0;display:grid;place-items:center;color:var(--accent);font-size:2rem;background:linear-gradient(145deg,var(--surface-2),var(--surface-3)); }
.entry-art { position:relative; }
.entry-art img { position:relative;z-index:1;width:100%;height:100%;object-fit:contain;background:linear-gradient(145deg,var(--surface-2),var(--surface-3)); }
.more-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:9px;flex:1;min-height:0; }
.more-card { position:relative;overflow:hidden;display:flex;align-items:flex-end;gap:9px;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2);color:var(--text);text-align:left; }
.more-card span { display:grid;place-items:center;width:30px;height:30px;flex:0 0 auto;border-radius:9px;background:color-mix(in srgb,var(--accent) 22%,#111);color:var(--accent-2);font-size:1rem; }
.more-card strong { position:relative;z-index:1;font: .9rem 'Marcellus',serif; }
.more-card b { margin-left:auto;color:var(--accent-2);font-size:1.2rem; }
.more-note { flex:0 0 auto;color:var(--muted-2);font-size:.58rem;text-align:center;padding:5px; }
.category-select { min-width:0;width:44%;height:41px;padding:0 8px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text);font-size:.63rem; }
.pager { display:flex;align-items:center;justify-content:space-between;gap:10px;flex:0 0 36px;padding-top:4px;border-top:1px solid var(--line);color:var(--muted-2);font-size:.62rem; }
.pager .button { padding:7px 10px;font-size:.6rem; }
.detail-tabs { display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:10px 0 8px; }
.detail-tabs button { padding:8px 5px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);font-size:.67rem; }
.detail-tabs button.active { color:var(--accent-2);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface)); }
.detail-panel { flex:1;min-height:0;overflow:hidden; }
.detail-summary-panel { height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:10px; }
.detail-summary-panel > p { margin:3px 0;color:var(--muted);font-size:.76rem;line-height:1.45; }
.detail-meta-grid { display:grid;grid-template-columns:1fr 1fr;gap:7px; }
.detail-meta-grid > div { display:flex;flex-direction:column;gap:3px;padding:9px;border:1px solid var(--line);border-radius:9px;background:var(--surface); }
.detail-meta-grid small { color:var(--muted-2);font-size:.55rem; }
.detail-meta-grid strong { color:var(--text);font-size:.65rem;line-height:1.3; }
.detail-pager { display:flex;justify-content:center;align-items:center;gap:18px;padding:5px; }
.detail-pager button { width:30px;height:28px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--accent); }
.detail-pager span { color:var(--muted);font-size:.65rem; }
.timeline-origin.compact-origin { display:flex;align-items:center;gap:12px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface); }
.timeline-origin.compact-origin > img { width:74px;height:74px;flex:0 0 74px;object-fit:cover;border-radius:9px;background:var(--surface-2); }
.timeline-origin.compact-origin h2 { font-size:1rem; }
.timeline-origin.compact-origin p { margin:3px 0 5px;font-size:.61rem; }
.timeline-branches { flex:1;min-height:0;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(0,1fr));gap:6px; }
.timeline-branches .branch-card { min-height:0;display:flex;align-items:center;padding:8px 10px; }
.timeline-branches .branch-line { flex:0 0 4px;height:38px;width:4px;margin:0 10px 0 0; }
.timeline-branches .branch-content h3 { margin:2px 0;font-size:.78rem; }
.timeline-branches .branch-content p { min-height:0;margin:0 0 4px;font-size:.57rem;line-height:1.3; }
.timeline-branches .branch-games { gap:3px; }
.timeline-branches .branch-games span { padding:3px 5px;font-size:.49rem; }
.timeline-event-mini { display:flex;align-items:center;gap:9px;flex:0 0 62px;padding:7px;border:1px solid var(--line);border-radius:10px;background:var(--surface); }
.timeline-event-mini img { width:48px;height:48px;object-fit:cover;border-radius:7px; }
.timeline-event-mini > div { flex:1;min-width:0; }
.timeline-event-mini strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.66rem; }
.timeline-event-mini .text-button { font-size:.58rem; }
.compact-summary { display:grid;grid-template-columns:repeat(2,1fr);flex:0 0 48px;margin:0; }
.compact-summary > div { padding:4px 9px; }
.compact-console { flex:1;min-height:0;padding:0;overflow:hidden; }
.console-banner { display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line); }
.console-banner .console-symbol { color:var(--accent);font-size:1.2rem; }
.console-banner div { display:flex;flex-direction:column;min-width:0; }
.console-banner small { color:var(--muted-2);font-size:.52rem; }
.console-banner strong { font: .87rem 'Marcellus',serif; }
.console-banner em { margin-left:auto;color:var(--muted-2);font-size:.55rem;font-style:normal; }
.compact-console .game-list { display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:7px; }
.compact-console .game-row { min-width:0;gap:6px;padding:5px;border:1px solid var(--line);border-radius:8px;background:var(--bg); }
.game-thumb { width:32px;height:38px;flex:0 0 32px;overflow:hidden;border-radius:5px;background:var(--surface-2); }
.game-thumb img { width:100%;height:100%;object-fit:cover; }
.compact-console .game-row > div { min-width:0; }
.compact-console .game-row strong { display:block;font-size:.57rem;line-height:1.2; }
.compact-console .game-row small { font-size:.49rem; }
.compact-console .game-row time { display:none; }
.compact-console .game-row > span.game-disc { display:none; }
.fighter-avatar { width:68px;height:72px;margin:7px auto;border-radius:11px;overflow:hidden;background:var(--surface-3); }
.fighter-avatar img { width:100%;height:100%;object-fit:contain; }
.fighter-panel { min-width:0; }
.collection-item .collectible-image { width:42px;height:42px;object-fit:contain; }

@media (max-width:820px) {
  html,body { width:100%;height:100%;overflow:hidden;overscroll-behavior:none; }
  body { height:100dvh; }
  .app-shell { height:100dvh;min-height:0;overflow:hidden;display:grid;grid-template-rows:56px minmax(0,1fr) 62px; }
  .topbar { position:relative;top:auto;height:56px;min-height:56px;padding:0 11px; }
  .top-actions { gap:4px; }
  .top-actions .button { padding:7px 9px;font-size:.61rem; }
  .layout,.compact-nav .layout { display:block;min-height:0;height:100%;overflow:hidden; }
  .sidebar { display:none!important; }
  .main-content { width:100%;height:100%;min-height:0;max-width:none;margin:0;padding:10px 11px 8px;overflow:hidden; }
  .screen-page { height:100%;display:flex;flex-direction:column;gap:8px;overflow:hidden; }
  .page-heading { display:flex;align-items:center;justify-content:space-between;gap:7px;flex:0 0 auto;margin:0 0 2px; }
  .page-heading .eyebrow { font-size:.51rem; }
  .page-heading h1 { margin:2px 0 0;font-size:1.16rem;line-height:1.1; }
  .page-heading p { max-width:230px;margin:3px 0 0;font-size:.57rem;line-height:1.28; }
  .heading-actions .button { padding:7px 8px;font-size:.58rem; }
  .bottom-nav { display:grid;grid-template-columns:repeat(5,1fr);align-items:stretch;min-height:62px;padding:5px 5px max(5px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:rgba(8,13,21,.96);backdrop-filter:blur(16px); }
  .bottom-nav-item { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;border-radius:9px;background:transparent;color:var(--muted-2); }
  .bottom-nav-item span { font-size:1.13rem;line-height:1; }
  .bottom-nav-item small { font-size:.53rem;font-weight:700; }
  .bottom-nav-item.active { background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent-2); }
  .footer { display:none; }
  .home-hero { flex-basis:clamp(128px,19vh,162px); }
  .home-departments { grid-template-rows:none;grid-auto-rows:minmax(64px,auto); }
  .department-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .page-heading + .search-panel { flex:0 0 auto;margin:0; }
  .search-panel { margin:0;gap:6px; }
  .search-box { height:41px;padding:0 9px; }
  .search-box input { font-size:.65rem; }
  .search-box span { font-size:1.05rem; }
  .results-head { flex:0 0 17px;margin:0;font-size:.57rem; }
  .entry-grid { flex:1;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:7px;overflow:hidden; }
  .entry-card { display:flex;flex-direction:column;min-width:0;min-height:0; }
  .entry-art { flex:0 0 94px;height:94px; }
  .entry-info { display:flex;flex:1;min-height:0;flex-direction:column;padding:8px; }
  .entry-info h3 { display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:3px 0;font-size:.69rem;line-height:1.2; }
  .entry-info p { display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:1px 0 4px;font-size:.53rem;line-height:1.25; }
  .entry-meta span { font-size:.48rem; }
  .entry-card-bottom { margin-top:auto;padding-top:5px;font-size:.48rem; }
  .entry-card-bottom span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .favorite-mini { width:24px;height:24px; }
  .pager { min-height:34px; }
  .category-select { width:43%;height:41px;font-size:.57rem; }
  .more-grid { grid-template-rows:repeat(3,minmax(0,1fr)); }
  .timeline-branches { grid-template-rows:repeat(3,minmax(0,1fr)); }
  .arena-mode-switch { flex:0 0 48px;padding:7px 9px; }
  .arena-mode-switch strong { font-size:.75rem; }
  .mode-buttons button { padding:6px 9px;font-size:.59rem; }
  .mode-description { flex:0 0 auto;margin:0;padding:7px 9px;font-size:.56rem;line-height:1.28; }
  .arena-selectors { flex:1;min-height:0;grid-template-columns:minmax(0,1fr) 27px minmax(0,1fr);gap:5px; }
  .fighter-panel { display:flex;flex-direction:column;min-width:0;min-height:0;padding:7px;border-radius:10px;overflow:hidden; }
  .fighter-overline { font-size:.47rem; }
  .fighter-avatar { width:54px;height:56px;margin:5px auto; }
  .fighter-panel select { padding:6px 4px;font-size:.56rem; }
  .fighter-panel > p { display:none; }
  .arena-vs { width:27px;height:27px;margin-top:95px;font-size:.62rem; }
  .equipment-picker { flex:1 1 auto;min-height:0;max-height:none;padding-top:5px;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y; }
  .picker-title { margin-bottom:3px; }
  .picker-title strong { font-size:.57rem; }
  .picker-title span { font-size:.48rem; }
  .equipment-option { gap:4px;padding:5px 1px;min-height:30px; }
  .equipment-check { width:13px;height:13px;flex:0 0 13px; }
  .equipment-option b { font-size:.5rem; }
  .equipment-option small { display:none; }
  .arena-actions { flex:0 0 auto;gap:5px;margin:0; }
  .arena-actions .button { flex:1;padding:8px 5px;font-size:.56rem; }
  .arena-empty { flex:1;justify-content:center;padding:15px; }
  .arena-empty h3 { font-size:1rem; }
  .arena-empty p { font-size:.62rem; }
  .screen-arena .notice-line { display:none; }
  .result-panel { flex:1;min-height:0;overflow:hidden;padding:10px; }
  .result-heading h2 { font-size:.95rem; }
  .score-duel { padding:8px 0;grid-template-columns:1fr 30px 1fr; }
  .score-duel > div:not(.versus) strong { font-size:1.3rem; }
  .score-duel > div:not(.versus) small { font-size:.5rem; }
  .chance-bars { gap:6px; }
  .chance-bars span { font-size:.48rem; }
  .subsection-title { margin:8px 0 4px;font-size:.68rem; }
  .compare-table { display:grid;gap:3px; }
  .compare-row { grid-template-columns:75px 18px minmax(20px,1fr) 18px;gap:4px; }
  .compare-row > span { font-size:.5rem; }
  .gear-summary { gap:6px;margin-top:6px; }
  .gear-summary > div { padding:6px; }
  .gear-summary strong,.gear-summary span { font-size:.48rem; }
  .disclaimer { margin:6px 0;font-size:.48rem; }
  .challenge-types { display:grid;grid-template-columns:repeat(3,1fr);gap:5px;flex:0 0 auto; }
  .challenge-type { min-height:45px;padding:6px;display:grid;grid-template-columns:20px 1fr;align-items:center;gap:2px 5px; }
  .challenge-type > span { grid-row:span 2;font-size:.95rem; }
  .challenge-type b { font-size:.52rem; }
  .challenge-type small { font-size:.43rem; }
  .quiz-layout { flex:1;min-height:0;display:block;overflow:hidden; }
  .quiz-side-info { display:none; }
  .quiz-main { height:100%;min-height:0;padding:10px;overflow:hidden; }
  .quiz-start,.quiz-finish { height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px; }
  .quiz-medallion { width:45px;height:45px;margin:0;font-size:1.2rem; }
  .quiz-start h2,.quiz-finish h2 { margin:0;font-size:1.15rem; }
  .quiz-start p,.quiz-finish p { margin:0;font-size:.61rem; }
  .quiz-start select { width:100%;max-width:230px;padding:8px;border-radius:8px;background:var(--bg);color:var(--text);border:1px solid var(--line); }
  .quiz-start .button { margin-top:4px; }
  .quiz-card { display:flex;flex-direction:column;justify-content:center;height:100%;gap:9px;overflow-y:auto; }
  .music-challenge-card { height:100%;padding:2px 1px; }
  .music-challenge-card h2 { font-size:.9rem; }
  .music-source-note { margin:3px 0;font-size:.52rem; }
  .official-audio-frame { max-height:115px;aspect-ratio:16/9;margin:5px 0; }
  .official-audio-placeholder { min-height:80px;margin:5px 0;padding:7px;gap:4px; }
  .official-audio-placeholder p { font-size:.49rem; }
  .official-audio-placeholder .button { min-height:31px;padding:5px 8px;font-size:.55rem; }
  .music-source-link { font-size:.5rem; }
  .music-player-hint { margin:2px 0 5px;font-size:.48rem; }
  .image-question-frame { height:105px;margin:3px auto; }
  .quiz-card h2 { margin:2px 0;font-size:1rem;line-height:1.25; }
  .answer-grid { grid-template-columns:1fr 1fr;gap:6px; }
  .answer-option { min-height:52px;padding:7px;font-size:.59rem; }
  .answer-feedback { padding:7px;font-size:.59rem; }
  .answer-feedback p { margin:3px 0;font-size:.55rem; }
  .collection-overview { flex:0 0 100px;padding:12px; }
  .collection-overview > div:first-child { width:74%; }
  .collection-overview strong { font-size:1.8rem; }
  .collection-art { font-size:3rem; }
  .collection-list { display:grid;grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(0,1fr));gap:6px;flex:1;min-height:0;overflow:hidden; }
  .collection-item { min-height:0;display:grid;grid-template-columns:45px minmax(0,1fr) auto;align-items:center;gap:7px;padding:7px; }
  .collectible-icon { width:42px;height:42px;display:grid;place-items:center;overflow:hidden;border-radius:7px;background:var(--surface-2); }
  .collectible-icon img { width:100%;height:100%;object-fit:contain; }
  .collection-text { min-width:0; }
  .collection-text h3 { font-size:.64rem; }
  .collection-text p { display:none; }
  .collection-text small { font-size:.48rem; }
  .collection-check { margin:0;display:flex;align-items:center;gap:4px;font-size:.48rem; }
  .collection-check span { white-space:nowrap; }
  .collection-item .icon-button { display:none; }
  .systems-grid { flex:1;min-height:0;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,minmax(0,1fr));gap:6px; }
  .system-card { min-height:0;padding:8px;overflow:hidden; }
  .system-card h2 { margin:3px 0;font-size:.77rem; }
  .system-card p { margin:3px 0 5px;font-size:.51rem;line-height:1.3; }
  .system-card .button { padding:6px 7px;font-size:.53rem; }
  .system-icon { width:28px;height:28px;margin-bottom:3px;font-size:.85rem; }
  .guess-clues { margin:3px 0;font-size:.52rem; }
  .guess-clues p { margin:2px 0; }
  .guess-actions { gap:3px;flex-wrap:wrap; }
  .guess-actions .button { font-size:.46rem;padding:5px; }
  .theme-grid { flex:0 0 auto;grid-template-columns:repeat(2,1fr);gap:6px;margin:0; }
  .theme-card { min-height:94px;padding:8px; }
  .theme-card > span { width:24px;height:24px;margin-bottom:4px; }
  .theme-card strong { font-size:.73rem; }
  .theme-card small,.theme-card em { font-size:.48rem; }
  .screen-personalizar .settings-panel { flex:1;min-height:0;overflow:hidden; }
  .screen-personalizar .settings-section { padding:8px; }
  .screen-personalizar .settings-section h2 { font-size:.75rem; }
  .screen-personalizar .settings-section > div:first-child > p { display:none; }
  .screen-personalizar .setting-row { padding:6px 0; }
  .screen-personalizar .setting-row strong { font-size:.56rem; }
  .screen-personalizar .setting-row small { font-size:.46rem; }
  .screen-personalizar .setting-row select { max-width:110px;font-size:.52rem; }
  .screen-personalizar .toggle-row { padding:6px 0; }
  .screen-personalizar .toggle-row strong { font-size:.56rem; }
  .screen-personalizar .toggle-row small { font-size:.46rem; }
  .screen-configuracoes .settings-panel { flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y; }
  .screen-configuracoes .settings-section:first-child .data-actions { grid-template-columns:1fr; }
  .screen-configuracoes .wiki-sync-notice { display:flex;align-items:flex-start;gap:6px;margin-top:6px;padding:7px;border-radius:8px;background:var(--surface-2); }
  .screen-configuracoes .wiki-sync-notice p { margin:0;font-size:.54rem;line-height:1.35; }
  .screen-configuracoes .settings-section { padding:9px; }
  .screen-configuracoes .settings-section h2 { font-size:.77rem; }
  .screen-configuracoes .settings-section > div:first-child > p { margin:3px 0 7px;font-size:.52rem; }
  .screen-configuracoes .data-actions { display:grid;grid-template-columns:1fr 1fr;gap:5px; }
  .screen-configuracoes .data-actions .button { padding:8px 5px;font-size:.53rem; }
  .screen-configuracoes .notice-line { display:none; }
  .screen-configuracoes .about-grid { grid-template-columns:1fr 1fr;gap:5px; }
  .screen-configuracoes .about-grid > div { padding:6px; }
  .screen-configuracoes .about-grid span { font-size:.46rem; }
  .screen-configuracoes .about-grid strong { font-size:.52rem; }
  .screen-configuracoes .limits-list { display:none; }
  .detail-modal { width:min(480px,calc(100vw - 22px));height:min(610px,calc(100dvh - 28px));max-height:calc(100dvh - 28px);display:flex;flex-direction:column;overflow:hidden;padding:13px; }
  .detail-hero { flex:0 0 118px;gap:12px; }
  .detail-hero > img,.detail-hero > span { width:100px;height:110px;flex:0 0 100px;object-fit:contain; }
  .detail-hero h2 { font-size:1rem;line-height:1.15; }
  .detail-hero p { font-size:.55rem; }
  .detail-tabs { flex:0 0 auto; }
  .detail-facts { height:100%;grid-template-columns:1fr 1fr;gap:6px;overflow:hidden; }
  .detail-facts > div { min-height:0;padding:7px; }
  .detail-facts strong { font-size:.58rem; }
  .detail-facts p { font-size:.53rem; }
  .detail-actions { flex:0 0 auto;gap:5px;margin-top:8px; }
  .detail-actions .button { flex:1;padding:7px 5px;font-size:.52rem; }
  .stats-list { gap:6px; }
  .stat-row { grid-template-columns:98px 1fr 20px; }
  .stat-row > span { font-size:.55rem; }
  .stat-row b { font-size:.55rem; }
  .modal-backdrop { padding:8px; }
  .form-modal { max-height:calc(100dvh - 16px);overflow:auto; }
  .screen-jogos .catalog-list { display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:6px;flex:1;min-height:0; }
  .screen-jogos .compact-console { min-height:0; }
  .screen-jogos .pager { flex:0 0 36px; }
  .screen-cronologia .timeline-event-mini { flex-basis:58px; }
}
@media (max-width:380px) {
  .home-hero-copy { max-width:82%; }
  .home-hero-seal { width:55px;right:7px; }
  .home-hero .button { padding:6px 7px;font-size:.54rem; }
  .entry-art { flex-basis:78px;height:78px; }
  .entry-info h3 { font-size:.62rem; }
  .entry-info p { font-size:.49rem; }
  .fighter-avatar { width:47px;height:50px; }
  .arena-vs { margin-top:88px; }
  .home-departments .department-card strong { font-size:.61rem; }
}
@media (max-width:820px) {
  .collection-item .collectible-icon { position:relative; }
  .collection-item .collectible-icon img { position:absolute;inset:0;z-index:1;width:100%;height:100%; }
  .collection-item .collectible-icon span { position:relative;z-index:0;color:var(--accent); }
  .system-card { background:var(--surface); }
  .theme-card { background:var(--surface); }
  .theme-card small,.theme-card em { color:#dce3ed; }
}


/* v0.2 — ilustrações por registro, tela única vertical e painéis sem rolagem */
@media (max-width:820px), (orientation:portrait) and (max-width:1100px) {
  html, body { height:100%; min-height:0; overflow:hidden; }
  body { height:100dvh; overscroll-behavior:none; }
  .app-shell { height:100dvh; min-height:0; overflow:hidden; }
  .layout { min-height:0; height:100%; overflow:hidden; }
  .main-content { min-height:0; height:100%; overflow:hidden; }
  .screen-page { min-height:0; height:100%; overflow:hidden; }
  .entry-grid, .catalog-list, .collection-list, .systems-grid, .more-grid,
  .timeline-branches, .arena-selectors, .detail-panel, .result-panel { min-height:0; overflow:hidden; }

  .home-hero { position:relative; isolation:isolate; overflow:hidden; }
  .home-hero-photo { position:absolute; z-index:0; right:0; bottom:0; width:49%; height:100%; object-fit:contain; object-position:right bottom; opacity:.94; filter:drop-shadow(0 8px 18px rgba(0,0,0,.55)); pointer-events:none; }
  .home-hero-copy { position:relative; z-index:2; max-width:66%; }
  .home-hero-seal { z-index:2; }

  .entry-art { isolation:isolate; overflow:hidden; }
  .entry-art .entry-remote-art { position:absolute; inset:0; display:block; width:100%; height:100%; margin:0; object-fit:contain; object-position:center; background:transparent; padding:7px; z-index:1; }
  .entry-art .entry-image-fallback { z-index:0; }
  .entry-art .favorite-mini { z-index:3; }

  .game-thumb { position:relative; isolation:isolate; }
  .game-thumb .game-remote-art { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; z-index:1; padding:3px; }

  .fighter-avatar { position:relative; isolation:isolate; }
  .fighter-avatar .fighter-remote-art { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; z-index:1; padding:5px; }
  .fighter-avatar-fallback { position:absolute; inset:0; z-index:0; display:grid; place-items:center; color:var(--muted-2); font-size:1.5rem; }

  .collectible-icon { position:relative; isolation:isolate; }
  .collectible-icon .collectible-remote-art { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; z-index:1; padding:4px; }
  .collectible-image-fallback { position:absolute; inset:0; display:grid; place-items:center; z-index:0; color:var(--muted-2); }

  .detail-image-wrap { position:relative; display:block; flex:0 0 100px; width:100px; height:110px; overflow:hidden; border-radius:12px; background:var(--surface-2); isolation:isolate; }
  .detail-image-wrap img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
  .detail-image-wrap .detail-image-fallback { position:absolute; inset:0; display:grid; place-items:center; z-index:0; color:var(--muted-2); font-size:2rem; }
  .detail-image-wrap .detail-remote-art { position:absolute; inset:0; z-index:1; object-fit:contain; }
  .detail-hero > .detail-image-wrap { flex:0 0 100px; width:100px; height:110px; }

  .timeline-event-art { position:relative; display:block; flex:0 0 48px; width:48px; height:48px; overflow:hidden; border-radius:7px; background:var(--surface-2); }
  .timeline-event-art img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
  .timeline-event-art .timeline-remote-art { z-index:1; }

  .form-modal { width:min(600px,calc(100vw - 18px)); height:min(690px,calc(100dvh - 18px)); max-height:calc(100dvh - 18px); display:flex; flex-direction:column; overflow:hidden; }
  .form-modal form { flex:1; min-height:0; display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:min-content; align-content:start; gap:6px; overflow:hidden; }
  .form-modal form > label:not(.checkbox-field) { min-width:0; gap:3px; font-size:.56rem; }
  .form-modal input,.form-modal select,.form-modal textarea { min-width:0; padding:6px 7px; font-size:.62rem; }
  .form-modal textarea { height:54px; min-height:54px; resize:none; }
  .form-modal form > label:has(textarea), .form-modal form > label:has(input[type="checkbox"]),
  .form-modal form > .form-actions, .form-modal form > button { grid-column:1 / -1; }
  .form-modal > p { margin:2px 0 7px; font-size:.58rem; }
  .form-modal h2 { font-size:1.1rem; }
  .form-modal .form-actions { display:flex; gap:6px; }
  .form-modal .form-actions .button { flex:1; padding:7px 5px; font-size:.58rem; }
}
@media (max-width:380px) {
  .home-hero-photo { width:44%; opacity:.82; }
  .home-hero-copy { max-width:72%; }
  .detail-image-wrap, .detail-hero > .detail-image-wrap { flex-basis:82px; width:82px; height:94px; }
  .detail-modal .detail-hero { flex-basis:100px; }
  .form-modal { padding:12px; }
  .form-modal form { gap:4px; }
}


@media (max-width:820px) {
  .standalone-app #install-button, .native-app #install-button { display:none !important; }
  .modal-backdrop { padding:8px; overflow:hidden; }
  .detail-modal { max-height:calc(100dvh - 16px); }
}

@media (max-width:820px), (orientation:portrait) and (max-width:1100px) {
  .timeline-art { position:relative; display:block; flex:0 0 74px; width:74px; height:74px; overflow:hidden; border-radius:9px; background:var(--surface-2); isolation:isolate; }
  .timeline-art img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
  .timeline-art img:first-child { z-index:0; }
  .timeline-art .timeline-remote-art { z-index:1; }
  .screen-colecoes > .notice-line { display:none; }
  .screen-colecoes > .pager { flex:0 0 36px; }
}
@media (max-width:380px) {
  .topbar { padding:0 7px; }
  .brand-button { gap:6px; }
  .brand-mark { width:27px; height:25px; }
  .brand-button strong { font-size:.78rem; }
  .brand-button small { display:none; }
  .version-pill { display:none; }
  .top-actions .button { padding:5px 7px; font-size:.55rem; }
}


/* v0.4 — revisão de enquadramento e fundos neutros, sem ilustrações decorativas atrás do conteúdo */
.home-hero { background:linear-gradient(120deg,var(--surface) 0%,var(--surface-2) 100%) !important; }
.home-hero-photo { object-fit:contain !important; object-position:right center !important; padding:7px 5px 4px 0; filter:none !important; opacity:1 !important; }
.home-departments .department-card { background:var(--surface) !important; }
.home-departments .department-card::after { display:none !important; }
.more-card, .system-card, .theme-card { background:var(--surface) !important; background-image:none !important; }
.more-card::before, .more-card::after, .system-card::before, .system-card::after, .theme-card::before, .theme-card::after { background-image:none !important; }
.entry-art { background:var(--surface-2) !important; }
.entry-art .entry-remote-art { object-fit:contain !important; object-position:center center !important; padding:7px !important; background:transparent !important; }
.entry-art .entry-image-fallback { position:absolute; inset:0; display:grid; place-items:center; z-index:0; color:var(--muted-2); opacity:.55; pointer-events:none; }
.entry-art .entry-remote-art { z-index:1; }
.fighter-avatar { width:88px; height:106px; background:var(--surface-2); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.fighter-avatar .fighter-remote-art { width:100%; height:100%; object-fit:contain !important; object-position:center center; padding:5px; background:transparent; }
.fighter-avatar > span { color:var(--muted-2); font-size:1.5rem; }
.collectible-icon { background:var(--surface-2); }
.collectible-icon .collectible-remote-art { width:100%; height:100%; object-fit:contain !important; padding:3px; }
.detail-image-wrap, .detail-hero > .detail-image-wrap { flex:0 0 124px; width:124px; height:142px; background:var(--surface-2); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.detail-image-wrap .detail-remote-art { width:100%; height:100%; object-fit:contain !important; object-position:center center; padding:5px; background:transparent; }
.detail-image-fallback { width:100%; height:100%; display:grid; place-items:center; color:var(--muted-2); font-size:2rem; }
.timeline-art, .timeline-event-art { background:var(--surface-2) !important; }
.timeline-art img, .timeline-event-art img { object-fit:contain !important; padding:3px; }
.game-thumb { background:var(--surface-2); }
.game-thumb .game-remote-art { object-fit:contain !important; padding:3px; }
.game-image-fallback { display:grid; place-items:center; width:100%; height:100%; color:var(--muted-2); }
@media (max-width:820px) {
  .home-hero-photo { width:44%; max-height:100%; object-position:right center !important; }
  .entry-art { height:112px !important; }
  .entry-list .entry-art { width:108px !important; flex-basis:108px !important; height:auto !important; min-height:104px !important; }
  .fighter-avatar { width:70px; height:86px; }
  .detail-image-wrap, .detail-hero > .detail-image-wrap { flex-basis:104px; width:104px; height:124px; }
}
@media (max-width:380px) {
  .entry-art { height:96px !important; }
  .entry-list .entry-art { width:90px !important; flex-basis:90px !important; height:auto !important; }
  .fighter-avatar { width:62px; height:76px; }
  .detail-image-wrap, .detail-hero > .detail-image-wrap { flex-basis:90px; width:90px; height:110px; }
}

/* v0.4.1 — retratos únicos, sem ilustrações decorativas como fundo */
.home-hero, .department-card, .more-card, .system-card, .theme-card { background-image:none !important; }
.home-hero { background:linear-gradient(120deg,var(--surface),var(--surface-2)) !important; }
.entry-art, .fighter-avatar, .collectible-icon, .detail-image-wrap, .game-thumb { background:var(--surface-2) !important; }
.entry-art .entry-remote-art, .fighter-avatar .fighter-remote-art, .collectible-icon .collectible-remote-art, .detail-image-wrap .detail-remote-art, .game-thumb .game-remote-art { object-fit:contain !important; object-position:center center !important; }
.fighter-avatar, .collectible-icon, .detail-image-wrap { position:relative; isolation:isolate; }
.fighter-avatar-fallback, .collectible-image-fallback, .detail-image-fallback { position:absolute; inset:0; z-index:0; display:grid; place-items:center; color:var(--muted-2); pointer-events:none; }
.fighter-avatar .fighter-remote-art, .collectible-icon .collectible-remote-art, .detail-image-wrap .detail-remote-art { z-index:1; }


/* v0.6.0 — rolagem independente e utilizável da lista de equipamentos na Arena */
@media (max-width:820px), (orientation:portrait) and (max-width:1100px) {
  .screen-arena .arena-selectors {
    min-height:0;
    overflow:visible;
    align-items:stretch;
  }
  .screen-arena .fighter-panel {
    display:flex;
    flex-direction:column;
    min-width:0;
    min-height:0;
    height:100%;
    overflow:hidden;
  }
  .screen-arena .equipment-picker {
    display:block;
    flex:1 1 0;
    height:0;
    min-height:0;
    max-height:none;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y;
    scrollbar-width:thin;
    scrollbar-gutter:stable;
    pointer-events:auto;
  }
}
@media (min-width:821px) {
  .screen-arena .fighter-panel {
    display:flex;
    flex-direction:column;
    min-height:0;
  }
  .screen-arena .equipment-picker {
    flex:1 1 auto;
    min-height:180px;
    max-height:440px;
    overflow-y:auto;
    overscroll-behavior-y:contain;
  }
}