:root { --ink:#171717; --paper:#f4f2ee; --red:#c51f2c; --line:#d8d5cf; --muted:#686868; --surface:#fff; --soft:#faf9f6; --accent:#b88a2a; }
* { box-sizing:border-box; letter-spacing:0; }
body { margin:0; color:var(--ink); background:#fff; font-family:Arial,Helvetica,sans-serif; }
body.theme-newsroom { --ink:#171717; --paper:#f4f2ee; --red:#c51f2c; --line:#d8d5cf; --muted:#686868; --surface:#fff; --soft:#faf9f6; --accent:#b88a2a; }
body.theme-metro { --ink:#102033; --paper:#eef3f7; --red:#245f9d; --line:#cbd8e3; --muted:#5d6977; --surface:#ffffff; --soft:#f7fafc; --accent:#d29a2e; background:#f7fafc; }
a { color:inherit; }
.site-header { background:#171717; border-bottom:3px solid var(--red); }
body.theme-metro .site-header { background:#102033; border-bottom-color:var(--accent); }
.navbar { min-height:70px; }
.navbar-brand { display:flex; align-items:center; gap:10px; }
.navbar-brand strong,.navbar-brand small { display:block; line-height:1; }
.navbar-brand small { margin-top:5px; font-size:10px; font-weight:700; color:#bfbfbf; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; background:var(--red); color:white; font-family:Georgia,serif; font-size:25px; font-weight:700; }
body.theme-metro .brand-mark { background:var(--accent); color:#102033; border-radius:6px; }
.admin-link { color:#ffb2b8!important; }
body.theme-metro .admin-link { color:#f4c56f!important; }
.alerts-wrap { padding-top:18px; }
.section-kicker { display:block; margin-bottom:10px; color:var(--red); font-size:12px; font-weight:800; }
.edition-band { padding:46px 0 56px; background:var(--paper); border-bottom:1px solid var(--line); }
body.theme-metro .edition-band { background:linear-gradient(180deg,#e9f0f6 0%, #f7fafc 100%); border-bottom:1px solid var(--line); }
.edition-heading,.page-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:32px; }
.edition-heading h1,.page-heading h1,.empty-state h1 { margin:0; font-family:Georgia,serif; font-size:clamp(34px,5vw,62px); line-height:1; }
.edition-heading p,.page-heading p { margin:12px 0 0; color:var(--muted); }
.front-layout { display:grid; grid-template-columns:minmax(300px,520px) 1fr; gap:42px; align-items:start; }
.front-page { display:block; background:white; box-shadow:0 12px 34px rgba(0,0,0,.16); }
body.theme-metro .front-page { padding:8px; border:1px solid var(--line); border-radius:8px; box-shadow:0 16px 36px rgba(16,32,51,.13); }
.front-page img { display:block; width:100%; height:auto; }
.page-browser { min-width:0; }
.page-browser-head { display:flex; justify-content:space-between; align-items:center; padding-bottom:14px; border-bottom:2px solid var(--ink); }
body.theme-metro .page-browser-head { border-bottom-color:var(--red); }
.page-browser-head h2 { margin:0; font-family:Georgia,serif; font-size:25px; }
.page-browser-head span { color:var(--muted); font-size:12px; }
.page-grid { display:grid; grid-template-columns:repeat(4,minmax(90px,1fr)); gap:14px; padding-top:18px; }
.page-tile { min-width:0; text-decoration:none; background:white; border:1px solid var(--line); transition:transform .15s,border-color .15s; }
body.theme-metro .page-tile { border-radius:7px; overflow:hidden; box-shadow:0 8px 20px rgba(16,32,51,.07); }
.page-tile:hover { transform:translateY(-2px); border-color:var(--red); }
.page-tile img,.locked-preview { display:block; width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top; }
.locked-preview { display:grid; place-items:center; background:#dedbd5; color:#555; font-size:24px; }
.page-tile strong { display:block; padding:9px; font-size:12px; }
.archive-section,.account-section,.admin-section { padding:52px 0 72px; }
body.theme-metro .archive-section,body.theme-metro .account-section,body.theme-metro .admin-section { background:#f7fafc; }
.section-title { margin-bottom:24px; }
.section-title h2 { margin:0; font-family:Georgia,serif; font-size:34px; }
.archive-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); }
body.theme-metro .archive-grid { gap:14px; border-top:0; }
.archive-item { display:grid; grid-template-columns:66px 1fr auto; align-items:center; gap:18px; padding:22px 14px; text-decoration:none; border-bottom:1px solid var(--line); }
body.theme-metro .archive-item { background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 6px 18px rgba(16,32,51,.05); }
.archive-item:nth-child(odd) { border-right:1px solid var(--line); }
body.theme-metro .archive-item:nth-child(odd) { border-right:1px solid var(--line); }
.archive-item time { color:var(--red); font-weight:800; }
.archive-thumb { display:block; width:58px; aspect-ratio:3/4; object-fit:cover; object-position:top; background:#dedbd5; border:1px solid var(--line); }
.archive-thumb-empty { display:block; }
.archive-item h3 { margin:0 0 5px; font-family:Georgia,serif; font-size:20px; }
.archive-item p { margin:0; color:var(--muted); font-size:13px; }
.archive-item:hover h3 { color:var(--red); }
.empty-state { min-height:420px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.auth-section { min-height:calc(100vh - 140px); display:grid; place-items:center; padding:48px 16px; background:var(--paper); }
body.theme-metro .auth-section { background:linear-gradient(135deg,#e8f0f7,#f7fafc); }
.auth-panel { width:min(100%,440px); padding:36px; background:white; border-top:4px solid var(--red); box-shadow:0 10px 30px rgba(0,0,0,.09); }
body.theme-metro .auth-panel { border:1px solid var(--line); border-top:4px solid var(--accent); border-radius:8px; box-shadow:0 18px 42px rgba(16,32,51,.12); }
.auth-panel h1 { margin:0 0 8px; font-family:Georgia,serif; font-size:36px; }
.auth-panel>p { margin-bottom:28px; color:var(--muted); }
.form-control,.form-select { min-height:46px; border-radius:3px; }
.btn { border-radius:3px; font-weight:700; }
.btn-danger { background:var(--red); border-color:var(--red); }
body.theme-metro .btn-danger { background:var(--red); border-color:var(--red); }
.auth-links { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-top:22px; font-size:13px; }
.auth-links a { color:var(--red); font-weight:700; }
.reader-page { background:#262626; min-height:calc(100vh - 70px); color:white; }
.reader-toolbar { position:sticky; top:70px; z-index:10; padding:10px 0; background:#111; border-bottom:1px solid #444; }
.reader-toolbar strong,.reader-toolbar small { display:block; }
.reader-toolbar small { color:#aaa; font-size:11px; }
.reader-actions { display:flex; align-items:center; gap:8px; }
.icon-btn { width:36px; height:36px; padding:0; border:1px solid #555; background:#222; color:white; font-size:20px; }
.reader-actions span { width:48px; text-align:center; font-size:12px; }
.reader-shell { display:grid; grid-template-columns:112px minmax(0,1fr); min-height:70vh; }
.thumb-strip { max-height:calc(100vh - 130px); overflow:auto; padding:12px; background:#181818; }
.thumb-strip a { display:grid; grid-template-columns:1fr; gap:4px; margin-bottom:12px; padding:5px; color:white; text-align:center; text-decoration:none; border:2px solid transparent; }
.thumb-strip a.active { border-color:var(--red); }
.thumb-strip img,.mini-lock { width:100%; aspect-ratio:3/4; object-fit:cover; background:#555; }
.mini-lock { display:grid; place-items:center; }
.paper-stage { overflow:auto; padding:28px; text-align:center; }
.paper-stage img { display:block; width:100%; max-width:1050px; height:auto; margin:auto; transform-origin:top center; transition:width .15s; }
.paper-stage:fullscreen { background:#222; }
.reader-pager { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; padding:18px; background:#111; }
.reader-pager a:last-child { justify-self:end; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:30px; }
.stat-card { display:flex; align-items:center; gap:18px; padding:22px 24px; border-radius:12px; background:#fff; border:1px solid #e8eaf0; box-shadow:0 2px 12px rgba(0,0,0,.06); transition:transform .2s,box-shadow .2s; }
.stat-card:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.10); }
.stat-card__icon { width:52px; height:52px; border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stat-card__icon svg { width:24px; height:24px; stroke-width:2; }
.stat-card__label { display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#8a94a6; margin-bottom:4px; }
.stat-card__value { display:block; font-family:Georgia,serif; font-size:36px; font-weight:700; line-height:1; color:#1a202c; }
.stat-card--blue .stat-card__icon { background:#eff6ff; color:#2563eb; }
.stat-card--blue .stat-card__value { color:#1d4ed8; }
.stat-card--green .stat-card__icon { background:#f0fdf4; color:#16a34a; }
.stat-card--green .stat-card__value { color:#15803d; }
.stat-card--purple .stat-card__icon { background:#faf5ff; color:#7c3aed; }
.stat-card--purple .stat-card__value { color:#6d28d9; }
.stat-card--gold .stat-card__icon { background:#fffbeb; color:#d97706; }
.stat-card--gold .stat-card__value { color:#b45309; }
.admin-table-wrap { border:1px solid var(--line); }
body.theme-metro .admin-table-wrap { overflow:hidden; background:#fff; border-radius:8px; box-shadow:0 10px 24px rgba(16,32,51,.06); }
.admin-table-wrap .table { margin:0; }
.admin-table-wrap th { padding:14px; background:#222; color:white; font-size:12px; text-transform:uppercase; }
.admin-table-wrap td { padding:15px 14px; }
.admin-table-wrap td small { display:block; color:var(--muted); }
.admin-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.status { display:inline-block; padding:5px 9px; border-radius:2px; font-size:11px; font-weight:800; text-transform:uppercase; }
.status-published,.status-active { background:#d9f0df; color:#17632d; }
.status-draft,.status-blocked { background:#f1dddd; color:#8d2028; }
.upload-form { padding:34px; border:1px solid var(--line); background:var(--paper); }
body.theme-metro .upload-form { background:#fff; border-radius:8px; box-shadow:0 10px 24px rgba(16,32,51,.06); }
.file-drop { display:grid; place-items:center; min-height:190px; padding:25px; text-align:center; border:2px dashed #999; background:white; cursor:pointer; }
.file-drop:hover { border-color:var(--red); }
.file-drop span { margin-top:7px; color:var(--muted); font-size:13px; }
.file-drop input { position:absolute; width:1px; height:1px; opacity:0; }
.selected-file { margin-top:8px; color:var(--muted); font-size:13px; }
.form-submit { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:30px; padding-top:24px; border-top:1px solid var(--line); }
.form-submit p { max-width:520px; margin:0; color:var(--muted); font-size:13px; }
.edition-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:28px 22px; border-top:2px solid var(--ink); padding-top:24px; }
body.theme-metro .edition-list { border-top:0; }
.edition-card { min-width:0; text-decoration:none; }
body.theme-metro .edition-card { padding:12px; background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 8px 22px rgba(16,32,51,.06); }
.edition-card time,.edition-card strong,.edition-card span { display:block; }
.edition-card time { margin-bottom:10px; color:var(--red); font-size:13px; font-weight:800; }
.edition-card-thumb { display:block; width:162px; max-width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top; background:#dedbd5; border:1px solid var(--line); box-shadow:0 8px 20px rgba(0,0,0,.12); transition:transform .15s,border-color .15s; }
.edition-card-empty { display:block; }
.edition-card strong { margin-top:12px; font-family:Georgia,serif; font-size:18px; line-height:1.15; }
.edition-card span { margin-top:5px; color:var(--muted); font-size:12px; }
.edition-card:hover .edition-card-thumb { transform:translateY(-3px); border-color:var(--red); }
.edition-card:hover strong { color:var(--red); }
.error-page { min-height:65vh; display:grid; place-content:center; justify-items:center; padding:30px; text-align:center; }
.error-page>strong { color:var(--red); font-family:Georgia,serif; font-size:80px; line-height:1; }
.site-footer { padding:22px 0; background:#171717; color:#aaa; font-size:12px; }
body.theme-metro .site-footer { background:#102033; color:#cbd8e3; }
.append-pages-band { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-bottom:38px; padding:24px 0; border-top:2px solid var(--ink); border-bottom:1px solid var(--line); }
.append-pages-band h2,.order-heading h2 { margin:0; font-family:Georgia,serif; font-size:26px; }
.append-pages-band form { display:flex; align-items:center; gap:10px; }
.compact-file-input { display:flex; align-items:center; gap:9px; width:min(320px,45vw); height:40px; padding:0 12px; overflow:hidden; background:#f4f2ee; border:1px solid #bbb; border-radius:3px; cursor:pointer; }
.compact-file-input svg { flex:0 0 auto; width:18px; }
.compact-file-input span { overflow:hidden; font-size:12px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.compact-file-input input { position:absolute; width:1px; height:1px; opacity:0; }
.order-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:16px; }
.page-sort-list { border-top:1px solid var(--line); }
.sortable-page { display:grid; grid-template-columns:44px 74px 1fr 28px; align-items:center; gap:16px; min-height:102px; padding:10px 14px; background:#fff; border-bottom:1px solid var(--line); transition:background .15s,box-shadow .15s; }
.sortable-page:hover { background:#faf9f7; }
.sortable-ghost { opacity:.35; background:#f7dfe1; }
.sortable-chosen { box-shadow:0 7px 22px rgba(0,0,0,.16); }
.drag-handle { display:grid; place-items:center; width:36px; height:52px; padding:0; color:#666; background:#f2f2f2; border:1px solid #ccc; border-radius:3px; cursor:grab; touch-action:none; }
.drag-handle:active { cursor:grabbing; }
.drag-handle svg { width:20px; }
.sortable-thumb { width:66px; height:82px; overflow:hidden; background:#ddd; border:1px solid #ccc; }
.sortable-thumb img { width:100%; height:100%; object-fit:cover; object-position:top; image-rendering:high-quality; image-rendering:-webkit-optimize-contrast; }

.sortable-meta span,.sortable-meta strong { display:block; }
.sortable-meta span { color:#888; font-size:9px; font-weight:800; }
.sortable-meta strong { font-family:Georgia,serif; font-size:28px; }
.sort-direction { width:18px; color:#aaa; }
.theme-settings-form { padding:28px; background:var(--paper); border:1px solid var(--line); }
body.theme-metro .theme-settings-form { background:#fff; border-radius:8px; box-shadow:0 10px 24px rgba(16,32,51,.06); }
.theme-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.theme-choice { position:relative; min-width:0; padding:16px; background:#fff; border:2px solid var(--line); cursor:pointer; transition:transform .15s,border-color .15s,box-shadow .15s; }
.theme-choice:hover,.theme-choice.selected { transform:translateY(-2px); border-color:var(--red); box-shadow:0 10px 26px rgba(0,0,0,.1); }
.theme-choice input { position:absolute; opacity:0; pointer-events:none; }
.theme-choice strong,.theme-choice small { display:block; }
.theme-choice strong { margin-top:14px; font-family:Georgia,serif; font-size:22px; }
.theme-choice small { margin-top:6px; color:var(--muted); line-height:1.5; }
.theme-preview { display:block; overflow:hidden; height:190px; background:#f4f2ee; border:1px solid #d8d5cf; }
.theme-preview .preview-top { display:block; height:34px; background:#171717; border-bottom:4px solid #c51f2c; }
.theme-preview .preview-main { display:grid; grid-template-columns:42% 1fr; gap:12px; padding:14px; }
.theme-preview .preview-main span:first-child { height:112px; background:#fff; box-shadow:0 10px 20px rgba(0,0,0,.16); }
.theme-preview .preview-main span:last-child { height:88px; background:repeating-linear-gradient(#fff 0 15px,#e4e0d9 16px 17px); border-top:3px solid #171717; }
.theme-preview .preview-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; padding:0 14px 14px; }
.theme-preview .preview-grid i { height:18px; background:#fff; border:1px solid #d8d5cf; }
.theme-preview-metro { background:#eef3f7; border-color:#cbd8e3; border-radius:7px; }
.theme-preview-metro .preview-top { background:#102033; border-bottom-color:#d29a2e; }
.theme-preview-metro .preview-main span:first-child { border-radius:5px; box-shadow:0 12px 24px rgba(16,32,51,.13); }
.theme-preview-metro .preview-main span:last-child { background:repeating-linear-gradient(#fff 0 15px,#dce7ef 16px 17px); border-top:3px solid #245f9d; border-radius:5px; }
.theme-preview-metro .preview-grid i { background:#fff; border-color:#cbd8e3; border-radius:4px; }

/* Professional newspaper reader */
.reader-layout,.reader-layout main { width:100%; height:100vh; height:100dvh; overflow:hidden; }
.pro-reader { --command-height:52px; --navigation-height:72px; --footer-height:24px; position:relative; height:100vh; height:100dvh; background:#343536; color:#fff; overflow:hidden; }
.reader-commandbar { position:relative; z-index:30; height:var(--command-height); display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 12px; background:#1a1d23; color:#e5e7eb; border-bottom:1px solid #2d313a; box-shadow:0 2px 12px rgba(0,0,0,.35); }
.reader-publication,.reader-tools,.zoom-control,.page-stepper,.view-switch { display:flex; align-items:center; }
.reader-publication { min-width:0; gap:10px; flex-shrink:0; }
.reader-home-button { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; color:#1a1d23; background:#e8a217; text-decoration:none; border-radius:6px; overflow:hidden; }
.reader-home-button span { font-family:Georgia,serif; font-size:22px; font-weight:800; color:#1a1d23; }
.reader-home-button img { display:block; width:100%; height:100%; object-fit:contain; padding:4px; }
.reader-selectors { display:flex; min-width:0; gap:6px; }
.reader-selectors label { min-width:0; margin:0; }
.reader-selectors label>span { display:block; margin-bottom:2px; color:#e8a217; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.reader-select { height:30px; padding:2px 22px 2px 7px; border:1px solid #3a3f4a; border-radius:4px; background:#252830; color:#e5e7eb; font-size:11px; font-weight:700; appearance:auto; min-width:120px; }
.reader-select option { background:#252830; color:#e5e7eb; }
.reader-tools { justify-content:flex-end; gap:2px; flex:1; }
.tool-button,.zoom-value { display:inline-flex; align-items:center; justify-content:center; gap:5px; height:34px; padding:0 7px; border:1px solid transparent; border-radius:5px; background:transparent; color:#c9cdd6; text-decoration:none; font-size:10px; font-weight:700; white-space:nowrap; cursor:pointer; }
.tool-button:hover,.tool-button:focus { color:#fff; background:#2d313c; border-color:#3a3f4a; }
.tool-button.icon-only { width:34px; padding:0; }
.reader-account-btn { display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 12px; border:none; border-radius:6px; background:#e8a217; color:#1a1d23; text-decoration:none; font-size:11px; font-weight:800; white-space:nowrap; cursor:pointer; flex-shrink:0; margin-left:6px; }
.reader-account-btn:hover { background:#f5b633; color:#1a1d23; }
.reader-account-btn svg { width:16px; height:16px; stroke-width:2; }
.tool-button svg,.nav-command svg,.nav-icon svg,.dropdown-item svg,.clip-modal .btn svg { width:17px; height:17px; stroke-width:1.9; }
.zoom-control { height:34px; border:1px solid #3a3f4a; border-radius:5px; overflow:hidden; }
.zoom-control .tool-button { border:0; border-radius:0; height:100%; }
.zoom-value { width:46px; padding:0; border-width:0 1px; border-color:#3a3f4a; border-radius:0; font-size:9px; color:#e5e7eb; background:transparent; }
.zoom-value:hover { background:#2d313c; color:#fff; }
.tool-divider { width:1px; height:20px; background:#3a3f4a; margin:0 3px; flex-shrink:0; }
.share-menu { min-width:190px; padding:6px; border-radius:4px; }
.share-menu .dropdown-item { display:flex; align-items:center; gap:9px; padding:9px; border-radius:2px; font-size:13px; }
.reader-canvas-shell { position:relative; height:calc(100vh - var(--command-height) - var(--navigation-height)); height:calc(100dvh - var(--command-height) - var(--navigation-height)); min-height:320px; }
.paper-viewport { width:100%; height:100%; overflow:auto; padding:10px 12px 16px; cursor:grab; overscroll-behavior:contain; scrollbar-color:#777 #2d2e2f; }
.paper-viewport.is-dragging { cursor:grabbing; user-select:none; }
.paper-spread { display:flex; align-items:flex-start; justify-content:center; gap:10px; width:max-content; min-width:100%; margin:auto; transform-origin:top center; }
.paper-sheet { position:relative; flex:0 0 auto; width:max-content; }
.paper-image { display:block; width:min(900px, calc(100vw - 150px)); max-width:none; height:auto; background:#fff; box-shadow:0 8px 28px rgba(0,0,0,.38); user-select:none; }
.second-sheet { display:none; }
.paper-spread[data-mode="double"] .paper-image { width:min(720px, calc((100vw - 150px) / 2)); }
.paper-spread[data-mode="double"] .second-sheet { display:block; }
.inline-clip-layer { position:absolute; inset:0; z-index:4; overflow:hidden; cursor:crosshair; touch-action:none; }
.inline-selection { position:absolute; z-index:2; border:2px solid #e32636; box-shadow:0 0 0 9999px rgba(0,0,0,.46); cursor:move; }
.inline-selection>span { position:absolute; width:14px; height:14px; background:#fff; border:2px solid #e32636; border-radius:2px; }
.inline-selection>[data-handle="nw"] { top:-8px; left:-8px; cursor:nwse-resize; }
.inline-selection>[data-handle="ne"] { top:-8px; right:-8px; cursor:nesw-resize; }
.inline-selection>[data-handle="sw"] { bottom:-8px; left:-8px; cursor:nesw-resize; }
.inline-selection>[data-handle="se"] { right:-8px; bottom:-8px; cursor:nwse-resize; }
.inline-clip-toolbar { position:absolute; top:8px; right:18px; z-index:20; display:flex; align-items:center; gap:5px; min-height:38px; padding:4px; color:#222; background:#fff; border:1px solid #bbb; border-radius:4px; box-shadow:0 4px 14px rgba(0,0,0,.24); }
.inline-clip-toolbar[hidden] { display:none; }
.inline-clip-toolbar>span { min-width:112px; padding:0 8px; color:#666; font-size:10px; font-weight:700; }
.inline-clip-toolbar button { display:inline-flex; align-items:center; gap:5px; height:30px; padding:0 8px; color:#222; background:#f4f4f4; border:1px solid #d0d0d0; border-radius:3px; font-size:10px; font-weight:700; }
.inline-clip-toolbar button.primary { color:#fff; background:var(--red); border-color:var(--red); }
.inline-clip-toolbar button:disabled { opacity:.45; }
.inline-clip-toolbar svg { width:15px; height:15px; }
.tool-button.is-active { color:#fff; background:var(--red); border-color:var(--red); }
.reader-navigation { position:relative; z-index:31; height:var(--navigation-height); display:flex; flex-direction:column; color:#222; background:#fff; border-top:1px solid #c8c8c8; box-shadow:0 -2px 9px rgba(0,0,0,.14); }
.reader-nav-row { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; padding:0 10px; height:calc(var(--navigation-height) - var(--footer-height)); }
.nav-command,.nav-icon { display:inline-flex; align-items:center; justify-content:center; border:1px solid #d2d2d2; border-radius:3px; background:#f7f7f7; color:#222; text-decoration:none; }
.nav-command { justify-self:start; gap:7px; height:32px; padding:0 10px; font-size:11px; font-weight:700; }
.nav-command:hover,.nav-icon:hover,.nav-icon.active { color:#fff; background:var(--red); border-color:var(--red); }
.nav-icon { width:32px; height:32px; padding:0; }
.nav-icon.disabled,.nav-icon:disabled { opacity:.35; pointer-events:none; }
.page-stepper { justify-content:center; gap:8px; }
.page-jump { display:flex; align-items:center; gap:7px; margin:0; font-size:11px; font-weight:700; }
.page-jump input { width:48px; height:31px; padding:3px; text-align:center; border:1px solid #bbb; border-radius:3px; font-weight:800; }
.view-switch { justify-self:end; gap:4px; }
.pages-drawer { width:min(440px, 94vw)!important; }
.offcanvas-header { border-bottom:1px solid var(--line); }
.offcanvas-header h2 { margin:0; font-family:Georgia,serif; font-size:26px; }
.drawer-kicker { display:block; margin-bottom:4px; color:var(--red); font-size:9px; font-weight:800; }
.drawer-page-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }
.drawer-page { min-width:0; padding:5px; color:#222; text-align:center; text-decoration:none; border:2px solid transparent; }
.drawer-page:hover,.drawer-page.active { color:var(--red); border-color:var(--red); }
.drawer-thumb { display:grid; place-items:center; width:100%; aspect-ratio:3/4; overflow:hidden; background:#dedede; }
.drawer-thumb img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.drawer-thumb svg { width:22px; }
.drawer-page strong { display:block; padding-top:6px; font-size:11px; }
.search-drawer { width:min(410px, 94vw)!important; }
.reader-search-form label { margin-bottom:7px; font-size:12px; font-weight:700; }
.reader-search-form .btn { display:grid; place-items:center; width:48px; }
.reader-search-form svg { width:18px; }
.search-status { padding:20px 0 12px; color:#777; font-size:12px; }
.search-result { display:block; padding:14px 4px; color:#222; text-decoration:none; border-top:1px solid var(--line); }
.search-result strong { display:block; margin-bottom:5px; color:var(--red); font-size:12px; }
.search-result p { margin:0; color:#555; font-size:12px; line-height:1.55; }
.reader-toast { position:fixed; right:20px; bottom:78px; z-index:1090; max-width:320px; padding:11px 15px; color:#fff; background:#171717; border-left:3px solid var(--red); border-radius:3px; opacity:0; pointer-events:none; transform:translateY(8px); transition:.18s; }
.reader-toast.show { opacity:1; transform:translateY(0); }
.reader-footer { display:flex; align-items:center; justify-content:center; height:var(--footer-height); background:#111419; border-top:1px solid #2d313a; width:100%; }
.reader-credit-link { color:#ffffff; font-size:10px; font-weight:600; text-decoration:none; letter-spacing:.02em; transition:color .15s; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:90%; text-align:center; }
.reader-credit-link:hover { color:#e8a217; }
.pro-reader:fullscreen { height:100vh; height:100dvh; }
.pro-reader:fullscreen .reader-canvas-shell { height:calc(100vh - var(--command-height) - var(--navigation-height)); height:calc(100dvh - var(--command-height) - var(--navigation-height)); }

@media print {
  @page { size: auto; margin: 4mm; }
  body, html { margin:0!important; padding:0!important; background:#fff!important; }
  .site-header,.site-footer,.reader-commandbar,.reader-navigation,.reader-footer,.offcanvas,.modal,.reader-toast,.epaper-ad-slot,.inline-clip-toolbar,.inline-clip-layer { display:none!important; }
  .pro-reader,.reader-canvas-shell,.paper-viewport,.paper-stage { position:static!important; width:100%!important; height:auto!important; min-height:0!important; padding:0!important; margin:0!important; overflow:visible!important; background:#fff!important; }
  .paper-spread { display:block!important; width:100%!important; min-width:0!important; margin:0!important; }
  .paper-sheet { position:static!important; width:100%!important; margin:0!important; }
  .paper-image { display:block!important; width:100%!important; max-width:100%!important; height:auto!important; max-height:98vh!important; object-fit:contain!important; box-shadow:none!important; page-break-after:always; page-break-inside:avoid; }
  .second-sheet, .second-paper { display:none!important; }
}

@media (max-width:991px) { .front-layout{grid-template-columns:minmax(260px,42%) 1fr;gap:25px}.page-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:767px) {
  .edition-band{padding:28px 0 38px}.edition-heading,.page-heading{align-items:flex-start;flex-direction:column}.edition-heading h1,.page-heading h1{font-size:38px}
  .front-layout{grid-template-columns:1fr}.front-page{max-width:480px;margin:auto}.page-grid{grid-template-columns:repeat(3,1fr)}
  .archive-grid{grid-template-columns:1fr}.archive-item:nth-child(odd){border-right:0}.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-card{padding:16px 18px;gap:14px}.stat-card__value{font-size:28px}.stat-card__icon{width:44px;height:44px}
  .reader-shell{grid-template-columns:1fr}.thumb-strip{display:flex;max-height:none;overflow:auto}.thumb-strip a{flex:0 0 70px}.paper-stage{padding:12px}
  .edition-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 14px; }
  .edition-card-thumb { width:100%; }
  .reader-toolbar{top:69px}.reader-pager{grid-template-columns:1fr auto 1fr;font-size:12px}.upload-form{padding:20px}
  .pro-reader { --command-height:80px; --navigation-height:72px; --footer-height:24px; }
  .reader-commandbar { height:var(--command-height); flex-direction:column; align-items:stretch; justify-content:center; gap:4px; padding:6px 10px; }
  .reader-publication { width:100%; gap:7px; }
  .reader-home-button { flex:0 0 32px; width:32px; height:32px; border-radius:5px; }
  .reader-selectors { flex:1; gap:5px; }
  .reader-selectors label { flex:1; }
  .reader-select { width:100%; min-width:0; height:27px; font-size:10px; }
  .reader-tools { width:100%; justify-content:flex-start; gap:2px; flex:unset; overflow:visible; }
  .tool-button { flex:0 0 auto; }
  .tool-button span,.tool-button-label { display:none!important; }
  .tool-button.icon-only { width:30px; height:30px; }
  .tool-button { height:30px; padding:0 5px; }
  .zoom-value { width:40px; font-size:8px; }
  .zoom-control { height:30px; }
  .reader-account-btn { height:30px; padding:0 9px; font-size:10px; margin-left:3px; }
  .reader-account-btn span { display:none!important; }
  .reader-account-btn svg { width:15px; height:15px; }
  .tool-divider { display:none; }


  .reader-canvas-shell { min-height:360px; }
  .paper-viewport { padding:4px 0 8px; overflow-x:auto; }
  .paper-image { max-width:100%; height:auto; }
  .paper-spread[data-mode="double"] .paper-image { max-width:50%; }

  .inline-clip-toolbar { top:5px; right:6px; left:6px; justify-content:flex-end; }
  .inline-clip-toolbar>span { min-width:0; margin-right:auto; }
  .inline-clip-toolbar button span { display:none; }
  .reader-nav-row { grid-template-columns:auto 1fr auto; gap:7px; padding:0 8px; }
  .nav-command { width:38px; padding:0; }
  .nav-command span { display:none; }
  .page-stepper { gap:4px; }
  .page-jump label { display:none; }
  .page-jump input { width:43px; }
  .drawer-page-grid { grid-template-columns:repeat(3,1fr); }
  .append-pages-band { align-items:stretch; flex-direction:column; gap:15px; }
  .append-pages-band form { align-items:stretch; flex-direction:column; }
  .compact-file-input { width:100%; }
  .sortable-page { grid-template-columns:40px 60px 1fr 20px; gap:10px; padding:9px 6px; }
  .sortable-thumb { width:56px; height:72px; }
}
@media (max-width:420px) { .page-grid{grid-template-columns:repeat(2,1fr)}.stats-grid{grid-template-columns:1fr 1fr}.auth-panel{padding:25px}.form-submit{align-items:stretch;flex-direction:column}.form-submit .btn{width:100%} }

/* Template-matched themes from 1.html and 2.html */
body.theme-newsroom {
  --paper:#f5f0e6; --paper-deep:#ece4d3; --ink:#1a1613; --muted:#4a423a; --red:#7a1f2b; --line:#c9bfae; --accent:#b8860b;
  background:var(--paper); color:var(--ink); font-family:Georgia,"Times New Roman",serif;
}
body.theme-newsroom .site-header { position:static; padding:22px 6vw 14px; background:var(--paper); border-bottom:4px double var(--ink); }
body.theme-newsroom .theme-nav { max-width:none; margin:0; display:block; }
body.theme-newsroom .theme-nav-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; color:var(--muted); font-family:Arial,Helvetica,sans-serif; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
body.theme-newsroom .theme-nav-top nav { display:flex; flex-wrap:wrap; gap:22px; }
body.theme-newsroom .theme-nav-top a { padding-bottom:2px; color:inherit; text-decoration:none; border-bottom:1px solid transparent; }
body.theme-newsroom .theme-nav-top a:hover { border-color:var(--red); }
body.theme-newsroom .theme-brand { display:none; }
body.theme-newsroom .theme-auth { display:flex; align-items:center; gap:10px; }

body.theme-newsroom .masthead-name { display:block; text-align:center; }
body.theme-newsroom .masthead-name .eyebrow { color:var(--red); font-family:Arial,Helvetica,sans-serif; font-size:11px; font-weight:700; letter-spacing:.3em; text-transform:uppercase; }
body.theme-newsroom .masthead-name h1 { margin:6px 0 10px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(42px,7vw,86px); font-weight:900; line-height:1; }
body.theme-newsroom .masthead-devanagari { color:var(--muted); font-size:15px; }
body.theme-newsroom .edition-band { padding:44px 0 0; background:var(--paper); border-bottom:0; }
body.theme-newsroom .edition-heading { align-items:end; margin-bottom:32px; }
body.theme-newsroom .badge-row, body.theme-newsroom .edition-sub, body.theme-newsroom .tag-new, body.theme-newsroom .front-page-back { display:none; }
body.theme-newsroom .section-kicker { display:flex; align-items:center; gap:10px; color:var(--red); font-family:Arial,Helvetica,sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
body.theme-newsroom .section-kicker::after { content:""; flex:1; height:1px; background:var(--line); }
body.theme-newsroom .edition-heading h1 { margin:6px 0 10px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(36px,5vw,58px); font-weight:800; line-height:1; }
body.theme-newsroom .edition-heading p { color:var(--muted); font-family:Arial,Helvetica,sans-serif; font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
body.theme-newsroom .front-layout { display:grid; grid-template-columns:1.35fr 1fr; gap:56px; padding-bottom:56px; border-bottom:1px solid var(--line); }
body.theme-newsroom .front-showcase { position:relative; }
body.theme-newsroom .front-page { position:relative; display:block; padding:10px; background:#fff; border:1px solid var(--ink); box-shadow:none; }
body.theme-newsroom .front-page .page-tag { position:absolute; top:-1px; left:-1px; z-index:2; padding:4px 10px; background:var(--ink); color:var(--paper); font-family:Arial,Helvetica,sans-serif; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
body.theme-newsroom .front-page img { width:100%; aspect-ratio:3/4.1; object-fit:cover; object-position:top; border:1px solid var(--line); }
body.theme-newsroom .open-reader-btn { display:inline-flex; align-items:center; gap:8px; margin-top:18px; padding:13px 22px; background:var(--ink); color:var(--paper); border:1px solid var(--ink); font-family:Arial,Helvetica,sans-serif; font-size:12px; font-weight:800; letter-spacing:.06em; text-decoration:none; text-transform:uppercase; }
body.theme-newsroom .open-reader-btn:hover { background:transparent; color:var(--ink); }
body.theme-newsroom .heading-reader-btn { display:none; }
body.theme-newsroom .page-browser-head { padding-bottom:10px; border-bottom:0; }
body.theme-newsroom .page-browser-head h2 { display:flex; align-items:center; gap:10px; width:100%; color:var(--red); font-family:Arial,Helvetica,sans-serif; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
body.theme-newsroom .page-browser-head h2::after { content:""; flex:1; height:1px; background:var(--line); }
body.theme-newsroom .page-browser-head span { font-family:Arial,Helvetica,sans-serif; font-size:11px; }
body.theme-newsroom .page-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding-top:0; }
body.theme-newsroom .page-tile { padding:8px; background:#fff; border:1px solid var(--line); }
body.theme-newsroom .page-tile img, body.theme-newsroom .locked-preview { aspect-ratio:3/4.1; border:1px solid var(--line); }
body.theme-newsroom .locked-preview { background:rgba(245,240,230,.92); color:var(--muted); font-size:22px; }
body.theme-newsroom .page-tile strong { display:inline-block; padding:8px 0 0; font-family:Arial,Helvetica,sans-serif; font-size:12px; }
body.theme-newsroom .page-tile small { float:right; padding-top:9px; color:var(--muted); font-family:Arial,Helvetica,sans-serif; font-size:11px; }
body.theme-newsroom .archive-section { padding:48px 0 60px; background:var(--paper); }
body.theme-newsroom .section-title h2 { font-family:Georgia,"Times New Roman",serif; font-size:30px; }
body.theme-newsroom .archive-grid { display:block; border-top:0; }
body.theme-newsroom .archive-item { display:grid; grid-template-columns:42px 90px 1fr auto; gap:16px; align-items:center; min-height:74px; padding:12px 0; background:transparent; border:0; border-bottom:1px solid var(--line); text-decoration:none; }
body.theme-newsroom .archive-thumb { display:block; width:36px; height:48px; object-fit:cover; object-position:top; background:#fff; border:1px solid var(--line); padding:2px; }
body.theme-newsroom .archive-item time { color:var(--red); font-family:Georgia,"Times New Roman",serif; font-size:26px; font-weight:900; }
body.theme-newsroom .archive-item time span, body.theme-newsroom .archive-item time small { display:block; }
body.theme-newsroom .archive-item time small { color:var(--muted); font-family:Arial,Helvetica,sans-serif; font-size:10px; letter-spacing:.1em; }
body.theme-newsroom .archive-item h3 { font-family:Georgia,"Times New Roman",serif; font-size:19px; }
body.theme-newsroom .archive-arrow { color:var(--muted); font-size:20px; transition:.2s; }
body.theme-newsroom .archive-item:hover .archive-arrow { color:var(--red); transform:translateX(6px); }
body.theme-newsroom .site-footer { background:var(--paper); color:var(--muted); border-top:4px double var(--ink); font-family:Arial,Helvetica,sans-serif; }

body.theme-metro {
  --cream:#fff8ed; --card:#fff; --ink:#22252b; --red:#ff5a5f; --line:#ebdfc8; --paper:#fff8ed; --muted:#6b6558; --accent:#ff8c32; --teal:#0b6e6e;
  overflow-x:hidden; background:var(--cream); color:var(--ink); font-family:Arial,Helvetica,sans-serif;
}
body.theme-metro .site-header { position:relative; z-index:5; padding:22px 6vw; background:var(--cream); border-bottom:0; }
body.theme-metro .theme-nav { display:flex; justify-content:space-between; align-items:center; gap:22px; }
body.theme-metro .theme-nav-top { display:flex; align-items:center; gap:28px; }
body.theme-metro .theme-nav-top > span, body.theme-metro .masthead-name { display:none; }
body.theme-metro .theme-nav-top nav { display:flex; flex-wrap:wrap; gap:22px; font-size:13px; font-weight:700; }
body.theme-metro .theme-nav-top a { position:relative; color:var(--ink); text-decoration:none; }
body.theme-metro .theme-nav-top a::after { content:""; position:absolute; left:0; bottom:-4px; width:0; height:2px; background:var(--red); transition:.2s; }
body.theme-metro .theme-nav-top a:hover::after { width:100%; }
body.theme-metro .theme-brand { order:-1; display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font-size:20px; font-weight:900; }
body.theme-metro .brand-mark { display:flex; align-items:center; justify-content:center; width:38px; height:38px; background:var(--ink); color:var(--cream); border-radius:12px; transform:rotate(-6deg); }
body.theme-metro .theme-brand small { display:none; }
body.theme-metro .theme-auth { display:flex; align-items:center; gap:10px; }
body.theme-metro .theme-login-btn, body.theme-metro .theme-signup-btn { display:inline-flex; align-items:center; min-height:42px; padding:9px 18px; background:var(--accent); color:var(--ink); border:2px solid var(--ink); border-radius:999px; box-shadow:3px 3px 0 var(--ink); font-size:13px; font-weight:800; text-decoration:none; }
body.theme-metro .theme-signup-btn { background:#fff; }
body.theme-metro .edition-band { padding:30px 0 0; background:var(--cream); border-bottom:0; }
body.theme-metro .edition-heading { display:block; margin-bottom:0; }
body.theme-metro .badge-row { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
body.theme-metro .date-badge { display:inline-block; padding:7px 14px; background:var(--teal); color:#fff; border-radius:999px; font-family:monospace; font-size:12px; font-weight:900; transform:rotate(-2deg); }
body.theme-metro .live-dot { display:flex; align-items:center; gap:6px; color:var(--red); font-family:monospace; font-size:11px; font-weight:900; }
body.theme-metro .live-dot span { width:7px; height:7px; background:var(--red); border-radius:50%; }
body.theme-metro .section-kicker { display:none; }
body.theme-metro .edition-heading h1 { margin:0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(40px,7vw,84px); font-style:italic; font-weight:900; line-height:.95; }
body.theme-metro .edition-heading p { margin-top:14px; max-width:520px; color:#5b5648; font-size:16px; font-weight:700; }
body.theme-metro .edition-sub { margin-top:4px; color:#5b5648; }
body.theme-metro .heading-reader-btn { display:none; }
body.theme-metro .front-layout { display:grid; grid-template-columns:1.1fr 1fr; gap:50px; align-items:start; margin-top:44px; }
body.theme-metro .front-showcase { position:relative; min-height:460px; }
body.theme-metro .front-page { position:absolute; top:0; left:0; z-index:2; width:260px; aspect-ratio:3/4.1; padding:12px; overflow:hidden; background:var(--card); border:3px solid var(--ink); border-radius:16px; box-shadow:6px 6px 0 var(--ink); transform:rotate(4deg); }
body.theme-metro .front-page-back { display:block; top:26px; left:56px; z-index:1; opacity:.85; transform:rotate(-7deg); }
body.theme-metro .front-page .page-tag { display:none; }
body.theme-metro .front-page img { width:100%; height:100%; object-fit:cover; object-position:top; border-radius:8px; border:1px solid var(--line); }
body.theme-metro .cover-placeholder { display:flex; flex-direction:column; width:100%; height:100%; padding:16px; background:linear-gradient(160deg,#ffebd2,#fff8ed); border:1px solid var(--line); border-radius:8px; }
body.theme-metro .cover-placeholder strong { padding-bottom:8px; margin-bottom:10px; border-bottom:3px solid var(--ink); font-size:19px; }
body.theme-metro .cover-placeholder em { font-family:Georgia,"Times New Roman",serif; font-style:normal; font-weight:800; }
body.theme-metro .tag-new { position:absolute; top:-14px; left:215px; z-index:3; padding:8px 14px; background:var(--red); color:#fff; border:3px solid var(--ink); border-radius:999px; font-size:12px; font-weight:900; transform:rotate(10deg); }
body.theme-metro .open-reader-btn { position:absolute; bottom:22px; left:56px; z-index:3; display:inline-flex; align-items:center; gap:8px; padding:13px 24px; background:var(--ink); color:var(--cream); border-radius:999px; box-shadow:4px 4px 0 var(--accent); font-size:14px; font-weight:900; text-decoration:none; }
body.theme-metro .page-browser-head { padding-bottom:14px; border-bottom:0; }
body.theme-metro .page-browser-head h2 { color:var(--teal); font-size:14px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; }
body.theme-metro .page-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding-top:0; }
body.theme-metro .page-tile { padding:10px; background:var(--card); border:3px solid var(--ink); border-radius:14px; box-shadow:4px 4px 0 var(--line); }
body.theme-metro .page-tile:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--accent); }
body.theme-metro .page-tile img, body.theme-metro .locked-preview { aspect-ratio:3/4; border:1px solid var(--line); border-radius:8px; }
body.theme-metro .locked-preview { background:#f2eee2; color:var(--ink); }
body.theme-metro .page-tile strong { padding:8px 0 0; font-size:13px; font-weight:900; }
body.theme-metro .page-tile small { display:block; color:#8b8577; font-size:11px; }
body.theme-metro .archive-section { padding:70px 0; background:var(--cream); }
body.theme-metro .section-title h2 { color:var(--teal); font-family:Arial,Helvetica,sans-serif; font-size:14px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; }
body.theme-metro .archive-grid { display:flex; gap:20px; overflow-x:auto; padding:10px 4px 20px; border-top:0; }
body.theme-metro .archive-item { display:block; flex:0 0 170px; width:170px; min-width:170px; padding:10px; background:var(--card); border:3px solid var(--ink); border-radius:14px; box-shadow:4px 4px 0 var(--line); text-decoration:none; transform:rotate(-2deg); }
body.theme-metro .archive-item:nth-child(even) { transform:rotate(2deg); }
body.theme-metro .archive-item:hover { transform:rotate(0) translateY(-4px); }
body.theme-metro .archive-thumb { display:block; width:100%; aspect-ratio:3/4; height:auto; margin-bottom:8px; object-fit:contain; object-position:center top; background:linear-gradient(160deg,#ffebd2,#fff8ed); border:1px solid var(--line); border-radius:8px; }
body.theme-metro .archive-item time { color:var(--red); font-family:monospace; font-size:11px; font-weight:900; }
body.theme-metro .archive-item time span, body.theme-metro .archive-item time small { display:inline; }
body.theme-metro .archive-item h3 { margin-top:3px; font-size:13px; font-weight:900; }
body.theme-metro .archive-item p { color:#8b8577; font-size:10px; }
body.theme-metro .archive-arrow { display:none; }
body.theme-metro .site-footer { background:var(--cream); color:#6b6558; border-top:3px solid var(--ink); font-family:monospace; }

/* Newsstand Rack (theme-metro) Auth & Account Styling */
body.theme-metro .auth-section {
  background: var(--cream);
  min-height: calc(100vh - 160px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 16px;
}
body.theme-metro .auth-panel {
  width: min(100%, 460px);
  padding: 40px 34px;
  background: var(--card);
  border: 3px solid var(--ink);
  border-radius: 18px;
  box-shadow: 6px 6px 0 var(--ink);
  position: relative;
}
body.theme-metro .auth-panel .section-kicker {
  display: inline-block !important;
  padding: 6px 14px;
  background: var(--teal);
  color: #fff;
  border-radius: 999px;
  font-family: monospace;
  font-size: 11px;
  font-weight: 900;
  transform: rotate(-2deg);
  margin-bottom: 14px;
  letter-spacing: .06em;
}
body.theme-metro .auth-panel h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-style: italic;
  font-weight: 900;
  color: var(--ink);
  margin: 0 0 8px;
  line-height: 1.1;
}
body.theme-metro .auth-panel > p {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 24px;
}
body.theme-metro .auth-panel .form-label {
  display: block;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink);
  margin-bottom: 6px;
}
body.theme-metro .auth-panel .form-control {
  min-height: 48px;
  border: 2px solid var(--ink);
  border-radius: 10px;
  background: #fff;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  padding: 10px 14px;
  box-shadow: 2px 2px 0 var(--line);
  transition: all .15s ease;
}
body.theme-metro .auth-panel .form-control:focus {
  border-color: var(--ink);
  box-shadow: 4px 4px 0 var(--accent);
  outline: none;
  background: #fff;
}
body.theme-metro .auth-panel .btn-danger,
body.theme-metro .auth-panel button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  padding: 12px 24px;
  background: var(--accent);
  color: var(--ink);
  border: 2px solid var(--ink);
  border-radius: 999px;
  box-shadow: 4px 4px 0 var(--ink);
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
  margin-top: 10px;
}
body.theme-metro .auth-panel .btn-danger:hover,
body.theme-metro .auth-panel button[type="submit"]:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--ink);
  background: var(--accent);
  color: var(--ink);
}
body.theme-metro .auth-panel .btn-danger:active,
body.theme-metro .auth-panel button[type="submit"]:active {
  transform: translate(2px, 2px);
  box-shadow: 2px 2px 0 var(--ink);
}
body.theme-metro .auth-links {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 2px dashed var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
}
body.theme-metro .auth-links a {
  color: var(--ink);
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .15s;
}
body.theme-metro .auth-links a:hover {
  color: var(--red);
}

/* Newsstand Rack Account View Styling */
body.theme-metro .account-section {
  background: var(--cream);
  padding: 48px 0 72px;
}
body.theme-metro .account-section .page-heading h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(32px, 5vw, 54px);
  font-style: italic;
  font-weight: 900;
  color: var(--ink);
  margin: 0;
}
body.theme-metro .account-section .page-heading p {
  color: #5b5648;
  font-weight: 700;
  font-size: 15px;
}
body.theme-metro .account-section .section-kicker {
  display: inline-block !important;
  padding: 6px 14px;
  background: var(--teal);
  color: #fff;
  border-radius: 999px;
  font-family: monospace;
  font-size: 11px;
  font-weight: 900;
  transform: rotate(-2deg);
  margin-bottom: 12px;
}
body.theme-metro .account-section .card {
  background: var(--card) !important;
  border: 3px solid var(--ink) !important;
  border-radius: 16px !important;
  box-shadow: 5px 5px 0 var(--ink) !important;
}
body.theme-metro .account-section .card h5 {
  color: var(--ink) !important;
}
body.theme-metro .account-section .btn-outline-danger {
  background: var(--accent) !important;
  color: var(--ink) !important;
  border: 2px solid var(--ink) !important;
  border-radius: 999px !important;
  box-shadow: 3px 3px 0 var(--ink) !important;
  font-weight: 900 !important;
}
body.theme-metro .account-section .btn-outline-danger:hover {
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0 var(--ink) !important;
}
body.theme-metro .account-section h4 {
  color: var(--teal) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  border-bottom: 2px solid var(--ink) !important;
  padding-bottom: 10px !important;
}
body.theme-metro .account-section .edition-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
  padding-top: 14px;
}
body.theme-metro .account-section .edition-card {
  background: var(--card);
  border: 3px solid var(--ink);
  border-radius: 14px;
  box-shadow: 4px 4px 0 var(--line);
  padding: 12px;
  text-decoration: none;
  transition: transform .15s, box-shadow .15s;
}
body.theme-metro .account-section .edition-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--accent);
}
body.theme-metro .account-section .edition-card time {
  color: var(--red);
  font-family: monospace;
  font-size: 11px;
  font-weight: 900;
}
body.theme-metro .account-section .edition-card strong {
  display: block;
  font-size: 13px;
  font-weight: 900;
  color: var(--ink);
  margin-top: 6px;
}
body.theme-metro .account-section .edition-card span {
  display: block;
  color: #8b8577;
  font-size: 11px;
}

/* Alert Styling in Newsstand Rack */
body.theme-metro .alert {
  border: 2px solid var(--ink);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--ink);
  font-weight: 700;
}

@media (max-width:920px) {
  body.theme-newsroom .theme-nav-top, body.theme-metro .theme-nav { align-items:flex-start; flex-direction:column; }
  body.theme-newsroom .front-layout, body.theme-metro .front-layout { grid-template-columns:1fr; }
  body.theme-metro .front-showcase { min-height:390px; }
  body.theme-metro .front-page { width:200px; }
  body.theme-metro .front-page-back { left:36px; }
  body.theme-metro .open-reader-btn { left:36px; bottom:-36px; }
}
@media (max-width:560px) {
  body.theme-newsroom .page-grid, body.theme-metro .page-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.theme-newsroom .archive-item { grid-template-columns:38px 56px 1fr auto; gap:10px; }
  body.theme-metro .theme-nav-top nav { gap:12px; }
  body.theme-metro .theme-auth { flex-wrap:wrap; }
}

.nav-logout-btn {
  background: transparent;
  border: none;
  color: var(--red, #c51f2c);
  font-weight: 700;
  font-size: inherit;
  cursor: pointer;
  padding: 0;
  margin: 0;
}
.nav-logout-btn:hover {
  text-decoration: underline;
}

.site-footer { padding: 32px 0 24px; background: #ffffff; border-top: 1px solid #e5e7eb; color: #4b5563; font-size: 13px; margin-top: 40px; }
.footer-logo-img { max-height: 42px; width: auto; object-fit: contain; }
.footer-tagline { font-size: 13px; color: #6b7280; line-height: 1.4; }
.footer-divider { height: 1px; background: #f3f4f6; margin: 20px 0; }
.footer-copyright { color: #6b7280; font-size: 13px; }

.social-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: #4b5563; background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 50%; text-decoration: none; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
.social-icon-btn:hover { transform: translateY(-3px); box-shadow: 0 4px 12px rgba(0,0,0,0.12); }
.social-facebook:hover { color: #fff; background: #1877f2; border-color: #1877f2; }
.social-x:hover { color: #fff; background: #000000; border-color: #000000; }
.social-instagram:hover { color: #fff; background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); border-color: #dc2743; }
.social-whatsapp:hover { color: #fff; background: #25d366; border-color: #25d366; }
.social-youtube:hover { color: #fff; background: #ff0000; border-color: #ff0000; }
.social-telegram:hover { color: #fff; background: #0088cc; border-color: #0088cc; }

.developer-link { color: #dc2626; font-weight: 600; text-decoration: none; font-size: 13px; transition: all 0.2s ease; }
.developer-link:hover { color: #991b1b; text-decoration: underline; }