.web-edition-label { font-size:12px; margin-top:10px; font-weight:600; }
.app-version { display:none!important; }
.web-version { position:fixed; right:max(8px,env(safe-area-inset-right)); bottom:calc(var(--web-banner-height,0px) + max(4px,env(safe-area-inset-bottom))); z-index:70; padding:1px 4px; color:#405566; background:#f8fafcef; font:600 11px/16px Arial,sans-serif; font-variant-numeric:tabular-nums; pointer-events:none; }
html[data-color-mode="dark"] .web-version { color:#d0dce5; background:#20262bef; }
html body .answerDock { padding-bottom:calc(22px + env(safe-area-inset-bottom)); }
.web-footer { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:8px 18px; padding:18px 0; font-size:12px; line-height:1.8; }
.web-footer a,.web-app-link { color:#315f7b; text-underline-offset:3px; }
.web-app-notice { grid-column:1/-1; margin-top:10px; padding-top:16px; border-top:1px solid #cbd6dc; font-size:14px; line-height:1.8; }
.web-app-notice p { margin:5px 0; }
.web-app-notice .web-price { font-size:18px; font-weight:700; }
.web-crown { display:inline-block; width:21px; height:21px; flex:none; color:#a77916; vertical-align:middle; }
.web-locked { position:relative; }
html body :is(#homeScreen,#pastMenuScreen,#yearMenuScreen) .big-btn.web-locked,
html body .web-locked:disabled { background:#e4e9ed; color:#53636f; border-color:#bdcbd4; opacity:1; box-shadow:none; }
html body :is(#homeScreen,#pastMenuScreen,#yearMenuScreen) .big-btn.web-locked small { color:#586a77; }
html body .big-btn.web-locked { padding-right:46px; }
.big-btn.web-locked > .web-crown { position:absolute; right:14px; top:18px; }
.web-locked:disabled { cursor:default; }
html body .screen .big-btn.web-locked { background:#e4e9ed!important; color:#53636f!important; border-color:#bdcbd4!important; opacity:1!important; box-shadow:none!important; }
html body .screen .big-btn.web-locked small { color:#586a77!important; }
.app-menu-links a.web-locked { display:flex; align-items:center; gap:12px; color:#53636f; }
.app-menu-links a.web-locked .web-crown { margin-left:auto; }
.web-preview-note { grid-column:1/-1; font-size:13px; line-height:1.8; padding:8px 0; margin:0 0 12px; }
#nextBtn { text-decoration:none; font-family:Arial,sans-serif; }
#webBanner { position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:min(var(--study-width),var(--reading-width)); max-width:100%; z-index:105; background:#f4f6f8; border-top:1px solid #bccbd4; padding:6px 12px calc(8px + env(safe-area-inset-bottom)); box-sizing:border-box; }
.web-ad-label { color:#516370; font:11px/16px sans-serif; text-align:center; }
.web-ad-content { height:60px; overflow:hidden; }
body.has-web-banner .answerDock { bottom:var(--web-banner-height); }
body.has-web-banner #modal { bottom:var(--web-banner-height); }
body.has-web-banner #modal .sheet { max-height:calc(100dvh - var(--web-banner-height) - 32px - env(safe-area-inset-top)); }
body.web-menu-open #webBanner { visibility:hidden; }
html[data-color-mode="dark"] .web-footer a,
html[data-color-mode="dark"] .web-app-link { color:#a9dafa; }
html[data-color-mode="dark"] body :is(#homeScreen,#pastMenuScreen,#yearMenuScreen) .big-btn.web-locked,
html[data-color-mode="dark"] body .web-locked:disabled { background:#29333d; color:#cad5de; border-color:#627380; }
html[data-color-mode="dark"] body :is(#homeScreen,#pastMenuScreen,#yearMenuScreen) .big-btn.web-locked small { color:#bac9d4; }
html[data-color-mode="dark"] body .screen .big-btn.web-locked { background:#29333d!important; color:#cad5de!important; border-color:#627380!important; }
html[data-color-mode="dark"] body .screen .big-btn.web-locked small { color:#bac9d4!important; }
html[data-color-mode="dark"] .web-crown { color:#e2bd61; }
html[data-color-mode="dark"] .app-menu-links a.web-locked { color:#cad5de; }
html[data-color-mode="dark"] .web-app-notice { border-color:#53616d; }
html[data-color-mode="dark"] #webBanner { background:#222a31; border-color:#53616d; }
html[data-color-mode="dark"] .web-ad-label { color:#bdcad4; }
body.web-document { height:auto; min-height:100vh; overflow:auto; }
.web-document main { width:min(800px,100%); margin:0 auto; padding:24px 20px 48px; box-sizing:border-box; line-height:1.85; overflow-wrap:anywhere; }
.web-document h1 { font-size:24px; line-height:1.55; margin:16px 0; }
.web-document h2 { font-size:20px; line-height:1.55; margin:28px 0 16px; }
.web-document img { max-width:100%; height:auto; object-fit:contain; background:#fff; }
.web-document .document-question { margin:20px 0; }
.web-document .document-question .qText { padding:0; }
.web-document .document-question .inlineChoice { overflow-wrap:anywhere; }
.web-document .document-explanation { margin-top:28px; }
.web-document .document-source { font-size:12px; border-top:1px solid #bccbd4; padding-top:16px; margin-top:24px; }
.web-document .document-nav { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:20px; }
.web-document a { color:#315f7b; }
html[data-color-mode="dark"] .web-document a { color:#a9dafa; }
.web-document.has-web-banner main { padding-bottom:calc(var(--web-banner-height) + 32px); }
.web-result .app { height:auto; min-height:100dvh; overflow:visible; }
.web-result { height:auto; overflow:auto; }
.web-result #resultScreen:not([hidden]) { display:block; }
.web-result #resultScreen[hidden] { display:none; }
@media(max-width:430px) { .web-document main { padding:16px 14px 36px; } .web-document h1 { font-size:22px; } }