:root { color-scheme:dark; interpolate-size:allow-keywords; --bg:#272a31; --panel:#2b2e35; --line:rgba(255,255,255,.14); --text:#f7f8fb; --muted:#c3c7d0; --orange:#ffad0b; --coral:#ff5d2d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { max-width:100%; margin:0; overflow-x:hidden; color:var(--text); background:var(--bg); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color:inherit; text-decoration:none; }
.site-shell { width:min(1380px,calc(100% - 28px)); margin:auto; }
.banner { position:relative; height:295px; overflow:hidden; border-radius:0 0 14px 14px; background:#111; }
.banner-home { display:block; width:100%; height:100%; color:inherit; text-decoration:none; }
.banner img { width:100%; height:100%; display:block; object-fit:cover; }
.banner::after { display:none; }
.banner-copy { display:none; }
.banner-copy span { color:#ff8bb4; font-size:.8rem; font-weight:850; letter-spacing:.16em; }
.banner-copy h1 { margin:5px 0; font-size:clamp(2.3rem,5vw,4.5rem); }
.section-heading { min-height:62px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); background:var(--panel); font-size:.9rem; }
.section-heading a { color:#c8cbd4; }
.help-content { padding:30px 28px 70px; }
.help-hero { position:relative; width:min(880px,100%); aspect-ratio:16/9; margin:0 auto; overflow:hidden; border:1px solid rgba(255,255,255,.18); border-radius:12px; box-shadow:0 22px 50px rgba(0,0,0,.27); }
.help-hero img { width:100%; height:100%; display:block; object-fit:cover; }
.help-hero-shade { position:absolute; inset:40% 0 0; background:linear-gradient(transparent,rgba(4,10,20,.88)); }
.help-hero h1 { position:absolute; z-index:1; left:50%; bottom:7%; width:95%; margin:0; transform:translateX(-50%); color:#ff2d25; font-size:clamp(2.25rem,6.5vw,5rem); font-weight:1000; line-height:.92; letter-spacing:.015em; text-align:center; -webkit-text-stroke:clamp(2px,.28vw,5px) #fff; text-shadow:0 6px 0 #080a0f,0 10px 24px rgba(0,0,0,.75); }
.intro-notes { max-width:1180px; margin:24px auto 0; text-align:center; font-size:clamp(.92rem,1.6vw,1.04rem); line-height:1.55; }
.intro-notes p { margin:16px 0; }
.intro-notes .warning { color:var(--orange); font-weight:850; text-decoration:underline; text-underline-offset:3px; }
.password-card { max-width:1180px; margin:32px auto 26px; padding:25px 20px; display:flex; flex-direction:column; align-items:center; gap:10px; border-block:2px solid rgba(255,255,255,.65); text-align:center; }
.password-card p { margin:0; font-size:clamp(1.25rem,3vw,2rem); }
.password-card code { color:var(--coral); font:900 clamp(1.65rem,4vw,2.4rem)/1.2 Inter,ui-sans-serif,system-ui,sans-serif; }
.password-card small { color:var(--muted); }
.faq-list { max-width:1180px; margin:0 auto; }
.faq-list>h2 { margin:34px 0 20px; color:#fff; font-size:1.35rem; letter-spacing:.03em; }
.faq-item { margin:0 0 24px; }
.faq-item h3 { margin:0 0 12px; color:var(--orange); font-size:clamp(1rem,2vw,1.18rem); line-height:1.4; }
.faq-item details { overflow:hidden; border:1px solid rgba(255,255,255,.18); border-radius:8px; background:#171920; }
.faq-item details::details-content { block-size:0; overflow:clip; opacity:0; transition:block-size 1.1s cubic-bezier(.22,.8,.3,1),content-visibility 1.1s allow-discrete,opacity .72s ease; }
.faq-item details[open]::details-content { block-size:auto; opacity:1; }
.faq-item summary { min-height:42px; padding:10px 14px; display:flex; align-items:center; gap:9px; color:#222731; background:#f2f2f3; font-weight:850; cursor:pointer; list-style:none; transition:background-color .24s ease,color .24s ease; }
.faq-item summary:hover { color:#10141d; background:#fff; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary span { font-size:1.15rem; transition:transform .18s ease; }
.faq-item details.is-expanded summary span { transform:none; font-size:0; }
.faq-item details.is-expanded summary span::after { content:"−"; font-size:1.15rem; }
.faq-answer { display:grid; grid-template-rows:0fr; overflow:hidden; opacity:0; color:#141820; background:#fff; font-size:1rem; line-height:1.6; transition:grid-template-rows 1.1s cubic-bezier(.22,.8,.3,1),opacity .72s ease; }
.faq-answer-inner { min-height:0; padding:0 18px; overflow:hidden; border-top:0 solid #d0d0d0; transition:padding 1.1s cubic-bezier(.22,.8,.3,1),border-width .3s ease; }
.faq-item details.is-expanded>.faq-answer { grid-template-rows:1fr; opacity:1; }
.faq-item details.is-expanded>.faq-answer>.faq-answer-inner { padding:15px 18px 24px; border-top-width:1px; }
.faq-answer p { margin:0 0 8px; }
.faq-answer p:last-child { margin-bottom:0; }
.faq-answer a { color:#428cff; text-decoration:underline; text-underline-offset:2px; overflow-wrap:anywhere; }
.game-errors-guide { display:grid; gap:16px; }
.game-errors-guide .encoding-warning { margin:0; color:#d51f35; font-weight:900; }
.encoding-guide-image { width:min(674px,100%); height:auto; margin:0 auto; display:block; border:1px solid #b7bbc4; border-radius:6px; box-shadow:0 12px 30px rgba(0,0,0,.18); }
.component-notes,.component-steps { margin:0; padding-left:24px; }
.component-notes li,.component-steps li { margin:6px 0; }
.component-steps { padding-left:0; list-style:none; counter-reset:component-step; }
.component-steps li { position:relative; padding-left:28px; counter-increment:component-step; }
.component-steps li::before { content:counter(component-step) "/"; position:absolute; left:0; font-weight:850; }
.pack-note { margin:2px 0 0!important; color:#3b4050; font-weight:750; }
.final-warning { margin:0!important; padding:12px 14px; border:1px solid rgba(213,31,53,.26); border-radius:6px; color:#d51f35; background:#fff5f6; font-weight:900; text-align:center; }
.final-warning p { margin:3px 0; }
.locale-emulator-guide { display:grid; gap:22px; }
.locale-step { display:grid; gap:10px; }
.locale-step h4 { margin:0; color:#6f2bc7; font-size:1.08rem; font-weight:950; letter-spacing:.08em; }
.locale-step img { width:min(1300px,100%); height:auto; margin:0 auto; display:block; border:1px solid #b7bbc4; border-radius:7px; box-shadow:0 12px 30px rgba(0,0,0,.18); }
.nwjs-profile-guide { display:grid; gap:15px; }
.nwjs-profile-guide img { width:min(480px,100%); height:auto; margin:0 auto; display:block; border:1px solid #b7bbc4; border-radius:6px; box-shadow:0 12px 30px rgba(0,0,0,.16); }
.nwjs-profile-guide p { margin:0; }
.nwjs-profile-guide code { padding:2px 5px; border-radius:4px; color:#5f258f; background:#f0e8f8; font-weight:750; overflow-wrap:anywhere; }
.android-help-guide { display:grid; gap:14px; }
.android-help-guide p { margin:0; }
.android-help-guide img { width:min(1000px,100%); height:auto; margin:4px auto 0; display:block; border:1px solid #b7bbc4; border-radius:7px; box-shadow:0 12px 30px rgba(0,0,0,.18); }
.multipart-archive-help { display:grid; gap:16px; }
.multipart-archive-help > p,
.multipart-archive-steps p { margin:0; }
.multipart-archive-help .multipart-archive-intro { padding:16px 18px; border:2px solid #ff9f1a; border-radius:8px; background:rgba(255,159,26,.09); color:#ff9f1a; font-size:clamp(18px,2vw,24px); font-weight:800; line-height:1.4; }
.multipart-archive-help img { width:min(900px,100%); height:auto; margin:0 auto; display:block; border:1px solid #b7bbc4; border-radius:7px; box-shadow:0 12px 30px rgba(0,0,0,.18); }
.multipart-archive-steps { display:grid; gap:7px; }
.mega-download-help { display:grid; gap:9px; }
.mega-download-help p { margin:0; }
.blocked-access-help { display:grid; gap:16px; }
.blocked-access-help img { width:min(1000px,100%); height:auto; margin:0 auto; display:block; border:1px solid #b7bbc4; border-radius:7px; box-shadow:0 12px 30px rgba(0,0,0,.18); }
.blocked-access-copy { display:grid; gap:10px; }
.blocked-access-copy p { margin:0; }
.footer { min-height:92px; padding:18px max(20px,calc((100% - 1330px)/2)); display:flex; align-items:center; justify-content:space-between; gap:20px; color:#aeb3c0; background:#30333a; }
.footer>a { width:44px; height:34px; display:grid; place-items:center; border-radius:6px; color:#555b67; background:#fff; }
@media(max-width:650px) {
  .site-shell { width:100%; }
  .banner { height:210px; border-radius:0; }
  .section-heading { min-height:58px; padding:10px 16px; font-size:.78rem; }
  .section-heading a { display:none; }
  .help-content { padding:20px 12px 50px; }
  .help-hero { border-radius:8px; }
  .help-hero h1 { bottom:8%; white-space:nowrap; font-size:clamp(1.85rem,9.5vw,2.35rem); -webkit-text-stroke:2px #fff; text-shadow:0 4px 0 #080a0f,0 8px 18px rgba(0,0,0,.75); }
  .intro-notes { max-width:100%; overflow-wrap:anywhere; font-size:.88rem; }
  .password-card { margin-top:25px; }
  .faq-item { margin-bottom:20px; }
  .footer { flex-direction:column; text-align:center; }
}

/* EmiruPlay banner: keep the complete artwork visible at every viewport size. */
.banner { background:#0c0d13; }
.banner img { object-fit:cover; transform:none; }

@media (max-width:720px) {
  .banner { height:auto !important; min-height:0 !important; aspect-ratio:1380 / 295; border-radius:0; }
  .banner img { width:100%; height:100% !important; min-height:0 !important; object-fit:contain; transform:none; }
}
