/* CINE ARK — atmosphere, hierarchy and comfortable reading. */
[v-cloak] { display:none; }
.ark-panel.ark-chapter-focused { max-width:1000px; padding:28px 32px 60px; }
.ark-chapter-focused>.ark-back { margin-bottom:16px; }
.ark-chapters-heading { margin:0 0 20px; }
.ark-chapters-heading h2 { font-size:clamp(23px,3vw,32px); font-weight:700; line-height:1.25; margin-top:4px; }
.ark-chapter-focused .ark-source-tabs { margin:14px 0; }
.ark-chapter-focused .ark-work-chapter-tools { margin:14px 0; }
.ark-chapter-focused .ark-dex-options { margin:12px 0; }
.ark-chapter-focused .ark-chapter { margin:8px 0; padding:12px 14px; border-radius:9px; }
.ark-chapter-focused .ark-chapter-list-actions { margin:12px 0; }
.ark-chapter-focused .ark-chapter-empty { padding:16px 0; }
.ark-work-details { border-top:1px solid #73304755; margin-top:24px; padding-top:15px; }
.ark-work-details>summary,.ark-edition-tools>summary { cursor:pointer; color:#ca98ac; font-size:12px; padding:8px 0; }
.ark-work-details-content { padding-top:20px; }
.ark-edition-tools { margin:10px 0; }
.ark-edition-tools .ark-dex-search { margin-top:12px; }
@media(max-width:600px) { .ark-panel.ark-chapter-focused { padding:20px 16px 40px; } .ark-chapter-focused .ark-work-chapter-tools { gap:10px; } .ark-chapter-focused .ark-work-chapter-tools label { min-width:130px; } }
.ark-route-preview { max-width:1000px; margin:40px auto; padding:24px; color:#ecdce3; background:#160b13; border:1px solid #6d233b; border-radius:18px; }
.ark-route-preview h1 { font-size:32px; font-weight:700; margin:20px 0; }
.ark-route-preview img { object-fit:cover; border-radius:10px; margin-bottom:20px; }
.ark-route-preview p { line-height:1.9; margin:12px 0; }
.ark-discovery-controls { display:flex; flex-wrap:wrap; gap:14px; align-items:end; margin-bottom:12px; }
.ark-discovery-controls label { display:grid; gap:7px; flex:1; min-width:150px; color:#bea4b3; font-size:11px; }
.ark-discovery-controls select,.ark-quality-panel select,.ark-atmosphere-panel select { min-height:44px; width:100%; color:#f5e2ec; background:#180c15; border:1px solid #6d2b4366; border-radius:9px; padding:10px; font-size:12px; }
.ark-filter-explanation { font-size:10px; color:#b18d9f; line-height:1.8; margin-bottom:24px; }
.ark-atmosphere-panel { max-width:520px; margin:40px auto; background:#140c13; border:1px solid #7a3047; border-radius:20px; padding:30px; }
.ark-atmosphere-panel h2 { font-size:26px; font-weight:700; margin:10px 0; }
.ark-atmosphere-panel>label { display:grid; gap:10px; margin:24px 0; font-size:13px; color:#e2c8d5; }
.ark-atmosphere-panel .ark-motion-toggle { display:flex; align-items:center; gap:12px; }
.ark-motion-toggle input { width:20px; height:20px; accent-color:#e72a4e; }
.ark-motion-off :is(.ark-rune-field span,.floating-rune,.runes-layer,.inner-brand,.pentagram-overlay,.sinister-msg,.ember,.click-prompt) { animation:none !important; transition:none !important; }
.ark-motion-off .ember { display:none; }
.ark-runes-off :is(.runes-layer,.floating-rune) { visibility:hidden; }
.ark-updates-panel { margin:28px 0 48px; padding:24px; border:1px solid #74243d55; border-radius:16px; background:#180b1322; }
.ark-updates-panel .ark-section-heading { flex-wrap:wrap; }
.ark-updates-panel .ark-section-heading>button,.ark-quality-panel .ark-section-heading>button { margin-left:auto; }
.ark-update-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:14px; margin-top:20px; }
.ark-update-card { display:grid; gap:8px; border:1px solid #6a2c4255; border-radius:12px; padding:18px; background:#160d14; }
.ark-update-card strong { font-size:13px; }
.ark-update-card>span { font-size:11px; color:#b69daa; }
.ark-update-card small { color:#a48496; font-size:10px; line-height:1.7; }
.ark-update-card p { color:#f19caf; font-size:11px; line-height:1.6; }
.ark-update-card .ark-toolbar { margin:8px 0 0; }
.ark-update-card .ark-toolbar button { min-height:36px; padding:8px; font-size:10px; }
.ark-update-card>span.ark-new-badge,.ark-cover-update { color:#ffd3e0; border:1px solid #c5375c77; border-radius:5px; background:#9e1533; padding:4px 7px; font-size:10px; width:fit-content; }
.ark-cover-update { position:absolute; bottom:10px; left:8px; z-index:2; pointer-events:none; }
.ark-quality-panel { padding:22px; background:#22101b88; border:1px solid #7a2b4555; border-radius:16px; margin-bottom:28px; }
.ark-quality-panel .ark-section-heading { flex-wrap:wrap; gap:14px; }
.ark-quality-panel h3 { font-size:18px; font-weight:700; }
.ark-quality-panel label { display:grid; gap:8px; font-size:11px; color:#c7a6b8; max-width:420px; }
.ark-quality-counts { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
.ark-quality-counts span { padding:7px 10px; border-radius:7px; background:#4d1c3033; color:#e2a3bb; font-size:11px; }
.ark-quality-result { flex-basis:100%; color:#bca0af; font-size:11px; line-height:1.7; }
.ark-share-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:24px 0; }
.ark-share-row span { font-size:12px; color:#e3a4bc; overflow-wrap:anywhere; }
.ark-related-section { margin-top:42px; padding-top:28px; border-top:1px solid #72304744; }
.ark-related-section .ark-section-heading h3 { font-size:18px; font-weight:700; }
.ark-ambient-toggle { display:grid; place-items:center; height:34px; width:32px; flex-shrink:0; color:#cf8ba1; }
.ark-card-edit { min-width:24px; min-height:24px; margin-left:4px; font-size:10px; color:#c88b9f; }
.ark-card-title a:focus-visible,.ark-ambient-toggle:focus-visible { outline:2px solid #f67c9c; outline-offset:3px; }
.ark-motion-off .ark-rune-field { transition:none; }
.ark-motion-off .blood-curtain { display:none; }
@media(prefers-reduced-motion:reduce) { .pentagram-overlay,.sinister-msg,.click-prompt,.ember { animation:none !important; } .ember { display:none; } }
@media(max-width:700px) {
  .ark-portal .ark-topbar>a.ark-header-search { display:none; }
  .ark-portal .ark-account-actions button:has(.fa-sliders)>span { display:none; }
  .ark-portal .ark-account-actions button:has(.fa-arrow-right-from-bracket) { font-size:0; }
  .ark-portal .ark-account-actions button:has(.fa-arrow-right-from-bracket)>i { font-size:12px; }
  .ark-portal .ark-account-actions { gap:5px; flex-shrink:0; }
}
@media(max-width:700px) and (pointer:coarse) { .ark-portal .ark-account-actions .ark-btn,.ark-portal .ark-menu-toggle,.ark-ambient-toggle { min-height:44px; min-width:40px; padding-inline:7px; } .ark-portal .ark-wordmark { font-size:24px; } }
@media(max-width:700px) { .ark-discovery-controls { gap:10px; } .ark-discovery-controls label { min-width:140px; } .ark-updates-panel { padding:18px; } .ark-update-grid { grid-template-columns:1fr; } .ark-updates-panel .ark-section-heading>button { margin-left:0; } .ark-atmosphere-panel { margin:20px 12px; padding:24px; } .ark-portal .ark-main-nav { max-width:calc(100vw - 48px); } .ark-portal .ark-topbar { gap:5px; } .ark-ambient-toggle { width:26px; } .ark-portal .ark-catalog-grid .ark-card-favorite { width:36px; height:36px; } }
.ark-spotlight { position:relative; min-height:470px; display:flex; align-items:center; isolation:isolate; margin:0 -24px 26px; overflow:hidden; background:#0c0609; }
.ark-spotlight-backdrop { position:absolute; z-index:-3; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 30%; opacity:.52; }
.ark-spotlight-shade { position:absolute; z-index:-2; inset:0; background:linear-gradient(0deg,#020202 0%,transparent 65%),linear-gradient(90deg,#020202f5 0%,#060206c9 35%,#10030933 100%); }
.ark-spotlight-content { width:100%; display:flex; align-items:center; gap:48px; padding:64px 24px 100px; }
.ark-spotlight-cover { width:200px; height:280px; object-fit:cover; flex-shrink:0; border:1px solid #c3697955; border-radius:7px; transform:rotate(-1.5deg); box-shadow:0 14px 50px #000b,0 0 35px #be16291c; }
.ark-spotlight-info { max-width:850px; min-width:0; }
.ark-spotlight-meta { display:flex; flex-wrap:wrap; align-items:center; gap:14px; font-size:10px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:#bdabb2; }
.ark-spotlight-meta>span+span { border-left:1px solid #80616c77; padding-left:14px; }
.ark-spotlight-meta i { color:#ee465d; }
.ark-spotlight-info h1 { font-size:clamp(28px,3.5vw,48px); line-height:1.08; font-weight:900; text-transform:uppercase; letter-spacing:-.04em; margin:22px 0; overflow-wrap:anywhere; }
.ark-spotlight-info>p { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; color:#c5b9be; font-size:15px; line-height:1.7; max-width:700px; }
.ark-spotlight-actions { display:flex; gap:12px; margin-top:28px; }
.ark-spotlight-actions .ark-btn { border-radius:40px; min-height:46px; padding:12px 24px; text-transform:uppercase; font-size:12px; }
.ark-spotlight-actions .ark-btn-primary { background:linear-gradient(110deg,#dc2037,#940c22); box-shadow:0 0 24px #c51e3833; }
.ark-spotlight-thumbs { position:absolute; bottom:28px; right:24px; display:flex; gap:10px; max-width:calc(100% - 48px); overflow-x:auto; padding:5px; }
.ark-spotlight-thumbs button { width:42px; height:60px; flex-shrink:0; padding:0; border:1px solid #a6788255; border-radius:5px; overflow:hidden; opacity:.55; transition:opacity .2s,transform .2s; }
.ark-spotlight-thumbs img { width:100%; height:100%; object-fit:cover; }
.ark-spotlight-thumbs button.is-active { opacity:1; outline:2px solid #f23a56; outline-offset:2px; transform:translateY(-2px); }
.ark-spotlight-thumbs button span { font-size:8px; }
.ark-shelf { margin:12px 0 56px; scroll-margin-top:90px; }
.ark-section-heading { display:flex; align-items:center; gap:13px; margin-bottom:26px; }
.ark-section-icon { display:grid; place-items:center; background:#a41a3224; color:#fb4b69; width:42px; height:42px; border-radius:7px; font-size:20px; flex-shrink:0; }
.ark-section-heading h2 { font-size:17px; font-weight:600; letter-spacing:.035em; text-transform:uppercase; color:#f4ebef; line-height:1.5; }
.ark-section-heading p { text-transform:uppercase; color:#a28d97; font-size:11px; letter-spacing:.055em; line-height:1.6; }
.ark-section-heading>a { margin-left:auto; white-space:nowrap; color:#d79eac; font-size:11px; }
.ark-cover-rail { display:flex; gap:18px; overflow-x:auto; padding:0 4px 12px; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:#762035 transparent; }
.ark-rail-card { flex:0 0 150px; min-width:0; text-align:left; scroll-snap-align:start; }
.ark-rail-art { display:block; position:relative; height:210px; border-radius:6px; overflow:hidden; background:#24101a; }
.ark-rail-art>img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.ark-rail-card:hover img { transform:scale(1.04); }
.ark-rail-art small { position:absolute; top:8px; right:8px; border-radius:3px; font-size:8px; text-transform:uppercase; padding:3px 5px; color:white; background:#12090bd9; }
.ark-rail-card>strong { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:12px; margin-top:9px; color:#e7dce1; }
.ark-rail-card>span:last-child { color:#a28695; font-size:9px; }
.ark-poster-hit { position:absolute; inset:0; z-index:1; width:100%; height:100%; cursor:pointer; }
.ark-poster-hit:focus-visible { outline:3px solid #ff4963; outline-offset:-3px; }
.ark-catalog-grid .ark-card-delete { z-index:2; }
.ark-layout-switch { display:flex; padding:4px; gap:4px; border:1px solid #61304155; background:#120b10; border-radius:9px; margin-left:auto; }
.ark-layout-switch button { width:32px; height:32px; color:#ab8998; border-radius:5px; }
.ark-layout-switch .is-active { background:#a81530; color:#fff; }
.ark-menu-toggle,.ark-header-search { color:#b9a3ad; width:32px; height:36px; display:grid; place-items:center; }
button.ark-menu-toggle:focus-visible,a.ark-header-search:focus-visible,.ark-rail-card:focus-visible { outline:2px solid #fa6c84; outline-offset:4px; }
.ark-portal { max-width:1380px; }
.ark-wordmark { font-family:'Bangers',cursive; font-size:30px; letter-spacing:2px; color:#fff1f1; white-space:nowrap; }
.ark-wordmark>span { color:#f0384c; }
.ark-main-nav { display:flex; gap:24px; font-size:13px; color:#c5b5bd; margin-right:auto; }
.ark-main-nav a:hover { color:#ff6578; }
.ark-portal .ark-topbar { gap:28px; padding-bottom:22px; flex-wrap:wrap; }
.ark-portal .ark-rank { display:none; }
.ark-feature { display:grid; grid-template-columns:1.6fr 1fr; gap:40px; align-items:center; padding:48px; margin-bottom:40px; border:1px solid #72243877; border-radius:22px; background:radial-gradient(ellipse at 90% 20%,#8e182b55,transparent 65%),linear-gradient(125deg,#1d0c14,#0d0b0f); overflow:hidden; }
.ark-feature h1 { font-size:clamp(30px,3.7vw,50px); line-height:1.18; font-weight:900; letter-spacing:-.045em; margin:16px 0; }
.ark-feature h1 em { color:#f44c61; font-style:normal; }
.ark-feature-copy>p { font-size:14px; line-height:1.9; color:#bcaeb6; max-width:440px; }
.ark-feature-actions { display:flex; flex-wrap:wrap; gap:12px; margin:24px 0; }
.ark-feature-actions .ark-btn { max-width:100%; white-space:normal; text-align:left; }
.ark-feature-footnote { font-size:11px; color:#c095a2; }
.ark-feature-book { position:relative; justify-self:center; width:220px; height:300px; border-radius:12px; overflow:hidden; border:1px solid #da566b77; box-shadow:14px 18px 0 #490e2466,0 20px 55px #0009; text-align:left; background:#270f1b; }
.ark-feature-book>img { width:100%; height:100%; object-fit:cover; }
.ark-feature-book>span { position:absolute; inset:auto 0 0; padding:38px 18px 16px; background:linear-gradient(transparent,#10050cf5 45%); display:grid; gap:5px; }
.ark-feature-book small { font-size:9px; color:#ff8c9d; letter-spacing:.15em; }
.ark-feature-book strong { font-size:17px; line-height:1.4; }
.ark-feature-book span span { font-size:11px; color:#c7a9b7; }
.ark-missions-disclosure { border-block:1px solid #67304644; margin:26px 0; }
.ark-missions-disclosure summary { cursor:pointer; padding:16px 0; font-size:12px; color:#e393a4; }
.ark-missions-disclosure summary span { float:right; color:#a38a99; }
.ark-missions-disclosure section { margin:12px 0 24px; }
.ark-discovery-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:32px; align-items:start; }
.ark-catalog-section { min-width:0; scroll-margin-top:24px; }
.ark-portal .ark-library-tools { gap:16px; flex-wrap:wrap; }
.ark-portal .ark-search { flex:1; min-width:180px; }
.ark-portal .ark-catalog-grid { grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:18px; }
.ark-sort { display:flex; justify-content:flex-end; align-items:center; gap:10px; font-size:11px; color:#b9a3af; margin:-8px 0 20px; }
.ark-sort select { background:#1b1017; color:#f1d7e3; padding:8px; border:1px solid #663348; border-radius:8px; }
.ark-catalog-empty { padding:32px; border:1px dashed #713044; border-radius:12px; color:#c9b3bf; font-size:14px; line-height:1.8; }
.ark-discovery-aside { background:#130d13; border:1px solid #68304566; padding:24px 20px; border-radius:16px; scroll-margin-top:24px; }
.ark-discovery-aside h2 { font-weight:700; font-size:20px; margin:6px 0; }
.ark-discovery-aside>p { font-size:12px; line-height:1.7; color:#b7a0ae; margin-bottom:16px; }
.ark-recent-row { display:flex; width:100%; align-items:center; gap:10px; padding:15px 0; border-bottom:1px solid #62304444; text-align:left; }
.ark-recent-row:hover strong { color:#ff899d; }
.ark-recent-position { font-family:'Bangers',cursive; font-size:23px; color:#d65a76; }
.ark-recent-row>img { width:42px; height:62px; object-fit:cover; border-radius:5px; }
.ark-recent-row>span:last-of-type { flex:1; min-width:0; }
.ark-recent-row strong { display:block; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.ark-recent-row small { font-size:10px; color:#b49aa9; }
.ark-recent-row>i { font-size:10px; color:#d36a84; }
.ark-discovery-note { display:grid; gap:10px; margin-top:24px; padding:20px 15px; background:#32101e55; border-radius:10px; }
.ark-discovery-note i { color:#f06985; }
.ark-discovery-note strong { font-size:12px; }
.ark-discovery-note span { font-size:11px; line-height:1.8; color:#bca4b2; }
.ark-site-footer { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:64px; padding-top:24px; border-top:1px solid #6f2e4044; }
.ark-site-footer p,.ark-site-footer a { font-size:12px; color:#b596a5; }
.ark-site-footer a { margin-left:auto; }
@media(max-width:1050px) { .ark-discovery-layout { grid-template-columns:minmax(0,1fr) 260px; gap:20px; } .ark-portal .ark-account-actions { margin-left:auto; } .ark-feature { padding:30px; } }
@media(max-width:760px) { .ark-discovery-layout { grid-template-columns:1fr; } .ark-feature { grid-template-columns:1fr 140px; gap:20px; padding:24px; } .ark-feature-book { width:140px; height:215px; } .ark-feature h1 { font-size:29px; } .ark-main-nav { order:3; width:100%; } .ark-portal .ark-catalog-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } }
@media(max-width:520px) { .ark-feature { grid-template-columns:1fr; padding:24px; } .ark-feature-book { display:none; } .ark-portal .ark-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ark-portal .ark-topbar { gap:16px; } .ark-account-actions { width:100%; } .ark-feature h1 { font-size:34px; } .ark-missions-disclosure summary span { display:none; } }
body {
  background-image: radial-gradient(ellipse at 15% 10%, #64132318, transparent 42%), radial-gradient(ellipse at 95% 70%, #57122814, transparent 45%);
  background-attachment: fixed;
}
body:has(.ark-overlay) { overflow:hidden; }
.ark-eyebrow { display:block; color:#dc788b; font-size:10px; font-weight:700; letter-spacing:.2em; line-height:1.8; }
.ark-overlay { background:radial-gradient(ellipse at 12% 0, #58142638, transparent 45%), radial-gradient(ellipse at 95% 85%, #4d112226, transparent 50%), #09080b; }
.ark-overlay :is(input,select,textarea) { outline:none; }
.ark-overlay :is(input,select,textarea):focus-visible { border-color:#dd6a80; box-shadow:0 0 0 3px #e35a731a; }
.ark-overlay :is(button,a):focus-visible, .ark-filter:focus-visible { outline:2px solid #f89aab; outline-offset:4px; }
.ark-overlay::-webkit-scrollbar, .ark-pages::-webkit-scrollbar { width:8px; }
.ark-overlay::-webkit-scrollbar-thumb, .ark-pages::-webkit-scrollbar-thumb { background:#54212e; border-radius:10px; }
.ark-overlay button { font-size:13px; min-height:46px; }
.ark-overlay .ark-note { font-size:13px; color:#baa9b3; }
.ark-back { margin-bottom:28px; }
.ark-panel.ark-admin-panel, .ark-panel.ark-work-panel { max-width:1120px; padding:40px 40px 80px; }
.ark-page-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin:4px 0 32px; }
.ark-page-heading h2 { font-size:clamp(27px,3.4vw,40px); font-weight:700; letter-spacing:-.045em; margin:8px 0; line-height:1.2; }
.ark-page-heading p { color:#b5a2ad; font-size:14px; line-height:1.8; }
.ark-heading-icon { display:grid; place-items:center; width:70px; height:70px; flex-shrink:0; background:linear-gradient(145deg,#471723,#211017); border:1px solid #84324466; border-radius:22px; color:#f18ca1; font-size:24px; box-shadow:0 0 50px #a2283e14; }

/* A single lightweight, non-interactive layer follows every screen and dialog. */
.ark-rune-field { position:fixed; inset:0; z-index:13000; overflow:hidden; pointer-events:none; user-select:none; transition:opacity .5s; }
.ark-rune-field span { position:absolute; color:#ff242e; font-family:'Noto Sans Runic','Segoe UI Historic',serif; font-size:calc(var(--rune-size) * 1.15); line-height:1; opacity:.4; text-shadow:0 0 6px #ff1728,0 0 18px #ef0013aa,0 0 36px #d9001a66; animation:ark-rune-float var(--rune-duration) ease-in-out var(--rune-delay) infinite alternate,ark-rune-pulse var(--rune-pulse,4.8s) ease-in-out var(--rune-delay) infinite; }
.ark-rune-field.is-reading { opacity:.25; }
@keyframes ark-rune-float {
  0% { transform:translate3d(0,32px,0) rotate(-9deg); }
  100% { transform:translate3d(var(--rune-drift),-44px,0) rotate(12deg); }
}
@keyframes ark-rune-pulse {
  0%,100% { opacity:.28; }
  50% { opacity:.78; }
}

/* Library */
.ark-site-header { margin-bottom:36px; }
.ark-site-header .blood-title { font-size:clamp(4.4rem,9vw,7rem); letter-spacing:.075em; line-height:1.2; margin:8px 0; filter:drop-shadow(0 8px 30px #b8172438); }
.ark-site-header .ark-brand-caption { color:#bb929d; font-size:11px; letter-spacing:.24em; margin-top:14px; }
.ark-topbar { border-bottom-color:#a1536628; }
.mission-card { border-color:#63203244 !important; background:linear-gradient(140deg,#200e1555,#09080c) !important; }
.mission-card p:first-child { font-size:11px; color:#c2b2ba; }
.mission-card p+p { font-size:10px; margin-top:5px; color:#e5687f; }
.ark-mission-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); gap:16px; }
.ark-library-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin:0 0 24px; }
.ark-library-heading h2 { font-size:27px; font-weight:700; letter-spacing:-.04em; margin-top:3px; }
.ark-library-heading>span { color:#ac8f9c; font-size:12px; padding-bottom:5px; }
.ark-catalog-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:24px; }
.ark-catalog-grid .movie-card { border:1px solid #71314566; border-radius:18px; background:#100b10; box-shadow:0 10px 25px #0004; overflow:hidden; }
.ark-catalog-grid .aura-high { box-shadow:0 8px 28px #a2193020; border-color:#ad405a80; }
.ark-catalog-grid .movie-card:hover { border-color:#cf647d; box-shadow:0 12px 36px #741a3433; }
.ark-catalog-grid .movie-card .p-3 { padding:15px; background:linear-gradient(155deg,#1d1017,#0c0b10); }
.ark-cover-type { position:absolute; top:12px; left:12px; padding:5px 9px; border-radius:6px; background:#180b15dd; border:1px solid #d9879d44; color:#f9dce5; font-size:9px; font-weight:700; letter-spacing:.05em; backdrop-filter:blur(8px); }
.ark-card-title { font-size:13px; color:#f0e5eb; font-weight:700; line-height:1.5; min-height:39px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-bottom:14px; }
.ark-card-title.is-editable { cursor:pointer; }
.ark-card-title.is-editable:hover { color:#fa9ab0; }
.ark-catalog-grid .ark-read-button { font-size:11px; border-radius:10px; min-height:44px; }
.ark-catalog-grid .ark-step { width:32px; height:32px; }
.ark-catalog-grid .movie-card .p-3>div>span { font-size:12px; color:#de8a9d; }

/* Administration */
.ark-admin-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:24px; }
.ark-admin-stats>div { position:relative; padding:24px; background:linear-gradient(135deg,#29111c,#110d13); border:1px solid #6f2d4266; border-radius:18px; }
.ark-admin-stats strong { display:block; font-size:32px; font-weight:700; letter-spacing:-.04em; line-height:1.3; color:#fff0f5; }
.ark-admin-stats span { display:block; color:#ba9fae; font-size:12px; margin-top:6px; }
.ark-admin-stats i { position:absolute; right:22px; top:25px; color:#dd6f8c; font-size:19px; }
.ark-admin-panel>.ark-toolbar { margin:24px 0 34px; padding:18px; background:#180e1680; border-color:#8a3b4e44; }
.ark-admin-list-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:18px; }
.ark-admin-list-heading h3 { font-size:18px; font-weight:700; letter-spacing:-.02em; }
.ark-admin-list-heading .ark-search input { border:0; padding:0; background:transparent; min-height:0; box-shadow:none; border-radius:0; }
.ark-admin-row { gap:20px; flex-wrap:wrap; padding:16px 20px; background:linear-gradient(110deg,#20111a,#100d13); border-color:#89425c3b; border-radius:16px; transition:border-color .2s; }
.ark-admin-row:hover { border-color:#c4627c88; }
.ark-admin-identity { display:flex; align-items:center; gap:18px; flex:1; min-width:170px; }
.ark-admin-identity>img, .ark-admin-cover { width:48px; height:68px; border-radius:7px; object-fit:cover; flex-shrink:0; background:#311421; }
.ark-admin-cover { display:grid; place-items:center; color:#d27c97; }
.ark-admin-identity>div { min-width:0; }
.ark-admin-identity strong { display:block; font-size:14px; font-weight:700; overflow-wrap:anywhere; }
.ark-admin-identity>div>span { display:block; font-size:11px; color:#ba9fab; margin-top:7px; }
.ark-status-dot { padding:0 8px; color:#ec7d9b; }
.ark-admin-row>.ark-toolbar { gap:8px; }
.ark-admin-row .ark-toolbar button { min-height:40px; font-size:11px; padding:10px 14px; border-radius:10px; }

/* Work details */
.ark-work-hero { display:flex; gap:34px; align-items:center; padding:30px; background:radial-gradient(ellipse at 0 0,#7a254133,transparent 70%),linear-gradient(120deg,#21111b,#0e0c12); border:1px solid #80405666; border-radius:24px; margin:0 0 28px; }
.ark-work-cover { width:148px; height:220px; object-fit:cover; flex-shrink:0; border-radius:12px; border:1px solid #cf819040; box-shadow:0 15px 35px #0008; }
.ark-work-hero>div { min-width:0; }
.ark-work-hero h2 { font-size:clamp(26px,3.8vw,43px); font-weight:700; letter-spacing:-.045em; line-height:1.2; margin:12px 0 18px; overflow-wrap:anywhere; }
.ark-work-hero p { font-size:13px; color:#bca6b3; margin-top:18px; line-height:1.8; }
.ark-work-badges { display:flex; flex-wrap:wrap; gap:9px; }
.ark-work-badges>span { display:inline-flex; gap:7px; align-items:center; padding:6px 11px; border:1px solid #a6546e55; border-radius:7px; background:#7e2d4822; color:#e8b9cb; font-size:11px; }
.ark-work-panel .ark-synopsis { padding:24px 28px; border:1px solid #86455844; border-left:3px solid #b24665; background:#1c101850; border-radius:14px; }
.ark-work-panel .ark-synopsis h3 { font-size:14px; color:#f0bacd; }
.ark-work-panel .ark-synopsis p { font-size:14px; line-height:1.95; color:#cdbcc7; }
.ark-work-panel .ark-source-tabs { padding:6px; border:1px solid #843d5355; background:#130d14; border-radius:15px; gap:6px; margin:28px 0 20px; }
.ark-work-panel .ark-source-tabs button { border:0; background:transparent; color:#baa0af; font-size:13px; min-height:48px; border-radius:10px; }
.ark-work-panel .ark-source-tabs .ark-btn-primary { background:linear-gradient(120deg,#a22243,#64112b); color:#fff0f7; box-shadow:0 4px 15px #911f3b22; }
.ark-work-panel>section { padding:24px; border:1px solid #81405a40; border-radius:20px; background:#130d1480; }
.ark-work-panel>section>.ark-note:first-child { margin-top:0; }
.ark-work-panel .ark-dex-selected { padding-bottom:18px; border-bottom:1px solid #a4617928; align-items:center; }
.ark-work-panel .ark-dex-selected strong { font-size:17px; }
.ark-work-panel .ark-dex-options { padding:18px; background:#20121d66; border:1px solid #87465b33; border-radius:14px; }
.ark-empty-state { margin:24px 0; padding:36px 24px; border:1px dashed #9e526966; border-radius:16px; background:radial-gradient(ellipse at 50% 0,#7c254024,transparent 75%); text-align:center; color:#bfa6b4; line-height:1.8; }
.ark-empty-state>i { display:block; font-size:29px; color:#bd5776; margin-bottom:16px; }
.ark-empty-state h3 { color:#f1d4e1; font-size:16px; font-weight:700; margin-bottom:8px; }
.ark-empty-state p { font-size:13px; max-width:460px; margin:auto; }

/* Login and registration */
.ark-auth-overlay { align-items:center; padding:40px 28px; }
.ark-auth-scene { display:grid; grid-template-columns:minmax(0,1fr) 440px; gap:70px; align-items:center; width:100%; max-width:1030px; margin:auto; position:relative; }
.ark-auth-story { padding:24px 0; }
.ark-auth-story>h2 { font-size:clamp(32px,3.5vw,47px); font-weight:700; letter-spacing:-.05em; line-height:1.25; color:#fbecf3; }
.ark-auth-story h2 em { font-style:normal; color:#f181a2; }
.ark-auth-story>p { color:#ba9daa; font-size:14px; line-height:1.95; margin-top:22px; max-width:390px; }
.ark-auth-seal { position:relative; display:grid; place-items:center; width:116px; height:116px; margin:34px 0; border:1px solid #c65a7a66; border-radius:50%; background:radial-gradient(circle,#8e294330,transparent 72%); box-shadow:0 0 60px #a6244318; }
.ark-auth-seal::before { content:''; position:absolute; inset:10px; border:1px dashed #bb537666; border-radius:50%; }
.ark-auth-seal span { position:absolute; inset:-10px; display:grid; place-items:center; font-family:'Noto Sans Runic',serif; font-size:14px; color:#df6d91; letter-spacing:8px; transform:rotate(-15deg); opacity:.6; }
.ark-auth-seal i { font-size:32px; color:#ffaac6; padding:18px; border-radius:50%; background:#1a0b12; z-index:1; }
.ark-auth-perks { display:flex; flex-direction:column; gap:15px; margin-top:28px; font-size:12px; color:#d5b4c4; }
.ark-auth-perks i { width:24px; color:#e16e91; }
.ark-auth-scene .ark-auth-panel { max-width:none; padding:30px 32px; border-color:#a2486366; border-radius:24px; background:linear-gradient(150deg,#2b1420,#110d15 65%); box-shadow:0 30px 90px #0007,0 0 60px #85294115; }
.ark-auth-scene .ark-auth-panel .ark-back { margin-bottom:10px; }
.ark-auth-scene .ark-auth-panel h2 { font-size:25px; letter-spacing:-.04em; }
.ark-auth-scene .ark-auth-panel>.ark-note { font-size:12px; margin:14px 0 24px; }
.ark-auth-panel .ark-form { gap:18px; }
.ark-auth-panel .ark-form label { font-size:12px; font-weight:600; color:#d4b8c7; }
.ark-auth-panel .ark-form input { background:#100c13; border-color:#86546a66; min-height:49px; padding:12px 14px; border-radius:10px; }
.ark-auth-panel .ark-form input:-webkit-autofill { -webkit-box-shadow:0 0 0 1000px #201621 inset; -webkit-text-fill-color:#f8edf3; caret-color:#f8edf3; }
.ark-auth-panel .ark-auth-emblem { background:linear-gradient(140deg,#a52f51,#4a1529); box-shadow:0 8px 30px #97244922; margin-top:8px; }
.ark-auth-panel .ark-form button[type=submit] { margin-top:6px; min-height:49px; font-size:13px; }

@media(min-width:901px) { .ark-auth-panel .ark-auth-emblem { display:none; } }
@media(max-width:900px) {
  .ark-auth-scene { grid-template-columns:minmax(0,1fr); max-width:480px; gap:0; }
  .ark-auth-story { display:none; }
  .ark-admin-row>.ark-toolbar { width:100%; justify-content:flex-end; }
  .ark-catalog-grid { gap:18px; }
}
@media(max-width:600px) {
  .ark-panel.ark-admin-panel, .ark-panel.ark-work-panel { padding:22px 18px 50px; }
  .ark-page-heading { gap:12px; margin:4px 0 24px; }
  .ark-page-heading h2 { font-size:27px; }
  .ark-page-heading p { font-size:12px; }
  .ark-heading-icon { width:48px; height:48px; border-radius:14px; font-size:17px; }
  .ark-admin-stats { gap:8px; }
  .ark-admin-stats>div { padding:17px 12px; border-radius:13px; }
  .ark-admin-stats strong { font-size:25px; }
  .ark-admin-stats span { font-size:10px; }
  .ark-admin-stats i { display:none; }
  .ark-admin-list-heading { align-items:stretch; flex-direction:column; gap:14px; }
  .ark-admin-list-heading .ark-search { max-width:none; }
  .ark-admin-row { padding:14px; }
  .ark-admin-row>.ark-toolbar { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .ark-admin-row .ark-toolbar button { font-size:10px; padding:9px 6px; gap:5px; }
  .ark-admin-identity strong { font-size:13px; }
  .ark-work-hero { padding:20px 16px; gap:18px; border-radius:18px; }
  .ark-work-cover { width:88px; height:132px; border-radius:8px; }
  .ark-work-hero h2 { font-size:25px; margin:8px 0 12px; }
  .ark-work-hero .ark-eyebrow { font-size:8px; letter-spacing:.12em; }
  .ark-work-hero p { display:none; }
  .ark-work-badges { gap:6px; }
  .ark-work-badges>span { font-size:9px; padding:4px 7px; }
  .ark-work-panel .ark-synopsis { padding:20px; }
  .ark-work-panel .ark-synopsis p { font-size:13px; }
  .ark-work-panel>section { padding:17px; border-radius:16px; }
  .ark-work-panel .ark-dex-options { padding:12px; }
  .ark-work-panel .ark-dex-options label { min-width:110px; }
  .ark-empty-state { padding:26px 16px; }
  .ark-auth-overlay { padding:24px 18px; }
  .ark-auth-scene .ark-auth-panel { padding:26px 24px; }
  .ark-library-heading { align-items:start; flex-direction:column; gap:6px; }
  .ark-library-heading h2 { font-size:24px; }
  .ark-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  .ark-catalog-grid .movie-card .p-3 { padding:12px; }
  .ark-card-title { font-size:12px; }
  .ark-cover-type { font-size:8px; padding:4px 7px; top:8px; left:8px; }
  .ark-rune-field span { font-size:calc(var(--rune-size) * .95); }
  .ark-site-header .ark-brand-caption { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) {
  .ark-rune-field span, .floating-rune, .runes-layer { animation:none !important; }
  .ark-rune-field { transition:none; }
  .ark-admin-row { transition:none; }
}

/* Reader: compact tools, full chapter directory and an uninterrupted canvas. */
.ark-reader .ark-reader-header { display:block; padding:12px 22px 10px; background:linear-gradient(130deg,#1c1018,#0e0c11); border-bottom:1px solid #77354b55; }
.ark-reader-topline { display:flex; align-items:center; gap:14px; min-width:0; }
.ark-reader-heading { flex:1; min-width:0; }
.ark-reader-heading strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; font-weight:700; color:#f8eaf1; }
.ark-reader-heading>span { display:block; margin-top:3px; color:#c29cab; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ark-reader .ark-reader-back { width:38px; min-height:38px; padding:8px; flex-shrink:0; }
.ark-reader-header-actions { display:flex; gap:8px; flex-shrink:0; }
.ark-reader .ark-reader-header-actions button { min-height:38px; padding:9px 12px; border-radius:9px; font-size:11px; }
.ark-reader-settings { display:flex; align-items:center; flex-wrap:wrap; gap:12px 18px; margin-top:12px; padding-top:10px; border-top:1px solid #ffffff0a; }
.ark-reader .ark-reader-settings label { display:flex; align-items:center; gap:8px; color:#b99fae; font-size:11px; }
.ark-reader .ark-reader-settings select { min-height:34px; padding:7px 10px; width:auto; max-width:190px; font-size:11px; border-color:#70435655; background:#100c13; border-radius:7px; }
.ark-reader-settings .ark-source-link { font-size:11px; margin-left:auto; }
.ark-reader .ark-reader-settings .ark-sync-state { font-size:10px; color:#c39eac; flex-basis:auto; }
.ark-reader .ark-reader-settings>button { min-height:34px; padding:7px 12px; font-size:11px; }
.ark-reader .ark-error { border-radius:0; border-width:0 0 1px; font-size:12px; }
.ark-reader-content { position:relative; }
.ark-reader .ark-pages { padding:0 12px; scrollbar-gutter:stable both-edges; }
.ark-reader .ark-pages img { max-width:var(--reader-width); }
.ark-reader .ark-pages.paged { display:flex; align-items:center; justify-content:center; }
.ark-reader .ark-pages.paged img { max-width:min(100%,var(--reader-width)); max-height:100%; width:auto; object-fit:contain; }
.ark-reader-navigation { position:relative; display:grid; grid-template-columns:minmax(110px,170px) minmax(0,380px) minmax(110px,170px); justify-content:space-between; align-items:center; gap:18px; padding:12px 22px max(12px,env(safe-area-inset-bottom)); background:#110d13; border-top:1px solid #66314755; flex-shrink:0; }
.ark-reader-progress-track { position:absolute; left:0; top:-1px; width:100%; height:2px; background:#39202a; }
.ark-reader-progress-track>span { display:block; height:100%; background:#ed476c; box-shadow:0 0 12px #ff325d66; }
.ark-reader .ark-reader-navigation>button { padding:10px 14px; font-size:12px; min-height:42px; border-radius:10px; }
.ark-reader-page-controls { display:grid; gap:6px; min-width:0; }
.ark-reader-page-navigation { display:flex; align-items:center; justify-content:center; gap:12px; }
.ark-reader-page-navigation.is-rtl { flex-direction:row-reverse; }
.ark-reader .ark-reader-page-navigation>button { min-height:30px; height:30px; width:32px; padding:6px; border-radius:7px; font-size:11px; background:#24131e; border-color:#72415555; }
.ark-reader-page-navigation label { display:flex; align-items:center; gap:7px; white-space:nowrap; color:#c9adba; font-size:11px; }
.ark-reader .ark-reader-page-controls input[type=number] { min-height:30px; height:30px; width:54px; padding:3px 5px; text-align:center; font-size:12px; border-radius:6px; color:#fff0f5; }
.ark-reader-page-controls input[type=range] { appearance:none; -webkit-appearance:none; height:14px; min-height:0; width:100%; padding:0; background:transparent; border:0; cursor:pointer; accent-color:#e8496a; }
.ark-reader-page-controls input[type=range]::-webkit-slider-runnable-track { height:3px; background:#603447; border-radius:5px; }
.ark-reader-page-controls input[type=range]::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:11px; height:11px; margin-top:-4px; border-radius:50%; background:#f66c8d; }
.ark-reader-page-controls input[type=range]::-moz-range-track { height:3px; background:#603447; }
.ark-reader-page-controls input[type=range]::-moz-range-thumb { width:11px; height:11px; border:0; background:#f66c8d; }
.ark-reader-drawer { display:flex; flex-direction:column; flex:0 0 300px; width:300px; min-height:0; padding:18px 16px; border-right:1px solid #78374f66; background:#120e15; }
.ark-reader-drawer-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.ark-reader-drawer-heading h2 { font-size:18px; font-weight:700; color:#f8e6ef; }
.ark-reader-drawer-heading p { color:#ac8c9d; font-size:10px; margin-top:4px; }
.ark-reader .ark-reader-drawer-heading button { min-height:32px; padding:7px 9px; }
.ark-reader-chapter-search { display:flex; align-items:center; gap:10px; margin:16px 0 8px; border:1px solid #7d415a55; background:#0b090e; padding:0 12px; border-radius:9px; color:#ce718e; }
.ark-reader .ark-reader-chapter-search input { width:100%; min-width:0; min-height:40px; padding:10px 0; border:0; background:none; font-size:11px; outline:0; box-shadow:none; }
.ark-reader-feed-status { display:flex; flex-direction:column; gap:8px; padding:6px 0; color:#c59eaf; font-size:11px; max-height:180px; overflow:auto; flex-shrink:0; }
.ark-reader .ark-reader-feed-status button { min-height:30px; font-size:10px; padding:5px 8px; }
.ark-reader-chapter-list { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; margin:10px -5px 0; padding:0 5px; }
.ark-reader .ark-reader-chapter-list button { display:flex; justify-content:space-between; width:100%; text-align:left; min-height:62px; padding:12px; margin-bottom:6px; border:1px solid #62304733; border-radius:9px; background:#1c111a66; gap:12px; }
.ark-reader-chapter-list button>span { min-width:0; }
.ark-reader-chapter-list strong { display:block; font-size:12px; color:#efdae5; }
.ark-reader-chapter-list small { display:block; font-size:10px; line-height:1.5; color:#b797a6; margin-top:4px; overflow-wrap:anywhere; }
.ark-reader-chapter-list i { flex-shrink:0; font-size:11px; color:#cb748f; }
.ark-reader .ark-reader-chapter-list .is-current { background:linear-gradient(120deg,#641d35,#301321); border-color:#d8587c88; box-shadow:inset 3px 0 #f57398; }
.ark-reader-drawer-scrim { display:none !important; }
.ark-reader.is-focus .ark-reader-header, .ark-reader.is-focus .ark-reader-navigation { display:none; }
.ark-reader .ark-reader-restore { position:absolute; z-index:15; top:16px; right:20px; min-height:36px; padding:9px 13px; font-size:11px; border-radius:9px; background:#160b15dc; backdrop-filter:blur(8px); }
.ark-rune-field.is-focused { opacity:0; }
.ark-feed-progress { padding:16px 18px; border:1px solid #8d405a55; border-radius:12px; background:#32152266; margin:18px 0; }
.ark-feed-progress>div { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:12px; }
.ark-feed-progress>div>span { color:#d09faf; }
.ark-feed-progress progress { display:block; width:100%; height:5px; margin-top:14px; accent-color:#e65076; }
.ark-feed-progress button { margin-top:10px; }
.ark-chapter-list-actions { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin:18px 0; }
.ark-chapter-list-actions>span { font-size:12px; color:#c69bad; }
@media(max-width:1000px) {
  .ark-reader-settings { gap:9px 12px; }
  .ark-reader-settings .ark-sync-state { flex-basis:100%; }
  .ark-reader-drawer { position:absolute; inset:0 auto 0 0; z-index:12; width:min(86vw,320px); max-width:100%; box-shadow:20px 0 60px #000a; }
  .ark-reader .ark-reader-drawer-scrim { display:block !important; position:absolute; inset:0; z-index:10; border:0; border-radius:0; background:#0009; width:100%; height:100%; }
}
@media(max-width:600px) {
  .ark-reader .ark-reader-header { padding:9px 12px; }
  .ark-reader-topline { gap:8px; }
  .ark-reader-heading strong { font-size:12px; }
  .ark-reader-heading>span { font-size:10px; }
  .ark-reader-header-actions { gap:5px; }
  .ark-reader .ark-reader-header-actions button { padding:7px 9px; min-height:34px; }
  .ark-reader-header-actions button>span { display:none; }
  .ark-reader .ark-reader-back { width:30px; padding:6px; }
  .ark-reader-settings { gap:8px; margin-top:8px; padding-top:8px; }
  .ark-reader .ark-reader-settings label { font-size:10px; flex:1 1 calc(50% - 8px); min-width:0; gap:7px; }
  .ark-reader .ark-reader-settings select { width:100%; min-width:0; max-width:none; font-size:10px; padding:6px; min-height:31px; }
  .ark-reader-settings .ark-source-link { margin-left:0; font-size:10px; }
  .ark-reader-settings .ark-sync-state { font-size:9px; flex-basis:auto; margin-left:auto; }
  .ark-reader .ark-pages { padding:0; scrollbar-gutter:auto; }
  .ark-reader-navigation { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:9px 12px max(9px,env(safe-area-inset-bottom)); }
  .ark-reader-page-controls { grid-column:1/-1; grid-row:1; gap:3px; }
  .ark-reader .ark-reader-navigation>button { min-height:37px; font-size:10px; padding:8px 10px; }
  .ark-reader-prev { grid-column:1; grid-row:2; }
  .ark-reader-next { grid-column:2; grid-row:2; }
  .ark-reader .ark-reader-restore { top:12px; right:12px; }
}

/* Portal layout overrides follow the shared screen styles. */
.ark-portal { max-width:1280px; padding-top:0; }
.ark-portal .ark-site-header { margin-bottom:0; }
.ark-portal .ark-topbar { position:relative; flex-wrap:nowrap; gap:20px; margin-bottom:0; padding:12px 0; border-bottom:0; min-height:64px; }
.ark-portal .ark-wordmark { font-size:32px; color:#f03a50; text-shadow:0 4px 18px #d7123230; }
.ark-portal .ark-wordmark>span { color:#f4e4ea; }
.ark-portal .ark-main-nav { display:none; position:absolute; top:64px; left:0; z-index:30; padding:20px; background:#140a11; border:1px solid #722538; border-radius:10px; width:230px; box-shadow:0 20px 40px #0009; }
.ark-portal .ark-main-nav.is-open { display:flex; flex-direction:column; gap:20px; }
.ark-portal .ark-header-search { margin-left:auto; }
.ark-portal .ark-account-actions { flex:0 1 auto; width:auto; margin-left:0; }
.ark-portal .ark-account-actions .ark-btn { font-size:11px; min-height:34px; padding:8px 12px; }
.ark-portal .ark-user-name { max-width:150px; font-size:10px; }
.ark-full-catalog { display:block; }
.ark-portal .ark-library-tools { margin-bottom:26px; }
.ark-portal .ark-catalog-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:24px 20px; }
.ark-portal .ark-catalog-grid .movie-card { border:0; border-radius:6px; box-shadow:none; background:transparent; }
.ark-portal .ark-catalog-grid .movie-card:hover { box-shadow:none; }
.ark-portal .ark-poster-link { border-radius:7px; overflow:hidden; }
.ark-portal .ark-catalog-grid .movie-card .p-3 { background:transparent; padding:10px 0 0; }
.ark-portal .ark-card-title { font-size:12px; min-height:36px; margin-bottom:8px; }
.ark-portal .ark-cover-type { font-size:8px; top:8px; left:8px; padding:3px 5px; border:0; border-radius:3px; }
.ark-portal .ark-catalog-grid .ark-read-button { min-height:33px; font-size:10px; border-radius:5px; background:#190c12; border-color:#61263677; }
.ark-portal .ark-catalog-grid .ark-step { width:26px; height:26px; }
.ark-portal .ark-catalog-grid.ark-catalog-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
.ark-portal .ark-catalog-list .movie-card { display:flex; gap:16px; background:#160c13; padding:12px; border:1px solid #47202e; border-radius:8px; }
.ark-portal .ark-catalog-list .ark-poster-link { width:85px; flex-shrink:0; }
.ark-portal .ark-catalog-list .movie-card .p-3 { flex:1; min-width:0; }
@media(max-width:1000px) { .ark-portal .ark-catalog-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } .ark-spotlight-content { gap:30px; } .ark-spotlight-info h1 { font-size:34px; } .ark-spotlight-cover { width:165px; height:240px; } }
@media(max-width:700px) { .ark-portal { padding-inline:18px; } .ark-portal .ark-topbar { gap:10px; } .ark-portal .ark-account-actions { justify-content:flex-end; } .ark-portal .ark-user-name { display:none; } .ark-spotlight { margin-inline:-18px; min-height:410px; } .ark-spotlight-content { padding:44px 18px 100px; gap:20px; } .ark-spotlight-cover { width:120px; height:180px; } .ark-spotlight-info h1 { font-size:27px; margin:14px 0; } .ark-spotlight-info>p { font-size:12px; } .ark-spotlight-meta { font-size:8px; gap:8px; letter-spacing:.1em; } .ark-spotlight-meta>span+span { padding-left:8px; } .ark-spotlight-meta>span:last-child { display:none; } .ark-spotlight-actions { gap:8px; margin-top:18px; } .ark-spotlight-actions .ark-btn { font-size:10px; min-height:38px; padding:9px 15px; } .ark-rail-card { flex-basis:130px; } .ark-rail-art { height:185px; } .ark-section-heading h2 { font-size:14px; } .ark-section-heading p { font-size:9px; } .ark-portal .ark-catalog-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 12px; } .ark-portal .ark-catalog-grid.ark-catalog-list { grid-template-columns:1fr; } }
@media(max-width:460px) { .ark-portal .ark-wordmark { font-size:25px; letter-spacing:1px; } .ark-portal .ark-account-actions .ark-btn { font-size:10px; padding:7px 9px; } .ark-portal .ark-account-actions .ark-btn-primary { display:none; } .ark-spotlight-content { gap:15px; align-items:center; } .ark-spotlight-cover { width:95px; height:145px; } .ark-spotlight-info h1 { font-size:22px; } .ark-spotlight-info>p { -webkit-line-clamp:3; font-size:11px; } .ark-spotlight-actions .ark-btn { padding:8px 11px; font-size:9px; } .ark-spotlight-actions { flex-wrap:wrap; } .ark-portal .ark-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ark-spotlight-meta { font-size:7px; } .ark-section-heading>a { font-size:10px; } }

/* Compact blood-red masthead and occult wordmark. */
.ark-portal .ark-site-header { position:relative; background:linear-gradient(90deg,#18070d,#080507 65%,#1e0810); border-bottom:1px solid #b6294355; box-shadow:0 5px 24px #ac142319; }
.ark-portal .ark-site-header::after { content:''; position:absolute; bottom:-1px; left:36px; width:175px; height:1px; background:linear-gradient(90deg,transparent,#ff3a55,transparent); box-shadow:0 0 12px #f32549aa; }
.ark-portal .ark-topbar { min-height:40px; padding:2px 8px; gap:14px; }
.ark-portal .ark-wordmark,.ark-site-footer .ark-wordmark { position:relative; font-family:'Metal Mania','Bangers',fantasy; font-size:26px; letter-spacing:2px; line-height:1.15; color:#e82c43; text-shadow:0 2px 0 #470713,0 0 15px #bd173f66,0 0 35px #9b062333; transform:skewX(-5deg); }
.ark-portal .ark-wordmark>span,.ark-site-footer .ark-wordmark>span { color:#fae3e8; text-shadow:0 1px 0 #ab2a43,0 0 16px #ef305c66; }
.ark-portal .ark-main-nav { top:100%; }
.ark-portal .ark-account-actions .ark-btn { min-height:30px; padding:4px 10px; }
.ark-portal .ark-menu-toggle,.ark-portal .ark-header-search { height:32px; }
.ark-rune-field span:nth-child(3n) { color:#ff5360; text-shadow:0 0 8px #ff203c,0 0 24px #db1238bb,0 0 45px #aa123b77; }
@media(max-width:700px) { .ark-rune-field span { font-size:calc(var(--rune-size) * .75); } .ark-portal .ark-topbar { gap:8px; min-height:44px; padding:2px 0; } .ark-portal .ark-main-nav { top:100%; } .ark-portal .ark-wordmark { font-size:26px; letter-spacing:1px; } .ark-portal .ark-account-actions .ark-btn { min-height:30px; padding:5px 8px; } }

/* Keep ambient foreground runes behind the splash identity. */
.ark-rune-field.is-splash { z-index:9998; }
.ark-card-favorite { position:absolute; right:8px; bottom:10px; z-index:3; display:grid; place-items:center; width:34px; height:34px; border:1px solid #b9576e88; border-radius:9px; background:#15080edb; color:#ff6b8b; }
.ark-card-personal-status { font-size:10px; color:#ba99a9; margin:5px 0; }
.ark-load-more { display:flex; margin:30px auto; }
.ark-personal-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:end; margin-bottom:22px; }
.ark-personal-actions label { display:grid; gap:6px; font-size:11px; color:#cbb3c0; }
.ark-personal-actions select { min-height:44px; padding:9px 12px; background:#180d15; border:1px solid #6b3044; border-radius:9px; color:#f7e6ef; }
.ark-work-metadata { margin:20px 0; font-size:13px; line-height:1.8; color:#cbb3c0; }
.ark-genre-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.ark-genre-tags span,.ark-read-badge { border:1px solid #8c345455; background:#50172b44; border-radius:6px; padding:4px 9px; color:#f3a6bc; font-size:10px; }
.ark-source-availability { display:grid; gap:9px; border:1px solid #67314566; background:#190f17; border-radius:12px; padding:18px; color:#cbb3c0; font-size:12px; margin:20px 0; }
.ark-source-availability small { color:#ab8d9f; line-height:1.7; }
.ark-work-chapter-tools { display:flex; flex-wrap:wrap; gap:14px; margin:22px 0; }
.ark-work-chapter-tools label { display:grid; gap:7px; flex:1; min-width:180px; font-size:11px; color:#cbb3c0; }
.ark-profile-panel { max-width:860px; margin:auto; padding:36px; }
.ark-profile-panel h2 { font-size:30px; font-weight:700; margin:10px 0; }
.ark-profile-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:28px 0; }
.ark-profile-stats>div { padding:20px 14px; background:#28121e; border:1px solid #75304866; border-radius:12px; }
.ark-profile-stats strong { display:block; font-size:28px; color:#ff879f; }
.ark-profile-stats span { font-size:11px; color:#bfa4b4; }
.ark-profile-panel .ark-section-heading { margin-top:36px; margin-bottom:12px; }
.ark-history-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 0; border-bottom:1px solid #6d2c4344; }
.ark-history-row strong { font-size:13px; display:block; }
.ark-history-row span { display:block; color:#b397a7; font-size:11px; margin-top:6px; }
.ark-reader .ark-pages img { filter:brightness(var(--reader-brightness,1)); }
.ark-reader .ark-pages:not(.paged)>div[data-page] { margin-bottom:var(--reader-spacing,0px) !important; }
.ark-reader-settings input[type=range] { width:90px; accent-color:#e53054; }
.ark-shelf,.ark-catalog-grid>.movie-card { content-visibility:auto; contain-intrinsic-size:auto 350px; }
@media(max-width:600px) { .ark-profile-panel { padding:24px 18px; } .ark-profile-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .ark-history-row { align-items:start; } .ark-history-row button { font-size:10px; padding:8px; } }

/* Reading hierarchy: quiet surfaces, one clear primary action. */
.ark-chapter-focused { --ark-muted:#bdaeb4; }
.ark-chapters-heading h2 { overflow-wrap:anywhere; letter-spacing:-.035em; }
.ark-chapter-focused>.ark-synopsis { padding:16px 20px; margin:0 0 22px; border-left-width:2px; background:#170f1480; }
.ark-chapter-focused>.ark-synopsis p { white-space:pre-line; font-size:13px; line-height:1.8; margin-top:8px; }
.ark-chapter-focused .ark-chapter { background:#131013; border-color:#ffffff0b; box-shadow:none; gap:10px; }
.ark-chapter-focused .ark-chapter-open { min-height:48px; padding:10px 8px; line-height:1.65; font-size:13px; }
.ark-chapter-focused .ark-chapter-open small { color:#b6a5ae; font-size:11px; }
.ark-chapter-focused .ark-chapter:has(.ark-read-badge) { background:#100e10; }
.ark-chapter-focused .ark-read-badge { color:#c4b4bc; background:#ffffff06; border-color:#ffffff12; white-space:nowrap; }
.ark-chapter-focused .ark-source-tabs { padding:4px; background:#100c10; border-color:#ffffff16; }
.ark-chapter-focused .ark-work-details { border-color:#ffffff12; background:#100d10; }
.ark-chapter-focused details>summary { min-height:44px; display:flex; align-items:center; gap:10px; cursor:pointer; }
.ark-chapter-focused details>summary::before { content:'+'; color:#ee7186; font-size:18px; }
.ark-chapter-focused details[open]>summary::before { content:'\2212'; }
.ark-chapter-focused details>summary::-webkit-details-marker { display:none; }
.ark-chapter-focused .ark-work-chapter-tools input { width:100%; min-width:0; }
.ark-reader-preferences { width:100%; min-width:0; }
.ark-reader-preferences>summary { display:flex; align-items:center; gap:9px; width:fit-content; min-height:36px; padding:6px 10px; border-radius:8px; color:#cdbbc3; font-size:11px; cursor:pointer; list-style:none; }
.ark-reader-preferences>summary::-webkit-details-marker { display:none; }
.ark-reader-preferences>summary::after { content:'+'; margin-left:12px; color:#f28597; }
.ark-reader-preferences[open]>summary::after { content:'\2212'; }
.ark-reader-preferences>summary:hover { background:#ffffff08; }
.ark-reader-preferences>summary:focus-visible,.ark-chapter-focused summary:focus-visible { outline:2px solid #ffb6c0; outline-offset:3px; }
.ark-reader-preferences[open] .ark-reader-settings { max-height:34dvh; overflow:auto; padding-bottom:8px; }
.ark-reader .ark-reader-header { flex-shrink:0; padding-top:max(10px,env(safe-area-inset-top)); }
.ark-reader .ark-reader-heading { min-width:0; }
.ark-reader .ark-reader-heading strong,.ark-reader .ark-reader-heading span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ark-reader .ark-reader-footer { flex-shrink:0; }
.ark-reader .ark-sync-state { min-height:18px; line-height:1.5; }
@media(max-width:600px) {
  .ark-chapter-focused .ark-work-chapter-tools { display:grid; grid-template-columns:minmax(0,1fr); }
  .ark-chapter-focused .ark-work-chapter-tools label { min-width:0; }
  .ark-chapter-focused .ark-chapter { flex-wrap:nowrap; padding:5px 8px; }
  .ark-chapter-focused .ark-chapter-open { font-size:12px; }
  .ark-chapter-focused .ark-chapter .ark-btn-danger { font-size:0; min-width:44px; min-height:44px; padding:10px; }
  .ark-chapter-focused .ark-chapter .ark-btn-danger i { font-size:14px; }
  .ark-reader .ark-reader-header-actions button { min-width:44px; min-height:44px; }
  .ark-reader .ark-reader-preferences>summary { min-height:44px; }
  .ark-reader .ark-reader-settings label { flex-direction:column; align-items:stretch; font-size:11px; }
  .ark-reader .ark-reader-settings select { min-height:44px; font-size:12px; }
  .ark-reader-settings input[type=range] { min-height:44px; width:100%; }
  .ark-reader-preferences[open] .ark-reader-settings { max-height:30dvh; }
}
.ark-work-intro { display:grid; grid-template-columns:180px minmax(0,1fr); gap:32px; padding:28px; margin:12px 0 28px; border:1px solid #77314355; border-radius:18px; background:radial-gradient(ellipse at top left,#5b142844,transparent 70%),#110d11; }
.ark-work-cover { width:180px; aspect-ratio:2/3; object-fit:cover; border-radius:12px; box-shadow:0 12px 30px #0008; }
.ark-work-intro-content { min-width:0; }
.ark-work-intro h2 { font-size:clamp(26px,3vw,38px); font-weight:800; line-height:1.2; letter-spacing:-.035em; overflow-wrap:anywhere; margin:8px 0 14px; }
.ark-work-type { display:inline-block; font-size:10px; padding:4px 9px; border-radius:5px; background:#721e3644; color:#f3a6b8; text-transform:uppercase; letter-spacing:.1em; }
.ark-work-story-preview { margin-top:20px; }
.ark-work-story-preview h3 { font-size:12px; font-weight:700; color:#f1c4cf; }
.ark-work-story-preview p,.ark-work-story p { font-size:13px; line-height:1.8; color:#c5b6bd; white-space:pre-line; margin-top:8px; }
.ark-work-story-preview p { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.ark-work-intro-content:has(.ark-work-story[open]) .ark-work-story-preview { display:none; }
.ark-chapter-focused .ark-work-story>summary { font-size:11px; color:#f38aa0; min-height:36px; }
.ark-work-quick-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; align-items:center; }
.ark-work-quick-actions>span { font-size:11px; color:#c5b6bd; overflow-wrap:anywhere; }
@media(max-width:600px) { .ark-work-intro { grid-template-columns:90px minmax(0,1fr); gap:16px; padding:18px 14px; } .ark-work-cover { width:90px; } .ark-work-intro h2 { font-size:24px; } .ark-work-intro .ark-eyebrow { font-size:8px; } .ark-work-story-preview,.ark-work-story,.ark-work-quick-actions { margin-left:-106px; } .ark-work-story-preview { margin-top:30px; } .ark-work-quick-actions .ark-btn { min-height:44px; font-size:11px; } }
.ark-upload-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.ark-upload-options label { min-width:0; }
.ark-upload-paste { display:flex; flex-direction:column; align-items:center; gap:10px; padding:26px 18px; text-align:center; border:1px dashed #9f4056; border-radius:12px; background:#4b15231c; cursor:text; }
.ark-upload-paste>i { color:#f17f97; font-size:24px; }
.ark-upload-paste>span { color:#bba8b1; font-size:12px; line-height:1.7; }
.ark-upload-paste:focus-visible { outline:2px solid #ffb6c0; outline-offset:3px; background:#4b152344; }
.ark-upload-selection { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; color:#e5bac7; }
.ark-form .ark-upload-selection button { width:auto; }
@media(max-width:600px) { .ark-upload-options { grid-template-columns:minmax(0,1fr); } }
.ark-rune-field.is-form { opacity:.12 !important; mask-image:linear-gradient(90deg,#000,transparent 24%,transparent 76%,#000); }
body:has(.ark-catalog-overlay) { overflow:hidden; }
.ark-catalog-overlay { overscroll-behavior:contain; }
.ark-catalog-modal { scrollbar-gutter:stable; overscroll-behavior:contain; }
.ark-page-previews { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:14px; max-height:520px; overflow:auto; padding:4px; scrollbar-gutter:stable; }
.ark-page-preview { display:flex; flex-direction:column; gap:7px; padding:10px; min-width:0; border:1px solid #ffffff16; border-radius:12px; background:#130d11; }
.ark-page-preview img { display:block; width:100%; height:150px; object-fit:contain; background:#080608; border-radius:6px; }
.ark-page-preview strong { font-size:12px; color:#f4d9e2; }
.ark-page-preview small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#baa5af; font-size:10px; }
.ark-page-preview>div { display:flex; gap:4px; }
.ark-form .ark-page-preview button { display:grid; place-items:center; padding:8px 4px; width:auto; flex:1; min-height:44px; font-size:12px; }
.ark-upload-progress { width:100%; height:8px; border:0; accent-color:#e13355; border-radius:6px; overflow:hidden; }
@media(max-width:600px) { .ark-catalog-overlay { padding:8px; } .ark-catalog-modal { max-height:calc(100dvh - 16px); border-radius:18px; padding:22px 16px; } .ark-page-previews { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:440px; gap:10px; } }
/* Work detail: cinematic backdrop, editorial hero and compact chapter rows. */
.ark-work-overlay { background:#0b080c; isolation:isolate; }
.ark-work-backdrop { position:absolute; inset:0 0 auto; height:370px; overflow:hidden; z-index:-1; pointer-events:none; }
.ark-work-backdrop img { width:100%; height:100%; object-fit:cover; object-position:center 30%; opacity:.35; filter:saturate(.65); }
.ark-work-backdrop::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#13080c20,#0b080c 98%),linear-gradient(90deg,#0b080c66,transparent,#0b080c66); }
.ark-work-panel.ark-chapter-focused { max-width:1080px; padding:26px 32px 70px; }
.ark-chapter-focused .ark-work-intro { grid-template-columns:210px minmax(0,1fr); gap:34px; padding:24px 0 32px; margin:0 0 24px; background:none; border:0; border-radius:0; }
.ark-work-cover-column { min-width:0; }
.ark-chapter-focused .ark-work-cover { width:100%; max-width:210px; aspect-ratio:2/3; border:1px solid #d7586a44; border-radius:12px; box-shadow:0 12px 40px #0009; }
.ark-work-cover-empty { display:grid; place-items:center; font-size:50px; color:#ae3951; background:#24101a; }
.ark-work-cover-caption { display:block; margin-top:14px; padding:16px; text-align:center; font-family:'Metal Mania',fantasy; color:#ef4965; font-size:24px; border:1px solid #78324455; border-radius:12px; background:#180d14; }
.ark-work-cover-caption b { color:#f6dbe3; font-weight:400; }
.ark-work-cover-caption small { display:block; font:8px 'Poppins',sans-serif; letter-spacing:.15em; color:#b48b9a; margin-top:5px; }
.ark-chapter-focused .ark-work-intro h2 { font-size:clamp(28px,3.5vw,42px); font-weight:900; font-style:italic; text-transform:uppercase; color:#fff1f4; text-shadow:0 2px 16px #000b; margin:6px 0 16px; }
.ark-work-genre-row { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.ark-work-genre-row>span { font-size:10px; padding:3px 9px; border:1px solid #9d374b77; border-radius:20px; color:#f094a6; background:#2c0e1977; }
.ark-work-facts { display:flex; flex-wrap:wrap; gap:9px 16px; color:#baacb5; font-size:11px; line-height:1.7; }
.ark-work-facts i { margin-right:6px; color:#ee6a85; }
.ark-work-facts>span:last-child { overflow-wrap:anywhere; }
.ark-chapter-focused .ark-work-quick-actions { margin-top:20px; gap:8px; }
.ark-chapter-focused .ark-work-quick-actions button { min-height:44px; border-radius:24px; font-size:11px; padding:10px 17px; }
.ark-work-resume-note { font-size:11px; color:#d68b9e; margin-top:12px; }
.ark-work-list-select { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:11px; color:#bda4af; margin:16px 0; }
.ark-work-list-select select { min-height:40px; font-size:11px; border-radius:20px; padding:8px 14px; }
.ark-work-intro-content .ark-work-story-preview { margin:24px 0 0; }
.ark-work-intro-content .ark-work-story { margin-left:0; }
.ark-work-intro-content .ark-work-story-preview h3 { font-size:14px; font-style:italic; color:#fce6ed; }
.ark-work-intro-content .ark-work-story-preview p { -webkit-line-clamp:4; font-size:13px; line-height:1.85; }
.ark-work-chapters-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; }
.ark-work-chapters-heading h3 { font-size:25px; font-weight:900; font-style:italic; letter-spacing:-.03em; color:#ffe8ef; }
.ark-work-chapters-heading>span { font-size:11px; color:#a88e9b; }
.ark-chapter-focused .ark-work-chapter-tools { display:grid; grid-template-columns:minmax(0,1fr) 210px; gap:12px; margin:16px 0; }
.ark-chapter-focused .ark-work-chapter-tools label { min-width:0; }
.ark-chapter-focused .ark-work-chapter-tools input,.ark-chapter-focused .ark-work-chapter-tools select { border-radius:24px; min-height:44px; background:#170e16; }
.ark-chapter-focused .ark-source-tabs { width:fit-content; max-width:100%; border:0; background:transparent; padding:0; gap:8px; margin-bottom:20px; }
.ark-chapter-focused .ark-source-tabs button { border-radius:20px; font-size:11px; min-height:40px; padding:8px 16px; }
.ark-work-chapter-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 14px; margin:18px 0 24px; }
.ark-chapter-focused .ark-work-chapter-grid .ark-chapter { margin:0; padding:4px 8px; border-radius:25px; background:#191019; border:1px solid #61304666; min-width:0; flex-wrap:nowrap; gap:5px; }
.ark-work-chapter-grid .ark-chapter-open { display:flex; justify-content:space-between; align-items:center; gap:10px; min-width:0; padding:8px 6px; }
.ark-chapter-index { min-width:0; font-size:12px; font-weight:700; }
.ark-chapter-index>i { color:#ac536d; margin-right:8px; }
.ark-chapter-index>small { display:block; font-size:10px; font-weight:400; margin:3px 0 0 23px; }
.ark-chapter-meta { text-align:right; font-size:10px; color:#bd9dab; flex-shrink:0; max-width:40%; }
.ark-chapter-meta small { display:block; font-size:9px; overflow-wrap:anywhere; }
.ark-work-chapter-grid .ark-read-badge { font-size:9px; padding:4px; border:0; }
.ark-work-chapter-grid .ark-chapter>.ark-btn-danger { width:34px; min-width:34px; min-height:40px; font-size:0; padding:6px; border-radius:20px; }
.ark-work-chapter-grid .ark-btn-danger i { font-size:12px; }
@media(max-width:700px) { .ark-work-panel.ark-chapter-focused { padding:18px 18px 50px; } .ark-chapter-focused .ark-work-intro { grid-template-columns:125px minmax(0,1fr); gap:20px; } .ark-work-cover-caption { font-size:20px; padding:12px 6px; } .ark-work-cover-caption small { font-size:6px; } .ark-chapter-focused .ark-work-intro h2 { font-size:27px; } .ark-work-chapter-grid { grid-template-columns:minmax(0,1fr); } .ark-work-facts { font-size:10px; gap:6px 12px; } }
@media(max-width:480px) { .ark-chapter-focused .ark-work-intro { display:block; padding-top:12px; } .ark-work-cover-column { float:left; width:95px; margin:0 18px 16px 0; } .ark-work-cover-caption { display:none; } .ark-chapter-focused .ark-work-intro h2 { font-size:25px; } .ark-work-intro-content .ark-eyebrow { font-size:8px; } .ark-work-genre-row { gap:4px; } .ark-work-genre-row>span { font-size:9px; padding:2px 6px; } .ark-chapter-focused .ark-work-quick-actions { clear:both; margin-left:0; padding-top:12px; } .ark-work-intro-content .ark-work-story-preview,.ark-work-intro-content .ark-work-story { margin-left:0; } .ark-chapter-focused .ark-work-chapter-tools { grid-template-columns:minmax(0,1fr); } .ark-work-chapters-heading h3 { font-size:22px; } .ark-work-intro::after { content:''; display:block; clear:both; } }
/* Stable reading canvas: controls float over it, never resize the pages. */
.ark-reader .ark-reader-header { position:absolute; top:0; left:0; right:0; z-index:8; background:#120c13f2; backdrop-filter:blur(12px); transition:transform .2s ease; }
.ark-reader .ark-reader-navigation { position:absolute; bottom:0; left:0; right:0; z-index:8; background:#120c13f2; backdrop-filter:blur(12px); transition:transform .2s ease; }
.ark-reader.is-immersed .ark-reader-header:not(:focus-within) { transform:translateY(-110%); }
.ark-reader.is-immersed .ark-reader-navigation:not(:focus-within) { transform:translateY(110%); }
.ark-reader .ark-reader-content { height:100%; }
.ark-reader .ark-pages { padding-block:130px 145px; scroll-padding-top:130px; overflow-anchor:none; }
.ark-reader.is-focus .ark-pages { padding-block:0 35px; scroll-padding-top:0; }
.ark-reader.reader-theme-black .ark-pages { background:#000; }
.ark-reader.reader-theme-gray .ark-pages { background:#232326; }
.ark-reader.reader-theme-sepia .ark-pages { background:#342b23; }
.ark-reader .ark-reader-image-slot { position:relative; }
.ark-reader-image-slot.is-pending { background:linear-gradient(135deg,#20171d,#110d10); }
.ark-reader-image-slot.is-failed { min-height:220px !important; }
.ark-page-retry { display:flex; flex-direction:column; gap:16px; align-items:center; justify-content:center; min-height:220px; height:100%; padding:24px; color:#dcb4c1; text-align:center; }
.ark-page-retry button { min-height:44px; }
.ark-reader .ark-paged-slot { min-height:calc(100dvh - 275px); display:flex; align-items:center; justify-content:center; }
.ark-reader .ark-pages.paged .ark-paged-slot img { max-height:calc(100dvh - 275px); width:auto; max-width:100%; }
.ark-reader.is-focus .ark-pages.paged .ark-paged-slot img { max-height:100dvh; }
.ark-reader-hint { position:relative; z-index:2; width:min(480px,calc(100% - 32px)); margin:12px auto 24px; padding:16px; border:1px solid #894052; border-radius:12px; background:#25121eee; color:#e1c4d0; font-size:12px; line-height:1.7; }
.ark-reader-hint p+p { margin-top:8px; }
.ark-reader-hint button { margin-top:8px; min-height:40px; }
.ark-reader-end { max-width:640px; margin:28px auto 0; padding:32px 20px; text-align:center; background:linear-gradient(180deg,#27101c,#130d13); border:1px solid #81334d66; border-radius:18px; color:#ebd5de; }
.ark-reader-end>i { display:inline-grid; place-items:center; width:40px; height:40px; border-radius:50%; background:#81213944; color:#ff90a7; }
.ark-reader-end h2 { font-size:24px; font-weight:800; margin:12px 0; }
.ark-reader-end p { font-size:12px; color:#baa3ae; margin:12px 0; line-height:1.7; }
.ark-reader .ark-reader-end button { display:flex; align-items:center; justify-content:center; gap:12px; min-height:48px; margin:12px auto 0; }
.ark-reader-minimal-progress { position:absolute; bottom:0; left:0; right:0; z-index:9; display:flex; justify-content:flex-end; align-items:center; gap:10px; padding:6px 12px max(6px,env(safe-area-inset-bottom)); background:#09070bb0; color:#c3a8b4; font-size:10px; pointer-events:none; }
.ark-reader-minimal-progress button { pointer-events:auto; min-height:40px; min-width:40px; padding:8px; }
.ark-reader-minimal-progress>div { position:absolute; bottom:0; left:0; height:2px; background:#d83153; }
.ark-reader-auto-hide input { width:18px; min-height:18px; accent-color:#ef4969; }
.ark-rune-field.is-reading { mask-image:linear-gradient(90deg,#000,transparent max(0px,calc((100vw - var(--rune-reader-width,900px))/2 - 18px)),transparent calc(100% - max(0px,calc((100vw - var(--rune-reader-width,900px))/2 - 18px))),#000); }
@media(max-width:700px) { .ark-reader .ark-pages { padding-block:140px 150px; scroll-padding-top:140px; } .ark-reader .ark-pages.paged .ark-paged-slot img { max-height:calc(100dvh - 290px); } .ark-reader-end { margin-inline:12px; } .ark-reader-end h2 { font-size:21px; } .ark-reader .ark-reader-navigation>button { min-height:44px; } }
@media(prefers-reduced-motion:reduce) { .ark-reader .ark-reader-header,.ark-reader .ark-reader-navigation { transition:none; } }
.ark-portal .ark-main-nav>button { color:#ebbbc9; font-size:12px; text-align:left; padding:12px 16px; border-radius:8px; }
.ark-grimoire-overlay { z-index:12500; }
.ark-grimoire-panel { max-width:1000px; }
.ark-grimoire-panel>h2 { font-family:'Metal Mania',fantasy; font-size:42px; color:#fa708e; margin-top:8px; }
.ark-grimoire-create { display:flex; align-items:end; gap:12px; padding:20px; background:#21101b; border:1px solid #7b314966; border-radius:14px; margin:24px 0; }
.ark-grimoire-create label,.ark-grimoire-search { display:grid; gap:8px; font-size:12px; color:#d9b8c6; flex:1; }
.ark-grimoire-create input,.ark-grimoire-search input { width:100%; }
.ark-grimoire-create button { min-height:44px; }
.ark-grimoire-collection { background:#160e16; border:1px solid #74314766; border-radius:14px; padding:18px; margin:18px 0; }
.ark-grimoire-collection>summary { display:flex; align-items:center; gap:12px; min-height:44px; cursor:pointer; color:#f2cad8; }
.ark-grimoire-collection>summary:focus-visible { outline:2px solid #ffb6c0; outline-offset:4px; }
.ark-grimoire-collection>summary>strong { flex:1; font-size:18px; overflow-wrap:anywhere; }
.ark-grimoire-collection>summary>span { color:#bba0ad; font-size:11px; }
.ark-grimoire-collection>button { margin-top:18px; }
.ark-grimoire-covers { display:grid; grid-template-columns:repeat(auto-fill,minmax(115px,1fr)); gap:16px; margin-top:20px; }
.ark-grimoire-covers article { min-width:0; }
.ark-grimoire-covers article>button:first-child { display:flex; flex-direction:column; width:100%; padding:0; border:0; background:transparent; text-align:left; }
.ark-grimoire-covers img { width:100%; aspect-ratio:2/3; object-fit:cover; border-radius:9px; }
.ark-grimoire-covers strong { font-size:11px; line-height:1.6; margin-top:8px; overflow-wrap:anywhere; }
.ark-grimoire-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:280px; overflow:auto; margin-top:20px; }
.ark-grimoire-picker label { display:flex; align-items:center; gap:10px; font-size:12px; padding:10px; min-height:44px; border:1px solid #ffffff0e; border-radius:8px; color:#d5bac7; }
.ark-grimoire-picker input { width:18px; min-height:18px; padding:0; accent-color:#e54063; }
.ark-work-grimoire-link { margin-top:10px; font-size:11px; }
.ark-chapter-reactions { padding:22px 0; margin-top:20px; border-block:1px solid #84364c55; }
.ark-chapter-reactions h3 { font-size:15px; font-weight:700; margin-bottom:14px; }
.ark-chapter-reactions>div { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.ark-reader .ark-chapter-reactions button { margin:0; font-size:11px; min-height:44px; border-radius:24px; }
.ark-reader .ark-chapter-reactions button.is-selected { border-color:#fa668b; background:#6a1c36; color:#fff0f5; }
.ark-chapter-reactions small { display:block; font-size:10px; color:#ae8b9e; margin-top:14px; }
.ark-marathon-panel { padding:18px; margin-top:18px; border:1px solid #89375066; background:#2f112044; border-radius:12px; }
.ark-marathon-panel label { display:flex; align-items:center; justify-content:center; gap:10px; font-size:13px; min-height:44px; }
.ark-marathon-panel input { width:18px; min-height:18px; accent-color:#e54063; }
@media(max-width:600px) { .ark-grimoire-create { flex-direction:column; align-items:stretch; padding:16px; } .ark-grimoire-picker { grid-template-columns:minmax(0,1fr); } .ark-grimoire-panel>h2 { font-size:34px; } }
.ark-social-auth { margin-top:24px; }
.ark-overlay .ark-google-button { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:46px; background:#fff; border:1px solid #dadce0; border-radius:10px; color:#202124; font-weight:600; }
.ark-overlay .ark-google-button:hover { background:#f1f3f4; }
.ark-google-button svg { flex-shrink:0; }
.ark-social-auth>p { font-size:11px; text-align:center; line-height:1.6; color:#bca7b3; margin:10px 0 20px; }
.ark-auth-divider { display:flex; align-items:center; gap:12px; color:#a88e9d; font-size:10px; }
.ark-auth-divider::before,.ark-auth-divider::after { content:''; flex:1; height:1px; background:#76425644; }
