/* Modern noir: quiet surfaces, generous space, a restrained brass accent. */
:root { --gold:#cbb58a;--text:#e5e5e9;--mute:#a0a0af;--line:#ffffff12;--panel:#17181e;--button-border:#50515e; }
body.reading-ui { --text:#e5e5e9;--mute:#a0a0af;--line:#ffffff12;--panel:#17181e;background:#101116; }
body.reading-ui::before {
  background:linear-gradient(90deg,#1011169c,#10111666),url('img/noir-corridor-v1.jpg') center/cover no-repeat #101116!important;
  pointer-events:none;
}
.reading-ui #menu { background:#101116; }
.reading-ui #menuart { display:none; }
.reading-ui #menu::after {
  position:fixed;
  background:linear-gradient(90deg,#10111680,#10111633 65%,#10111666),url('img/noir-corridor-v1.jpg') center/cover no-repeat #101116;
}
.reading-ui #mc:has(.case-home) { width:min(1120px,100%); }
.case-home-header { position:relative;isolation:isolate;gap:64px;padding:16px 0 48px;border-color:var(--line); }
.case-home-header::before { content:'';position:absolute;z-index:-1;inset:-60px -30px 0 35%;pointer-events:none;background:radial-gradient(ellipse at 70% 25%,#75658a12,transparent 65%); }
.home-brand img { filter:none; }
.home-brand strong { color:#e7e4dc; }
.reading-ui #mc .case-home h1 { font-family:'Be Vietnam Pro',sans-serif;font-weight:500;font-size:clamp(2.6rem,4.3vw,4.25rem);letter-spacing:-.055em;line-height:1.2;color:#ededf0; }
.case-home h1 em { font-style:normal;color:var(--gold); }
.case-home .menu-kicker { color:#b5a786;font-size:.64rem;letter-spacing:.14em; }
.case-home .menu-description { color:#aaaab8;font-size:.87rem;max-width:520px;line-height:1.95; }
.hero-facts { display:flex;gap:32px;flex-wrap:wrap;margin-top:30px; }
.hero-facts span { color:#9292a2;font-size:.65rem; }
.hero-facts b { display:block;color:#dedbe2;font:500 1.15rem 'Be Vietnam Pro',sans-serif;margin-bottom:5px;letter-spacing:-.025em; }
.home-profile { border:1px solid var(--line);background:#191a21;border-radius:16px;padding:25px;box-shadow:none; }
.home-profile .profile-strip { border-color:var(--line);color:#aaaab8; }
.home-profile .menu-utilities { margin-top:22px; }
.reading-ui .btn { background:#1c1d25;border:1px solid var(--button-border);border-radius:9px;color:#d8d8e0;box-shadow:none; }
.reading-ui .btn:hover { background:#24252f;border-color:var(--gold);box-shadow:none; }
.reading-ui .btn.pri { background:var(--gold);border-color:var(--gold);color:#17171c;font-weight:600;box-shadow:none; }
.reading-ui .btn.pri:hover { filter:brightness(1.08); }
.reading-ui .home-settings.btn { background:transparent;border-color:var(--button-border);color:#aaaab8; }
.catalog-heading { margin-top:38px; }
.catalog-heading h2 { font-size:1.25rem;font-weight:500;letter-spacing:-.035em;color:#e6e6ec; }
.catalog-heading>p,.catalog-intro { color:#9999a9; }
.case-filters { gap:6px;flex-wrap:wrap; }
.case-filter { border:1px solid var(--button-border);border-radius:8px;min-height:42px;padding:8px 18px;background:transparent;color:#a6a6b5; }
.case-filter:hover { background:#ffffff05;border-color:var(--gold);color:#e2e2e8; }
.case-filter.on { background:#cbb58a12;border-color:var(--gold);color:var(--gold); }
.case-grid { gap:20px; }
.case-card { position:relative;overflow:hidden;padding:0 22px 20px;min-height:370px;background:#191a21;border:1px solid #ffffff0c;border-radius:14px;box-shadow:none;transition:background .18s,border-color .18s; }
.case-card:hover { border-color:#cbb58a50;background:#1e1f28;box-shadow:none; }
.case-card-art { position:relative;display:block;align-self:stretch;margin:0 -22px 20px;aspect-ratio:16/9;overflow:hidden;background:#14151c; }
.case-card-art img { display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.9); }
.case-card-art::after { content:'';position:absolute;inset:0;background:linear-gradient(0deg,#191a2166,transparent 70%);pointer-events:none; }
.case-card-top { font-size:.59rem;color:#9898a8;letter-spacing:.09em; }
.case-card-top>span:last-child { border:0;border-radius:4px;padding:3px 7px;background:#ffffff06;color:#b5b5c0; }
.case-card h3 { font:500 1.12rem/1.5 'Be Vietnam Pro',sans-serif;letter-spacing:-.03em;color:#ececf0;margin:14px 0 12px; }
.case-card p { color:#aaaab8;font-size:.76rem;line-height:1.85; }
.case-progress { display:flex;align-items:center;gap:7px;font-size:.64rem;color:#a3a3b2;margin:0 0 14px; }
.case-progress::before { content:'';width:5px;height:5px;border-radius:50%;background:#787889;flex-shrink:0; }
.case-progress[data-state='playing'] { color:#ddc697; }
.case-progress[data-state='playing']::before { background:#ddc697; }
.case-progress[data-state='solved'] { color:#a7c6b8; }
.case-progress[data-state='solved']::before { background:#a7c6b8; }
.case-mechanics { color:#9595a5; }
.case-card-bottom { border-color:var(--line);color:var(--gold);font-size:.68rem; }
.case-card-bottom>span { display:grid;place-items:center;width:25px;height:25px;border:0;border-radius:50%;background:#cbb58a0b; }
.reading-ui #mb .case-card { padding:0 18px 18px; }
.reading-ui #mb .case-card-art { margin:0 -18px 16px; }
.reading-ui #bar { padding:0 0 20px;margin-bottom:28px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none; }
.reading-ui #logo { color:#e1dcd0; }
.reading-ui .toolbar-actions .tool-button { border:1px solid var(--button-border);border-radius:8px;background:#191a21;color:#bbbcc8; }
.reading-ui .toolbar-actions .tool-button:hover { border-color:var(--gold);background:#24252f;color:#ededf0; }
.reading-ui .toolbar-more>summary { background:#191a21;border:1px solid var(--button-border);border-radius:8px;color:#bbbcc8; }
.reading-ui .toolbar-more>summary:hover { border-color:var(--gold); }
.reading-ui .toolbar-popover { background:#1b1c24;border-color:#ffffff1c;box-shadow:0 12px 40px #0005; }
.reading-ui #scene { border:1px solid #ffffff12;border-radius:12px;box-shadow:none!important; }
#case-context { color:#9999a9; }
.case-section>summary { color:#b9b9c7; }
.case-section { border-color:var(--line); }
#reader-heading { border-color:var(--line);color:#a3a3b2; }
#reader-mode { color:#9993ad; }
#current-objective { padding:12px 16px;background:#17181ee6;border:0;border-left:2px solid #cbb58a70;border-radius:0 6px 6px 0;box-shadow:none; }
#current-objective .sidebar-kicker { color:#b1a17f;font-size:.59rem;letter-spacing:.09em; }
#current-objective p { color:#b4b4c2;font-weight:400;font-size:.78rem; }
.reading-ui #card { background:#191a21;border:1px solid #ffffff0b;border-radius:14px;box-shadow:none;padding:30px 32px; }
.reading-ui #ch { color:#b6a581;font-size:.62rem;letter-spacing:.085em; }
.reading-ui #tt { font-family:'Be Vietnam Pro',sans-serif;font-weight:500;color:#efeff2;font-size:clamp(1.4rem,2.1vw,1.85rem);letter-spacing:-.035em;line-height:1.5; }
.reading-ui #tt:focus { outline:none; }
.reading-ui #tx { color:#c9c9d4;line-height:1.95; }
.reading-ui #tx b { color:#e3dac5; }
#bd blockquote,#bd>i { background:#ffffff03;border-left-color:#756b8e; }
.speaker { color:#b3a6c7; }
.reading-ui .pre { background:#cbb58a08;border-color:#cbb58a25;color:#d2c6ad;border-radius:8px; }
#choice-heading { color:#b9b9c6;font-size:.75rem; }
#choice-heading small,#reading-help { color:#9999a9; }
.reading-ui #op { gap:8px; }
.reading-ui .ch { background:#191a21;border:1px solid var(--button-border);border-radius:10px;padding:14px 16px;color:#d0d0db; }
.reading-ui .ch:hover { background:#22232c;border-color:#cbb58a70; }
.reading-ui .ch .n { color:#b5a581;border:0;background:#cbb58a0a;border-radius:5px; }
.reading-ui .ch.ev { background:#1d2125!important;border-color:#657d71!important; }
.reading-ui .box { background:#17181f;border-radius:16px;border-color:#ffffff1a;box-shadow:0 30px 90px #0007; }
.reading-ui .mh { background:#17181f;border-color:var(--line); }
.reading-ui .mh h2 { font-family:'Be Vietnam Pro',sans-serif;font-weight:500;font-size:1.1rem;letter-spacing:-.025em; }
.reading-ui :is(button,summary):focus-visible { outline:2px solid var(--gold);outline-offset:4px; }
.reading-ui #toast { background:#25232c;color:#e1d6be;border:1px solid #cbb58a40;box-shadow:0 8px 30px #0004;border-radius:10px; }
@media(max-width:1050px) { .case-home-header { gap:30px; }.case-grid { gap:16px; } }
@media(max-width:760px) {
  body.reading-ui::before { background-position:center,70% center!important; }
  .reading-ui #menu::after { background-position:center,70% center; }
  .reading-ui #menu { padding:25px 20px; }
  .case-home-header { padding:8px 0 30px;gap:22px; }
  .reading-ui #mc .case-home h1 { font-size:clamp(2.35rem,9.5vw,3.2rem); }
  .case-home .menu-description { font-size:.8rem; }
  .home-profile { padding:20px; }
  .hero-facts { gap:23px;margin-top:22px; }.hero-facts b { font-size:1.05rem; }
  .catalog-heading h2 { font-size:1.1rem; }
  .case-grid { gap:16px; }
  .case-card { min-height:0;padding:0 20px 20px; }
  .case-card-art { margin:0 -20px 16px;aspect-ratio:16/9; }
  .case-card h3 { font-size:1.12rem; }
  .reading-ui #bar { padding:0 0 16px;gap:10px;margin-bottom:20px; }
  .reading-ui #hud { flex:1 1 160px;justify-content:flex-end;gap:4px 8px;font-size:.65rem; }
  .reading-ui .toolbar-actions { gap:6px;grid-template-columns:repeat(5,minmax(0,1fr)); }
  .reading-ui .toolbar-actions>.tool-button,.reading-ui .toolbar-actions>#pz,.reading-ui .toolbar-more { grid-column:span 1; }
  .reading-ui .toolbar-actions>.tool-button { position:relative;flex-direction:column;padding:6px 3px;gap:3px;min-height:56px; }
  .reading-ui .tool-label { font-size:.58rem;line-height:1.4; }
  .reading-ui .toolbar-more>summary { font-size:.59rem;min-height:56px;gap:3px;padding:6px 3px; }
  .reading-ui .hint-count { position:absolute;top:3px;right:4px;font-size:.57rem;min-width:14px;height:16px; }
  .reading-ui #scene:not(.scene-compact) { height:clamp(140px,20svh,180px); }
  .reading-ui #card { padding:23px 20px;border-radius:12px; }.reading-ui #tt { font-size:1.35rem; }
  .reading-ui #scene { box-shadow:0 8px 20px #0004!important; }
  #current-objective { padding:11px 13px; }
}
@media(max-width:420px) { .hero-facts { gap:18px; }.reading-ui #card { padding:21px 18px; }#choice-heading small { font-size:.62rem; } }