/* Shared studio navigation, shelf, passport, and reading tools. */
@import url('brand-theme.css');
.progress-report { position:relative; margin:10px 0 14px; text-align:left; font:14px/1.5 Inter,system-ui,sans-serif; color:#edf4ef; letter-spacing:normal; text-transform:none; }
.hero > .progress-report { width:fit-content; max-width:100%; margin:12px auto; }
.progress-trigger { display:flex; align-items:center; gap:7px; width:fit-content; min-height:36px; box-sizing:border-box; padding:5px 10px; border:1px solid #43544a; border-radius:20px; background:#152019; color:var(--report-accent,#a6e8ae); font:12px/1.5 Inter,system-ui,sans-serif; cursor:pointer; }
.progress-trigger:hover { border-color:var(--report-accent,#a6e8ae); }
.progress-symbol { font-size:20px; line-height:1; }
.progress-dialog { width:min(390px,calc(100vw - 32px)); box-sizing:border-box; padding:0; border:1px solid #536259; border-radius:12px; background:#101b15; color:#edf4ef; box-shadow:0 20px 60px #000b; }
.progress-dialog::backdrop { background:#020503bb; backdrop-filter:blur(3px); }
.progress-dialog .progress-panel { box-sizing:border-box; padding:24px; }
.progress-close { position:absolute; right:10px; top:8px; width:34px; height:34px; border:1px solid #43544a; border-radius:50%; background:#18221d; color:#edf4ef; font:24px/1 Inter,system-ui,sans-serif; cursor:pointer; }
.progress-close:hover { border-color:#ff686e; color:#ff686e; }
.progress-report .progress-panel h3,.project-shelf .shelf-card-body .progress-panel h3 { margin:0 0 4px; font:600 16px/1.4 Inter,system-ui,sans-serif; color:#edf4ef; }
.progress-report .progress-status { margin:0 0 12px; font-size:11px; color:var(--report-accent,#a6e8ae); }
.progress-number { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12px; }
.progress-number strong { color:var(--report-accent,#a6e8ae); font-size:22px; font-variant-numeric:tabular-nums; }
.progress-report meter { display:block; width:100%; height:12px; margin:6px 0; accent-color:var(--report-accent,#a6e8ae); }
.progress-report meter::-webkit-meter-bar { background:#28382f; border:0; border-radius:8px; }
.progress-report meter::-webkit-meter-optimum-value { background:var(--report-accent,#a6e8ae); border-radius:8px; }
.progress-report meter::-moz-meter-bar { background:var(--report-accent,#a6e8ae); }
.progress-report dl { margin:10px 0; }
.progress-report dl > div { padding:8px 0; border-top:1px solid #304136; }
.progress-report dt { color:#a7baae; font-size:11px; }
.progress-report dd { margin:2px 0 0; color:#edf4ef; font-size:13px; }
.progress-report .progress-caption { margin:6px 0 0; color:#a7baae; font:11px/1.5 Inter,system-ui,sans-serif; }
@media (prefers-reduced-motion:no-preference) { html:not(.b3d-still) .progress-dialog[open] .progress-panel { animation:report-reveal .16s ease-out; } }
@keyframes report-reveal { from { opacity:0; transform:translateY(-3px); } to { opacity:1; transform:translateY(0); } }
[hidden] { display:none !important; }
.tm-mark { display:inline-block; margin-left:.12em; font-family:Inter,Arial,sans-serif; font-size:.32em; font-weight:600; line-height:1; vertical-align:super; }
:root { color-scheme:dark; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.studio-page { --accent:#ff686e; --bg:#0b0b0b; --border:#303832; margin:0; background:var(--bg); color:#ededed; font:16px/1.65 Inter,system-ui,sans-serif; }
.studio-page h1,.studio-page h2,.studio-page h3 { font-family:'VT323',monospace; line-height:1.1; }
.studio-page h1 { font-size:clamp(2.8rem,7vw,5rem); margin:12px 0 24px; }
.studio-page h2 { font-size:2rem; }
.studio-page a { color:var(--accent); }
.studio-wrap { max-width:1100px; margin:auto; padding:64px 24px; }
.studio-wrap > section { margin-top:56px; }
.studio-lead { max-width:700px; color:#c0c8c3; font-size:1.15rem; }
.eyebrow { color:var(--accent,#ff686e); letter-spacing:.16em; font: .8rem/1.5 monospace; text-transform:uppercase; }
.studio-nav { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; padding:20px max(24px,calc((100% - 1200px)/2)); border-bottom:1px solid #303832; background:#101310; }
.studio-nav .brand { color:#ff686e; font:1.8rem 'VT323',monospace; text-decoration:none; }
.studio-links { display:flex; align-items:center; flex-wrap:wrap; gap:6px 20px; }
.studio-links a { text-decoration:none; color:#e9efec; font-size:.93rem; min-height:44px; display:inline-flex; align-items:center; }
.studio-links a:hover,.studio-links a[aria-current='page'] { color:#ff686e; }
.studio-links .studio-x-cta { min-height:34px; gap:6px; padding:3px 9px 3px 4px; border:1px solid #536259; border-radius:999px; background:#18221d; color:#f2f7f4; font-size:.84rem; font-weight:600; white-space:nowrap; }
.studio-links .studio-x-cta:hover { border-color:#ff686e; background:#1c2b23; color:#ff686e; }
.studio-x-cta img { width:24px; height:24px; border-radius:50%; object-fit:cover; }
.studio-footer { text-align:center; padding:40px 24px 64px; border-top:1px solid #303832; }
.footer-kicker { margin:0 0 10px; color:var(--accent); font:600 .78rem/1.2 'VT323',monospace; letter-spacing:.16em; }
.studio-utility { display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:center; margin:24px auto; }
.studio-utility a { color:inherit; min-height:44px; display:inline-flex; align-items:center; }
.studio-utility a:hover { color:var(--accent,#ff686e); }
.studio-utility [data-passport-count],.passport-banner [data-passport-count] { margin-left:8px; font-size:.85em; opacity:.75; }
.skip-link { position:fixed; top:8px; left:8px; z-index:2147483000; padding:12px 20px; background:#ff686e; color:#07110d; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
:is(a,button,input,summary,select):focus-visible { outline:3px solid var(--accent,#ff686e); outline-offset:4px; }
.studio-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border:1px solid #536259; border-radius:6px; background:#131b17; color:#edf6f0; font:inherit; text-decoration:none; cursor:pointer; box-sizing:border-box; }
.studio-button:hover { border-color:var(--accent,#ff686e); color:var(--accent,#ff686e); }
.studio-button.primary { color:#07150d; background:#ff686e; border-color:#ff686e; }
.studio-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:24px 0; }
.studio-card { padding:26px; border:1px solid #354039; border-radius:10px; background:#111813; }
.studio-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:20px; }
.studio-grid img { width:100%; border-radius:6px; }
.studio-small { font-size:.9rem; color:#a9b8af; }
/* Let transparent game artwork sit directly on the page. */
.hero .hero-logo-wrap,
.hero .hero-visual,
.hero .hero-image,
.hero .hero-logo,
.hero .hero-image img {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.hero .hero-logo { filter: none; }
.shelf-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; flex-wrap:wrap; }
.shelf-heading h2 { border:0; margin-bottom:4px; }
.shelf-intro { max-width:760px; color:#acb8b0; line-height:1.7; }
.shelf-controls { margin:24px 0; }
.shelf-filters { display:flex; flex-wrap:wrap; gap:10px; }
.shelf-filters button[aria-pressed='true'] { background:#ff686e; border-color:#ff686e; color:#07150d; }
.project-shelf { grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); align-items:stretch; }
.project-shelf .project-card { padding:0 0 30px; display:flex; flex-direction:column; background:#121714; }
.shelf-cover { display:block; width:100%; height:auto; aspect-ratio:3/4; object-fit:cover; object-position:center; flex-shrink:0; background:#18201b; border-bottom:1px solid #354039; }
.shelf-card-body { display:flex; flex-direction:column; flex:1; padding:22px 24px 0; }
.project-shelf .shelf-card-body h3 { font-size:2rem; margin:10px 0; color:var(--project-accent,#ff686e); }
.shelf-hook { font-size:1rem; font-weight:600; color:#edf5ef; margin:0 0 12px; }
.shelf-quick-play { width:fit-content; margin:-5px 0 12px; color:var(--project-accent,#ff686e); font:700 .85rem/1.4 monospace; text-underline-offset:4px; }
.shelf-quick-play:hover { color:#fff; }
.project-shelf .shelf-description { color:#acb8b0; line-height:1.65; font-size:.95rem; margin:0 0 24px; }
.shelf-card-body .btn { margin-top:auto; text-align:center; padding:11px 16px; }
.shelf-teaser-link, .shelf-trailer-link { display:block; width:fit-content; margin:10px auto 0; color:#b7c8bd; font-size:.84rem; text-underline-offset:3px; }
.shelf-teaser-link:hover, .shelf-trailer-link:hover { color:var(--project-accent,#ff686e); }
.shelf-status { font: .72rem/1.5 monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--project-accent,#ff686e); }
.shelf-number { float:right; opacity:.55; }
.shelf-note { padding:18px 0; color:#a9b8af; font-size:.9rem; }
.fresh-notes { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:20px; }
.fresh-notes a { display:block; border:1px solid #354039; border-radius:8px; padding:24px; color:#dce8df; background:#111713; text-decoration:none; }
.fresh-notes a:hover { border-color:#ff686e; }
.fresh-notes h3 { margin:12px 0; font-size:1.8rem; color:#eee; }
.fresh-notes time { font: .8rem monospace; color:#91b29e; }
.fresh-notes p { color:#acb8b0; }
.demo-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); gap:20px; }
.demo-card { display:flex; flex-direction:column; overflow:hidden; border:1px solid #354039; border-radius:10px; background:#111713; }
.demo-card:hover { border-color:var(--demo-accent,#ff686e); transform:translateY(-3px); box-shadow:0 16px 36px rgba(0,0,0,.24); }
.demo-card img { display:block; width:100%; height:120px; object-fit:cover; border-bottom:1px solid #354039; }
.shelf-cover-graffiti { object-fit:contain; background:#0b0b0b; }
.shelf-cover-secret { object-fit:contain; background:#100b10; }
.demo-card-body { display:flex; flex:1; flex-direction:column; padding:16px; }
.demo-card-body .eyebrow { color:var(--demo-accent,#ff686e); font-size:.68rem; }
.demo-card-body h3 { margin:4px 0 8px; color:#f1f5f2; font-size:1.4rem; }
.demo-card-body p:not(.eyebrow) { margin:0 0 16px; color:#acb8b0; font-size:.84rem; line-height:1.55; }
.demo-card-body .btn { display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; flex:0 0 auto; width:auto; min-height:36px; height:auto; box-sizing:border-box; margin-top:auto; padding:8px 14px; font-size:.82rem; line-height:1.25; text-align:center; }
.demo-project-link { align-self:flex-start; margin-top:9px; color:#b7c4bb; font-size:.78rem; text-decoration:none; }
.demo-project-link:hover { color:var(--demo-accent,#ff686e); text-decoration:underline; text-underline-offset:3px; }
.demo-card-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:auto; }
.demo-card-actions .btn { flex:0 1 auto; margin-top:0; }
@media (max-width:520px) { .demo-card img { height:105px; } }
.upcoming-section .section-intro { margin-bottom:26px; }
.passport-banner { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:24px; padding:28px; border:1px solid #516749; background:linear-gradient(115deg,#20281b,#101613); border-radius:8px; }
.passport-banner .passport-mark { font:3rem monospace; color:#d4e597; }
.passport-banner h3 { font-size:2rem; margin:0 0 8px; color:#e7edcf; }
.passport-banner p { margin:0; color:#b7c2a5; }
.passport-top { display:flex; gap:30px; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:28px; border:1px solid #657747; background:linear-gradient(125deg,#27301e,#121914); border-radius:10px; }
.passport-count { font:3.5rem 'VT323',monospace; color:#d5e7a0; }
.passport-top progress { width:min(320px,100%); height:10px; accent-color:#c9df88; }
.passport-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:18px; margin:32px 0; }
.passport-stamp { position:relative; padding:24px; border:1px dashed #475046; border-radius:8px; background:#111612; }
.passport-stamp h2 { font-size:1.7rem; margin:12px 0; }
.passport-stamp p { font-size:.9rem; color:#a9b3ac; }
.passport-stamp .eyebrow { font-size:.68rem; }
.passport-stamp .stamp-icon { display:block; font:2rem monospace; color:#657369; }
.passport-stamp.is-earned { border:1px solid #789453; background:linear-gradient(130deg,#1d291b,#111713); }
.passport-stamp.is-earned .stamp-icon { color:#cce48e; }
.passport-stamp a { display:inline-block; padding:8px 0; }
.passport-tools { padding:24px; border:1px solid #354039; border-radius:8px; }
.passport-tools input[type=file] { max-width:100%; display:block; margin:12px 0; }
.passport-reset-panel { margin:20px 0; padding:20px; border:1px solid #b27676; border-radius:6px; }
.studio-settings label { display:flex; align-items:center; gap:14px; padding:14px 0; cursor:pointer; }
.studio-settings input[type=checkbox] { width:22px; height:22px; accent-color:#ff686e; }
.studio-settings fieldset { border:1px solid #354039; border-radius:8px; padding:16px 24px; }
.studio-settings legend { padding:0 10px; }
.terminal-box { border:1px solid #354039; padding:24px; background:#0b100c; border-radius:8px; }
.terminal-box input,.log-search input { box-sizing:border-box; width:100%; background:#0b100c; color:#e3f8e9; border:1px solid #4a6050; border-radius:5px; padding:14px; font:1rem monospace; }
.terminal-box label { display:block; margin-bottom:12px; }
.studio-disclosure { border:1px solid var(--border,#354039); border-radius:8px; padding:20px; margin:30px 0; background:rgba(20,26,22,.4); }
.studio-disclosure > summary { cursor:pointer; color:var(--accent,#ff686e); font:1.5rem 'VT323',monospace; padding:8px; }
.studio-disclosure[open] > summary { margin-bottom:24px; }
.studio-disclosure .statusboard { margin-bottom:0; }
.studio-timeline { border-left:2px solid #385044; padding-left:24px; display:grid; gap:24px; }
.studio-timeline h3 { margin:0 0 8px; }
.studio-timeline p { margin:0; }
.concept-art { width:100%; max-height:340px; object-fit:cover; border-radius:10px; border:1px solid #354039; margin-bottom:30px; }
.log-search { margin:24px 0; }
.log-search label { display:block; margin-bottom:10px; }
.log-month { border:1px solid #3b4466; border-radius:8px; padding:18px; margin:20px 0; }
.log-month > summary { cursor:pointer; padding:8px; font-size:1.15rem; color:#ffd54a; }
.log-month[open] > summary { margin-bottom:20px; }
.b3d-glitch::before,.b3d-glitch::after { content:none !important; }
.b3d-glitch .glitch-copy { position:absolute; inset:0; pointer-events:none; opacity:0; }
.b3d-glitch.is-glitching .glitch-copy { opacity:.7; color:#ff4057; clip-path:inset(18% 0 52%); transform:translateX(-3px); }
.b3d-glitch.is-glitching .glitch-copy:last-child { color:#00e5ff; clip-path:inset(60% 0 10%); transform:translateX(3px); }
.b3d-still *, .b3d-still *::before, .b3d-still *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
.b3d-still .b3d-particle-canvas,.b3d-no-particles .b3d-particle-canvas,.b3d-still .glitch-copy,.b3d-still .b3d-fireflies,.b3d-still .b3d-chaos-bot { display:none !important; }
.b3d-still .project-card.b3d-cartridge { transform:none !important; }
.b3d-still .b3d-footer-bot { left:22px; }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .b3d-footer-bot { left:22px; }
}
@media(max-width:700px) {
  .studio-nav { justify-content:center; padding:16px; }
  .studio-links { justify-content:center; gap:2px 16px; }
  .studio-wrap { padding:40px 20px; }
  .passport-banner { grid-template-columns:1fr; gap:16px; }
  .passport-banner .passport-mark { display:none; }
  .studio-disclosure { padding:14px; }
}

/* Released studio films and the press thumbnail. */
.brand-film-card { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:28px; align-items:center; padding:24px; border:1px solid #353538; border-radius:12px; background:#141416; }
.brand-film-player { aspect-ratio:16/9; min-width:0; background:#080808; border:1px solid #353538; border-radius:6px; overflow:hidden; }
.brand-film-player iframe { display:block; width:100%; height:100%; border:0; }
.brand-film-copy { min-width:0; }
.brand-film-copy .brand-film-mark { display:block; width:76px; height:auto; margin-bottom:16px; }
.brand-film-copy h3 { font-size:2rem; margin:8px 0 12px; }
.brand-film-copy p { color:#c4c4c9; }
.brand-film-copy .eyebrow { color:var(--accent,#ff686e); }
.brand-film-copy .studio-actions { margin:20px 0 0; }
.brand-film-copy .studio-button { text-align:center; }
.brand-channel-note { margin-top:24px; }
.studio-grid .press-brand-thumbnail { display:block; width:220px; max-width:100%; height:auto; margin:0 auto 20px; border-radius:0; }
#launched, #brand-film { scroll-margin-top:24px; }
@media (max-width:820px) { .brand-film-card { grid-template-columns:1fr; gap:20px; padding:20px; } }
@media (max-width:400px) { .brand-film-card { padding:14px; } }