:root { color-scheme: dark; --bg:#272a31; --panel:#20232b; --line:rgba(255,255,255,.14); --text:#f6f7fb; --muted:#b9beca; --pink:#ff4d8d; --purple:#9b5cff; --orange:#ff7417; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; 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; }
.topbar { position:sticky; top:0; z-index:30; border-bottom:1px solid var(--line); background:rgba(25,27,33,.94); backdrop-filter:blur(14px); }
.topnav { width:min(1380px,calc(100% - 28px)); min-height:54px; margin:auto; display:flex; align-items:center; gap:24px; overflow-x:auto; }
.topnav a { color:#c7cad2; font-size:.88rem; white-space:nowrap; }
.topnav a:hover { color:#fff; }
.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; margin-right:334px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.72); background:#2b2e35; font-size:.9rem; }
.section-heading a { color:#c8cbd4; }
.detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:34px; padding:38px 28px 0; }
.post-detail { min-width:0; }
.post-detail>h1 { margin:0 0 14px; font-size:clamp(2rem,4vw,3.15rem); line-height:1.15; letter-spacing:-.035em; }
.post-date { margin-bottom:24px; color:#daddE5; font-size:.75rem; font-weight:800; }
.main-gallery-image { display:grid; justify-items:center; }
.main-gallery-image img { display:block; width:auto; max-width:86%; max-height:none; border-radius:12px; background:#11131a; }
.developers { margin:18px 0 10px; display:flex; flex-wrap:wrap; align-items:center; gap:8px; color:#dfe2eb; }
.developers strong { margin-right:2px; color:#fff; }
.developers a { padding:7px 10px; border:1px solid rgba(192,132,252,.42); border-radius:999px; color:#e9d5ff; background:rgba(168,85,247,.12); font-size:.84rem; font-weight:800; transition:color .22s ease,border-color .22s ease,background .22s ease,transform .22s ease; }
.developers a:hover,.developers a:focus-visible { color:#fff; border-color:#ff72a7; background:linear-gradient(135deg,rgba(255,77,141,.72),rgba(155,92,255,.78)); transform:translateY(-1px); }
.dlsite-link { margin:18px 0 10px; padding:12px 15px; border-left:4px solid #a855f7; border-radius:6px; color:#dfe2eb; background:rgba(168,85,247,.1); line-height:1.5; }
.dlsite-link strong { color:#fff; }
.dlsite-link a { color:#70c5ff; font-weight:800; text-decoration:underline; text-underline-offset:3px; transition:color .2s ease,text-shadow .2s ease; }
.dlsite-link a:hover { color:#c084fc; text-shadow:0 0 12px rgba(192,132,252,.35); }
.screenshots-panel { margin:22px 0; overflow:hidden; border:1px solid #c9cbd0; border-radius:8px; background:#fff; }
.screenshots-panel summary { min-height:32px; padding:7px 10px; display:flex; align-items:center; gap:8px; border:0; border-radius:0; color:#252831; background:#f2f2f3; box-shadow:inset 0 1px 0 #fff; font-size:.8rem; font-weight:850; text-transform:uppercase; cursor:pointer; list-style:none; }
.screenshots-panel[open] summary { border-bottom:1px solid #d8d9dc; }
.screenshots-panel summary::-webkit-details-marker { display:none; }
.screenshots-panel summary span { font-size:1.1rem; }
.screenshots-panel[open] summary span { font-size:0; }
.screenshots-panel[open] summary span::after { content:"−"; font-size:1.1rem; }
.screenshots-panel summary small { margin-left:auto; color:#666c77; font-size:.72rem; font-weight:750; }
.screenshots-panel[open] > .screenshots-gallery { width:100%; margin:0; padding:12px; display:grid; gap:12px; justify-items:center; border-radius:0; background:#fff; box-shadow:none; }
.screenshots-panel[open] > .screenshots-gallery > img { display:block; width:auto !important; max-width:100% !important; height:auto !important; max-height:none; object-fit:contain; border-radius:10px; background:#fff; }
.description { margin:22px 0 12px; color:#d9dce5; font-size:1.03rem; line-height:1.65; }
.description p { margin:0 0 12px; }
.description ul,.description ol { padding-left:24px; }
.published-notice { margin:0 0 20px; padding:12px 15px; border:1px solid rgba(36,201,135,.35); border-radius:8px; color:#7aefbc; background:rgba(36,201,135,.12); font-weight:800; }
.version { text-align:center; font-size:1.05rem; }
.changelog { margin:22px 0; border-radius:8px; color:#252831; background:#f2f2f3; }
.changelog summary { padding:11px 14px; cursor:pointer; font-weight:800; }
.changelog>div { padding:0 14px 14px; line-height:1.55; }
.changelog p { margin:8px 0; }
.changelog ul,.changelog ol { padding-left:22px; }
.download-panel { position:relative; margin:42px 0 18px; padding:28px 18px 18px; border:3px solid #9a63ff; border-radius:24px; background:linear-gradient(145deg,rgba(25,27,35,.96),rgba(38,31,51,.96)); box-shadow:0 16px 40px rgba(0,0,0,.22),inset 0 0 30px rgba(155,92,255,.06); }
.download-panel>h2 { position:absolute; top:0; left:50%; min-width:150px; margin:0; padding:11px 25px; transform:translate(-50%,-50%); border-radius:999px; color:#fff; background:linear-gradient(135deg,var(--pink),var(--purple)); box-shadow:0 9px 24px rgba(155,92,255,.3); text-align:center; font-size:.82rem; letter-spacing:.13em; }
.download-size { width:max-content; max-width:100%; margin:4px auto 16px; padding:9px 18px; border:1px solid rgba(203,181,255,.3); border-radius:10px; color:#f4edff; background:rgba(155,92,255,.13); font-size:.92rem; letter-spacing:.02em; }
.download-size strong { color:#ff84ad; }
.download-servers { display:grid; gap:12px; }
.download-server { padding:15px; display:grid; grid-template-columns:110px minmax(0,1fr); align-items:center; gap:14px; border:1px solid rgba(178,146,255,.32); border-radius:14px; background:rgba(15,17,24,.52); }
.download-server h3 { margin:0; color:#f2f0f8; font-size:.86rem; white-space:nowrap; }
.download-server h3 span { margin-right:7px; color:#aa72ff; }
.server-download-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.server-download-links a { min-height:46px; padding:10px 12px; display:flex; align-items:center; justify-content:center; gap:7px; border:1px solid rgba(218,210,236,.36); border-radius:9px; color:#e8e5ef; background:#242731; box-shadow:0 5px 12px rgba(0,0,0,.18); font-size:.82rem; font-weight:800; text-align:center; transition:color .24s ease,border-color .24s ease,background .24s ease,transform .24s ease,box-shadow .24s ease; }
.server-download-links a span { font-size:1.1rem; }
.server-download-links a:hover,.server-download-links a:focus-visible { color:#fff; border-color:#ca8aff; background:linear-gradient(135deg,rgba(255,77,141,.82),rgba(155,92,255,.88)); box-shadow:0 9px 20px rgba(119,70,196,.28); transform:translateY(-2px); }
.download-empty { padding:18px; border:1px dashed rgba(255,255,255,.24); border-radius:12px; color:var(--muted); text-align:center; }
.download-password { margin-top:14px; padding:15px; display:flex; align-items:center; justify-content:center; gap:13px; border:1px solid rgba(255,255,255,.12); border-radius:12px; background:rgba(12,14,20,.38); }
.download-password strong { color:#ff729f; }
.download-password code { padding:9px 13px; border:1px solid rgba(203,181,255,.24); border-radius:8px; color:#f0dfff; background:rgba(155,92,255,.12); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.9rem; font-weight:850; letter-spacing:.02em; }
.post-notes { margin:8px 0 36px; color:#ff7b1b; text-align:center; font-weight:750; }
.post-notes p { margin:9px 0; }
.post-notes a,.post-note-link { color:#63aaff; font:inherit; font-weight:850; text-decoration:underline; text-underline-offset:3px; transition:color .2s ease,text-shadow .2s ease; }
.post-note-link { padding:0; border:0; background:transparent; cursor:pointer; }
.post-notes a:hover,.post-notes a:focus-visible,.post-note-link:hover,.post-note-link:focus-visible { color:#a879ff; text-shadow:0 0 12px rgba(168,121,255,.38); }
.tags { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:20px 0 28px; border-bottom:1px solid var(--line); }
.tags strong { color:var(--orange); font-size:1.5rem; }
.tags span,.tags a { padding:8px 10px; color:#111; background:#fff; font-weight:850; text-transform:uppercase; }
.tags a:hover { color:#fff; background:linear-gradient(135deg,var(--pink),var(--purple)); }
.tags a.developer-tag { color:#fff; background:linear-gradient(135deg,#7c3aed,#a855f7); }
.tags a.developer-tag:hover,.tags a.developer-tag:focus-visible { color:#fff; background:linear-gradient(135deg,var(--pink),var(--purple)); box-shadow:0 0 0 2px rgba(192,132,252,.28); }
.tags em { color:var(--muted); }
.recommendations { padding-top:24px; }
.recommendations h2 { font-size:1rem; }
.recommendation-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.recommendation-cover { display:block; width:100%; border-radius:9px; overflow:hidden; background:transparent; }
.recommendation-cover img { width:100%; height:auto; display:block; }
.recommendation-grid h3 { margin:9px 0; text-align:left; font-size:.95rem; line-height:1.35; }
.sidebar { min-width:0; }
.side-card { padding:18px 0; border-bottom:1px solid var(--line); }
.side-card h2 { font-size:.95rem; }
.side-card p { color:#daddE5; line-height:1.5; }
.side-categories { display:flex; flex-wrap:wrap; gap:8px 14px; }
.side-categories a { padding:6px 8px; border:1px solid var(--line); border-radius:6px; color:#daddE5; background:rgba(20,22,28,.22); font-size:.72rem; white-space:nowrap; }
.side-categories a:hover { border-color:rgba(255,255,255,.3); color:#fff; background:rgba(255,255,255,.06); }
.side-tags { display:flex; flex-wrap:wrap; gap:7px; }
.side-tags span,.side-tags a { padding:6px 8px; border:1px solid var(--line); border-radius:6px; color:#daddE5; background:rgba(20,22,28,.22); font-size:.72rem; }
.side-tags a:hover { border-color:rgba(255,255,255,.3); color:#fff; background:rgba(255,255,255,.06); }
.side-card input { width:100%; padding:11px; border:1px solid #50545f; border-radius:7px; color:#222; background:#fff; }
.dmca-sidebar { padding:24px 0; border-bottom:1px solid var(--line); }
.dmca-sidebar .dmca-badge { display:inline-block; margin-bottom:18px; }
.dmca-sidebar .dmca-badge img { display:block; width:200px; max-width:100%; height:auto; }
.dmca-sidebar p { margin:7px 0; color:#ffb000; font-size:.84rem; font-weight:800; line-height:1.5; }
.dmca-sidebar p span { color:#f5f6f8; }
.dmca-sidebar p a { color:#fff; text-decoration:underline; text-underline-offset:2px; transition:color .2s ease; }
.dmca-sidebar p a:hover,.dmca-sidebar p a:focus-visible { color:#75c9ff; }
.not-found { min-height:420px; display:grid; place-content:center; text-align:center; }
.not-found a { color:#8ccfff; }
.footer { min-height:92px; margin-top:60px; 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:900px) { .section-heading { margin-right:0; } .detail-layout { grid-template-columns:1fr; } .sidebar { border-top:1px solid var(--line); } }
@media (max-width:720px) { .download-server { grid-template-columns:1fr; } .server-download-links { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .site-shell,.topnav { width:100%; } .topnav { padding:0 14px; } .banner { height:210px; border-radius:0; } .section-heading { padding:0 16px; } .detail-layout { padding:26px 14px 0; } .main-gallery-image img { max-width:100%; } .screenshots-panel[open] > .screenshots-gallery { width:100%; margin:0; padding:10px; } .screenshots-panel[open] > .screenshots-gallery > img { width:auto !important; max-width:100% !important; } .download-panel { margin-inline:-4px; padding-inline:11px; border-radius:18px; } .server-download-links { grid-template-columns:1fr; } .recommendation-grid { grid-template-columns:1fr; } .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-home { height:100%; }
  .banner img { width:100%; height:100% !important; min-height:0 !important; object-fit:contain; transform:none; }
}