@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600;700&family=Prata&display=swap');
:root{--primary-purple:#24292b;--deep-purple:#171b20;--mystic-indigo:#24292b;--gold:#e6bd7a;--gold-accent:#d5a966;--glass-bg:#24292b;--glass-border:#4e514d;--text-primary:#f6efe1;--text-secondary:#c7bfb2;--card-bg:#24292b;--shadow:#0004}
html{background:#111517}body{font:16px/1.5 'DM Sans',sans-serif;background:#171b20;color:var(--text-primary);padding-bottom:0;min-height:100dvh}body::before{display:none}
.container{width:min(100%,540px);min-height:100dvh;margin:auto;padding:26px 20px calc(98px + env(safe-area-inset-bottom));background:#171b20;box-shadow:0 0 60px #0004;display:block}
.screen{display:none}.screen.active{display:flex}.header{text-align:left;margin:0 0 24px}.logo{font:400 clamp(31px,8vw,40px)/1.12 Prata,serif;color:#f6efe1;background:none;-webkit-text-fill-color:#f6efe1;text-shadow:none;letter-spacing:-.04em;margin:0 0 8px}.subtitle{font-size:15px;line-height:1.5;color:var(--text-secondary);font-weight:400}.kicker{font:700 11px/1.3 'DM Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0 0 8px}
.brandbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.brandbar-name{font:25px Prata,serif;letter-spacing:-.05em}.brandbar-name b{color:var(--gold);font-weight:400}.brandbar-mark{width:35px;height:35px;display:grid;place-items:center;border:1px solid #8c816e;border-radius:50%;color:var(--gold)}
.hero-art{height:206px;position:relative;overflow:hidden;border-radius:16px;margin-bottom:32px;background:#34332d url('/static/fan-full/warcraft/major_00.jpg') center 35%/cover;border:1px solid #756952}.hero-art:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#151c1def,#151c1da6 56%,transparent),linear-gradient(0deg,#14191788,transparent 70%)}.hero-art-copy{position:absolute;bottom:18px;left:18px;right:20px;max-width:72%}.hero-art-copy h2{font:23px/1.22 Prata,serif;margin:5px 0;color:#fff6e5}.hero-art-copy p{font-size:13px;line-height:1.45;margin:0;color:#ded7ca}.hero-art-tag{position:absolute;right:12px;top:12px;background:#202825dc;border:1px solid #bfa579;border-radius:20px;padding:5px 9px;font-size:11px;color:#f5e4c6}
.glass-card{background:none;backdrop-filter:none;border:0;box-shadow:none;padding:0;margin:0 0 28px;border-radius:0}.glass-card:hover{transform:none;box-shadow:none}.glass-card h3{font:24px/1.2 Prata,serif!important;color:#f6efe1!important;text-align:left!important;margin:0 0 14px!important}.spread-option{display:inline-flex;vertical-align:top;flex-direction:column;justify-content:space-between;width:calc((100% - 18px)/3);min-height:108px;margin:0 5px 0 0;padding:12px 9px;text-align:left;background:#24292b;border:1px solid #56584e;border-radius:12px;transform:none!important}.spread-option:last-child{margin-right:0}.spread-option.selected{background:#3a332b;border-color:var(--gold)}.spread-title{font:600 14px/1.25 'DM Sans',sans-serif;color:#f7e9d0;margin:0 0 5px}.spread-description{font-size:12px;line-height:1.28;color:#c7bfb2}.question-input{font:16px/1.5 'DM Sans',sans-serif;background:#24292b;border:1px solid #606054;border-radius:12px;padding:14px;min-height:96px;margin:0;color:#f6efe1}.question-input::placeholder{color:#b2aca3}.question-input:focus{border-color:var(--gold);box-shadow:none}.btn{background:var(--gold);color:#211b16;border-radius:12px;padding:16px 20px;font:700 16px/1.25 'DM Sans',sans-serif;box-shadow:none;margin-top:8px;min-height:54px}.btn:hover{box-shadow:none;transform:none}.btn:disabled{opacity:.46}
.spread-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.spread-picker h3{grid-column:1/-1}.spread-picker .spread-option{width:100%;margin:0;min-height:112px}
#mainScreen .header{margin-bottom:17px}.brandbar{margin-bottom:20px}.hero-art{height:142px;margin-bottom:23px}.hero-art-copy h2{font-size:21px}.hero-art-copy p{font-size:12px}.question-block{margin-bottom:4px}.question-block h3{margin-bottom:9px!important}.question-block .question-input{min-height:76px}.form-hint{font-size:12px;color:var(--text-secondary);margin:6px 2px 0}#mainScreen>#startReading{margin:9px 0 30px}
.reading-guide{border:1px solid #605a49;background:#292b28;border-radius:11px;margin:0 0 19px}.reading-guide summary{padding:12px 13px;cursor:pointer;color:var(--gold);font-weight:700;font-size:14px}.reading-guide-body{padding:0 13px 13px}.reading-guide-body h3{font:20px Prata,serif;margin:17px 0 6px}.reading-guide-body p,.reading-guide-body li{font-size:14px;line-height:1.5;color:#e5ded2;margin:0 0 8px}.reading-guide-body ul{padding-left:20px;margin:0 0 15px}
.deck-picker{border:1px solid #56584e;border-radius:12px;background:#24292b;padding:10px 12px}.deck-picker summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:700}.deck-picker summary::after{content:'⌄';font-size:20px;color:var(--gold)}.deck-picker[open] summary::after{content:'⌃'}.deck-picker summary::-webkit-details-marker{display:none}.deck-options{display:flex;gap:10px;overflow-x:auto;padding:13px 0 5px;scroll-snap-type:x mandatory}.deck-option{flex:0 0 104px;scroll-snap-align:start;background:#282d2e;border:1px solid #5b5d55;border-radius:10px;min-height:138px;padding:6px}.deck-preview{aspect-ratio:1.25;margin-bottom:6px}.deck-label{font-size:11px;line-height:1.25}.deck-option[aria-pressed="true"]{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}#fanDeckStatus,#cardsStatus{font-size:12px!important;line-height:1.4;margin:9px 1px 0!important;color:var(--text-secondary)!important}#fanGalleryPanel{margin-top:14px}#fanGalleryPanel summary{color:var(--gold);font-size:14px;cursor:pointer;padding:7px 0}.fan-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:13px}.fan-gallery figure{margin:0;cursor:pointer}.fan-gallery img{width:100%;aspect-ratio:2/3;object-fit:cover;border:1px solid #74664e;border-radius:8px}.fan-gallery figcaption{font-size:12px;color:#e9dfd0;line-height:1.25}
/* Four stable slots: SVG geometry never depends on font or translated labels. */
:root{--nav-safe-bottom:max(env(safe-area-inset-bottom,0px),var(--tg-safe-area-inset-bottom,0px));--nav-height:72px}
.container{padding-bottom:calc(var(--nav-height) + var(--nav-safe-bottom) + 24px)}
.navigation{position:fixed;inset:auto 0 0;transform:none;width:100%;max-width:540px;height:calc(var(--nav-height) + var(--nav-safe-bottom));margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:0;padding:7px 8px calc(8px + var(--nav-safe-bottom));background:#22282a;border-top:1px solid #4f524d;backdrop-filter:none;z-index:100}
.navigation .nav-item{position:relative;display:grid;place-items:center;min-width:0;width:100%;height:56px;min-height:56px;padding:0;border:0;border-radius:12px;background:none;color:#b2b5af;font:inherit;line-height:1;appearance:none;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;cursor:pointer;transition:none}
.navigation .nav-item[hidden],.admin-shortcut[hidden]{display:none}
.navigation .nav-item:hover{background:none}
.navigation .nav-item.active{color:var(--gold)}
.navigation .nav-icon{display:grid;place-items:center;width:52px;height:48px;margin:0;border-radius:14px;font-size:0}
.navigation .nav-icon svg{display:block;width:30px;height:30px;flex:none}
.navigation .nav-item.active .nav-icon{background:#3c352b;box-shadow:inset 0 0 0 1px #e6bd7a40}
.navigation .nav-item:active .nav-icon{background:#3c352b}
.brandbar{column-gap:8px}
.brandbar-mark{position:relative;flex:none;width:44px;height:44px}
.admin-shortcut{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #8c816e;border-radius:50%;background:#171b20;color:var(--gold);cursor:pointer;touch-action:manipulation}
.admin-shortcut.active{background:#3c352b}
/* Long card names must not widen the page and shift the fixed navigation. */
.library-card{min-width:0;overflow-wrap:anywhere;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}
/* Reserve two title lines; longer names expand the row without shifting its art. */
.library-card img{flex:none}
.library-card strong{min-height:2.5em;flex:1}
.library-card span{line-height:1.4}
#adminScreen .admin-controls{grid-template-columns:minmax(0,1fr) auto}
#adminScreen .admin-controls select{min-width:0;width:100%}
.library-status{background:#2b2b25;border:1px solid #605a49;border-radius:11px;padding:12px;color:#dfd1b7;font-size:13px;line-height:1.5;margin:0 0 16px}.library-filters{display:flex;overflow:auto;gap:7px;margin-bottom:16px;padding-bottom:5px}.library-filters button{flex:none;border:1px solid #535951;background:#252c2d;color:#d1cec5;border-radius:30px;font-size:13px;padding:8px 12px;min-height:40px}.library-filters button.active{border-color:var(--gold);background:#463b2d;color:#ffe2af}.library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 10px}.library-card{border:0;background:none;padding:0;color:#f6efe1;text-align:left}.library-card img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:8px;border:1px solid #76654b}.library-card strong{display:block;font-size:13px;line-height:1.25;margin-top:6px}.library-card span{font-size:11px;color:var(--text-secondary)}
.card-dialog[hidden]{display:none}.card-dialog{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;background:#000b}.card-dialog-panel{position:relative;width:min(100%,540px);max-height:94dvh;overflow:auto;background:#252b2d;padding:48px 20px calc(22px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;display:grid;grid-template-columns:40% 1fr;gap:16px;box-shadow:0 -18px 70px #0008}.card-dialog-panel>img{width:100%;border:1px solid #7d6849;border-radius:8px}.card-dialog-panel>button{position:absolute;right:17px;top:13px;border:0;border-radius:50%;background:#414a49;color:white;width:32px;height:32px;font-size:23px}.card-dialog-copy h2{font:22px/1.2 Prata,serif;margin:4px 0 12px}.card-dialog-copy h3{font:700 11px 'DM Sans',sans-serif;letter-spacing:.11em;text-transform:uppercase;color:var(--gold);margin:17px 0 5px}.card-dialog-copy p{font-size:13px;line-height:1.5;color:#e0dacf;margin:0}
.tarot-card{width:120px;height:200px}.card-face{border-radius:10px}.card-front{background:#2b302e;border-color:var(--gold)}.card-front.has-fan-art{padding:0}.card-front img{width:100%;height:100%;object-fit:cover}.card-back{border-color:var(--gold)}.cards-container{gap:10px}.shuffle-text{font:24px Prata,serif;color:var(--gold)}.loading-card{background:#323331}.interpretation{font-size:16px;line-height:1.6}.history-item{background:#252b2d;border:1px solid #51544e;border-left:3px solid var(--gold);border-radius:12px}.history-item:hover{background:#2a302f;transform:none}.premium-features{background:#252b2d;border:1px solid #5e594f;border-radius:14px;text-align:left}.premium-title{font-family:Prata,serif}.premium-feature{justify-content:flex-start}.price{font-size:17px}
button:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media(max-width:370px){.container{padding-left:16px;padding-right:16px}.spread-option{min-height:120px}.spread-title{font-size:13px}.card-dialog-panel{grid-template-columns:36% 1fr;gap:12px}}
@media(min-width:600px){body{padding:25px 0}.container{border-radius:22px 22px 0 0;min-height:850px}.navigation{bottom:25px;border-radius:0 0 22px 22px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Card artwork is 600×1000 (3:5): show the entire title and pip footer. */
.fan-gallery img,.library-card img{aspect-ratio:3/5;object-fit:contain;background:#182333}
.card-front.has-fan-art img{object-fit:contain;background:#182333}
.card-front.has-fan-art .art-caption{position:absolute;bottom:0;left:0;right:0;padding:8px 4px 4px;background:linear-gradient(transparent,#101719eb 45%);color:#fff6df;font:600 10px/1.2 'DM Sans',sans-serif;text-align:center;transform:none;z-index:1}
.locale-switch{display:flex;gap:4px;margin-left:auto}.locale-switch button{background:transparent;color:var(--text-secondary);border:1px solid #76694d;border-radius:7px;padding:4px 7px;font-size:11px;cursor:pointer}.locale-switch button[aria-pressed=true]{color:var(--gold);border-color:var(--gold)}

/* The reading form is the primary surface; artwork is a secondary preview. */
#mainScreen .header{margin-bottom:25px}
#mainScreen .question-block{margin-bottom:12px}
#mainScreen>#startReading{margin:14px 0 23px}
#mainScreen .hero-art{height:128px;margin-bottom:18px}
.reading-setting{border:1px solid #666354;border-radius:12px;background:#24292b;margin:0 0 8px;padding:0 14px}
.reading-setting>summary{list-style:none;min-height:54px;display:flex;align-items:center;gap:12px;cursor:pointer}
.reading-setting>summary::-webkit-details-marker{display:none}
.reading-setting>summary::after{content:'';flex:none;width:7px;height:7px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(45deg);margin:0 3px 4px 5px}
.reading-setting[open]>summary::after{transform:rotate(225deg);margin:4px 3px 0 5px}
.setting-label{flex:0 0 70px;color:var(--text-secondary);font-size:14px}
.setting-value{flex:1;min-width:0;text-align:right;color:var(--text-primary);font-size:14px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.reading-setting>.glass-card{margin:15px 0 20px}
.reading-setting>.glass-card h3{font-size:20px!important}
.reading-setting .spread-option{min-height:88px}
.reading-setting .spread-description{font-size:12px}
.library-search{width:100%;min-height:48px;background:#252c2d;border:1px solid #67675a;border-radius:11px;color:var(--text-primary);font:16px/1.4 'DM Sans',sans-serif;padding:10px 14px;margin-bottom:16px}
.library-search::placeholder{color:#b8b5ac}
.library-grid{min-height:60px}
.history-state{border:1px solid #5e594f;border-radius:14px;background:#252b2d;padding:22px;margin-top:24px}
.history-state p{font-size:16px;line-height:1.5;margin:0 0 20px;color:var(--text-primary)}
.secondary-action,.reveal-all{min-height:48px;border:1px solid var(--gold);border-radius:10px;background:#35332c;color:var(--gold);font:700 14px/1.3 'DM Sans',sans-serif;padding:10px 16px;cursor:pointer}
.reveal-all{align-self:center;margin:14px 0}
.reveal-all[hidden]{display:none}
.history-detail-question{font:24px/1.25 Prata,serif;color:var(--text-primary);margin:0 0 16px}
.premium-hint{font-size:13px;line-height:1.5;color:var(--text-secondary);margin:14px 0 0}
#premiumScreen .premium-features{padding:22px}
#premiumScreen .premium-feature{font-size:15px;line-height:1.45}
@media(max-width:370px){.reading-setting .spread-option{padding:10px 7px}.reading-setting .spread-title{font-size:12px}}

/* Deck artwork is portrait (2:3). A fixed image row keeps every back centered
   independently of how many lines its name/status needs. */
.deck-option{flex:0 0 108px;display:grid;grid-template-rows:114px minmax(72px,auto);gap:6px;justify-items:center;align-content:start;min-height:206px;padding:6px}
.deck-preview{width:76px;height:114px;aspect-ratio:2/3;background-size:contain;background-repeat:no-repeat;background-position:center;margin:0}
.deck-label{width:100%;min-height:72px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;line-height:1.3;overflow-wrap:normal;word-break:normal}

/* A short, single-cycle shuffle using the currently selected deck back. */
#spreadScreen .shuffle-animation{padding:28px 12px 10px}
#spreadScreen .shuffle-text{margin-bottom:12px;animation:none}
#spreadScreen .loading-cards{position:relative;display:block;width:230px;height:168px;margin:0 auto}
#spreadScreen .loading-card{position:absolute;left:50%;top:12px;width:84px;height:140px;border:2px solid var(--gold);border-radius:9px;background-image:var(--deck-art);background-position:center;background-size:cover;box-shadow:0 10px 24px #0008;will-change:transform,opacity;animation-duration:1.4s;animation-timing-function:cubic-bezier(.45,0,.2,1);animation-iteration-count:1;animation-fill-mode:both}
#spreadScreen .loading-card:nth-child(1){z-index:3;animation-name:arcana-shuffle-left;animation-delay:0s}
#spreadScreen .loading-card:nth-child(2){z-index:2;animation-name:arcana-shuffle-center;animation-delay:0s}
#spreadScreen .loading-card:nth-child(3){z-index:1;animation-name:arcana-shuffle-right;animation-delay:0s}
@keyframes arcana-shuffle-left{0%{transform:translate(-105%,4px) rotate(-12deg)}22%{transform:translate(-150%,-13px) rotate(-18deg)}48%{transform:translate(20%,-23px) rotate(12deg)}72%{transform:translate(-115%,0) rotate(-12deg)}100%{transform:translate(-105%,2px) rotate(-10deg)}}
@keyframes arcana-shuffle-center{0%{transform:translate(-50%,0) rotate(0)}22%{transform:translate(25%,-21px) rotate(13deg)}48%{transform:translate(-130%,0) rotate(-12deg)}72%{transform:translate(-5%,-17px) rotate(8deg)}100%{transform:translate(-50%,0) rotate(0)}}
@keyframes arcana-shuffle-right{0%{transform:translate(5%,4px) rotate(12deg)}22%{transform:translate(-10%,1px) rotate(13deg)}48%{transform:translate(-80%,-14px) rotate(-9deg)}72%{transform:translate(35%,-4px) rotate(14deg)}100%{transform:translate(5%,2px) rotate(10deg)}}
@media(prefers-reduced-motion:reduce){#spreadScreen .loading-card{animation:none!important}#spreadScreen .loading-card:nth-child(1){transform:translate(-105%,2px) rotate(-10deg)}#spreadScreen .loading-card:nth-child(2){transform:translate(-50%,0)}#spreadScreen .loading-card:nth-child(3){transform:translate(5%,2px) rotate(10deg)}}

/* Keep the complete three-card spread visible on a phone. */
#cardsContainer.three-card-spread{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto;gap:8px;width:100%;max-width:100%;min-height:0;justify-items:center;margin:18px auto}
#cardsContainer.three-card-spread .tarot-card{width:min(100px,100%);height:auto;aspect-ratio:3/5;margin:0;grid-column:auto;grid-row:auto}
#cardsContainer.celtic-card-spread{display:grid;min-height:0}
.reading-question{width:100%;border:1px solid #666354;border-radius:12px;background:#24292b;padding:12px 14px;margin:0 0 16px}
.reading-question span{display:block;color:var(--gold);font:700 11px/1.3 'DM Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.reading-question p{margin:0;color:var(--text-primary);font-size:15px;line-height:1.45;overflow-wrap:anywhere;white-space:pre-wrap}
#interpretationText .loading-text{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;margin:20px 0;text-align:center;white-space:normal}
#interpretationText .loading-spinner{display:block;margin:0}

/* Keep the drawn artwork visible while the interpretation loads and after it arrives. */
.interpretation-cards{width:100%;margin:2px 0 22px}
.interpretation-cards h2{font:20px/1.25 Prata,serif;color:var(--text-primary);margin:0 0 12px}
.interpretation-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 9px;width:100%}
.interpretation-card-grid[data-spread="single"]{grid-template-columns:minmax(0,190px);justify-content:center}
.interpretation-card{min-width:0;padding:0;border:0;background:none;color:var(--text-primary);text-align:center;cursor:pointer}
.interpretation-card-art{display:block;width:100%;aspect-ratio:3/5;overflow:hidden;border:1px solid #806b4a;border-radius:8px;background:#182333;box-shadow:0 6px 18px #0006}
.interpretation-card-art img{display:block;width:100%;height:100%;object-fit:contain}
.interpretation-card-art img.is-reversed{transform:rotate(180deg)}
.interpretation-card-fallback{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;height:100%;padding:8px;background:#2b302e;color:var(--gold);font:14px/1.25 Prata,serif;white-space:pre-line;overflow-wrap:anywhere}
.interpretation-card-label{display:block;margin-top:7px;color:#e9dfd0;font-size:12px;line-height:1.3;overflow-wrap:anywhere}
.interpretation-part{padding:20px 0;border-bottom:1px solid #56564f;white-space:normal}
.interpretation-part:first-child{padding-top:0}
.interpretation-part h3,.interpretation-summary h3{font:20px/1.25 Prata,serif;color:var(--gold);margin:0 0 14px}
.interpretation-part .interpretation-card{display:block;width:min(100%,190px);margin:0 auto 18px}
.interpretation-part .interpretation-card-label{font-size:13px}
.interpretation-part p,.interpretation-summary p{margin:0;color:var(--text-primary);font-size:15px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.interpretation-summary{padding:22px 0 4px;white-space:normal}

/* Production flow: generous targets, stable art, recoverable reading states. */
[hidden]{display:none!important}
.locale-switch button{min-width:44px;min-height:44px;font-size:12px;padding:8px}
.card-dialog-panel>button{width:44px;height:44px;top:8px;right:10px}
.card-dialog-panel{padding-top:60px;overscroll-behavior:contain}
.card-dialog-panel>img{aspect-ratio:3/5;object-fit:contain;align-self:start;background:#182333}
#detailMeaning{white-space:pre-line}
.library-filters button{min-height:44px}
.library-card span{font-size:12px}
.deck-label{font-size:13px;line-height:1.4}
.interpretation-card{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}
.interpretation-card-label{min-height:2.6em;line-height:1.3}
.interpretation-card-art{flex:none}
.text-action{min-height:44px;border:0;background:none;color:var(--gold);font:600 14px/1.4 'DM Sans',sans-serif;padding:10px 0;cursor:pointer;text-align:left}
.resume-reading{display:block;width:100%;text-align:center;margin:-16px 0 18px}
.history-item{display:block;width:100%;color:var(--text-primary);font:inherit;text-align:left;cursor:pointer}
.history-question{overflow-wrap:anywhere}
.reading-meta{font-size:14px;line-height:1.5;color:var(--text-secondary);margin:0 0 22px}
#historyCards{margin-bottom:24px}
#historyText{overflow-wrap:anywhere}
#interpretationText small{font-size:13px;line-height:1.5;color:var(--text-secondary);max-width:280px}
#interpretationText .history-state{white-space:normal}
#interpretationText .history-state .secondary-action{width:100%}
/* Card detail is a reading surface, not a thumbnail beside a narrow text column. */
.card-dialog-panel{grid-template-columns:minmax(0,1fr);gap:24px}
.card-dialog-panel>img{width:min(100%,210px);justify-self:center}
.card-dialog-copy h2{font-size:26px;margin-bottom:16px}
.card-dialog-copy p{font-size:16px;line-height:1.6}
.card-dialog-copy h3{font-size:12px;line-height:1.5;margin-top:22px}
.interpretation-part p,.interpretation-summary p{font-size:16px}

.library-filters{scrollbar-width:none}
.library-filters::-webkit-scrollbar{display:none}
#historyDetailScreen .header{margin-bottom:12px}
#historyDetailScreen .header .text-action{margin-bottom:8px}

/* Stable allowance copy, wraps at narrow phone widths. */
.allowance-status { color: var(--text-secondary); font-size: 13px; line-height: 1.5; margin: 16px 0 12px; text-align: center; overflow-wrap: anywhere; }

#mainScreen > .allowance-status { margin: 8px 0 10px; min-height: 3em; text-align: left; }
#mainScreen > #startReading { margin-top: 0; }