:root{--font-ui: "Segoe UI", Tahoma, sans-serif;--color-bg: #091a3a;--color-surface: #ffffff;--color-ink: #0f2940;--color-border: #c9daee;--shadow-soft: 0 8px 22px rgba(16, 42, 67, .14);--card-gap: 12px;--cards-row-height: clamp(100px, 20dvh, 200px);--control-row-height: 88px;--icon-chip-bg: rgba(255, 255, 255, .1);--icon-chip-border: rgba(255, 255, 255, .1);--icon-chip-hover: rgba(255, 255, 255, .16);--icon-chip-active: rgba(255, 255, 255, .18)}*{box-sizing:border-box}body{margin:0;min-width:320px;font-family:var(--font-ui);color:var(--color-ink);background:linear-gradient(145deg,#06152f,#0c2657,#1a458b);overflow:hidden}.page{--detail-scale: 1;padding:12px;display:grid;gap:10px;height:100dvh;width:100%;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden}.brand-row{display:flex;align-items:center;justify-content:flex-start;gap:12px;min-height:var(--control-row-height)}.backend-status{border-radius:10px;padding:8px 12px;font-size:20px;font-weight:700;width:fit-content;max-width:100%}.backend-status--loading{background:#8fb6ff38;color:#d9eaff;border:1px solid rgba(143,182,255,.55)}.backend-status--error{background:#d3000033;color:#ffd8d8;border:1px solid rgba(255,132,132,.6)}.brand-logo{height:52px;width:auto;object-fit:contain}.brand-logo-button{border:none;background:transparent;padding:0;margin:0;cursor:pointer}.icon-nav{border:1px solid var(--icon-chip-border);background:var(--icon-chip-bg);border-radius:14px;width:64px;height:64px;display:inline-flex;align-items:center;justify-content:center;line-height:1;padding:0;cursor:pointer;transition:transform .15s ease,background .15s ease}.icon-nav--edge{transform:scale(1.1);filter:brightness(1.25)}.icon-nav:hover,.icon-nav:focus-visible{background:var(--icon-chip-hover)}.person-filters-row{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:10px;height:var(--control-row-height);overflow:hidden;min-width:0;flex:1 1 auto}.header-tool-btn{width:64px;height:64px}.header-tool-btn--active{background:var(--icon-chip-active)}.person-filter{width:87px;height:87px;border:2px solid #7eb6ff;border-radius:999px;background:#d9eaff;padding:0;overflow:hidden;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.person-filter--all{background:var(--icon-chip-bg);border-color:var(--icon-chip-border)}.person-filter--pair{border-color:#ff8a00;box-shadow:0 0 0 2px #ff8a0038}.person-filter__avatar{width:100%;height:100%;object-fit:cover;display:block}.person-filter--active{border-color:#ff8a00;box-shadow:0 0 0 2px #ff8a004d}.layout-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;height:var(--cards-row-height);min-height:0}.icon-nav--strip{align-self:center;justify-self:center;min-width:78px}.cards-strip{display:grid;grid-auto-flow:column;grid-auto-columns:calc((var(--cards-row-height) - 20px) / 1.5);gap:var(--card-gap);overflow-x:auto;overflow-y:hidden;align-items:start;width:100%;padding:10px;border-radius:14px;background:linear-gradient(140deg,#0a1d42,#13326f 55%,#1e4a95);scrollbar-width:none;height:100%;scroll-snap-type:x mandatory}.cards-strip::-webkit-scrollbar{display:none}.content-card{border:1px solid rgba(201,218,238,.65);border-radius:16px;background:transparent;box-shadow:var(--shadow-soft);height:100%;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;scroll-snap-align:start;scroll-snap-stop:always}.content-card--read{background:transparent;border-color:#2f5fae}.content-card--selected{border:4px solid #ff8a00;box-shadow:0 0 0 2px #ff8a0040}.card-hero{position:relative;flex:0 0 64%;width:100%;min-height:0;overflow:hidden;padding:2px 2px 4px}.card-hero img{width:100%;height:calc(100% - 4px);margin-top:2px;object-fit:cover;border-radius:10px}.important-triangle{position:absolute;left:8px;bottom:8px;font-size:144px;color:#d30000;font-weight:900;line-height:1;pointer-events:none}.card-meta{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2px 4px;background:transparent;text-align:center;flex:0 0 36%;min-height:30px}.type-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}.detail-zone{min-height:0;display:grid;grid-template-rows:minmax(0,1fr);gap:4px;padding-bottom:84px;overflow:hidden}.detail-panel{border:1px solid rgba(201,218,238,.5);border-radius:14px;background:#f8fbff;padding:10px;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;overflow:hidden;width:min(100%,calc(1280px / var(--detail-scale)));max-width:min(100%,calc(1280px / var(--detail-scale)));max-height:100%;justify-self:center}.detail-panel--quote{grid-template-rows:auto;width:fit-content;max-width:min(100%,calc(1100px / var(--detail-scale)));padding:0;border:none;background:transparent;box-shadow:none}.detail-panel__header{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:10px}.detail-panel__header strong,.detail-panel__meta{font-size:clamp(17px,2.4vw,32px);line-height:1.15;font-weight:700}.detail-media{position:relative;width:fit-content;max-width:100%;min-height:0;border-radius:12px;overflow:hidden;background:#081a3a;display:flex;align-items:center;justify-content:center;height:100%;justify-self:center}.detail-media--text{width:100%;justify-self:stretch;overflow:visible}.detail-media--quote{width:fit-content;max-width:min(980px,100%);justify-self:center;padding:28px 36px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}.daily-quote-label{margin:0;font-size:clamp(22px,2.9vw,40px);font-weight:700;color:#8fb6ff}.daily-quote-text{margin:0;font-size:clamp(24px,3.1vw,44px);line-height:1.28;font-weight:700;color:#f8fbff}.detail-media__img{width:auto;height:100%;max-width:100%;object-fit:contain}.detail-media-player,.modal-media-player{width:100%;height:100%;object-fit:contain}.detail-empty-media{width:100%;height:100%}.detail-media-video-frame{background:#f8fbff;border-radius:12px;padding:14px;width:min(100%,1120px);height:100%;display:flex;align-items:center;justify-content:center}.detail-text-shell{position:relative;width:calc(100% - 220px);max-width:1100px;height:100%;overflow:visible;margin:0 auto}.detail-text-only{width:100%;height:100%;display:flex;align-items:flex-start;justify-content:center;text-align:center;padding:28px 72px 18px 18px;font-size:clamp(17px,2.4vw,32px);line-height:1.28;font-weight:700;color:#f8fbff;overflow-y:auto;scrollbar-width:none}.detail-text-only::-webkit-scrollbar{display:none}.detail-text-controls{position:absolute;top:50%;right:-134px;transform:translateY(-50%);display:grid;gap:10px;z-index:3}.text-scroll-btn{border:none;background:#d9eafff2;border-radius:12px;width:64px;height:64px;font-size:34px;line-height:1;cursor:pointer}.detail-inline-controls{min-height:0;padding:0;display:flex;align-items:center;gap:12px}.detail-inline-controls .inline-control-btn{width:34px;height:34px}.detail-text-audio-controls{position:absolute;left:8px;bottom:8px;display:flex;gap:8px;z-index:3}.detail-text-audio-controls .inline-control-btn{width:34px;height:34px;background:#d9eaffe6;border:none}.detail-text-audio-controls .ui-icon--inline{width:18px;height:18px;stroke:#0f2940}.inline-control-btn{border:1px solid var(--icon-chip-border);border-radius:10px;width:64px;height:64px;cursor:pointer;background:var(--icon-chip-bg);color:#fff}.inline-control-btn:hover,.inline-control-btn:focus-visible{background:var(--icon-chip-hover)}.inline-control-with-label{display:inline-flex;align-items:center;gap:6px;font-size:16px;font-weight:700}.tts-state{font-size:20px;font-weight:700}.center-status-overlay{position:fixed;inset:0;z-index:45;display:grid;justify-items:center;align-items:start;padding-top:33vh;pointer-events:none}.center-status-popup{pointer-events:auto;display:grid;gap:10px;place-items:center;max-width:min(88vw,680px);padding:16px 20px;border-radius:16px;border:1px solid rgba(74,125,18,.62);background:linear-gradient(155deg,#c4f770fa,#88d322fa);box-shadow:0 16px 34px #2a4d0a57}.center-status-popup p{margin:0;color:#13330e;font-size:clamp(18px,2vw,30px);font-weight:700;text-align:center}.detail-types-row{position:fixed;left:50%;bottom:10px;transform:translate(-50%);display:flex;justify-content:center;align-items:center;gap:18px;padding:4px 0;min-height:64px;max-height:64px;z-index:5}.detail-gallery-nav{position:absolute;top:50%;transform:translateY(-50%);border:none;border-radius:12px;width:56px;height:56px;cursor:pointer;background:#d9eafff0;z-index:3}.detail-gallery-nav:disabled{opacity:.45;cursor:default}.detail-gallery-nav--left{left:10px}.detail-gallery-nav--right{right:10px}.detail-gallery-count{position:absolute;right:14px;bottom:10px;font-size:16px;font-weight:700;color:#f8fbff;background:#081a3abf;border:1px solid rgba(201,218,238,.45);border-radius:999px;padding:4px 10px;line-height:1.2}.detail-type-item{width:64px;height:64px;line-height:1;opacity:.75}.detail-type-btn{border:1px solid var(--icon-chip-border);border-radius:14px;background:var(--icon-chip-bg);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:transform .12s ease,background .12s ease}.detail-type-btn:hover,.detail-type-btn:focus-visible{background:var(--icon-chip-hover);opacity:1}.detail-type-btn:active{transform:scale(.98) translateY(1px)}.modal-overlay{position:fixed;inset:0;background:#050e1ed9;z-index:30;display:grid;place-items:center;padding:16px}.modal-content{position:relative;width:min(95vw,1500px);height:min(92vh,980px);border-radius:16px;border:2px solid #c9daee;background:#f8fbff;display:grid;grid-template-rows:auto minmax(0,1fr);padding:12px;gap:8px}.modal-close{position:absolute;top:10px;right:10px;border:none;background:#d9eaff;width:64px;height:64px;border-radius:10px;font-size:22px;font-weight:800;cursor:pointer}.modal-header{font-size:clamp(24px,2.2vw,40px);font-weight:700;color:#0f2940;padding-right:70px}.modal-body{position:relative;min-height:0;border-radius:12px;background:#081a3a;overflow:hidden;display:grid;place-items:center}.modal-media{width:100%;height:100%;object-fit:contain}.modal-nav{position:absolute;top:50%;transform:translateY(-50%);border:none;border-radius:12px;width:64px;height:64px;cursor:pointer;background:#d9eafff2;z-index:2}.modal-nav--left{left:12px}.modal-nav--right{right:12px}.modal-text-shell{position:relative;width:100%;height:100%}.modal-text{width:calc(100% - 220px);max-width:1200px;margin:0 auto;height:100%;overflow-y:auto;scrollbar-width:none;padding:34px 84px 22px 24px;font-size:clamp(24px,2.8vw,42px);line-height:1.3;color:#f8fbff;text-align:center;font-weight:700}.modal-text::-webkit-scrollbar{display:none}.modal-text-controls{position:absolute;top:50%;right:14px;transform:translateY(-50%);display:grid;gap:10px}.modal-tts-controls{position:absolute;right:110px;bottom:14px;display:flex;gap:10px}.ui-icon{width:44px;height:44px;stroke:#fff;stroke-width:2.25;fill:none}.ui-icon--type{width:24px;height:24px;stroke:#fff;stroke-width:2.6}.content-card--read .ui-icon--type{stroke:#9fd1ff}.content-card--unseen:not(.content-card--read) .ui-icon--type{animation:unseen-icon-alert 1.2s ease-in-out infinite}@keyframes unseen-icon-alert{0%{stroke:#fff}50%{stroke:#ff3b3b}to{stroke:#fff}}.ui-icon--scroll{width:34px;height:34px;stroke:#0f2940}.ui-icon--inline{width:30px;height:30px}.ui-icon--nav{width:42px;height:42px}.ui-icon--filter{width:40px;height:40px}.center-dialog-overlay{position:fixed;inset:0;z-index:40;background:#050e1eb8;display:grid;place-items:center;padding:16px}.center-dialog{width:min(92vw,560px);border-radius:18px;border:1px solid rgba(201,218,238,.28);background:linear-gradient(155deg,#0a1d42,#15336e 60%,#1f4c97);box-shadow:0 24px 50px #0000006b;padding:22px;display:grid;gap:14px}.center-dialog__title{margin:0;font-size:clamp(24px,2.2vw,32px);color:#f8fbff}.center-dialog__input{width:100%;min-height:58px;border-radius:12px;border:1px solid rgba(201,218,238,.4);background:#ffffff1f;color:#fff;font-size:24px;padding:10px 14px}.center-dialog__input::placeholder{color:#f8fbffb3}.center-dialog__actions{display:flex;justify-content:flex-end;gap:10px}.center-dialog__btn{min-width:120px;min-height:52px;border-radius:12px;border:1px solid rgba(201,218,238,.4);color:#fff;font-size:20px;font-weight:700;cursor:pointer}.center-dialog__btn--cancel{background:#ffffff1f}.center-dialog__btn--confirm{background:#63aeff6b}@media(max-width:920px){:root{--cards-row-height: clamp(86px, 17dvh, 160px)}.icon-nav{width:56px;height:56px}.person-filter{width:76px;height:76px}.person-filter--all{background:var(--icon-chip-bg)}.brand-logo{height:42px}.detail-type-item{width:56px;height:56px}.detail-panel__header strong,.detail-panel__meta{font-size:clamp(15px,2.2vw,21px)}.detail-text-only{font-size:clamp(15px,2.2vw,21px);padding:18px 62px 14px 14px}.detail-text-shell{width:calc(100% - 150px)}.detail-text-controls{right:-96px}.text-scroll-btn{width:58px;height:58px;font-size:30px}}@media(orientation:landscape)and (min-width:1024px)and (max-width:1400px){:root{--cards-row-height: clamp(88px, 16dvh, 140px);--control-row-height: 76px}.page{padding:10px;gap:8px}.brand-row{gap:8px}.brand-logo{height:40px}.person-filter{width:72px;height:72px}.icon-nav{width:60px;height:60px}.ui-icon--filter{width:34px;height:34px}.ui-icon--type{width:20px;height:20px}.card-meta{padding:2px 3px;min-height:20px}.detail-zone{gap:2px}.detail-panel{width:100%;max-width:100%;padding:10px;gap:6px}.detail-panel__header strong,.detail-panel__meta{font-size:clamp(14px,1.7vw,20px)}.detail-media--quote{max-width:min(100%,900px);padding:18px 20px;gap:10px}.daily-quote-label{font-size:clamp(20px,2.2vw,30px)}.daily-quote-text{font-size:clamp(21px,2.6vw,32px)}.detail-text-shell{width:calc(100% - 130px);max-width:100%}.detail-text-only{font-size:clamp(14px,1.7vw,20px);line-height:1.24;padding:14px 54px 10px 10px}.detail-text-controls{right:-78px}.text-scroll-btn{width:52px;height:52px;font-size:26px}.detail-types-row{gap:10px;padding:2px 0;bottom:8px}.detail-type-item{width:58px;height:58px}.ui-icon--toolbar{width:34px;height:34px}}#root{width:100%;margin:0}