/* ========================================================= DUPLICATE SELECTOR REVIEW COPY --------------------------------------------------------- Exact duplicate top-level selector blocks have been moved next to their first occurrence. No CSS rule blocks or declarations were removed. Added comments identify: - properties that override an earlier block - properties that are new for that selector Original source: style(2).css ========================================================= */ /* ========================================================= BETTABETA DESIGN TOKENS --------------------------------------------------------- Authoritative --app-* and --reader-* values. Reused literal dimensions throughout this stylesheet reference this block. ========================================================= */ :root { --app-scale: .75; /* Typography */ --app-font-family-ui: system-ui, -apple-system, "Segoe UI", sans-serif; --app-font-family-reading: Georgia, "Times New Roman", serif; --app-font-size-page-title: clamp(calc(2.15rem * var(--app-scale)), 2.5vw, calc(3rem* var(--app-scale))); --app-font-size-page-subtitle: calc(1.02rem* var(--app-scale)); --app-font-size-hero-title: clamp(calc(1.85rem* var(--app-scale)), 2vw, calc(2.45rem* var(--app-scale))); --app-font-size-hero-copy: calc(1.08rem* var(--app-scale)); --app-font-size-section-title: calc(1.45rem* var(--app-scale)); --app-font-size-card-title: calc(1.20rem* var(--app-scale)); --app-font-size-body: calc(1.02rem* var(--app-scale)); --app-font-size-supporting: calc(.95rem* var(--app-scale)); --app-font-size-label: calc(1.35rem* var(--app-scale)); /* was .88 */ --app-font-size-small: calc(.82rem* var(--app-scale)); --app-font-size-micro: calc(.78rem* var(--app-scale)); --app-font-size-kpi-value: clamp(calc(2rem* var(--app-scale)), 2.2vw, calc(2.65rem* var(--app-scale))); --app-font-size-kpi-label: calc(1.02rem * var(--app-scale)); --app-font-size-eyebrow: calc(.82rem* var(--app-scale)); --app-table-font-size: calc(.95rem* var(--app-scale)); --app-status-font-size: calc(.80rem* var(--app-scale)); /* Line heights */ --app-line-height-page-subtitle: 1.55; --app-line-height-hero-title: 1.12; --app-line-height-hero-copy: 1.5; --app-line-height-heading: 1.25; --app-line-height-body: 1.55; --app-line-height-compact: 1.45; /* Page and section spacing */ --app-page-padding-y: calc(44px* var(--app-scale)); --app-page-padding-x: clamp(calc(32px* var(--app-scale)), 4.5vw, calc(68px* var(--app-scale))); --app-page-header-gap: calc(28px* var(--app-scale)); --app-section-gap: calc(28px* var(--app-scale)); --app-gap-xs: calc(8px* var(--app-scale)); --app-gap-sm: calc(12px* var(--app-scale)); --app-gap-md: calc(16px* var(--app-scale)); --app-gap-lg: calc(22px* var(--app-scale)); --app-gap-xl: calc(28px* var(--app-scale)); --app-heading-margin-bottom: calc(10px* var(--app-scale)); --app-paragraph-margin-bottom: calc(16px* var(--app-scale)); /* Cards and surfaces */ --app-card-padding: calc(24px* var(--app-scale)); --app-card-padding-compact: calc(22px * var(--app-scale)); --app-card-padding-large: calc(30px * var(--app-scale)); --app-card-radius: calc( 18px * var(--app-scale)); --app-card-min-height: calc( 112px* var(--app-scale)); --app-card-min-height-large: calc( 170px * var(--app-scale)); --app-color-border: #eadfce; --app-color-card: #fff; --app-color-page: #fffdf9; --app-shadow-card: 0 2px 8px rgba(36, 32, 24, .055); /* Hero and KPI components */ --app-hero-padding-y: calc( 34px * var(--app-scale)); --app-hero-padding-x: calc(38px * var(--app-scale)); --app-hero-margin-y: calc(24px * var(--app-scale)); --app-hero-min-height: calc( 118px * var(--app-scale)); --app-hero-icon-size: calc( 72px * var(--app-scale)); --app-kpi-padding-y: calc(24px * var(--app-scale)); --app-kpi-padding-x: calc( 26px * var(--app-scale)); --app-kpi-min-height: calc(112px * var(--app-scale)); /* Controls */ --app-button-min-height: calc(42px * var(--app-scale)); --app-button-padding-y: calc(10px* var(--app-scale)); --app-button-padding-x: calc(16px * var(--app-scale)); --app-button-radius: calc(12px * var(--app-scale)); --app-control-height: calc(42px* var(--app-scale)); --app-status-padding-y: calc(5px * var(--app-scale)); --app-status-padding-x: calc(10px * var(--app-scale)); /* Tables */ --app-table-cell-padding-y: calc(16px * var(--app-scale)); --app-table-cell-padding-x: calc(14px * var(--app-scale)); --app-table-cell-padding-dense-y: calc(14px * var(--app-scale)); --app-table-cell-padding-dense-x: calc( 12px * var(--app-scale)); --app-table-row-min-height: calc(52px * var(--app-scale)); /* Layout rails */ --app-side-panel-width: calc(380px * var(--app-scale)); --app-side-panel-gap: calc(20px * var(--app-scale)); --app-content-rail-gap: calc(28px * var(--app-scale)); /* Charts and empty states */ --app-chart-card-padding: calc(30px * var(--app-scale)); --app-chart-height: calc(400px * var(--app-scale)); --app-chart-height-compact: calc( 220px * var(--app-scale)); --app-chart-gap: calc(14px * var(--app-scale)); --app-chart-bar-height: calc(260px * var(--app-scale)); --app-chart-bar-width: calc(34px * var(--app-scale)); --app-empty-state-padding-y: calc(58px * var(--app-scale)); --app-empty-state-padding-x: calc( 44px * var(--app-scale)); /* Reader desktop */ --reader-font-size-desktop: calc( 1.17rem * var(--app-scale)); --reader-line-height-desktop: 1.75; --reader-content-padding-top: calc(70px * var(--app-scale)); --reader-content-padding-x: 9vw; --reader-content-padding-bottom: calc(36px* var(--app-scale)); --reader-paragraph-gap: calc(1.35em* var(--app-scale)); --reader-paragraph-padding-y: calc(3px* var(--app-scale)); --reader-paragraph-padding-x: calc(5px* var(--app-scale)); --reader-controls-padding-top: calc(16px * var(--app-scale)); --reader-controls-margin-top: calc( 28px * var(--app-scale)); /* Reader mobile */ --reader-mobile-font-size: clamp(1.14rem, 4.65vw, 1.34rem); --reader-mobile-line-height: 1.72; --reader-mobile-content-top: 56px; --reader-mobile-side-padding: clamp(22px, 7vw, 54px); --reader-mobile-paragraph-gap: 1.38em; --reader-mobile-header-button-size: 44px; --reader-mobile-control-height: 48px; --reader-mobile-bottom-bar-padding-y: 10px; --reader-mobile-bottom-offset: 74px; /* Repeated literal scales extracted from the existing stylesheet */ --app-border-radius-10px: calc(10px* var(--app-scale)); --app-border-radius-11px: calc(11px* var(--app-scale)); --app-border-radius-12px: calc(12px* var(--app-scale)); --app-border-radius-14px: calc(14px* var(--app-scale)); --app-border-radius-16px: calc(16px* var(--app-scale)); --app-border-radius-18px: calc(18px* var(--app-scale)); --app-border-radius-20px: calc(20px* var(--app-scale)); --app-border-radius-4px: calc(4px* var(--app-scale)); --app-border-radius-50pct: 50%; --app-border-radius-5px: calc(5px* var(--app-scale)); --app-border-radius-6px: calc(6px* var(--app-scale)); --app-border-radius-8px: calc(8px* var(--app-scale)); --app-border-radius-999px: calc(999px* var(--app-scale)); --app-border-radius-99px: calc(99px* var(--app-scale)); --reader-font-size-42em: calc(.42em* var(--app-scale)); --reader-font-size-48em: calc(.48em* var(--app-scale)); --app-font-size-152rem: calc(1.52rem* var(--app-scale)); --app-font-size-68rem: calc(.68rem* var(--app-scale)); --app-font-size-72rem: calc(.72rem* var(--app-scale)); --app-font-size-75rem: calc(.75rem * var(--app-scale)); --app-font-size-76rem: calc( .76rem* var(--app-scale)); --app-font-size-78rem: calc(.78rem* var(--app-scale)); --app-font-size-82rem: calc(.82rem* var(--app-scale)); --reader-font-size-84rem: calc(.84rem* var(--app-scale)); --app-font-size-85rem: calc(.85rem* var(--app-scale)); --app-font-size-86rem: calc(.86rem* var(--app-scale)); --app-font-size-88rem: calc(.88rem* var(--app-scale)); --app-font-size-8rem: calc(.8rem* var(--app-scale)); --app-font-size-92rem: calc(.92rem* var(--app-scale)); --app-font-size-94rem: calc(.94rem* var(--app-scale)); --app-font-size-95rem: calc(.95rem* var(--app-scale)); --reader-font-size-96rem: calc(.96rem* var(--app-scale)); --app-font-size-9rem: calc(.9rem* var(--app-scale)); --reader-font-size-0-72rem: calc(0.72rem* var(--app-scale)); --reader-font-size-0-78rem: calc(0.78rem* var(--app-scale)); --reader-font-size-0-9rem: calc(0.9rem* var(--app-scale)); --app-font-size-1-02rem: calc(1.02rem* var(--app-scale)); --app-font-size-1-03rem: calc(1.03rem* var(--app-scale)); --app-font-size-1-05rem: calc(1.05rem* var(--app-scale)); --app-font-size-1-08rem: calc(1.08rem* var(--app-scale)); --app-font-size-1-12rem: calc(1.12rem* var(--app-scale)); --app-font-size-1-15rem: calc(1.15rem* var(--app-scale)); --reader-font-size-1-17rem: calc(1.17rem* var(--app-scale)); --reader-font-size-1-18rem: calc(1.18rem* var(--app-scale)); --app-font-size-1-1rem: calc(1.1rem* var(--app-scale)); --app-font-size-1-22rem: calc(1.22rem* var(--app-scale)); --app-font-size-1-25rem: calc(1.25rem* var(--app-scale)); --app-font-size-1-2rem: calc(1.2rem* var(--app-scale)); --app-font-size-1-35rem: calc(1.35rem* var(--app-scale)); --app-font-size-1-3rem: calc(1.3rem* var(--app-scale)); --app-font-size-1-45rem: calc(1.45rem* var(--app-scale)); --app-font-size-1-4rem: calc(1.4rem* var(--app-scale)); --app-font-size-1-55rem: calc(1.55rem* var(--app-scale)); --app-font-size-1-5rem: calc(1.5rem* var(--app-scale)); --app-font-size-1-65rem: calc(1.65rem* var(--app-scale)); --app-font-size-1-75rem: calc(1.75rem* var(--app-scale)); --app-font-size-1-7rem: calc(1.7rem* var(--app-scale)); --app-font-size-1-85rem: calc(1.85rem* var(--app-scale)); --app-font-size-1-8rem: calc(1.8rem* var(--app-scale)); --app-font-size-1-95rem: calc(1.95rem* var(--app-scale)); --app-font-size-1-9rem: calc(1.9rem* var(--app-scale)); --app-font-size-12px: calc(12px* var(--app-scale)); --app-font-size-13px: calc(13px* var(--app-scale)); --app-font-size-1rem: calc(1rem* var(--app-scale)); --app-font-size-2-25rem: calc(2.25rem* var(--app-scale)); --app-font-size-2-2rem: calc(2.2rem* var(--app-scale)); --app-font-size-2-35rem: calc(2.35rem* var(--app-scale)); --reader-font-size-2-45rem: calc(2.45rem* var(--app-scale)); --app-font-size-2-5rem: calc(2.5rem* var(--app-scale)); --app-font-size-22px: calc(22px* var(--app-scale)); --app-font-size-24px: calc(24px* var(--app-scale)); --app-font-size-2rem: calc(2rem* var(--app-scale)); --app-font-size-3-2rem: calc(3.2rem* var(--app-scale)); --app-font-size-3-6rem: calc(3.6rem* var(--app-scale)); --reader-font-size-32px: calc(32px* var(--app-scale)); --app-font-size-36px: calc(36px* var(--app-scale)); --app-font-size-3rem: calc(3rem* var(--app-scale)); --app-font-size-4-2rem: calc(4.2rem* var(--app-scale)); --app-font-size-4-8rem: calc(4.8rem* var(--app-scale)); --reader-font-size-clamp-1-14rem-4-65vw-1-34rem: clamp(calc(1.14rem* var(--app-scale)),4.65vw,calc(1.34rem* var(--app-scale))); --reader-font-size-clamp-1-35rem-5vw-1-75rem: clamp(calc(1.35rem* var(--app-scale)),5vw,calc(1.75rem* var(--app-scale))); --reader-font-size-clamp-1-85rem-2vw-2-45rem: clamp(calc(1.85rem* var(--app-scale)), 2vw, calc(2.45rem* var(--app-scale))); --app-font-size-clamp-2-15rem-2-5vw-3rem: clamp(calc(2.15rem* var(--app-scale)), 2.5vw, calc(3rem* var(--app-scale))); --app-font-size-clamp-2-3rem-4-55vw-3-68rem: clamp(calc(2.3rem* var(--app-scale)),4.55vw,calc(3.68rem* var(--app-scale))); --app-font-size-clamp-2rem-2-2vw-2-65rem: clamp(calc(2rem* var(--app-scale)), 2.2vw, calc(2.65rem* var(--app-scale))); --app-font-size-clamp-2rem-2-3vw-2-65rem: clamp(calc(2rem* var(--app-scale)), 2.3vw, calc(2.65rem* var(--app-scale))); --app-font-size-clamp-2rem-3vw-2-6rem: clamp(calc(2rem* var(--app-scale)), 3vw, calc(2.6rem* var(--app-scale))); --reader-font-size-clamp-2rem-5vw-3-4rem: clamp(calc(2rem* var(--app-scale)),5vw,calc(3.4rem* var(--app-scale))); --app-font-size-clamp-2rem-8vw-3rem: clamp(calc(2rem* var(--app-scale)),8vw,calc(3rem* var(--app-scale))); --app-gap-10px: calc(10px* var(--app-scale)); --app-gap-12px: calc(12px* var(--app-scale)); --app-gap-14px: calc(14px* var(--app-scale)); --app-gap-16px: calc(16px* var(--app-scale)); --app-gap-18px: calc(18px* var(--app-scale)); --app-gap-20px: calc(20px* var(--app-scale)); --app-gap-22px: calc(22px* var(--app-scale)); --app-gap-24px: calc(24px* var(--app-scale)); --app-gap-28px: calc(28px* var(--app-scale)); --app-gap-2px: calc(2px* var(--app-scale)); --app-gap-32px: calc(32px* var(--app-scale)); --app-gap-3px: calc(3px* var(--app-scale)); --app-gap-4px: calc(4px* var(--app-scale)); --app-gap-6px: calc(6px* var(--app-scale)); --app-gap-7px: calc(7px* var(--app-scale)); --app-gap-8px: calc(8px* var(--app-scale)); --app-gap-42px: calc(42px* var(--app-scale)); --reader-gap-9px: calc(9px* var(--app-scale)); --app-height-10px: calc(10px* var(--app-scale)); --app-height-112px: calc(112px* var(--app-scale)); --app-height-116px: calc(116px* var(--app-scale)); --app-height-11px: calc(11px* var(--app-scale)); --app-height-12px: calc(12px* var(--app-scale)); --app-height-138px: calc(138px* var(--app-scale)); --app-height-150px: calc(150px* var(--app-scale)); --app-height-170px: calc(170px* var(--app-scale)); --app-height-180px: calc(180px* var(--app-scale)); --app-height-1px: calc(1px* var(--app-scale)); --app-height-220px: calc(220px* var(--app-scale)); --app-height-24px: calc(24px* var(--app-scale)); --app-height-260px: calc(260px* var(--app-scale)); --app-height-28px: calc(28px* var(--app-scale)); --app-height-30px: calc(30px* var(--app-scale)); --app-height-32px: calc(32px* var(--app-scale)); --app-height-36px: calc(36px* var(--app-scale)); --app-height-42px: calc(42px* var(--app-scale)); --app-height-44px: calc(44px* var(--app-scale)); --app-height-46px: calc(46px* var(--app-scale)); --app-height-48px: calc(48px* var(--app-scale)); --app-height-50px: calc(50px* var(--app-scale)); --app-height-56px: calc(56px* var(--app-scale)); --app-height-58px: calc(58px* var(--app-scale)); --app-height-70px: calc(70px* var(--app-scale)); --app-height-72px: calc(72px* var(--app-scale)); --app-height-88px: calc(88px* var(--app-scale)); --app-height-8px: calc(8px* var(--app-scale)); --app-height-96px: calc(96px* var(--app-scale)); --app-height-190px: calc(190px* var(--app-scale)); --app-line-height-1: 1 --app-line-height-1-05: 1.05; --app-line-height-1-08: 1.08; --app-line-height-1-12: 1.12; --reader-line-height-1-2: 1.2; --app-line-height-1-25: 1.25; --app-line-height-1-35: 1.35; --app-line-height-1-4: 1.4; --app-line-height-1-45: 1.45; --reader-line-height-1-5: 1.5; --app-line-height-1-55: 1.55; --app-line-height-1-65: 1.65; --app-margin-1em-0: .1em 0; --app-margin-4em-0: .4em 0; --app-margin-0-0-10px: 0 0 calc(10px* var(--app-scale)); --app-margin-0-0-12px: 0 0 calc(12px* var(--app-scale)); --app-margin-0-0-20px: 0 0 calc(20px* var(--app-scale)); --app-margin-0-0-22px: 0 0 calc(22px* var(--app-scale)); --app-margin-0-0-7px: 0 0 calc(7px* var(--app-scale)); --app-margin-0-0-8px: 0 0 calc(8px* var(--app-scale)); --app-margin-0-auto: 0 auto; --app-margin-0-auto-18px: 0 auto calc(18px* var(--app-scale)); --app-margin-6px: calc(6px* var(--app-scale)); --app-margin-8px: calc(8px* var(--app-scale)); --app-margin-12px-0: calc(12px* var(--app-scale)) 0; --app-margin-14px-0: calc(14px* var(--app-scale)) 0; --app-margin-16px-0: calc(16px* var(--app-scale)) 0; --app-margin-18px-0: calc(18px* var(--app-scale)) 0; --app-margin-22px-0-0: calc(22px* var(--app-scale)) 0 0; --app-margin-22px-0-18: calc(22px* var(--app-scale)) 0 calc(18px* var(--app-scale)); --app-margin-24px-0: calc(24px* var(--app-scale)) 0; --app-margin-8px-0-4px: calc(8px* var(--app-scale)) 0 calc(4px* var(--app-scale)); --app-margin-bottom-12px: calc(12px* var(--app-scale)); --app-margin-bottom-28px: calc(28px* var(--app-scale)); --app-margin-right-6px: calc(6px* var(--app-scale)); --app-margin-top-0-75rem: calc(0.75rem* var(--app-scale)); --app-margin-top-14px: calc(14px* var(--app-scale)); --app-margin-top-18px: calc(18px* var(--app-scale)); --app-margin-top-1rem: calc(1rem* var(--app-scale)); --app-margin-top-22px: calc(22px* var(--app-scale)); --app-margin-top-28px: calc(28px* var(--app-scale)); --app-margin-top-8px: calc(8px* var(--app-scale)); --app-max-width-1100px: calc(1100px* var(--app-scale)); --app-max-width-1120px: calc(1120px* var(--app-scale)); --app-max-width-1580px: calc(1580px* var(--app-scale)); --app-max-width-1740px: calc(1740px* var(--app-scale)); --reader-max-width-1680px: calc(1680px* var(--app-scale)); --app-max-width-340px: calc(340px* var(--app-scale)); --app-max-width-380px: calc(380px* var(--app-scale)); --app-max-width-520px: calc(520px* var(--app-scale)); --app-max-width-720px: calc(720px* var(--app-scale)); --app-min-height-100svh: 100svh; --app-min-height-100vh: 100vh; --app-min-height-112px: calc(112px* var(--app-scale)); --reader-min-height-128px: calc(128px* var(--app-scale)); --app-min-height-150px: calc(150px* var(--app-scale)); --app-min-height-330px: calc(330px* var(--app-scale)); --app-min-height-300px: calc(300px* var(--app-scale)); --app-min-height-42px: calc(42px* var(--app-scale)); --app-min-height-48px: calc(48px* var(--app-scale)); --reader-min-width-260px: calc(260px* var(--app-scale)); --app-min-width-46px: calc(46px* var(--app-scale)); --app-min-width-6px: calc(6px* var(--app-scale)); --app-min-width-92px: calc(92px* var(--app-scale)); --app-min-width-120px: calc(120px* var(--app-scale)); --app-padding-10px: calc(10px* var(--app-scale)); --app-padding-10px-12px: calc(10px* var(--app-scale)) calc(12px* var(--app-scale)); --app-padding-10px-14px: calc(10px* var(--app-scale)) calc(14px* var(--app-scale)); --app-padding-11px-12px: calc(11px* var(--app-scale)) calc(12px* var(--app-scale)); --app-padding-12px: calc(12px* var(--app-scale)); --app-padding-12px-14px: calc(12px* var(--app-scale)) calc(14px* var(--app-scale)); --app-padding-12px-16px: calc(12px* var(--app-scale)) calc(16px* var(--app-scale)); --app-padding-14px: calc(14px* var(--app-scale)); --app-padding-14px-16px: calc(14px* var(--app-scale)) calc(16px* var(--app-scale)); --app-padding-16px: calc(16px* var(--app-scale)); --app-padding-16px-14px: calc(16px* var(--app-scale)) calc(14px* var(--app-scale)); --app-padding-18px: calc(18px* var(--app-scale)); --app-padding-18px-20px: calc(18px* var(--app-scale)) calc(20px* var(--app-scale)); --app-padding-18px-22px: calc(18px* var(--app-scale)) calc(22px* var(--app-scale)); --app-padding-20px: calc(20px* var(--app-scale)); --app-padding-20px-22px: calc(20px* var(--app-scale)) calc(22px* var(--app-scale)); --app-padding-22px: calc(22px* var(--app-scale)); --app-padding-24px: calc(24px* var(--app-scale)); --app-padding-24px-26px: calc(24px* var(--app-scale)) calc(26px* var(--app-scale)); --app-padding-26px: calc(26px* var(--app-scale)); --app-padding-28px: calc(28px* var(--app-scale)); --app-padding-28px-18px: calc(28px* var(--app-scale)) calc(18px* var(--app-scale)); --app-padding-28px-30px: calc(28px* var(--app-scale)) calc(30px* var(--app-scale)); --app-padding-30px: calc(30px* var(--app-scale)); --app-padding-32px: calc(32px* var(--app-scale)); --app-padding-40px: calc(40px* var(--app-scale)); --app-padding-46px: calc(46px* var(--app-scale)); --app-padding-4px-8px: calc(4px* var(--app-scale)) calc(8px* var(--app-scale)); --app-padding-5px-9px: calc(5px * var(--app-scale)) calc(9px* var(--app-scale)); --app-padding-6px-10px: calc(6px* var(--app-scale)) calc(10px* var(--app-scale)); --app-padding-8px: calc(8px* var(--app-scale)); --app-padding-4px:calc(4px* var(--app-scale)); --app-padding-6px: calc(6px* var(--app-scale)); --app-padding-8px-0: calc(8px* var(--app-scale)) 0; --app-padding-8px-10px: calc(8px* var(--app-scale)) calc(10px* var(--app-scale)); --app-padding-8px-14px: calc(8px* var(--app-scale)) calc(14px* var(--app-scale)); --app-padding-bottom-12px: calc(12px* var(--app-scale)); --app-padding-bottom-16px: calc(16px* var(--app-scale)); --app-padding-bottom-6px: calc(6px* var(--app-scale)); --app-padding-left-1-2em: calc(1.2em* var(--app-scale)); --app-padding-left-34px: calc(34px* var(--app-scale)); --app-padding-top-18px: calc(18px* var(--app-scale)); --app-width-10px: calc(10px* var(--app-scale)); --app-width-110px: calc(110px* var(--app-scale)); --app-width-112px: calc(112px* var(--app-scale)); --app-width-11px: calc(11px* var(--app-scale)); --app-width-12px: calc(12px* var(--app-scale)); --app-width-1px: calc(1px* var(--app-scale)); --app-width-220px: calc(220px* var(--app-scale)); --app-width-28px: calc(28px* var(--app-scale)); --app-width-30px: calc(30px* var(--app-scale)); --app-width-32px: calc(32px* var(--app-scale)); --app-width-340px: calc(340px* var(--app-scale)); --app-width-34px: calc(34px * var(--app-scale)); --app-width-36px: calc(36px* var(--app-scale)); --app-width-380px: calc(380px * var(--app-scale)); --app-width-42px: calc(42px * var(--app-scale)); --app-width-44px: calc(44px * var(--app-scale)); --app-width-46px: calc(46px * var(--app-scale)); --app-width-48px: calc(48px * var(--app-scale)); --app-width-50px: calc(50px * var(--app-scale)); --app-width-58px: calc(58px * var(--app-scale)); --app-width-60px: calc(60px * var(--app-scale)); --app-width-70px: calc(70px * var(--app-scale)); --app-width-72px: calc(72px * var(--app-scale)); --app-width-96px: calc(96px * var(--app-scale)); --app-width-280px: calc(280px * var(--app-scale)); --app-grid-380px: calc(380px * var(--app-scale)); --app-grid-330px: calc(330px * var(--app-scale)); --app-grid-320px: calc(320px * var(--app-scale)); --app-5px:calc(5px * var(--app-scale)); --app-38px:calc(38px * var(--app-scale)); --app-52px:calc(52px * var(--app-scale)); --app-68px: calc(68px * var(--app-scale)); --app-85px:calc(85px * var(--app-scale)); --app-80px:calc(80px * var(--app-scale)); --app-245px:calc(245px * var(--app-scale)); --app-350px:calc(350px * var(--app-scale)); --app-410px:calc(410px * var(--app-scale)); --app-680px:calc(680px * var(--app-scale)); --app-860px:calc(860px * var(--app-scale)); --app-minus28px:calc(-28px * var(--app-scale)); --app-9px:calc(9px * var(--app-scale)); --app-76px:calc(76px * var(--app-scale)); --app-104px:calc(104px * var(--app-scale)); --app-210px:calc(210px * var(--app-scale)); --app-1020px:calc(1020px * var(--app-scale)); --app-400px:calc(400px * var(var(--app-scale))); --app-160px:calc(160px * var(var(--app-scale))); --app-980px:calc(980px * var(var(--app-scale))); --app-140px:calc(140px * var(var(--app-scale))); --app-62px:calc(62px * var(var(--app-scale))); --app-64px:calc(64px * var(var(--app-scale))); --app-230px:calc(230px * var(var(--app-scale))); } /* DUPLICATE SELECTOR — occurrence 2 of 3 */ :root{ --ink:#242018; --muted:#82786a; --line:#eadfce; --paper:#faf7f1; --card:#fff; --brand:#5b2eea; --brand-2:#6f3ff0; --sand:#fffaf3} /* DUPLICATE SELECTOR — occurrence 3 of 3 */ :root { --bb-card-radius: calc(18px * var(--app-scale)); --bb-border: #eadfce; --bb-shadow-soft: 0 calc(2px * var(--app-scale)) calc(8px * var(--app-scale)) rgba(36, 32, 24, .055); --bb-section-gap: calc(28px * var(--app-scale)); } body{font-family: system-ui, -apple-system, Segoe UI, sans-serif; background:#faf7f1; color:#242018; margin:0} main{max-width:var(--app-max-width-1100px);margin:var(--app-margin-0-auto);padding:var(--app-padding-28px)} a{color:#6941c6} button,.buttonlike{padding:var(--app-padding-10px-14px);border:0;border-radius:var(--app-border-radius-10px);background:#242018;color:white;cursor:pointer;text-decoration:none;display:inline-block} input{padding:var(--app-padding-10px);margin:var(--app-margin-6px);border:1px solid #ddd;border-radius:var(--app-border-radius-8px)} .card,.insight{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-18px);margin:var(--app-margin-14px-0);box-shadow:0 1px 2px #0001} .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--app-width-280px),1fr));gap:var(--app-gap-14px)} .answer{font-size:var(--app-font-size-1-15)} .confidence{color:#736b5e} table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--app-border-radius-12px);overflow:hidden} td,th{padding:var(--app-padding-10px);border-bottom:1px solid #eee;text-align:left} .subtle{color:#82786a} .heatmap{display:flex;gap:var(--app-gap-8px);flex-wrap:wrap;margin:var(--app-gap-20px) 0} .cell{width:var(--app-width-44px);height:var(--app-height-44px);border-radius:var(--app-border-radius-10px);display:grid;place-items:center;font-weight:700} .fast{background:#d7f5df} .normal{background:#fff2bd} .slow{background:#ffd2cc} .waiting{background:#e9e4dc} .legend{display:flex;gap:var(--app-gap-10px);flex-wrap:wrap} .legend span{padding:var(--app-padding-8px-10px);border-radius:10px} .comment{background:#fff;border-left:var(--app-border-radius-4px) solid #6941c6;padding:var(--app-padding-12px);margin:var(--app-gap-10px) 0} /* Reader / author review layout */ body:has(.reader-shell) main{max-width:none;padding:0} .reader-shell{height:calc(100vh - var(--app-height-56px));display:grid;grid-template-columns:var(--app-width-280px) minmax(620px,1fr) 360px;gap:var(--app-gap-28px);overflow:hidden} .toc-panel,.comment-panel{background:#fffaf3;border:1px solid #eadfce;padding:var(--app-padding-22px);overflow:auto} .toc-panel{border-left:0} .comment-panel{border-right:0} .toc-panel h3,.comment-panel h3{margin-top:0} .toc-list{display:flex;flex-direction:column;gap:var(--app-border-radius-4px)} .toc-item{color:#242018;text-decoration:none;padding:var(--app-padding-10px-12px);border-radius:9px} .toc-item.active{background:#eadfce} .book-page{background:#fff;margin:0;align-self:stretch;overflow:auto;padding:70px 9vw 36px;line-height:1.75;font-family:Georgia, "Times New Roman", serif;font-size:var(--reader-font-size-1-17rem);box-shadow:0 0 0 1px #eee} .reader-note{font-family:system-ui, -apple-system, Segoe UI, sans-serif;font-size:var(--app-font-size-9rem);color:#82786a;margin-bottom:var(--app-gap-24px)} .para{margin:1.35em 0;cursor:default;border-radius:var(--app-border-radius-8px);padding:3px 5px} .reader.reader .para,.reader-shell.reader .para{cursor:pointer} .para:hover{background:#fff8df} .para.selected{background:#fff0b8;outline:2px solid #ead077} .para.target{background:#ffe7b5;outline:3px solid #d19a00} .readerbar{position:sticky;bottom:0;background:#fff;padding:16px 0 0;display:flex;justify-content:space-between;border-top:1px solid #eee;margin-top:28px} textarea{width:100%;min-height:var(--app-min-height-150px);border:1px solid #dacdbc;border-radius:var(--app-border-radius-10px);padding:var(--app-padding-12px);box-sizing:border-box;font:inherit;background:#fff} .comment-card,.review-card{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-12px);padding:var(--app-padding-12px);margin:12px 0} .comment-meta,.review-card small{color:#82786a;font-size:.85rem} .review-jump{display:block;color:#242018;text-decoration:none} .review-jump p{margin:.5em 0} .status{font-size:var(--app-font-size-78rem);background:#fff2bd;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-4px-8px);margin-left:8px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 388. Overrides earlier properties: background, border-radius, font-size, padding Adds new properties: None */ .status{padding:var(--app-padding-4px-8px);border-radius:var(--app-border-radius-999px);background:#fff3bf;font-size:.8rem} .status.reviewed_updated{background:#d7f5df} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 388. Overrides earlier properties: background Adds new properties: None */ .status.reviewed_updated{background:#d7f5df} .status.reviewed_no_change{background:#e9e4dc} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 388. Overrides earlier properties: background Adds new properties: None */ .status.reviewed_no_change{background:#eee} .review-actions{display:flex;gap:var(--app-gap-6px);flex-wrap:wrap;margin-top:10px} .review-actions button{font-size:var(--app-font-size-78rem);padding:7px 9px} .review-actions .secondary{background:#e9e4dc;color:#242018} @media(max-width:1000px){.reader-shell{grid-template-columns:1fr;height:auto;overflow:visible}.toc-panel,.comment-panel,.book-page{overflow:visible}.book-page{padding:36px 28px}.toc-panel{border-left:1px solid #eadfce}.comment-panel{border-right:1px solid #eadfce}} /* Auth / account UX */ .topbar{height:var(--app-height-56px);display:flex;align-items:center;gap:var(--app-gap-16px);padding:0 var(--app-gap-24px);background:#fff;border-bottom:1px solid #eadfce}.topbar .brand{font-weight:800;color:#242018;text-decoration:none;margin-right:auto}.topbar form{margin:0}.secondary{background:#eee;color:#242018} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 689. Overrides earlier properties: background, color Adds new properties: border */ .secondary{background:#fff;color:#242018;border:1px solid #eadfce} .auth-wrap{min-height:calc(100vh - 56px);display:grid;place-items:center}.auth-card{width:min(520px,92vw);background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-20px);padding:var(--app-padding-28px);box-shadow:0 var(--app-gap-3px) var(--app-gap-12px) #0001}.stack{display:flex;flex-direction:column;gap:var(--app-gap-12px)}.stack label{display:flex;flex-direction:column;font-weight:700}.stack input{margin:var(--app-margin-6px) 0 0}.oauth-grid{display:grid;gap:var(--app-gap-10px);margin:18px 0}.oauth{display:block;text-align:center;padding:var(--app-padding-12px);border-radius:var(--app-border-radius-12px);text-decoration:none;font-weight:800;border:1px solid #ddd;color:#242018;background:#fff}.oauth.apple{background:#242018;color:#fff}.oauth.google{background:#fff}.oauth.facebook{background:#1877f2;color:#fff}.divider{display:flex;align-items:center;gap:var(--app-gap-10px);color:#82786a;margin:18px 0}.divider:before,.divider:after{content:"";height:var(--app-height-1px);background:#eadfce;flex:1}.error{background:#ffe3e0;border:1px solid #ffb8b0;color:#8a1f11;padding:var(--app-padding-10px-12px);border-radius:10px} .verification-card{text-align:center}.verification-card .stack{margin-top:18px}.email-callout{background:#fffaf3;border:2px solid #eadfce;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-18px);margin:var(--app-margin-18px-0);text-align:left}.email-callout p{margin:.6em 0 0}.field-help{margin-top:-6px;color:#82786a;font-size:var(--app-font-size-92rem)} /* Reader invite welcome */ .topbar .small{padding:var(--app-padding-8px-10px);font-size:.9rem}.topbar .buttonlike{color:white}.topbar .secondary.buttonlike{background:#eee;color:#242018}.welcome-shell{min-height:calc(100vh - 112px);display:grid;place-items:center}.welcome-card{width:min(820px,92vw);background:#fff;border:1px solid #eadfce;border-radius:var(--app-gap-24px);padding:42px;box-shadow:0 var(--app-gap-6px) var(--app-gap-24px) #00000012}.welcome-card h1{font-family:Georgia,"Times New Roman",serif;text-align:center;font-size:var(--app-font-size-2-5rem);margin:.1em 0}.book-byline{text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:1.25rem}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:#82786a;font-weight:800;text-align:center}.welcome-card h2{margin-top:32px}.welcome-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--app-gap-24px);margin:28px 0}.welcome-grid ul{padding-left:var(--app-padding-left-1-2em);line-height:1.8}.account-pitch{background:#fffaf3;border:1px solid #eadfce;border-radius:var(--app-border-radius-18px);padding:var(--app-gap-20px)}.full{width:100%;box-sizing:border-box;text-align:center}.start-reading-form{text-align:center;margin-top:28px}.start-reading{font-size:var(--app-font-size-1-15rem);padding:14px 28px;border-radius:14px}@media(max-width:800px){.welcome-grid{grid-template-columns:1fr}.welcome-card{padding:var(--app-padding-28px)}} /* Author decision dashboard V1 */ .insight-grid{grid-template-columns:repeat(auto-fit,minmax(330px,1fr));align-items:stretch} .insight h2{margin-top:0} .why{background:#fffaf3;border:1px solid #eadfce;border-radius:var(--app-border-radius-12px);padding:var(--app-padding-10px-14px);margin:var(--app-margin-14px-0)} .why h3{font-size:var(--app-font-size-95rem);margin:.2em 0 .5em} .why ul{margin:var(--app-margin-4em-0);padding-left:var(--app-padding-left-1-2em)} .evidence-link{font-weight:800} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2413. Overrides earlier properties: font-weight Adds new properties: align-items, background, border, color, cursor, display, font, gap, padding, text-decoration */ .evidence-link{display:inline-flex;align-items:center;gap:.35rem;border:0;background:transparent;color:#6d43d8;font:inherit;font-weight:700;padding:0;cursor:pointer;text-decoration:none} .kpis{display:flex;gap:var(--app-gap-14px);flex-wrap:wrap;margin:var(--app-margin-16px-0)} .kpis>div{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-14px) var(--app-padding-18px);min-width:var(--app-min-width-120px)} .kpis span{display:block;font-size:var(--app-font-size-1-8rem);font-weight:800;margin-top:var(--app-border-radius-4px)} .funnel-list{display:grid;gap:var(--app-gap-8px)}.funnel-row{display:grid;grid-template-columns:minmax(var(--app-height-190px),var(--app-height-260px)) 1fr var(--app-85px) var(--app-80px);align-items:center;gap:var(--app-gap-12px);width:100%;background:#fff;color:#242018;border:1px solid #eee;border-radius:var(--app-border-radius-12px);text-align:left;padding:var(--app-padding-10px-12px)} .funnel-row:hover,.funnel-row.selected{border-color:#d6c7b2;background:#fffaf3} .funnel-label{font-weight:700} .bar-wrap{height:var(--app-height-24px);background:#efe8dc;border-radius:var(--app-border-radius-999px);overflow:hidden} .bar-fill{height:100%;display:block;background:#242018;border-radius:var(--app-border-radius-999px)} .funnel-count{white-space:nowrap} .drop{color:#82786a} .drop.bad{color:#a43d2e;font-weight:800} .mini-bar{display:inline-block;width:var(--app-width-110px);height:var(--app-height-10px);background:#eee;border-radius:var(--app-border-radius-99px);vertical-align:middle;overflow:hidden;margin-right:var(--app-margin-8px)} .mini-bar span{display:block;height:100%;background:#242018;border-radius:99px} .pill{display:inline-block;padding:var(--app-padding-6px-10px);border-radius:var(--app-border-radius-999px);font-weight:700;font-size:.85rem} .conf-low{background:#d7f5df} .conf-medium{background:#fff2bd} .conf-high{background:#ffd2cc} .conf-waiting{background:#e9e4dc} .comment-heatmap{display:flex;flex-wrap:wrap;gap:var(--app-gap-8px);margin:var(--app-margin-16px-0)} .comment-cell{width:var(--app-width-60px);height:var(--app-height-56px);border-radius:var(--app-border-radius-12px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:#242018} .comment-cell small{font-size:var(--app-font-size-72rem);color:#242018;opacity:.8} .unit-heatmap{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--app-width-34px),1fr));gap:var(--app-gap-6px);margin:var(--app-margin-16px-0)} .unit-cell{height:var(--app-height-32px);border-radius:var(--app-border-radius-8px);display:grid;place-items:center;text-decoration:none;color:#242018;font-size:var(--app-font-size-78rem);font-weight:800} .discussion-none{background:#e9e4dc;color:#242018} .discussion-low{background:#d7f5df;color:#242018} .discussion-medium{background:#fff2bd;color:#242018} .discussion-high{background:#ffd2cc;color:#242018} .comment small{color:#82786a} @media(max-width:800px){.funnel-row{grid-template-columns:1fr}.bar-wrap{width:100%}} .finding-columns{display:grid;grid-template-columns:1fr 1fr;gap:var(--app-gap-18px)} .finding{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-14px);margin:var(--app-margin-12px-0)} .finding h4{margin:.1rem 0 .4rem} .finding.problem{border-left:var(--app-border-radius-5px) solid #d95f59} .finding.strength{border-left:var(--app-border-radius-5px) solid #5fbf7a} .finding.mixed,.finding.note{border-left:var(--app-border-radius-5px) solid #d7b85f} @media(max-width:900px){.finding-columns{grid-template-columns:1fr}} .answer-lines p{margin:.35em 0 1em} .answer-lines p:last-child{margin-bottom:0} .burndown-chart{display:flex;align-items:end;gap:var(--app-gap-10px);min-height:250px;padding:var(--app-padding-18px) var(--app-padding-4px) var(--app-padding-6px);overflow-x:auto} .chapter-bar{border:0;background:transparent;color:#242018;display:grid;grid-template-rows:var(--app-height-24px) var(--app-height-150px) var(--app-padding-20px) var(--app-padding-20px);justify-items:center;align-items:end;gap:var(--app-gap-6px);min-width:var(--app-width-50px);cursor:pointer} .chapter-bar .bar-column{height:var(--app-height-150px);width:var(--app-width-32px);background:#efe8dc;border-radius:var(--app-border-radius-8px);display:flex;align-items:end;overflow:hidden} .chapter-bar .bar-column span{display:block;width:100%;background:#242018;border-radius:var(--app-border-radius-8px) var(--app-border-radius-8px) 0 0} .chapter-bar.drop-red .bar-column span{background:#b4493d} .chapter-bar.selected .bar-column{outline:3px solid #d7b85f}.bar-top{font-weight:800} .bar-label{font-weight:800;line-height:1} .drop-badge{font-size:var(--app-font-size-72rem);font-weight:800;white-space:nowrap;min-height:1em} .drop-red .drop-badge{color:#b4493d}.drop-amber .drop-badge{color:#b27b16} .drop-gray .drop-badge{color:#82786a}.unit-burndown{display:grid;gap:8px} .unit-bar{display:grid;grid-template-columns:180px minmax(200px,1fr) 70px 70px 60px;gap:var(--app-gap-12px);align-items:center;padding:9px 10px;border-bottom:1px solid #eee} .unit-bar.drop-red{background:#fff5f3} .unit-bar.drop-amber{background:#fffaf0} .unit-bar.drop-gray{background:#faf9f6} .unit-bar.drop-red .drop{color:#b4493d;font-weight:800} .unit-bar.drop-amber .drop{color:#b27b16;font-weight:800} .comment-pills{display:flex;gap:var(--app-gap-6px);flex-wrap:wrap} .ai-pill{display:inline-block;background:#e9e4dc;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-4px-8px);font-size:var(--app-font-size-8rem);font-weight:700;text-transform:capitalize} .sentiment-positive{background:#d7f5df} .sentiment-negative{background:#ffd2cc} .sentiment-mixed{background:#fff2bd} .sentiment-neutral{background:#e9e4dc} @media(max-width:800px){.unit-bar{grid-template-columns:1fr}.burndown-chart{min-height:220px}} .state-pill{display:inline-block;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-5px-9px);font-weight:800;font-size:var(--app-font-size-82rem);background:#e9e4dc}.state-new_invite{background:#d7f5df}.state-at_risk_invite,.state-stalled{background:#fff2bd}.state-ignored_invite,.state-churned{background:#ffd2cc}.state-active{background:#d7f5df}.state-completed{background:#e5ddff} /* Author home / beta library */ .page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--app-gap-18px);margin-bottom:18px} .page-header h1{margin-bottom:.2em} .upload-panel{display:grid;grid-template-columns:minmax(220px,.8fr) 2fr;gap:var(--app-gap-20px);align-items:center} .upload-panel h2{margin:.1em 0 .25em} .compact-upload{display:grid;grid-template-columns:1.2fr .8fr .8fr auto;gap:var(--app-gap-10px);align-items:end} .compact-upload label{font-weight:700} .compact-upload input{box-sizing:border-box;width:100%;margin:var(--app-margin-6px) 0 0} .home-section{margin-top:28px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 721. Overrides earlier properties: margin-top Adds new properties: None */ .home-section{margin-top:26px} .beta-table-card{padding:0;overflow:auto}.beta-table th{font-size:var(--app-font-size-9rem);color:#5f564b}.strong-link{font-weight:800}.small-text{font-size:.85rem}.beta-signal{max-width:360px;color:#5f564b}.status-chip{display:inline-block;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-6px-10px);font-size:var(--app-font-size-8rem);font-weight:800;background:#e9e4dc;white-space:nowrap} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 717. Overrides earlier properties: background, border-radius, display, font-size, font-weight, padding Adds new properties: color, margin-right */ .status-chip{display:inline-block;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-6px-10px);font-weight:850;font-size:var(--app-font-size-85rem);margin-right:12px;background:#efe5ff;color:#6f3ff0} .status-collecting-readers,.status-reading-in-progress{background:#d7f5df}.status-invites-sent{background:#fff2bd}.status-needs-attention{background:#ffd2cc}.status-complete{background:#e5ddff}.empty-state{max-width:760px}.empty-state ul{line-height:1.8}@media(max-width:1000px){.upload-panel{grid-template-columns:1fr}.compact-upload{grid-template-columns:1fr}.page-header{display:block}} /* Author home onboarding */ .first-beta-card { display: grid; grid-template-columns: 1fr 1.1fr; gap: var(--app-gap-32px); align-items: start; margin-bottom: 36px; } .first-beta-copy h2, .demo-card h3 { margin-top: 0; } .steps-list { margin: 18px 0 0; padding-left: 22px; } .steps-list li { margin: 8px 0; } .first-upload-form { display: grid; grid-template-columns: 1fr; gap: var(--app-gap-14px); } .first-upload-form label { display: grid; gap: var(--app-gap-6px); font-weight: 700; } .demo-card { display: grid; grid-template-columns: 1fr auto; gap: var(--app-gap-24px); align-items: center; } .demo-cta { display: flex; flex-direction: column; gap: var(--app-gap-12px); align-items: flex-start; min-width: 210px; } .status-demo { background: #ece7de; color: #2a241f; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 717. Overrides earlier properties: background, color Adds new properties: None */ .status-demo{background:#e9e4dc;color:#5f564b} @media (max-width: 900px) { .first-beta-card, .demo-card { grid-template-columns: 1fr; } } /* Profile/settings */ .topbar-nav { display: flex; gap: var(--app-gap-14px); margin-left: auto; margin-right: 18px; align-items: center; } .topbar-nav a { color: var(--ink); text-decoration: none; font-weight: 700; } .topbar-nav a:hover { text-decoration: underline; } .profile-header { align-items: center; } .profile-layout { display: grid; grid-template-columns: minmax(0, 760px) 320px; gap: var(--app-gap-24px); align-items: start; } .profile-form { display: grid; gap: var(--app-gap-14px); } .profile-form label { display: grid; gap: var(--app-gap-8px); font-weight: 700; } .profile-form input, .profile-form textarea { width: 100%; box-sizing: border-box; } .profile-form hr { border: 0; border-top: 1px solid var(--line); width: 100%; margin: var(--app-margin-12px-0); } .checkbox-row { display: flex !important; flex-direction: row; align-items: center; gap: var(--app-gap-10px) !important; font-weight: 600 !important; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 478. Overrides earlier properties: align-items, display, font-weight, gap Adds new properties: None */ .checkbox-row{display:flex;align-items:center;gap:var(--app-gap-8px);font-weight:600} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 619. Overrides earlier properties: align-items, display, font-weight, gap Adds new properties: grid-template-columns */ .checkbox-row { display: flex !important; grid-template-columns: none !important; align-items: center; gap: var(--app-gap-8px); font-weight: 700; } .checkbox-row input { width: auto; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 478. Overrides earlier properties: width Adds new properties: margin */ .checkbox-row input{width:auto;margin:0} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 620. Overrides earlier properties: margin, width Adds new properties: None */ .checkbox-row input { width: auto; margin: 0; } .profile-preview { position: sticky; top: 90px; } .profile-avatar { width: var(--app-width-96px); height: var(--app-height-96px); border-radius: var(--app-border-radius-50pct); object-fit: cover; margin-bottom: var(--app-margin-bottom-12px); } .placeholder-avatar { display: grid; place-items: center; background: var(--sand); font-size: var(--app-font-size-36px); font-weight: 800; color: var(--ink); } .success-banner { max-width: var(--app-max-width-1120px); margin: var(--app-margin-0-auto-18px); padding: var(--app-padding-12px-16px); border: 1px solid #b7e4c7; background: #ecfdf3; border-radius: var(--app-border-radius-12px); font-weight: 700; } .secondary-link { text-decoration: none; } @media (max-width: 900px) { .profile-layout { grid-template-columns: 1fr; } .profile-preview { position: static; } .topbar-nav { display:none; } } .chapter-title-input{width:100%;max-width:420px;box-sizing:border-box}.invite-list code{color:#5f564b;font-size:.9rem}.reader-topbar{position:relative;z-index:10} .error-banner { max-width: var(--app-max-width-1120px); margin: var(--app-margin-0-auto-18px); padding: var(--app-padding-12px-16px); border: 1px solid #f5b5b5; background: #fff1f1; border-radius: var(--app-border-radius-12px); font-weight: 700; color: #6b1f1f; } .narrow { max-width: var(--app-max-width-720px); margin: var(--app-padding-40px) auto; } .buttonlike { display: inline-block; text-decoration: none; } .ops-controls{display:flex;justify-content:space-between;gap:var(--app-gap-16px);align-items:center;flex-wrap:wrap}.ops-tabs{display:flex;gap:var(--app-gap-8px);flex-wrap:wrap}.ops-tabs a{padding:var(--app-padding-8px-10px);border-radius:var(--app-border-radius-999px);background:#fffaf3;border:1px solid #eadfce;text-decoration:none;color:#242018;font-weight:700}.ops-tabs a.active{background:#242018;color:#fff}.time-filter select{padding:var(--app-padding-8px);border-radius:var(--app-border-radius-8px);border:1px solid #ddd;background:#fff}.ops-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--app-gap-20px);align-items:start}.cards .card strong{display:block;font-size:2rem}.cards .card span{display:block;color:#82786a;margin-top:6px} /* Phase 3 Sprint 1A: mobile/tablet reader presentation. Desktop author/reader review layout remains the existing three-pane layout. */ .mobile-reader-header,.mobile-reader-backdrop,.mobile-panel-heading{display:none} @media(max-width:900px){ body:has(.reader-shell.reader){background:#fff} body:has(.reader-shell.reader) .topbar.reader-topbar{display:none} body:has(.reader-shell.reader) main{padding:0} .reader-shell.reader{min-height:var(--app-min-height-100vh);height:auto;display:block;overflow:visible;background:#fff} .reader-shell.reader .mobile-reader-header{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:var(--app-width-48px) 1fr var(--app-width-48px);align-items:center;gap:var(--app-gap-8px);background:rgba(255,255,255,.96);border-bottom:1px solid #eee;padding:var(--app-padding-8px-10px);backdrop-filter:blur(8px)} .mobile-icon-button{width:var(--app-width-44px);height:var(--app-height-44px);border-radius:var(--app-border-radius-999px);padding:0;font-size:var(--app-font-size-1-1rem);background:#242018;color:#fff;display:grid;place-items:center} .mobile-reader-title{min-width:0;text-align:center;line-height:var(--reader-line-height-1-2);font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#242018} .mobile-reader-title strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.95rem} .mobile-reader-title span{display:block;color:#82786a;font-size:var(--app-font-size-78rem);margin-top:2px} .reader-shell.reader .book-page{box-shadow:none;min-height:calc(100vh - 62px);padding:34px clamp(20px,7vw,44px) 92px;font-size:var(--reader-font-size-1-18rem);line-height:1.78;overflow:visible;background:#fff} .reader-shell.reader .reader-note{display:none} .reader-shell.reader .book-chapter-title{font-size:var(--app-font-size-1-45rem);line-height:var(--app-line-height-1-25);margin:0 0 1.2em;text-align:center} .reader-shell.reader .para{margin:1.2em 0;padding:5px 2px;border-radius:10px} .reader-shell.reader .para:hover{background:transparent} .reader-shell.reader .para.selected{background:#fff1bd;outline:2px solid #ead077;padding:5px 7px;margin-left:-7px;margin-right:-7px} .reader-shell.reader .readerbar{position:fixed;left:0;right:0;bottom:0;z-index:25;background:rgba(255,255,255,.97);border-top:1px solid #eee;margin:0;padding:10px 14px calc(10px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1fr;gap:var(--app-gap-10px);box-shadow:0 -var(--app-gap-6px) var(--app-gap-18px) #00000012} .reader-shell.reader .readerbar button{width:100%;min-height:46px;border-radius:999px} .reader-shell.reader .toc-panel,.reader-shell.reader .comment-panel{position:fixed;z-index:40;background:#fffaf3;border:0;box-shadow:0 var(--app-gap-18px) var(--app-width-50px) #00000042;overflow:auto;transition:transform .18s ease;display:block} .reader-shell.reader .toc-panel{top:0;bottom:0;left:0;width:min(86vw,340px);transform:translateX(-105%);border-right:1px solid #eadfce} .reader-shell.reader .comment-panel{left:0;right:0;bottom:0;max-height:82vh;border-radius:22px 22px 0 0;transform:translateY(105%);padding-bottom:calc(22px + env(safe-area-inset-bottom))} .reader-shell.reader.mobile-toc-open .toc-panel{transform:translateX(0)} .reader-shell.reader.mobile-comments-open .comment-panel{transform:translateY(0)} .reader-shell.reader.mobile-toc-open .mobile-reader-backdrop,.reader-shell.reader.mobile-comments-open .mobile-reader-backdrop{display:block;position:fixed;inset:0;background:#0008;z-index:35} .reader-shell.reader .mobile-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px} .reader-shell.reader .mobile-panel-heading h3{margin:0} .mobile-panel-close{background:#e9e4dc;color:#242018;border-radius:var(--app-border-radius-999px);padding:8px 12px;font-size:.86rem} .reader-shell.reader textarea{min-height:110px;font-size:1rem} } @media(min-width:901px){ .reader-shell.reader .toc-panel,.reader-shell.reader .comment-panel{transform:none!important} } /* Phase 3 Sprint 1B: immersive mobile reader polish. Desktop remains the existing three-pane reader/review experience. */ .para-text{display:inline}.comment-badge{display:none}.reader-progress-label{display:none}.mobile-comment-cta{display:none} @media(max-width:900px){ .reader-shell.reader{--reader-bottom:74px;--reader-side:clamp(22px,7vw,54px);font-feature-settings:"kern" 1;background:#fffdf8;color:#1f1b16} .reader-shell.reader.reader-chrome-hidden .mobile-reader-header{transform:translateY(-110%)} .reader-shell.reader.reader-chrome-hidden .readerbar{transform:translateY(76%);opacity:.92} .reader-shell.reader .mobile-reader-header{transition:transform .22s ease, opacity .22s ease;background:linear-gradient(to bottom,rgba(255,253,248,.98),rgba(255,253,248,.9));border-bottom:0;box-shadow:0 8px 24px #0000000d;padding:calc(8px + env(safe-area-inset-top)) 12px 8px} .reader-shell.reader .mobile-icon-button{background:rgba(36,32,24,.9);box-shadow:0 3px 10px #00000018;-webkit-tap-highlight-color:transparent} .reader-shell.reader .book-page{max-width:var(--app-max-width-720px);margin:var(--app-margin-0-auto);min-height:var(--app-min-height-100svh);padding:56px var(--reader-side) calc(var(--reader-bottom) + 42px);font-size:var(--reader-font-size-clamp-1-14rem-4-65vw-1-34rem);line-height:1.72;letter-spacing:.003em;background:#fffdf8;color:#1f1b16} .reader-shell.reader .book-chapter-title{font-size:var(--reader-font-size-clamp-1-35rem-5vw-1-75rem);font-weight:700;letter-spacing:.01em;margin-bottom:1.6em;color:#2a241f} .reader-shell.reader .para{position:relative;margin:1.38em 0;padding:7px 0;border-radius:var(--app-border-radius-12px);cursor:pointer;-webkit-tap-highlight-color:rgba(234,208,119,.18)} .reader-shell.reader .para.selected{background:#fff3c8;outline:0;box-shadow:0 0 0 9999px transparent;padding:10px 10px;margin-left:-10px;margin-right:-10px} .reader-shell.reader .para.selected::after{content:"Selected";display:block;margin-top:var(--app-margin-top-8px);font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:var(--app-font-size-78rem);font-weight:800;color:#8a6a00;text-transform:uppercase;letter-spacing:.06em} .reader-shell.reader .comment-badge{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:28px;margin-left:8px;padding:3px 9px;border-radius:var(--app-border-radius-999px);border:1px solid #eadfce;background:#fffaf3;color:#5f564b;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:var(--app-font-size-8rem);font-weight:800;vertical-align:middle;box-shadow:none} .reader-shell.reader .comment-badge:active{transform:scale(.98)} .reader-shell.reader .mobile-comment-cta{display:inline-flex;align-items:center;gap:var(--app-gap-8px);margin:8px 0 0;padding:var(--app-padding-10px-14px);border-radius:var(--app-border-radius-999px);background:#242018;color:#fff;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:var(--app-font-size-92rem);font-weight:800;box-shadow:0 6px 18px #00000020} .reader-shell.reader .readerbar{grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--app-gap-10px);background:linear-gradient(to top,rgba(255,253,248,.99),rgba(255,253,248,.94));border-top:0;box-shadow:0 -8px 26px #00000014;padding:10px 12px calc(12px + env(safe-area-inset-bottom));transition:transform .22s ease, opacity .22s ease} .reader-shell.reader .readerbar .reader-progress-label{display:block;text-align:center;min-width:82px;max-width:30vw;font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:var(--app-line-height-1-12);color:#242018} .reader-shell.reader .reader-progress-label strong{display:block;font-size:var(--app-font-size-9rem);white-space:nowrap} .reader-shell.reader .reader-progress-label span{display:block;font-size:var(--app-font-size-68rem);color:#82786a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px} .reader-shell.reader .readerbar button{min-height:var(--app-min-height-48px);border-radius:var(--app-border-radius-999px);font-weight:850;font-size:var(--reader-font-size-96rem);padding:var(--app-padding-10px-12px);background:#242018;color:#fff;box-shadow:0 5px 16px #0000001c} .reader-shell.reader .toc-panel{background:#fffdf8;padding:calc(24px + env(safe-area-inset-top)) 18px 24px} .reader-shell.reader .toc-panel h3{font-size:var(--app-font-size-1-2rem);margin-bottom:18px} .reader-shell.reader .toc-item{padding:13px 12px;border-radius:var(--app-border-radius-12px);font-size:1rem} .reader-shell.reader .toc-item.active{background:#efe6d8;font-weight:850} .reader-shell.reader .comment-panel{background:#fffdf8;padding:var(--app-gap-20px) 18px calc(24px + env(safe-area-inset-bottom));border-radius:26px 26px 0 0} .reader-shell.reader .mobile-panel-heading{position:sticky;top:0;background:#fffdf8;padding-bottom:var(--app-padding-bottom-12px);z-index:1;border-bottom:1px solid #f0e8dc;margin-bottom:12px} .reader-shell.reader textarea{min-height:var(--reader-min-height-128px);border-radius:var(--app-border-radius-16px);font-size:var(--app-font-size-1-05rem);line-height:var(--app-line-height-1-45);background:#fff;border-color:#d9cbb9} .reader-shell.reader #saveComment{width:100%;min-height:var(--app-min-height-48px);border-radius:var(--app-border-radius-999px);margin:10px 0 16px;font-weight:850} .reader-shell.reader .comment-card{border-radius:var(--app-border-radius-16px);background:#fff;border-color:#eee1cf} } @media(min-width:901px){ .reader-shell.reader .readerbar{grid-template-columns:1fr 1fr} .reader-shell.reader .reader-progress-label{display:none} } /* Phase 3: mobile/tablet reader invitation welcome. Keep the desktop invitation chrome unchanged, but make first land on phones/tablets feel like the mobile reader: content-first, no header bar. */ @media(max-width:1000px){ body:has(.welcome-shell){background:#fffdf8} body:has(.welcome-shell) .topbar{display:none} body:has(.welcome-shell) main{max-width:none;padding:0} .welcome-shell{min-height:var(--app-min-height-100svh);display:block;background:#fffdf8} .welcome-card{width:auto;min-height:var(--app-min-height-100svh);box-sizing:border-box;border:0;border-radius:0;box-shadow:none;background:#fffdf8;padding:calc(28px + env(safe-area-inset-top)) clamp(22px,7vw,54px) calc(34px + env(safe-area-inset-bottom))} .welcome-card .eyebrow{text-align:left;font-size:var(--app-font-size-78rem);letter-spacing:.11em;margin:var(--app-margin-0-0-12px);color:#82786a} .welcome-card h1{text-align:left;font-size:var(--app-font-size-clamp-2rem-8vw-3rem);line-height:var(--app-line-height-1-08);margin:.1em 0 .1em;color:#1f1b16} .welcome-card .book-byline{text-align:left;font-size:var(--app-font-size-1-1rem);margin:.25em 0 1.4em;color:#5f564b} .welcome-card h2{font-size:var(--app-font-size-1-35rem);line-height:1.22;margin:1.35em 0 .5em;color:#242018} .welcome-card p,.welcome-card li{font-size:var(--app-font-size-1-03rem);line-height:1.65} .welcome-grid{display:grid;grid-template-columns:1fr;gap:var(--app-gap-18px);margin:var(--app-gap-24px) 0} .welcome-grid ul{line-height:var(--app-line-height-1-65);margin-bottom:0} .account-pitch{background:#fffaf3;border-color:#eadfce;border-radius:var(--app-border-radius-20px);padding:18px} .account-pitch h3,.welcome-grid h3{margin-top:0;font-size:1.05rem} .account-pitch .buttonlike.full{min-height:var(--app-min-height-48px);border-radius:var(--app-border-radius-999px);display:grid;place-items:center;font-weight:850;margin-top:14px} .start-reading-form{position:sticky;bottom:0;background:linear-gradient(to top,rgba(255,253,248,1),rgba(255,253,248,.88));padding:16px 0 calc(10px + env(safe-area-inset-bottom));margin:var(--app-gap-20px) calc(-1 * clamp(22px,7vw,54px)) 0} .start-reading{width:calc(100% - (2 * clamp(22px,7vw,54px)));min-height:52px;border-radius:var(--app-border-radius-999px);font-weight:850;font-size:var(--app-font-size-1-05rem);box-shadow:0 8px 22px #00000018} } .reader-account-card{margin-top:var(--app-margin-top-22px);padding:var(--app-padding-16px);border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);background:#fff;box-shadow:0 1px 2px #00000008}.reader-account-card h4{margin:.1em 0 .4em;font-size:1rem}.reader-account-card p{margin:.4em 0 1em;color:#82786a;font-size:var(--app-font-size-92rem);line-height:1.45}.reader-books-page{max-width:var(--app-max-width-1100px);margin:0 auto}.reader-books-hero{margin-bottom:18px}.reader-books-hero h1{font-family:Georgia,"Times New Roman",serif;font-size:var(--reader-font-size-clamp-2rem-5vw-3-4rem);margin:.05em 0}.reader-link-card{display:flex;justify-content:space-between;align-items:center;gap:18px}.reader-link-card h2{margin:.1em 0 .25em}.reader-link-form{display:flex;gap:var(--app-gap-10px);align-items:center;min-width:min(480px,100%)}.reader-link-form input{flex:1;min-width:180px}.reader-book-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.reader-book-card{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-20px);padding:var(--app-padding-20px);box-shadow:0 2px 8px #0000000a;display:flex;flex-direction:column;gap:var(--app-gap-14px)}.reader-book-card h2{margin:var(--app-margin-1em-0);font-family:Georgia,"Times New Roman",serif;font-size:1.55rem}.book-byline-small{margin:var(--app-margin-1em-0);color:#5f564b}.reader-book-progress strong{display:block;margin-top:8px}.reader-progress-track{height:var(--app-height-10px);background:#eee7dc;border-radius:var(--app-border-radius-999px);overflow:hidden} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 689. Overrides earlier properties: background, border-radius, height, overflow Adds new properties: flex */ .reader-progress-track{height:var(--app-height-8px);background:#eee;border-radius:var(--app-border-radius-999px);overflow:hidden;flex:1} .reader-progress-track span{display:block;height:100%;background:#242018;border-radius:999px}@media(max-width:720px){body:has(.reader-books-page) main{padding:22px 16px}.reader-link-card{display:block}.reader-link-form{display:grid;grid-template-columns:1fr;min-width:0}.reader-book-grid{grid-template-columns:1fr}.reader-book-card{border-radius:18px}.reader-account-card{margin:var(--app-gap-20px) 0 4px}} .reader-account-card-top{margin-top:0;margin-bottom:16px} @media(max-width:820px){.reader-account-card-top{margin:0 0 16px}} /* Invite beta readers */ .invite-page-header { align-items: flex-start; } .invite-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--app-gap-18px); align-items: stretch; } .invite-choice-card { display: flex; flex-direction: column; gap: var(--app-gap-8px); margin: 0; } .invite-choice-card h2 { margin: .1em 0 .2em; } .invite-choice-card ul { padding-left: var(--app-padding-left-1-2em); line-height: var(--app-line-height-1-65); margin: 8px 0 18px; } .invite-choice-card .buttonlike, .invite-choice-card button { margin-top: auto; align-self: flex-start; } .invite-choice-eyebrow { text-transform: uppercase; letter-spacing: .08em; color: #82786a; font-weight: 800; font-size: var(--app-font-size-82rem); } .invite-choice-muted { background: #fffaf3; } .invite-specific-panel { margin-top: var(--app-margin-top-22px); } .invite-section-heading { display: flex; justify-content: space-between; gap: var(--app-gap-14px); align-items: flex-start; } .invite-section-heading h2 { margin-top: 0; } .invite-specific-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--app-gap-12px); align-items: end; } .invite-specific-form label { display: grid; gap: var(--app-gap-6px); font-weight: 700; } .invite-specific-form input { margin: 0; width: 100%; box-sizing: border-box; } .invite-entry-card { display: flex; justify-content: space-between; align-items: center; gap: var(--app-gap-18px); } .invite-entry-card h2 { margin-top: 0; } .invite-link-list { display: grid; gap: var(--app-gap-10px); } .invite-link-row { display: flex; justify-content: space-between; gap: var(--app-gap-12px); align-items: center; padding: var(--app-padding-12px); border: 1px solid #eee; border-radius: var(--app-border-radius-12px); background: #fff; } @media (max-width: 800px) { .invite-choice-grid { grid-template-columns: 1fr; } .invite-specific-form { grid-template-columns: 1fr; } .invite-entry-card, .invite-section-heading, .invite-link-row { display: grid; grid-template-columns: 1fr; } } .invite-success-card { border-left: 5px solid #5fbf7a; background: #f6fff8; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 705. Overrides earlier properties: background Adds new properties: border-color */ .invite-success-card{border-color:#b9e6c3;background:#f2fbf4} .invite-success-card h2 { margin-top: 0; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 705. Overrides earlier properties: margin-top Adds new properties: color */ .invite-success-card h2{margin-top:0;color:#16743a} .invite-specific-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: var(--app-gap-18px); align-items: start; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 705. Overrides earlier properties: align-items, display, gap, grid-template-columns Adds new properties: None */ .invite-specific-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--app-gap-22px);align-items:start} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 741. Overrides earlier properties: align-items, display, gap, grid-template-columns Adds new properties: None */ .invite-specific-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--app-gap-22px);align-items:start} .invite-form-block { border: 1px solid #eee; border-radius: var(--app-border-radius-16px); padding: var(--app-padding-16px); background: #fff; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 705. Overrides earlier properties: background, border, border-radius, padding Adds new properties: None */ .invite-form-block{border:1px solid #eee7dd;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-18px);background:#fff} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 742. Overrides earlier properties: background, border, border-radius, padding Adds new properties: None */ .invite-form-block{border:1px solid #eee7dd;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-18px);background:#fff} .invite-form-block h3 { margin-top: 0; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 705. Overrides earlier properties: margin-top Adds new properties: None */ .invite-form-block h3{margin-top:0} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 743. Overrides earlier properties: margin-top Adds new properties: None */ .invite-form-block h3{margin-top:0} .invite-one-form { grid-template-columns: 1fr; } .invite-bulk-form { display: grid; gap: var(--app-gap-12px); } .invite-bulk-form label { display: grid; gap: var(--app-gap-6px); font-weight: 700; } .invite-bulk-form textarea { width: 100%; box-sizing: border-box; border: 1px solid #ddd; border-radius: var(--app-border-radius-12px); padding: 11px; font: inherit; background: #fff; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 705. Overrides earlier properties: None Adds new properties: min-height */ .invite-bulk-form textarea{min-height:156px} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 747. Overrides earlier properties: min-height Adds new properties: None */ .invite-bulk-form textarea{min-height:156px} .invite-link-main { display: grid; gap: var(--app-gap-6px); min-width: 0; } .invite-url-input { width: min(560px, 100%); box-sizing: border-box; font-size: var(--app-font-size-85rem); padding: var(--app-padding-8px-10px); border-radius: var(--app-border-radius-10px); background: #fffaf3; color: #5f564b; } .invite-link-actions { display: flex; flex-wrap: wrap; gap: var(--app-gap-8px); justify-content: flex-end; align-items: center; } .invite-link-actions button, .invite-link-actions .buttonlike { padding: 9px 11px; font-size: var(--app-font-size-9rem); } @media (max-width: 900px) { .invite-specific-grid { grid-template-columns: 1fr; } .invite-link-actions { justify-content: flex-start; } } @media (max-width: 640px) { .invite-link-actions { display: grid; grid-template-columns: 1fr 1fr; } .invite-link-actions button, .invite-link-actions .buttonlike { width: 100%; text-align: center; box-sizing: border-box; } } .compact-grid { gap: var(--app-gap-12px); } .join-link-shell { max-width: var(--app-max-width-720px); margin: var(--app-margin-0-auto); padding: 24px 16px; } .join-link-card .lead { font-size: var(--app-font-size-1-15rem); margin-top: -4px; } .join-link-form input[readonly] { background: #f6f4ef; color: #5f584c; } .success-notice { border-left: 4px solid #6a8f58; } .warning-notice { border-left: 4px solid #b7743d; } @media (max-width: 760px) { .join-link-shell { padding: 16px 10px; } .join-link-card { box-shadow: none; border-radius: var(--app-border-radius-18px); } } .join-link-management { margin-top: var(--app-margin-top-0-75rem); padding-top: 0.75rem; border-top: 1px solid rgba(0,0,0,0.08); } .join-link-management summary { cursor: pointer; font-weight: 700; color: #5f4b32; } .join-link-settings-form { margin-top: var(--app-margin-top-0-75rem); } .join-link-status-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: var(--app-margin-top-0-75rem); } .join-link-status-actions form { margin: 0; } button.danger-button, .danger-button { border-color: rgba(160, 32, 32, 0.35); color: #8f2424; } .join-request-list { margin-top: var(--app-margin-top-1rem); } .join-request-row { display: flex; justify-content: space-between; gap: 0.75rem; align-items: center; padding: 0.65rem 0; border-top: 1px solid rgba(0,0,0,0.08); } @media (max-width: 720px) { .join-request-row { display: block; } } /* Readers management / invite flow polish */ .readers-shell{max-width:var(--app-max-width-1120px);margin:var(--app-margin-0-auto);padding-bottom:var(--app-width-34px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 705. Overrides earlier properties: max-width Adds new properties: None */ .readers-shell{max-width:var(--app-max-width-1120px)} .readers-header{display:flex;justify-content:space-between;gap:var(--app-gap-22px);align-items:flex-start;margin:var(--app-margin-22px-0-18)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1300. Overrides earlier properties: None Adds new properties: margin-bottom */ .readers-header { margin-bottom: var(--app-height-24px); } .readers-header h1{font-size:var(--app-font-size-2rem);line-height:1.1;margin:.15rem 0 .35rem}.readers-header-actions{display:flex;gap:var(--app-gap-12px);align-items:center} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1498. Overrides earlier properties: None Adds new properties: flex-wrap, justify-content */ .readers-header-actions { flex-wrap: wrap; justify-content: flex-end; } .primary-purple{background:#5b2eea;color:#fff;box-shadow:0 var(--app-gap-8px) var(--app-gap-18px) #5b2eea24} .add-readers-menu{position:relative} .add-readers-menu summary{list-style:none} .add-readers-menu summary::-webkit-details-marker{display:none} .add-readers-popover{position:absolute;right:0;top:calc(100% + var(--app-gap-8px));width:var(--app-width-220px);background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);box-shadow:0 var(--app-gap-18px) var(--app-width-50px) #0002;padding:var(--app-padding-8px);z-index:20} .add-readers-popover a{display:block;padding:var(--app-padding-11px-12px);border-radius:var(--app-border-radius-10px);text-decoration:none;color:#242018;font-weight:750}.add-readers-popover a:hover{background:#f4ecff;color:#5b2eea} .readers-empty-state{text-align:center;padding:var(--app-width-58px) var(--app-width-44px);background:linear-gradient(180deg,#ffffff,#fbf8ff)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 3017. Overrides earlier properties: padding Adds new properties: None */ .readers-empty-state { padding: var(--app-empty-state-padding-y) var(--app-empty-state-padding-x); } .readers-empty-illustration{width:var(--app-width-110px);height:86px;margin:0 auto var(--app-gap-16px);border-radius:var(--app-width-48px);background:linear-gradient(135deg,#efe6ff,#fff5fb);display:grid;place-items:center;font-size:44px}.readers-empty-state h2{font-size:var(--app-font-size-1-75rem);margin:0 0 var(--app-gap-10px)}.readers-empty-state>p{max-width:var(--app-max-width-520px);margin:0 auto var(--app-gap-22px);font-size:var(--app-font-size-1-08rem);color:#5f564b}.empty-question{font-weight:750;color:#242018!important}.empty-invite-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;max-width:760px;margin:0 auto}.empty-invite-card{display:grid;grid-template-columns:62px 1fr;gap:var(--app-gap-18px);text-align:left;background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-26px);box-shadow:0 4px 16px #00000008}.empty-invite-icon{width:52px;height:52px;border-radius:var(--app-border-radius-50pct);display:grid;place-items:center;background:#f4ecff;color:#5b2eea;font-size:var(--app-gap-24px)}.empty-invite-card h3{margin:2px 0 8px}.empty-invite-card p{min-height:64px;color:#5f564b;line-height:1.45}.reader-metrics-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--app-gap-16px);margin:16px 0}.metric-card{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-20px-22px);box-shadow:0 1px 2px #0001}.metric-card strong{display:block;font-size:var(--app-font-size-2rem);line-height:var(--app-line-height-1);margin-bottom:10px}.metric-card span{color:#4e463e;font-weight:650}.readers-tabs-row{display:flex;justify-content:space-between;gap:var(--app-gap-16px);align-items:center;margin:18px 0 10px}.readers-tabs{display:flex;gap:var(--app-gap-22px);align-items:center;flex-wrap:wrap}.readers-tabs a{text-decoration:none;color:#5f564b;font-weight:800;padding:var(--app-padding-8px-0);border-bottom:3px solid transparent}.readers-tabs a.active{color:#6f3ff0;border-color:#6f3ff0}.reader-search{min-width:var(--reader-min-width-260px);background:#fff}.reader-table-card,.join-links-summary{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-16px);padding:0;margin:var(--app-margin-0-0-22px);overflow:hidden;box-shadow:0 1px 2px #0001}.reader-management-table{margin:0;border-radius:0}.reader-management-table th{font-size:var(--app-font-size-88rem);color:#4e463e}.reader-management-table td{vertical-align:middle}.reader-management-table td span{color:#82786a}.reader-status{display:inline-block;padding:var(--app-5px) var(--app-gap-10px);border-radius:var(--app-border-radius-999px);font-size:var(--app-font-size-8rem);font-weight:800}.status-reading{background:#efe5ff;color:#6f3ff0}.status-finished{background:#dcf7df;color:#207a31}.status-not-started{background:#efefef;color:#4e463e}.status-reminder{background:#fff0bf;color:#875d00}.reader-progress-cell{display:flex;align-items:center;gap:var(--app-gap-12px);min-width:150px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1519. Overrides earlier properties: min-width Adds new properties: None */ .reader-progress-cell { min-width: var(--reader-min-width-260px); } .reader-progress-cell span{width:38px;color:#242018!important;font-weight:700}.reader-progress-track i{display:block;height:100%;background:#6f3ff0;border-radius:999px}.link-button{background:transparent;color:#6941c6;border:0;padding:0;font-weight:800;text-decoration:underline;cursor:pointer}.reader-action-icons{display:flex;gap:var(--app-gap-14px);align-items:center} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1522. Overrides earlier properties: None Adds new properties: justify-content, min-width */ .reader-action-icons { min-width: 86px; justify-content: flex-start; } .reader-action-icons a,.icon-button{background:transparent;border:0;color:#4e463e;text-decoration:none;padding:0;font:inherit;cursor:pointer}.section-title-row{display:flex;justify-content:space-between;align-items:center;padding:18px 20px 4px} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 774. Overrides earlier properties: align-items, display, justify-content Adds new properties: gap */ .section-title-row{display:flex;justify-content:space-between;gap:var(--app-gap-16px);align-items:flex-start} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 3026. Overrides earlier properties: padding Adds new properties: None */ .section-title-row { padding: 18px 20px 4px; } .section-title-row h2{margin:0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 774. Overrides earlier properties: margin Adds new properties: None */ .section-title-row h2{margin:.1em 0} .section-title-row a{font-weight:800;text-decoration:none}.join-links-summary .reader-management-table{border-top:1px solid #eee}.invite-workflows-grid{display:grid;grid-template-columns:1fr;gap:var(--app-gap-18px);margin-top:26px} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 705. Overrides earlier properties: display, margin-top Adds new properties: None */ .invite-workflows-grid{display:block;margin-top:26px} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 736. Overrides earlier properties: display, margin-top Adds new properties: None */ .invite-workflows-grid{display:block;margin-top:26px} .invite-workflow-card{scroll-margin-top:var(--app-gap-20px)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 705. Overrides earlier properties: scroll-margin-top Adds new properties: display */ .invite-workflow-card{display:none;scroll-margin-top:22px} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 737. Overrides earlier properties: display, scroll-margin-top Adds new properties: None */ .invite-workflow-card{display:none;scroll-margin-top:var(--app-gap-24px)} .workflow-kicker{text-transform:uppercase;letter-spacing:.12em;color:#6f3ff0;font-weight:900;font-size:.8rem}.privacy-footer{text-align:center;color:#82786a;border-top:1px solid #eadfce;margin-top:var(--app-margin-top-22px);padding-top:var(--app-padding-top-18px);font-weight:650}@media(max-width:900px){.readers-header{flex-direction:column}.reader-metrics-grid,.empty-invite-grid{grid-template-columns:1fr}.readers-tabs-row{align-items:stretch;flex-direction:column}.reader-search{min-width:0}.reader-table-card,.join-links-summary{overflow-x:auto}.reader-metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.empty-invite-card{grid-template-columns:1fr}.readers-empty-state{padding:34px 20px}} /* Polished public login page */ body:has(.login-polish-shell) main{max-width:none;padding:0} .login-polish-shell{min-height:var(--app-min-height-100vh);box-sizing:border-box;display:grid;grid-template-columns:minmax(360px,1fr) minmax(410px,500px);gap:60px;align-items:center;padding:var(--app-width-48px) clamp(28px,8vw,140px);background:radial-gradient(circle at 18% 18%,#fae7eb 0,#faf7f1 32%,#f8f3ea 100%)} .login-hero-panel{max-width:620px}.login-brand{display:inline-flex;align-items:center;gap:var(--app-gap-12px);color:#242018;text-decoration:none;font-size:var(--app-font-size-1-45rem);font-weight:900;margin-bottom:58px}.login-brand-mark{width:var(--app-width-30px);height:var(--app-height-30px);border-radius:9px;background:#b2559e;color:#fff;display:grid;place-items:center;font-weight:900;line-height:1}.login-eyebrow{text-transform:uppercase;letter-spacing:.12em;color:#8b4ca4;font-weight:900;font-size:var(--app-font-size-86rem);margin:0 0 var(--app-gap-18px)}.login-hero-copy h1{font-size:var(--app-font-size-clamp-2-3rem-4-55vw-3-68rem);line-height:.98;letter-spacing:-.075em;margin:0 0 var(--app-gap-24px);max-width:600px}.login-lede{font-size:var(--app-font-size-1-22rem);line-height:1.48;color:#6b6257;margin:0 0 var(--app-gap-32px);max-width:610px}.trust-group{margin-top:var(--app-padding-26px)}.trust-group h2{font-size:var(--app-font-size-92rem);font-weight:900;margin:var(--app-margin-0-0-12px);color:#3a332b}.trust-group.compact{margin-top:var(--app-gap-20px)}.trust-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--app-gap-14px);color:#3f382f}.trust-list li{position:relative;padding-left:var(--app-padding-left-34px);line-height:1.42}.trust-list li:before{content:"✓";position:absolute;left:0;top:-1px;width:var(--app-gap-20px);height:var(--app-gap-20px);border-radius:var(--app-border-radius-999px);background:#e5f5e9;color:#1f9d59;display:grid;place-items:center;font-weight:900;font-size:.9rem}.login-trust-note{margin:38px 0 0;padding-left:var(--app-gap-20px);border-left:var(--app-border-radius-4px) solid #e4cfb4;color:#6b6257;max-width:var(--app-max-width-520px);line-height:1.45}.login-card-polished{width:auto;margin:0;padding:34px;border-radius:22px;box-shadow:0 var(--app-gap-16px) var(--app-gap-42px) #2a16080c}.login-card-polished h1{margin:var(--app-margin-0-0-8px);font-size:var(--app-font-size-1-9rem);letter-spacing:-.04em}.login-card-subtitle{line-height:1.42;color:#5f574d;margin:0 0 var(--app-gap-22px)}.login-card-polished .oauth-grid{gap:var(--app-gap-12px);margin:22px 0}.login-card-polished .oauth{padding:var(--app-padding-12px-14px);border-radius:11px}.login-card-polished .oauth span{display:inline-block;margin-right:8px}.login-card-polished .oauth.google span{font-weight:900;font-size:1.08em}.login-card-polished .oauth.apple{background:#000;color:#fff}.login-card-polished .divider{margin:var(--app-margin-24px-0);color:#8b8175;font-size:.9rem}.login-form-stack{gap:18px}.login-card-polished .stack label{gap:7px}.login-card-polished .stack input{box-sizing:border-box;width:100%;margin:0;border-color:#e2d5c4;border-radius:var(--app-border-radius-11px);background:#fffdf9}.login-card-polished .stack input:focus{outline:3px solid #eadcf3;border-color:#b2559e}.password-field{position:relative;display:block}.password-field input{padding-right:64px}.show-password{position:absolute;right:7px;top:50%;transform:translateY(-50%);padding:7px 9px;border-radius:var(--app-border-radius-8px);background:transparent;color:#5f2f86;font-size:var(--app-font-size-8rem);font-weight:800}.show-password:hover{background:#f4edf8}.login-card-polished form button:not(.show-password){width:100%;padding:13px 16px;border-radius:var(--app-border-radius-11px);font-weight:900}.login-links{margin-top:var(--app-gap-20px)}.login-links p{margin:10px 0}.login-links a{font-weight:800;color:#73378a}.login-security-callout{margin:var(--app-margin-22px-0-0);padding:var(--app-padding-14px-16px);border-radius:13px;background:#f5e8d9;color:#6b5545;line-height:var(--app-line-height-1-35);font-size:var(--app-font-size-92rem);display:grid;gap:var(--app-border-radius-4px)}.login-security-callout strong{color:#4b3a2e}.success{background:#e3f7e9;border:1px solid #a9e2ba;color:#1d6f3a;padding:var(--app-padding-10px-12px);border-radius:10px} @media(max-width:900px){.login-polish-shell{grid-template-columns:1fr;gap:var(--app-gap-28px);padding:32px 20px}.login-brand{margin-bottom:36px}.login-hero-copy h1{font-size:2.35rem}.login-card-polished{width:auto}.login-trust-note{margin-top:28px}} /* UX polish repair: scoped onboarding/review + readers flow overrides. Keep these selectors scoped so login/profile/home styles are not touched. */ body:has(.onboarding-flow) main{max-width:1280px;padding:36px 28px 42px}.onboarding-flow{max-width:var(--app-max-width-1120px);margin:0 auto}.flow-progress{display:flex;align-items:center;gap:var(--app-gap-14px);flex-wrap:wrap;margin:0 0 28px;color:#6f655a;font-weight:700}.flow-progress a{font-weight:800}.flow-progress span{display:inline-flex;align-items:center;gap:8px}.flow-progress span b{width:var(--app-width-28px);height:var(--app-height-28px);border-radius:var(--app-border-radius-999px);display:grid;place-items:center;background:#e8e3dd;color:#5f574d;font-size:.9rem}.flow-progress span.active{color:var(--ink)}.flow-progress span.active b{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(91,46,234,.18)}.review-header{margin-bottom:26px}.review-header h1{font-size:var(--app-font-size-2-2rem);line-height:var(--app-line-height-1-08);margin:var(--app-margin-0-0-10px);letter-spacing:-.04em}.review-header .subtle{font-size:1.05rem}.review-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--app-gap-24px);align-items:start}.review-grid>.card,.review-grid .detected-card,.chapter-help-card{margin:0}.upload-complete-card{max-width:none;margin:var(--app-margin-0-0-20px);display:flex;justify-content:space-between;align-items:center;gap:var(--app-gap-18px);padding:var(--app-padding-18px-20px);border-radius:var(--app-border-radius-14px);background:#e7f8eb;border:1px solid #b9e6c3;color:#16743a}.upload-complete-card strong{display:inline-flex;align-items:center;gap:var(--app-gap-10px);font-size:1.05rem}.upload-complete-card strong:before{content:"✓";width:var(--app-gap-24px);height:var(--app-height-24px);border-radius:var(--app-border-radius-999px);background:#20a05a;color:#fff;display:grid;place-items:center;font-weight:900}.upload-complete-card span{color:#16743a}.detected-card{padding:var(--app-gap-24px) var(--app-gap-24px) var(--app-gap-18px);border-radius:18px}.detected-card h2{margin:var(--app-margin-0-0-22px);font-size:1.45rem}.detected-card h2 .subtle{font-weight:800;color:#82786a}.clean-table th{font-size:var(--app-font-size-9rem);color:#2e2923}.clean-table td,.clean-table th{padding:12px 10px}.clean-table .table-total td{font-weight:800;border-top:1px solid #eadfce}.chapter-help-card{padding:var(--app-padding-24px);border-radius:18px}.chapter-help-card h3{font-size:var(--app-font-size-1-2rem);margin:0 0 18px}.chapter-help-card h4{margin:30px 0 8px}.chapter-help-card .check-list{list-style:none;margin:16px 0 26px;padding:0;display:grid;gap:13px}.chapter-help-card .check-list li{position:relative;padding-left:30px}.chapter-help-card .check-list li:before{content:"✓";position:absolute;left:0;top:0;color:#289653;font-weight:900}.review-cover img{width:100%;border-radius:var(--app-border-radius-12px);border:1px solid var(--line);margin-top:var(--app-gap-20px)}.flow-actions{display:flex;justify-content:space-between;gap:var(--app-gap-16px);align-items:center;margin:28px 0 0}.flow-actions .buttonlike:last-child{min-width:230px;text-align:center;font-weight:900}.onboarding-flow .privacy-footer{margin-top:30px} @media(max-width:900px){body:has(.onboarding-flow) main{padding:var(--app-gap-24px) var(--app-gap-18px) var(--app-width-34px)}.review-grid{grid-template-columns:1fr}.upload-complete-card{align-items:flex-start;flex-direction:column}.flow-actions{align-items:stretch;flex-direction:column}.flow-actions .buttonlike{text-align:center}} /* Readers add-flow behavior: forms open only after selected. */ .invite-workflow-card.is-open,.invite-workflow-card:target{display:block}.invite-workflow-card h2{margin:.35rem 0 .6rem} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 740. Overrides earlier properties: margin Adds new properties: None */ .invite-workflow-card h2{margin:.35rem 0 .6rem} .invite-specific-form,.invite-bulk-form{display:grid;gap:12px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 744. Overrides earlier properties: display, gap Adds new properties: None */ .invite-specific-form,.invite-bulk-form{display:grid;gap:12px} .invite-specific-form label,.invite-bulk-form label{display:grid;gap:var(--app-gap-7px);font-weight:800} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 745. Overrides earlier properties: display, font-weight, gap Adds new properties: None */ .invite-specific-form label,.invite-bulk-form label{display:grid;gap:var(--app-gap-7px);font-weight:800} .invite-specific-form input,.invite-bulk-form textarea{margin:0;width:100%;box-sizing:border-box} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 746. Overrides earlier properties: box-sizing, margin, width Adds new properties: None */ .invite-specific-form input,.invite-bulk-form textarea{margin:0;width:100%;box-sizing:border-box} .invite-join-form{grid-template-columns:minmax(240px,1fr) auto auto minmax(260px,1.2fr);align-items:end} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 748. Overrides earlier properties: align-items, grid-template-columns Adds new properties: None */ .invite-join-form{grid-template-columns:minmax(240px,1fr) auto auto minmax(260px,1.2fr);align-items:end} .invite-join-form>button{grid-column:1 / 2} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 749. Overrides earlier properties: grid-column Adds new properties: None */ .invite-join-form>button{grid-column:1 / 2} .invite-join-form .compact-grid{display:contents} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 750. Overrides earlier properties: display Adds new properties: None */ .invite-join-form .compact-grid{display:contents} .invite-join-form .checkbox-row{align-self:center;margin-bottom:10px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 751. Overrides earlier properties: align-self, margin-bottom Adds new properties: None */ .invite-join-form .checkbox-row{align-self:center;margin-bottom:10px} .join-links-empty{padding:0 20px 18px}.readers-empty-state .buttonlike,.section-title-row a,.add-readers-popover a{cursor:pointer} @media(max-width:900px){.invite-specific-grid{grid-template-columns:1fr}.invite-join-form{grid-template-columns:1fr}.invite-join-form .compact-grid{display:grid}.invite-join-form>button{grid-column:auto}.invite-join-form .checkbox-row{margin-bottom:0}} /* Author home shell repair: keep scoped so login/profile/review/readers styles are not touched. */ body:has(.author-shell) main{max-width:none;padding:0} .author-shell{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:calc(100vh - 56px);background:linear-gradient(115deg,#fffdf9 0%,#faf7f1 55%,#f7efe6 100%)} .author-sidebar{background:#fff;border-right:1px solid #eadfce;padding:26px 26px 24px;display:flex;flex-direction:column;gap:var(--app-gap-24px);position:sticky;top:56px;height:calc(100vh - 56px);box-sizing:border-box} .sidebar-brand{font-size:var(--app-font-size-1-25rem);font-weight:900;color:#242018;margin-bottom:12px}.sidebar-nav{display:grid;gap:8px}.sidebar-nav a{color:#4f463c;text-decoration:none;font-weight:750;padding:var(--app-padding-12px-14px);border-radius:var(--app-border-radius-12px);display:block}.sidebar-nav a.active,.sidebar-nav a:hover{background:#f0e6ff;color:#6f3ff0}.sidebar-help{margin-top:auto;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-16px);background:#fffdf9;color:#4f463c;font-weight:750}.sidebar-help span{font-weight:500;color:#82786a} .author-main{padding:44px clamp(28px,5vw,72px) 42px;max-width:1060px;width:100%;box-sizing:border-box}.home-hero-header{margin:0 0 24px}.home-hero-header h1{font-size:var(--app-font-size-2rem);letter-spacing:-.04em;margin:.1em 0 .35em}.home-hero-header p{font-size:var(--app-font-size-1-05rem);margin:0} .setup-card{padding:var(--app-padding-28px-30px);margin-bottom:22px}.setup-card h2{margin:0 0 8px}.setup-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:26px;align-items:start}.setup-step{position:relative;text-align:center;color:#5f564b;padding:0 14px}.setup-step:not(:last-child):after{content:"";position:absolute;left:calc(50% + 38px);right:calc(-50% + 38px);top:22px;height:2px;background:#e8dfd2}.setup-step span{position:relative;z-index:1;width:var(--app-width-46px);height:var(--app-height-46px);border-radius:var(--app-border-radius-999px);background:#e9e4dc;color:#242018;display:grid;place-items:center;font-weight:900;font-size:var(--app-font-size-1-2rem);margin:0 auto 12px}.setup-step.active span{background:#6f3ff0;color:#fff;box-shadow:0 8px 20px #6f3ff030}.setup-step strong{display:block;font-weight:900;color:#242018;margin-bottom:var(--app-border-radius-4px)}.setup-step em{display:block;font-style:normal;font-size:var(--app-font-size-92rem);color:#6f675d} .create-beta-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:var(--app-gap-18px);margin:22px 0 30px}.trust-card,.create-beta-card{margin:0}.trust-card{padding:var(--app-gap-24px)}.trust-card h3{margin:0 0 22px}.trust-item{display:grid;gap:var(--app-gap-4px);margin:0 0 18px;padding-left:var(--app-padding-left-34px);position:relative}.trust-item:before{content:"🔒";position:absolute;left:0;top:1px}.trust-item strong{font-weight:900}.trust-item span{color:#5f564b;line-height:1.45}.trust-card a{display:inline-block;margin-top:var(--app-margin-top-8px);font-weight:800;text-decoration:none}.create-beta-card{padding:var(--app-gap-24px) var(--app-gap-28px)}.section-heading-row{display:flex;justify-content:space-between;align-items:center;gap:16px}.section-heading-row h2{margin:.1em 0} .upload-form.create-upload-form{display:grid;gap:16px}.upload-form.create-upload-form label{font-weight:800}.upload-form.create-upload-form input{box-sizing:border-box;width:100%;margin:8px 0 0}.label-note{font-weight:500;color:#82786a}.dropzone{display:block;border:1.5px dashed #d7c6f8;border-radius:var(--app-border-radius-18px);background:linear-gradient(135deg,#fff,#fbf7ff);padding:var(--app-padding-28px);text-align:center;color:#242018;cursor:pointer}.dropzone input{position:absolute;opacity:0;pointer-events:none;width:var(--app-width-1px);height:1px}.dropzone-inner{display:grid;place-items:center;gap:8px}.dropzone-inner:before{content:"☁";font-size:var(--app-font-size-2rem);color:#6f3ff0}.dropzone-inner strong{font-weight:900}.dropzone-inner em{font-style:normal;background:#242018;color:white;border-radius:var(--app-border-radius-10px);padding:10px 18px;font-weight:900}.dropzone-inner small{color:#82786a}.cover-dropzone{padding:var(--app-padding-20px);background:#fffdf9}.cover-dropzone .dropzone-inner:before{content:"▧"}.cover-dropzone .dropzone-inner em{background:#fff;color:#242018;border:1px solid #eadfce} .author-main .home-section{margin-top:28px}.beta-list{display:grid;gap:var(--app-gap-14px)}.beta-list-row{display:grid;grid-template-columns:82px minmax(0,1fr) 32px;align-items:center;gap:var(--app-gap-20px);text-decoration:none;color:#242018;margin:0;padding:16px}.book-cover-thumb{width:var(--app-width-72px);height:92px;border-radius:var(--app-border-radius-8px);background:#efe8dc;overflow:hidden;display:grid;place-items:center;font-size:var(--app-font-size-2rem);font-weight:900;color:#6f3ff0}.book-cover-thumb img{width:100%;height:100%;object-fit:cover;display:block}.beta-list-main h3{margin:0 0 6px}.beta-list-main p{margin:var(--app-margin-0-0-10px);color:#5f564b}.status-active{background:#dcf7df;color:#207a31}.row-arrow{font-size:var(--app-font-size-2-2rem);color:#82786a}.author-main .privacy-footer{text-align:center;color:#82786a;border-top:1px solid #eadfce;margin-top:var(--app-margin-top-22px);padding-top:var(--app-padding-top-18px);font-weight:650} @media(max-width:980px){.author-shell{grid-template-columns:1fr}.author-sidebar{position:static;height:auto}.create-beta-layout{grid-template-columns:1fr}.setup-steps{grid-template-columns:1fr;gap:18px}.setup-step:not(:last-child):after{display:none}.beta-list-row{grid-template-columns:64px minmax(0,1fr) 24px}.book-cover-thumb{width:var(--app-width-58px);height:74px}.author-main{padding: var(--app-padding-28px-18px)}} /* Separate dashboard from step 1 of create beta flow */ .create-beta-shell .create-beta-header{align-items:flex-start;margin-bottom:var(--app-gap-24px)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 728. Overrides earlier properties: margin-bottom Adds new properties: None */ .create-beta-shell .create-beta-header{margin-bottom:var(--app-gap-22px)} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 2580. Overrides earlier properties: margin-bottom Adds new properties: None */ .create-beta-shell .create-beta-header{margin-bottom:var(--app-gap-14px)} .create-beta-step-layout{margin-top:0}.create-beta-step-layout .create-beta-card{min-height:0}.home-section .section-heading-row{margin-bottom:var(--app-gap-12px)}.home-section .buttonlike{white-space:nowrap}.author-main>.privacy-footer{border-top:1px solid #eadfce;margin-top:var(--app-margin-top-28px);padding-top:var(--app-gap-24px)} /* Setup wizard consistency pass: scoped to author onboarding/readers shells only. */ .setup-card-compact{padding:var(--app-gap-22px) var(--app-padding-26px);margin:0 0 var(--app-width-22px)} .setup-card-compact .setup-steps{margin-top:0} .setup-step.done span{background:#22a35a;color:#fff;box-shadow:none} .setup-step.done:not(:last-child):after{background:#cfe8d7} .create-beta-shell .setup-card-compact{margin-bottom:var(--app-width-22px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2582. Overrides earlier properties: margin-bottom Adds new properties: padding */ .create-beta-shell .setup-card-compact{padding:var(--app-gap-16px) var(--app-gap-24px);margin-bottom:var(--app-gap-14px)} .review-author-shell .review-header{margin-bottom:var(--app-gap-18px)} .review-author-shell .review-grid{margin-top:var(--app-gap-22px)} .onboarding-author-main{max-width:var(--app-max-width-1120px);margin:var(--app-margin-0-auto);width:100%} .readers-author-shell .readers-shell{max-width:var(--app-max-width-1120px);width:100%;margin:var(--app-margin-0-auto);padding-bottom:var(--app-width-34px)} .readers-author-shell .readers-header{margin-top:0} .readers-author-shell .setup-card-compact{margin-bottom:var(--app-gap-22px)} .invite-workflow-card:target{display:block} .invite-workflow-card.is-open{display:block} .setup-complete-card{text-align:center;padding:var(--app-width-46px) var(--app-52px);max-width:900px;margin:var(--app-gap-22px) auto 0;background:linear-gradient(180deg,#fff,#fbfff9)} .completion-icon{width:var(--app-width-72px);height:var(--app-height-72px);border-radius:var(--app-border-radius-999px);background:#22a35a;color:#fff;display:grid;place-items:center;font-size:var(--app-font-size-36px);font-weight:900;margin:var(--app-margin-0-auto-18px);box-shadow:0 var(--app-gap-14px) var(--app-width-30px) rgba(34,163,90,.22)} .setup-complete-card h1{font-size:var(--app-font-size-2-35rem);letter-spacing:-.04em;margin:.35rem 0 .7rem} .setup-complete-card>.subtle{max-width:var(--app-680px);margin:0 auto var(--app-padding-26px);font-size:1.05rem} .complete-next-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--app-gap-18px);text-align:left;margin:var(--app-gap-28px) 0} .complete-next-grid article{border:1px solid #eadfce;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-20px);background:#fff} .complete-next-grid h3{margin:0 0 var(--app-padding-8px)} .complete-next-grid p{margin:0;color:#5f564b;line-height:1.45} .complete-actions{display:flex;justify-content:center;gap:var(--app-gap-14px);flex-wrap:wrap;margin-top:var(--app-padding-26px)} @media(max-width:980px){.setup-card-compact .setup-steps{grid-template-columns:1fr}.invite-specific-grid,.complete-next-grid{grid-template-columns:1fr}.invite-join-form{display:grid;grid-template-columns:1fr}.invite-join-form .compact-grid{display:grid;grid-template-columns:1fr}.onboarding-author-main{max-width:none}} /* Setup completion page: completion banner + reader tracking snapshot */ .setup-complete-card-inline{max-width:none;margin:var(--app-margin-22px-0-0);padding:var(--app-38px) var(--app-52px);background:linear-gradient(180deg,#fff,#fbfff9)} .setup-complete-card-inline .complete-next-grid{max-width:var(--app-860);margin:var(--app-gap-28px) auto 0} .complete-next-link{display:block;border:1px solid #eadfce;border-radius:var(--app-border-radius-16px);padding:var(--app-padding-20px);background:#fff;text-decoration:none;color:inherit} .complete-next-link:hover{border-color:#d6c3ff;box-shadow:0 var(--app-gap-8px) var(--app-gap-24px) rgba(91,46,234,.10)} .setup-reader-management{margin-top:var(--app-width-30px)} .setup-reader-header{margin-top:0} .setup-reader-management .reader-table-card,.setup-reader-management .join-links-summary{margin-bottom:var(--app-padding-26px)} @media(max-width:980px){.setup-complete-card-inline{padding: 24px}.setup-reader-header{flex-direction:column}.setup-reader-header .readers-header-actions{width:100%;justify-content:flex-start}} /* Story Flow analytics redesign */ .analytics-shell{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:calc(100vh - var(--app-height-56px));margin:var(--app-minus28px);background:#fffdf9} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 851. Overrides earlier properties: background, display, grid-template-columns, margin, min-height Adds new properties: align-items, width */ .analytics-shell { display: grid; grid-template-columns: var(--app-width-280px) minmax(0, 1fr); align-items: start; width: 100%; min-height: calc(100vh - var(--app-height-56px)); margin: 0; background: #fffdf9; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1190. Overrides earlier properties: background, grid-template-columns Adds new properties: None */ .analytics-shell { grid-template-columns: var(--app-width-280px) minmax(0, 1fr); background: #fffdf9; } .analytics-sidebar{background:#fff;border-right:1px solid #eadfce;padding:var(--app-padding-26px) var(--app-gap-18px);display:flex;flex-direction:column;gap:var(--app-gap-22px);position:sticky;top:var(--app-height-56px);height:calc(100vh - var(--app-height-56px));box-sizing:border-box} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 861. Overrides earlier properties: box-sizing, height, position, top Adds new properties: left, max-width, width, z-index */ .analytics-sidebar { position: sticky; top: var(--app-height-56px); left: 0; width: var(--app-width-280px); max-width: var(--app-width-280px); height: calc(100vh - var(--app-height-56px)); box-sizing: border-box; z-index: 2; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1194. Overrides earlier properties: padding Adds new properties: None */ .analytics-sidebar { padding: var(--app-padding-28px) var(--app-padding-20px); } .analytics-brand{font-size:var(--app-font-size-1-25rem);font-weight:900;color:#242018} .analytics-book-card{display:grid;grid-template-columns:var(--app-width-44px) minmax(0,1fr);gap:var(--app-gap-12px);align-items:center;padding:var(--app-padding-10px);border-radius:var(--app-border-radius-14px);background:#fffaf3;border:1px solid #eadfce} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 780. Overrides earlier properties: None Adds new properties: font-size */ .analytics-book-card{ font-size: var(--app-font-size-1rem); } .analytics-book-cover{width:var(--app-width-42px);height:var(--app-height-58px);border-radius:var(--app-gap-7px);background:linear-gradient(160deg,#6f3ff0,#242018);color:#fff;display:grid;place-items:center;font-weight:900} .analytics-book-card strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .analytics-book-card span{font-size:var(--app-font-size-85rem);color:#82786a} .analytics-nav{display:grid;gap:8px}.analytics-nav a{color:#4f463c;text-decoration:none;font-weight:750;padding:var(--app-padding-12px-14px);border-radius:var(--app-border-radius-12px);display:block} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 777. Overrides earlier properties: None Adds new properties: font-size */ .analytics-nav a { font-size: var(--app-font-size-1rem); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1195. Overrides earlier properties: font-weight, padding Adds new properties: None */ .analytics-nav a { padding: var(--app-padding-14px-16px); font-weight: 850; } .analytics-nav a.active,.analytics-nav a:hover{background:#f0e6ff;color:#6f3ff0} .analytics-help{margin-top:auto;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-16px);background:#fffdf9;color:#4f463c;font-weight:800} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 783. Overrides earlier properties: None Adds new properties: font-size */ .analytics-help{ font-size: var(--app-font-size-1rem); } .analytics-help span{font-weight:500;color:#82786a} .analytics-main{padding:var(--app-38px) clamp(var(--app-gap-28px),4vw,var(--app-height-56px));max-width:var(--app-max-width-1580px);width:100%;box-sizing:border-box} /* DUPLICATE SELECTOR — occurrence 2 of 4 Moved from original line 872. Overrides earlier properties: box-sizing, max-width, padding, width Adds new properties: min-width */ .analytics-main { width: 100%; max-width: none; min-width: 0; box-sizing: border-box; padding: var(--app-38px) clamp(var(--app-gap-28px),4vw,var(--app-height-56px)); } /* DUPLICATE SELECTOR — occurrence 3 of 4 Moved from original line 1197. Overrides earlier properties: max-width, padding Adds new properties: None */ .analytics-main { padding:var(--app-width-44px) clamp(var(--app-gap-32px),4.5vw,var(--app-68px)); max-width: var(--app-max-width-1740px); } /* DUPLICATE SELECTOR — occurrence 4 of 4 Moved from original line 1429. Overrides earlier properties: max-width, width Adds new properties: None */ .analytics-main { width: 100%; max-width: none; } .analytics-page-head{display:flex;justify-content:space-between;gap:var(--app-gap-20px);align-items:flex-start;margin-bottom:var(--app-margin-top-22px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1201. Overrides earlier properties: margin-bottom Adds new properties: None */ .analytics-page-head { margin-bottom: var(--app-margin-bottom-28px); } .analytics-page-head h1{font-size:var(--app-font-size-2-25rem);line-height:var(--app-line-height-1-05);margin:.1em 0 .3em} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1202. Overrides earlier properties: font-size Adds new properties: letter-spacing */ .analytics-page-head h1 { font-size: var(--app-font-size-clamp-2-15rem-2-5vw-3rem); letter-spacing: -.035em; } .info-dot{display:inline-grid;place-items:center;width:var(--app-gap-18px);height:var(--app-gap-18px);border-radius:var(--app-border-radius-999px);border:1px solid #bdb4a7;color:#82786a;font-size:var(--app-font-size-75rem);vertical-align:middle}.secondary-button{background:#fff;color:#242018;border:1px solid #eadfce;border-radius:var(--app-border-radius-10px);text-decoration:none;font-weight:750;box-shadow:0 1px 2px #00000008} .small-button{padding:var(--app-padding-8px-10px);font-size:var(--app-font-size-88rem)} .hero-insight{border:1px solid #ffd7dc;background:linear-gradient(90deg,#fff1f4,#fff7f3);border-radius:var(--app-border-radius-18px);padding:var(--app-padding-24px) var(--app-padding-28px);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--app-gap-18px);align-items:center;margin:var(--app-padding-18px) 0} .hero-icon{width:var(--app-width-58px);height:var(--app-height-58px);border-radius:var(--app-border-radius-50pct);display:grid;place-items:center;background:#ffd7dc;color:#e02d4f;font-size:var(--app-font-size-2rem);font-weight:900} .hero-insight .eyebrow{color:#e02d4f;text-transform:uppercase;letter-spacing:.09em;font-weight:900;font-size:.8rem} .hero-insight h2{font-size:var(--app-font-size-1-85rem);line-height:1.15;margin:.25em 0} .hero-insight p{font-size:var(--app-font-size-1-02rem);color:#6b6258;margin:.3em 0} .flow-kpi-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-18px);overflow:hidden;margin:var(--app-margin-18px-0);box-shadow:0 1px 2px #00000008} .flow-kpi{padding:var(--app-padding-18px-20px);border-right:1px solid #eadfce} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1252. Overrides earlier properties: padding Adds new properties: min-height */ .flow-kpi { padding: var(--app-padding-24px-26px); min-height: var(--app-min-height-112px); } .flow-kpi:last-child{border-right:0}.flow-kpi strong{display:block;font-size:var(--app-font-size-1-8rem);line-height:var(--app-line-height-1);font-weight:900} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1253. Overrides earlier properties: font-size Adds new properties: None */ .flow-kpi strong { font-size: var(--app-font-size-clamp-2rem-2-2vw-2-65rem); } .flow-kpi span{display:block;margin-top:var(--app-margin-top-8px);font-weight:800} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1254. Overrides earlier properties: None Adds new properties: font-size */ .flow-kpi span { font-size: var(--app-font-size-1-02rem); } .flow-kpi small{display:block;color:#6f665d;margin-top:var(--app-margin-6px)} .flow-kpi.confidence-high strong{color:#6f3ff0} .story-layout{display:grid;grid-template-columns:minmax(0,1fr) var(--app-350px);gap:var(--app-gap-22px);align-items:start} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 801. Overrides earlier properties: align-items, gap, grid-template-columns Adds new properties: None */ .story-layout { grid-template-columns: minmax(0, 1fr) var(--app-width-340px); gap: var(--app-gap-24px); align-items: start; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1546. Overrides earlier properties: grid-template-columns Adds new properties: None */ .story-layout { grid-template-columns: minmax(0, 1fr) var(--app-grid-380px); } .story-primary{display:grid;gap:18px}.flow-legend{display:flex;gap:var(--app-gap-22px);flex-wrap:wrap;margin:var(--app-margin-14px-0);color:#4f463c;font-weight:700} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1336. Overrides earlier properties: gap, margin Adds new properties: None */ .flow-legend { gap: var(--app-gap-28px); margin: var(--app-margin-18px-0); } .flow-legend span{display:inline-flex;align-items:center;gap:8px}.flow-legend i{display:inline-block;width:var(--app-width-12px);height:var(--app-height-12px);border-radius:50%} .legend-readers{background:#242018}.legend-momentum{background:#6f3ff0}.legend-drop{background:#ff384f} .flow-chart{position:relative;display:flex;align-items:end;gap:var(--app-gap-10px);min-height:var(--app-min-height-330px);overflow-x:auto;padding:var(--app-padding-28px) var(--app-padding-18px) var(--app-padding-16px);background:linear-gradient(#fff,#fffaf7);border-radius:var(--app-border-radius-14px)} /* DUPLICATE SELECTOR — occurrence 2 of 5 Moved from original line 812. Overrides earlier properties: overflow-x Adds new properties: box-sizing, max-width, overflow-y, width */ .flow-chart { width: 100%; max-width: 100%; box-sizing: border-box; overflow-x: auto; overflow-y: hidden; } /* DUPLICATE SELECTOR — occurrence 3 of 5 Moved from original line 924. Overrides earlier properties: box-sizing, max-width, overflow-x, overflow-y, width Adds new properties: None */ .flow-chart { width: 100%; max-width: 100%; box-sizing: border-box; overflow-x: auto; overflow-y: hidden; } /* DUPLICATE SELECTOR — occurrence 4 of 5 Moved from original line 1337. Overrides earlier properties: gap, min-height, padding Adds new properties: None */ .flow-chart { min-height: var(--app-410px); gap: var(--app-gap-14px); padding: var(--app-width-36px) var(--app-gap-10px) var(--app-gap-24px); } /* DUPLICATE SELECTOR — occurrence 5 of 5 Moved from original line 1556. Overrides earlier properties: None Adds new properties: justify-content */ .flow-chart { justify-content: flex-start; } .flow-chapter{min-width:var(--app-width-44px);border:0;background:transparent;color:#242018;display:grid;grid-template-rows:var(--app-padding-26px) var(--app-height-190px) var(--app-gap-22px) var(--app-gap-24px);justify-items:center;align-items:end;gap:var(--app-5px);padding:0;box-shadow:none} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1338. Overrides earlier properties: gap, grid-template-rows, min-width Adds new properties: None */ .flow-chapter { min-width: 54px; grid-template-rows: var(--app-width-30px) var(--app-245px) var(--app-gap-24px) var(--app-gap-28px); gap: var(--app-gap-7px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1559. Overrides earlier properties: None Adds new properties: flex */ .flow-chapter { flex: 0 0 auto; } .flow-count{font-weight:900;font-size:.85rem} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1341. Overrides earlier properties: font-size Adds new properties: None */ .flow-count { font-size: var(--app-font-size-95rem); } .flow-bar{height:var(--app-height-190px);width:var(--app-width-28px);background:#efe8dc;border-radius:var(--app-border-radius-10px);display:flex;align-items:end;overflow:hidden} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1339. Overrides earlier properties: border-radius, height, width Adds new properties: None */ .flow-bar { height: var(--app-245px); width: var(--app-width-36px); border-radius: var(--app-border-radius-12px); } .flow-bar span{display:block;width:100%;background:#242018;border-radius:var(--app-gap-10px) var(--app-gap-10px) 0 0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1340. Overrides earlier properties: border-radius Adds new properties: None */ .flow-bar span { border-radius: var(--app-gap-12px) var(--app-gap-12px) 0 0; } .chapter-slow .flow-bar span,.flow-chapter.drop-red .flow-bar span{background:linear-gradient(#ff384f,#fb8a33)}.chapter-fast .momentum-dot{background:#18a55a}.chapter-normal .momentum-dot{background:#f8bd2b}.chapter-slow .momentum-dot{background:#ff384f}.chapter-waiting .momentum-dot{background:#bdb4a7}.momentum-dot{width:var(--app-width-10px);height:var(--app-height-10px);border-radius:var(--app-border-radius-50pct);background:#bdb4a7} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1342. Overrides earlier properties: height, width Adds new properties: None */ .momentum-dot { width: var(--app-width-11px); height: var(--app-height-11px); } .flow-label{font-weight:900}.flow-chapter.selected .flow-bar{outline:var(--app-gap-3px) solid #ff7b8c;box-shadow:0 0 0 var(--app-5px) #fff1f4}.story-phases{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--app-gap-12px);margin-top:var(--app-gap-8px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1343. Overrides earlier properties: gap, margin-top Adds new properties: None */ .story-phases { gap: var(--app-gap-16px); margin-top: var(--app-margin-top-14px); } .phase{border-top:var(--app-gap-3px) solid #e6ddd1;padding-top:var(--app-height-8px);color:#6f665d} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1344. Overrides earlier properties: padding-top Adds new properties: font-size */ .phase { padding-top: var(--app-gap-12px); font-size: var(--app-font-size-1rem); } .phase b{display:block;color:#242018}.phase-strong{border-color:#18a55a}.phase-steady{border-color:#f8bd2b}.phase-losing{border-color:#ff384f}.phase-recovered{border-color:#18a55a}.tip-line{background:#faf7f1;border-radius:var(--app-border-radius-10px);padding:var(--app-padding-10px-12px);color:#82786a}.story-timeline{display:flex;gap:var(--app-gap-8px);flex-wrap:wrap;margin:var(--app-gap-18px) 0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1346. Overrides earlier properties: gap Adds new properties: None */ .story-timeline { gap: var(--app-gap-10px); } .timeline-cell{width:var(--app-padding-40px);height:var(--app-padding-40px);border:0;border-radius:var(--app-border-radius-10px);color:#242018;font-weight:900;box-shadow:none} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1347. Overrides earlier properties: border-radius, height, width Adds new properties: None */ .timeline-cell { width: var(--app-width-46px); height: var(--app-height-46px); border-radius: var(--app-border-radius-12px); } .timeline-fast{background:#d7f5df} .timeline-normal{background:#fff2bd} .timeline-slow{background:#ffd2cc} .timeline-waiting{background:#e9e4dc} .timeline-cell.selected{outline:3px solid #6f3ff0} .timeline-legend{ display:flex;gap:var(--app-gap-18px); flex-wrap:wrap;color:#6f665d; font-weight:750 } .timeline-legend span:before{content:"";display:inline-block;width:var(--app-width-12px);height:var(--app-height-12px);border-radius:var(--app-border-radius-4px);margin-right:var(--app-margin-right-6px);vertical-align:-1px} .timeline-legend .timeline-fast:before{background:#26c36a} .timeline-legend .timeline-normal:before{background:#f8bd2b} .timeline-legend .timeline-slow:before{background:#ff384f} .timeline-legend .timeline-waiting:before{border:2px solid #bdb4a7;box-sizing:border-box} .muted-heading{color:#82786a}.story-unit-table{font-size:var(--app-font-size-92rem)} .story-unit-row.hidden{display:none} .story-unit-table td,.story-unit-table th{padding:var(--app-gap-12px) var(--app-gap-10px)} .negative{color:#e02d4f;font-weight:850} .positive{color:#168c4a;font-weight:850} .story-side-panel{display:grid;gap:var(--app-gap-16px);position:sticky;top:var(--app-76px)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 820. Overrides earlier properties: None Adds new properties: box-sizing, max-width, width, z-index */ .story-side-panel { width: var(--app-width-340px); max-width: var(--app-max-width-340px); box-sizing: border-box; z-index: 0; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1549. Overrides earlier properties: max-width, width Adds new properties: None */ .story-side-panel { width: var(--app-width-380px); max-width: var(--app-max-width-380px); } .side-card{margin:0} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1351. Overrides earlier properties: None Adds new properties: padding */ .side-card { padding: var(--app-padding-24px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 2978. Overrides earlier properties: padding Adds new properties: None */ .side-card { padding: var(--app-card-padding); } .side-card h3{margin-top:0}.side-insight{border-left:var(--app-border-radius-4px) solid #eadfce;padding:var(--app-padding-8px) 0 var(--app-padding-8px) var(--app-padding-12px);margin:var(--app-padding-10px) 0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1352. Overrides earlier properties: padding Adds new properties: None */ .side-insight { padding: var(--app-padding-12px) 0 var(--app-padding-12px) var(--app-padding-16px); } .side-insight.down{border-color:#ff384f}.side-insight.up,.side-insight.star{border-color:#18a55a}.side-insight p{margin:.25em 0;color:#6f665d}.rank-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--app-padding-12px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1353. Overrides earlier properties: gap Adds new properties: None */ .rank-list { gap: var(--app-gap-14px); } .rank-list li{display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:var(--app-gap-8px);align-items:center;border-bottom:1px solid #f1e8dc;padding-bottom:var(--app-padding-10px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1354. Overrides earlier properties: padding-bottom Adds new properties: None */ .rank-list li { padding-bottom: var(--app-font-size-13px); } .rank-list span{color:#6f665d}.rank-list strong{color:#168c4a}.bad-list strong{color:#e02d4f}.rank-list em{font-style:normal;border-radius:var(--app-border-radius-999px);padding:var(--app-border-radius-4px) var(--app-gap-7px);background:#fff2bd;color:#9a5a00;font-weight:800;font-size:var(--app-font-size-78rem)}.bad-list li:first-child em{background:#ffe1e5;color:#e02d4f}.evidence-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--app-padding-12px)}.evidence-grid b{font-size:var(--app-font-size-1-35rem);display:block}.evidence-grid span{color:#6f665d;font-size:.82rem}.stars{color:#18a55a;letter-spacing:2px;margin-top:var(--app-padding-12px)} @media(max-width:1180px){.analytics-shell{grid-template-columns:1fr;margin:-28px}.analytics-sidebar{position:static;height:auto}.story-layout{grid-template-columns:1fr}.story-side-panel{position:static}.flow-kpi-row{grid-template-columns:repeat(3,1fr)}.flow-kpi:nth-child(3){border-right:0}.flow-kpi:nth-child(n/**/+4){border-top:1px solid #eadfce}} @media(max-width:720px){.analytics-main{padding:var(--app-gap-24px) var(--app-gap-16px)}.hero-insight{grid-template-columns:1fr}.flow-kpi-row{grid-template-columns:1fr}.flow-kpi{border-right:0;border-bottom:1px solid #eadfce}.flow-kpi:last-child{border-bottom:0}.story-phases{grid-template-columns:1fr}.section-title-row{display:block}.story-unit-table{display:block;overflow-x:auto}.rank-list li{grid-template-columns:1fr}.analytics-page-head{display:block}} /* added */ .app-card, .mini-table{font-size: var(--app-font-size-1rem);} .flow-legend, .story-side-panel, .timeline-cell, .timeline-legend, .understanding-callout{font-size: var(--app-font-size-1rem);} .evidence-drawer-panel{font-size: var(--app-font-size-1rem);} .reader-activity-card dl{ font-size: var(--app-font-size-1rem); } .toc-panel, .comment-panel{font-size: var(--app-font-size-1rem);} .reader-sources-card, .reader-tips-card{ font-size: var(--app-font-size-1rem); } .privacy-footer{font-size: var(--app-font-size-1rem);} .reader-breakdown-list li{ font-size: var(--app-font-size-1rem); } .link-button{ font-size: var(--app-font-size-1rem); } .app-section-header a{ font-size: var(--app-font-size-1rem); } .reader-management-table{ font-size: var(--app-font-size-1rem); } .readers-tabs { font-size: var(--app-font-size-1rem); } .impact-copy { font-size: var(--app-font-size-1rem); } h2 {font-size: var(--app-font-size-152rem);} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2126. Overrides earlier properties: None Adds new properties: color, font-weight, line-height, margin */ .impact-copy { color: #5f564b; font-weight: 800; line-height: var(--app-line-height-1-45); margin: .5rem 0 0; } /* Story Flow layout repair: keep chart and right rail in separate columns */ .story-layout, .story-primary, .flow-chart-card, .timeline-card, .unit-drilldown-card { min-width: 0; } .story-primary > .card { width: 100%; box-sizing: border-box; } .story-side-panel .card { width: 100%; box-sizing: border-box; } @media(max-width:1180px){ .story-layout{grid-template-columns:1fr} .story-side-panel{width:100%;max-width:none;position:static} } /* Story Understanding redesign */ .story-understanding-page .analytics-page-head{margin-bottom:var(--app-gap-18px)} .story-understanding-page .hero-insight{margin-top:var(--app-gap-14px)} .understanding-hero .hero-icon{background:#ffe1e8;color:#ff2d55} .understanding-kpi-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--app-gap-14px);margin:var(--app-gap-18px) 0 var(--app-gap-20px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1357. Overrides earlier properties: gap Adds new properties: None */ .understanding-kpi-row { gap: var(--app-gap-18px); } .understanding-kpi{background:#fff;border:1px solid #eadfce;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-16px);box-shadow:0 1px 2px #00000008} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1255. Overrides earlier properties: padding Adds new properties: min-height */ .understanding-kpi { padding: var(--app-padding-22px); min-height: var(--app-104px); } .understanding-kpi strong{display:block;font-size:var(--app-font-size-1-7rem);line-height:var(--app-line-height-1);font-weight:900} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1256. Overrides earlier properties: font-size Adds new properties: None */ .understanding-kpi strong { font-size: var(--app-font-size-2rem); } .understanding-kpi span{display:block;font-weight:850;margin-top:var(--app-gap-10px)}.understanding-kpi small{display:block;color:#6f665d;margin-top:var(--app-margin-top-8px);line-height:1.3}.understanding-kpi.tone-danger strong,.understanding-kpi.tone-danger span{color:#e02d4f}.understanding-kpi.tone-warn strong{color:#f08b21}.understanding-kpi.tone-good strong{color:#18a55a}.understanding-kpi.tone-confidence strong{color:#6f3ff0}.understanding-layout{display:grid;grid-template-columns:minmax(0,1fr) var(--app-350px);gap:var(--app-gap-22px);align-items:start} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1567. Overrides earlier properties: grid-template-columns Adds new properties: None */ .understanding-layout { grid-template-columns: minmax(0, 1fr) var(--app-grid-380px); } .understanding-primary{display:grid;gap:var(--app-gap-18px)} .understanding-legend{display:flex;gap:var(--app-gap-18px);flex-wrap:wrap;margin:var(--app-gap-12px) 0 var(--app-gap-18px);color:#5d5348;font-size:var(--app-font-size-9rem);font-weight:750} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1362. Overrides earlier properties: gap, margin Adds new properties: None */ .understanding-legend { gap: var(--app-gap-20px); margin: var(--app-gap-16px) 0 var(--app-gap-22px); } .understanding-legend span{display:inline-flex;align-items:center;gap:var(--app-gap-7px)} .understanding-legend span:before{content:"";width:var(--app-width-12px);height:var(--app-height-12px);border-radius:var(--app-border-radius-4px);display:inline-block} .understanding-legend .heat-very-low:before{background:#d7f5df}.understanding-legend .heat-low:before{background:#bdeed0}.understanding-legend .heat-moderate:before{background:#ffe5a6}.understanding-legend .heat-high:before{background:#ffad7a}.understanding-legend .heat-very-high:before{background:#ff4f68} .confusion-matrix{display:grid;grid-template-columns:var(--app-height-190px) repeat(var(--chapter-count, 22), minmax(var(--app-gap-24px),1fr));gap:var(--app-gap-8px);align-items:center;overflow-x:auto;padding:var(--app-margin-6px) var(--app-gap-2px)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1358. Overrides earlier properties: gap, grid-template-columns, padding Adds new properties: None */ .confusion-matrix { grid-template-columns: var(--app-210px) repeat(var(--chapter-count, 22), minmax(var(--app-gap-32px), 1fr)); gap: var(--app-gap-10px); padding: var(--app-gap-12px) var(--app-gap-4px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1578. Overrides earlier properties: None Adds new properties: min-width */ .confusion-matrix { min-width: var(--app-1020px); } .matrix-corner,.matrix-topic,.matrix-chapter{font-weight:850;color:#4f463c}.matrix-chapter{text-align:center;font-size:.85rem} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1361. Overrides earlier properties: font-size Adds new properties: None */ .matrix-chapter { font-size: var(--app-font-size-9rem); } .matrix-topic{white-space:nowrap;font-size:.95rem} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1360. Overrides earlier properties: font-size Adds new properties: None */ .matrix-topic { font-size: var(--app-font-size-1rem); } .matrix-cell{height:var(--app-height-32px);border-radius:var(--app-border-radius-6px);border:1px solid #ffffffaa} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1359. Overrides earlier properties: border-radius, height Adds new properties: None */ .matrix-cell { height: 38px; border-radius: var(--app-border-radius-8px); } .matrix-cell.selected{outline:var(--app-gap-3px) solid #6f3ff0;outline-offset:1px}.heat-very-low{background:#d7f5df}.heat-low{background:#bdeed0}.heat-moderate{background:#ffe5a6}.heat-high{background:#ffad7a}.heat-very-high{background:#ff4f68}.understanding-callout{margin-top:var(--app-gap-20px);border:1px solid #ffd7dc;background:#fff5f6;border-radius:var(--app-border-radius-12px);padding:var(--app-gap-16px) var(--app-gap-18px);display:grid;gap:var(--app-gap-6px)}.understanding-callout strong{color:#e02d4f}.understanding-callout span{color:#6f665d}.understanding-callout a{color:#6f3ff0;font-weight:850}.understanding-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--app-gap-18px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1363. Overrides earlier properties: gap Adds new properties: None */ .understanding-card-grid { gap: var(--app-gap-22px); } .topic-bars{list-style:none;margin:0;padding:0;display:grid;gap:var(--app-gap-14px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1365. Overrides earlier properties: gap Adds new properties: None */ .topic-bars { gap: var(--app-gap-16px); } .topic-bars li{display:grid;grid-template-columns:var(--app-height-150px) minmax(0,1fr) var(--app-52px) var(--app-width-34px);gap:var(--app-gap-10px);align-items:center} .topic-bars span{font-weight:800;color:#4f463c}.topic-bar{height:var(--app-height-8px);border-radius:var(--app-border-radius-999px);background:#f0e7dc;overflow:hidden} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1364. Overrides earlier properties: height Adds new properties: None */ .topic-bar { height: var(--app-height-11px); } .topic-bar i{display:block;height:100%;background:linear-gradient(90deg,#ff384f,#ff9b45);border-radius:var(--app-border-radius-999px)}.topic-bars strong{font-size:.9rem}.topic-bars small{color:#82786a}.mini-line-chart{height:var(--app-height-180px);border-radius:var(--app-border-radius-12px);background:linear-gradient(#fff,#fffaf7);display:flex;align-items:end;gap:var(--app-gap-6px);padding:var(--app-gap-16px) var(--app-gap-12px);border:1px solid #f1e8dc} /* DUPLICATE SELECTOR — occurrence 2 of 4 Moved from original line 972. Overrides earlier properties: align-items, background, border, border-radius, display, gap, height, padding Adds new properties: None */ .mini-line-chart{height:var(--app-height-116px);border-radius:var(--app-border-radius-14px);background:linear-gradient(180deg,#ffffff,#f5fff8);border:1px solid #eef2ec;display:flex;align-items:flex-end;gap:var(--app-gap-12px);padding:var(--app-gap-18px) var(--app-gap-18px) 0} /* DUPLICATE SELECTOR — occurrence 3 of 4 Moved from original line 1319. Overrides earlier properties: gap, height, padding Adds new properties: None */ .mini-line-chart { height: var(--app-height-150px); gap: var(--app-gap-14px); padding: var(--app-gap-22px) var(--app-gap-22px) 0; } /* DUPLICATE SELECTOR — occurrence 4 of 4 Moved from original line 1371. Overrides earlier properties: height Adds new properties: None */ .mini-line-chart { height: var(--app-height-220px); } .mini-point{display:block;flex:1;min-width:var(--app-min-width-6px);border-radius:var(--app-border-radius-999px) var(--app-border-radius-999px) 0 0}.mini-axis{text-align:center;color:#82786a;font-size:var(--app-font-size-85rem);margin-top:var(--app-gap-8px)}.reader-needs{list-style:none;margin:0 0 var(--app-gap-16px);padding:0;display:grid;gap:var(--app-gap-14px);color:#4f463c;font-weight:750} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1366. Overrides earlier properties: gap Adds new properties: None */ .reader-needs { gap: var(--app-gap-16px); } .reader-needs li{background:#fbf7ff;border-radius:var(--app-border-radius-10px);padding:var(--app-padding-10px-12px);color:#6f3ff0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1367. Overrides earlier properties: padding Adds new properties: None */ .reader-needs li { padding: var(--app-font-size-13px) var(--app-gap-14px); } .full-width{display:block;text-align:center}.reread-bars{height:var(--app-height-180px);display:flex;align-items:end;gap:var(--app-gap-6px);border:1px solid #f1e8dc;background:#fffaf7;border-radius:var(--app-border-radius-12px);padding:var(--app-gap-16px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1370. Overrides earlier properties: gap, height, padding Adds new properties: None */ .reread-bars { height: var(--app-height-220px); gap: var(--app-gap-8px); padding: var(--app-padding-22px); } .reread-bars span{flex:1;min-width:var(--app-min-width-6px);border-radius:var(--app-border-radius-999px) var(--app-border-radius-999px) 0 0;background:#6f3ff0}.comment-examples{display:grid;gap:var(--app-gap-12px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1368. Overrides earlier properties: gap Adds new properties: None */ .comment-examples { gap: var(--app-gap-16px); } .comment-examples article{border-bottom:1px solid #f1e8dc;padding-bottom:var(--app-gap-12px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1369. Overrides earlier properties: padding-bottom Adds new properties: None */ .comment-examples article { padding-bottom: var(--app-padding-bottom-16px); } .comment-examples article:last-child{border-bottom:0;padding-bottom:0}.comment-examples strong{display:block}.comment-examples p{margin:.35em 0;color:#4f463c}.comment-examples span{display:inline-block;color:#f08b21;background:#fff2bd;border-radius:var(--app-border-radius-999px);padding:var(--app-gap-3px) var(--app-height-8px);font-size:var(--app-font-size-8rem);font-weight:800}.investigation-card table{font-size:var(--app-font-size-92rem)}.severity{display:inline-block;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-4px-8px);font-weight:850;font-size:var(--app-font-size-78rem)} .severity-critical{background:#ffe1e5;color:#e02d4f}.severity-high{background:#fff2bd;color:#9a5a00}.severity-watch{background:#e7f8ed;color:#168c4a}.segment-list{display:grid;gap:var(--app-gap-18px)}.segment-list div{display:grid;grid-template-columns:minmax(0,1fr) var(--app-width-48px);gap:var(--app-gap-6px);align-items:center}.segment-list strong{grid-column:1}.segment-list span{grid-column:1;color:#6f665d;font-size:var(--app-font-size-85rem)}.segment-list b{grid-column:2;grid-row:1 / span 2;justify-self:end}.segment-list i{grid-column:1 / -1;height:var(--app-height-8px);border-radius:var(--app-border-radius-999px);background:linear-gradient(90deg,#18a55a,#f8bd2b,#ff384f);display:block;max-width:100%} .understanding-side-panel{position:sticky;top:var(--app-76px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1570. Overrides earlier properties: None Adds new properties: max-width, width */ .understanding-side-panel { width: var(--app-width-380px); max-width: var(--app-max-width-380px); } @media(max-width:1280px){.understanding-layout{grid-template-columns:1fr}.understanding-side-panel{position:static}.understanding-kpi-row{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.understanding-card-grid{grid-template-columns:1fr}.understanding-kpi-row{grid-template-columns:1fr}.confusion-matrix{grid-template-columns:150px repeat(var(--chapter-count,22), 28px)}} /* Analytics three-column layout repair Must remain last so analytics redesigns do not collapse into a narrow column. Left rail = book navigation, center = analysis, right rail = contextual summary. */ body:has(.analytics-shell) main { max-width: none; width: 100%; margin: 0; padding: 0; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1189. Overrides earlier properties: max-width, padding Adds new properties: None */body:has(.analytics-shell) main { padding: 0; max-width: none; } .story-layout, .understanding-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--app-width-340px); gap: var(--app-gap-24px); align-items: start; width: 100%; } .story-primary, .understanding-primary, .flow-chart-card, .timeline-card, .unit-drilldown-card, .understanding-primary > .card { min-width: 0; } .story-primary, .understanding-primary { display: grid; gap: var(--app-gap-18px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1333. Overrides earlier properties: gap Adds new properties: None */ .story-primary, .understanding-primary { gap: var(--app-gap-24px); } .story-primary > .card, .story-side-panel .card, .understanding-primary > .card, .understanding-side-panel .card { width: 100%; box-sizing: border-box; } .story-side-panel, .understanding-side-panel { position: sticky; top: var(--app-76px); display: grid; gap: var(--app-gap-16px); width: var(--app-width-340px); max-width: var(--app-max-width-340px); min-width: 0; z-index: 1; } @media (max-width: 1180px) { .analytics-shell { grid-template-columns: 1fr; } .analytics-sidebar { position: static; width: 100%; max-width: none; height: auto; } .story-layout, .understanding-layout { grid-template-columns: 1fr; } .story-side-panel, .understanding-side-panel { position: static; width: 100%; max-width: none; } } /* Reader Perception redesign */ .reader-perception-page .analytics-page-head{margin-bottom:var(--app-gap-18px)} .perception-hero{border-color:#bdeed0;background:linear-gradient(90deg,#f0fff6,#fbfff7)} .perception-hero .hero-icon{background:#dcf8e7;color:#18a55a} .perception-hero .eyebrow{color:#18a55a}.perception-kpi-row{grid-template-columns:repeat(7,minmax(0,1fr))}.flow-kpi.kpi-good strong{color:#18a55a}.flow-kpi.kpi-danger strong{color:#e02d4f}.flow-kpi.kpi-warn strong{color:#f08b21}.flow-kpi.kpi-confidence strong{color:#6f3ff0}.perception-layout{display:grid;grid-template-columns:minmax(0,1fr) var(--app-width-340px);gap:var(--app-gap-24px);align-items:start;width:100%} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 964. Overrides earlier properties: align-items, display, gap, grid-template-columns, width Adds new properties: None */ .perception-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--app-gap-24px);align-items:start;width:100%} /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1588. Overrides earlier properties: grid-template-columns Adds new properties: None */ .perception-layout { grid-template-columns: minmax(0, 1fr) var(--app-grid-380px); } .perception-chart-card{min-width:0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1376. Overrides earlier properties: None Adds new properties: padding */ .perception-chart-card { padding: var(--app-padding-30px); } .perception-legend{display:flex;gap:var(--app-gap-18px);align-items:center;flex-wrap:wrap;font-weight:750;color:#5d5348}.perception-legend span{display:inline-flex;align-items:center;gap:7px}.perception-legend i{display:inline-block;width:var(--app-width-12px);height:var(--app-height-12px);border-radius:var(--app-border-radius-4px)}.sent-pos{background:#1fc875}.sent-neu{background:#d9d4cb}.sent-neg{background:#ff4f68}.sent-line{height:3px!important;width:22px!important;border-radius:var(--app-border-radius-99px) !important;background:#6f3ff0}.sentiment-chart{position:relative;min-height:var(--app-min-height-330px);border-radius:var(--app-border-radius-14px);background:linear-gradient(#fff,#fffaf7);border:1px solid #f1e8dc;padding:34px 18px 22px;display:flex;align-items:end;gap:var(--app-gap-10px);overflow-x:auto} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1377. Overrides earlier properties: gap, min-height, padding Adds new properties: None */ .sentiment-chart { min-height: var(--app-400px); gap: var(--app-gap-14px); padding: var(--app-gap-42px) var(--app-gap-22px) var(--app-gap-28px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 2416. Overrides earlier properties: align-items, display, overflow-x, position Adds new properties: column-gap, grid-template-columns, isolation, overflow-y */ .sentiment-chart { position: relative; display: grid; grid-template-columns: repeat(var(--sentiment-chapters), minmax(var(--app-width-34px), 1fr)); align-items: end; column-gap: var(--app-gap-14px); overflow-x: auto; overflow-y: hidden; isolation: isolate; } .sentiment-column{position:relative;display:grid;grid-template-rows:var(--app-width-220px) var(--app-gap-24px);gap:var(--app-gap-8px);align-items:end;justify-items:center;min-width:var(--app-38px)} /* DUPLICATE SELECTOR — occurrence 2 of 5 Moved from original line 1378. Overrides earlier properties: grid-template-rows, min-width Adds new properties: None */ .sentiment-column { min-width: var(--app-min-width-46px); grid-template-rows: var(--app-height-260px) var(--app-gap-28px); } /* DUPLICATE SELECTOR — occurrence 3 of 5 Moved from original line 2427. Overrides earlier properties: align-items, display, grid-template-rows, justify-items, min-width, position Adds new properties: -webkit-appearance, appearance, background, border, border-radius, box-shadow, color, cursor, font, margin, padding, z-index */ .sentiment-column { appearance: none; -webkit-appearance: none; position: relative; z-index: 3; display: grid; grid-template-rows: var(--app-height-260px) var(--app-gap-28px); align-items: end; justify-items: center; min-width: var(--app-min-width-46px); padding: 0; margin: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; box-shadow: none; cursor: pointer; } /* DUPLICATE SELECTOR — occurrence 4 of 5 Moved from original line 2538. Overrides earlier properties: z-index Adds new properties: None */ .sentiment-column { z-index: 3; } /* DUPLICATE SELECTOR — occurrence 5 of 5 Moved from original line 3002. Overrides earlier properties: grid-template-rows Adds new properties: None */ .sentiment-column { grid-template-rows: var(--app-chart-bar-height) 28px; } .sentiment-stack{width:var(--app-width-28px);height:var(--app-height-220px);border-radius:var(--app-border-radius-10px);overflow:hidden;background:#f1e8dc;display:flex;flex-direction:column-reverse;justify-content:flex-start} /* DUPLICATE SELECTOR — occurrence 2 of 4 Moved from original line 1379. Overrides earlier properties: border-radius, height, width Adds new properties: None */ .sentiment-stack { width: var(--app-width-34px); height: var(--app-height-260px); border-radius: var(--app-border-radius-12px); } /* DUPLICATE SELECTOR — occurrence 3 of 4 Moved from original line 2462. Overrides earlier properties: background, border-radius, display, flex-direction, height, justify-content, overflow, width Adds new properties: position, z-index */ .sentiment-stack { position: relative; z-index: 1; width: var(--app-width-34px); height: var(--app-height-260px); border-radius: var(--app-border-radius-10px); overflow: hidden; background: #f1e8dc; display: flex; flex-direction: column-reverse; justify-content: flex-start; } /* DUPLICATE SELECTOR — occurrence 4 of 4 Moved from original line 3001. Overrides earlier properties: height, width Adds new properties: None */ .sentiment-stack { width: var(--app-chart-bar-width); height: var(--app-chart-bar-height); } .sentiment-stack i{display:block;width:100%}.stack-pos{background:#48cc8a}.stack-neu{background:#e6e2da}.stack-neg{background:#ff6678}.sentiment-column b{font-size:.85rem}.sentiment-column em{position:absolute;bottom:var(--app-gap-42px);width:var(--app-9px);border-radius:var(--app-border-radius-99px);background:#6f3ff0;opacity:.85;min-height:var(--app-gap-8px)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1380. Overrides earlier properties: bottom, width Adds new properties: None */ .sentiment-column em { width: var(--app-width-11px); bottom: var(--app-52px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 2502. Overrides earlier properties: None Adds new properties: display */ .sentiment-column em { display: none; } .moment-labels{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--app-gap-10px);margin-top:var(--app-margin-top-14px);color:#6f665d;font-size:var(--app-font-size-86rem);text-align:center} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1381. Overrides earlier properties: font-size, margin-top Adds new properties: None */ .moment-labels { margin-top: var(--app-margin-top-18px); font-size: var(--app-font-size-95rem); } .emotion-heatmap{display:grid;grid-template-columns:140px repeat(var(--chapter-count,22), minmax(var(--app-gap-22px),1fr));gap:var(--app-gap-8px);align-items:center;overflow-x:auto;padding:var(--app-border-radius-4px) var(--app-gap-2px) var(--app-gap-10px)} /* DUPLICATE SELECTOR — occurrence 2 of 5 Moved from original line 1382. Overrides earlier properties: gap, grid-template-columns, padding Adds new properties: None */ .emotion-heatmap { grid-template-columns: var(--app-160px) repeat(var(--chapter-count,22), minmax(var(--app-width-30px),1fr)); gap: var(--app-gap-10px); padding: var(--app-gap-12px) var(--app-gap-4px) var(--app-gap-16px); } /* DUPLICATE SELECTOR — occurrence 3 of 5 Moved from original line 1595. Overrides earlier properties: None Adds new properties: min-width */ .emotion-heatmap { min-width: var(--app-980px); } /* DUPLICATE SELECTOR — occurrence 4 of 5 Moved from original line 2051. Overrides earlier properties: align-items, display, gap, grid-template-columns, min-width, padding Adds new properties: overflow */ .emotion-heatmap { display: grid; grid-template-columns: var(--app-min-width-92px) repeat(var(--chapter-count,22), var(--app-width-30px)); gap: var(--app-gap-10px) var(--app-width-12px); align-items: center; min-width: max-content; overflow: visible; padding: var(--app-gap-14px) var(--app-gap-4px) var(--app-gap-10px); } /* DUPLICATE SELECTOR — occurrence 5 of 5 Moved from original line 2269. Overrides earlier properties: grid-template-columns Adds new properties: None */ .emotion-heatmap { grid-template-columns: var(--app-410px) repeat(var(--chapter-count,22), var(--app-width-30px)); } .heat-row-label,.heat-col-label{font-weight:850;color:#4f463c;font-size:.9rem}.heat-col-label{text-align:center} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2070. Overrides earlier properties: text-align Adds new properties: color, font-size */ .heat-col-label { text-align: center; font-size: var(--app-font-size-86rem); color: #4f463c; } .heat-cell{height:var(--app-height-30px);border-radius:var(--app-border-radius-6px);border:1px solid #ffffffaa} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1383. Overrides earlier properties: border-radius, height Adds new properties: None */ .heat-cell { height: var(--app-height-36px); border-radius: var(--app-border-radius-8px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 2075. Overrides earlier properties: border-radius, height Adds new properties: box-sizing, width */ .heat-cell { width: var(--app-width-30px); height: var(--app-height-30px); border-radius: var(--app-border-radius-5px); box-sizing: border-box; } .heatmap-legend{display:flex;gap:var(--app-gap-18px);flex-wrap:wrap;color:#6f665d;font-weight:750;margin-top:var(--app-gap-12px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2081. Overrides earlier properties: gap Adds new properties: border-top, padding-top */ .heatmap-legend { gap: var(--app-gap-18px); padding-top: var(--app-gap-10px); border-top: 1px solid #f1e8dc; } .heatmap-legend span:before{content:"";display:inline-block;width:var(--app-width-12px);height:var(--app-height-12px);border-radius:var(--app-border-radius-4px);margin-right:var(--app-margin-right-6px);vertical-align:-1px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2092. Overrides earlier properties: margin-right Adds new properties: None */ .heatmap-legend span:before { margin-right: 0; } .heatmap-legend .heat-very-low:before{background:#d7f5df}.heatmap-legend .heat-low:before{background:#bdeed0}.heatmap-legend .heat-moderate:before{background:#ffe5a6}.heatmap-legend .heat-high:before{background:#ffad7a} .heatmap-legend .heat-very-high:before{background:#ff4f68}.perception-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--app-gap-18px)}.compact-rank-list li{grid-template-columns:var(--app-min-width-92px) minmax(0,1fr) var(--app-52px)} .topic-bar-row{display:grid;grid-template-columns:150px minmax(0,1fr) var(--app-width-44px);gap:var(--app-gap-10px);align-items:center;margin:var(--app-padding-12px) 0} .topic-bar-row span{font-weight:800;color:#4f463c}.topic-bar-row b{height:var(--app-height-8px);border-radius:var(--app-border-radius-999px);background:#f0e7dc;overflow:hidden;display:block} .topic-bar-row i{display:block;height:100%;background:linear-gradient(90deg,#18a55a,#f8bd2b,#ff384f);border-radius:var(--app-border-radius-999px)} .topic-bar-row strong{font-size:.9rem}.mock-note{font-size:var(--app-font-size-75rem);color:#82786a;font-weight:800}.mini-table{font-size:.9rem} .mini-table td,.mini-table th{padding:var(--app-gap-10px) var(--app-gap-8px)}.mini-table small{color:#82786a}.reader-comment-list{display:grid;gap:var(--app-padding-12px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1386. Overrides earlier properties: gap Adds new properties: None */ .reader-comment-list { gap: var(--app-gap-18px); } .reader-comment-item{border-bottom:1px solid #f1e8dc;padding-bottom:var(--app-padding-12px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1387. Overrides earlier properties: padding-bottom Adds new properties: None */ .reader-comment-item { padding-bottom: var(--app-gap-18px); } .reader-comment-item:last-child{border-bottom:0}.reader-comment-item p{margin:var(--app-margin-4em-0);color:#4f463c} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1602. Overrides earlier properties: None Adds new properties: line-height */ .reader-comment-item p { line-height: var(--app-line-height-1-55); } .reader-comment-item a{margin-left:var(--app-gap-8px)} .perception-bottom-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--app-gap-18px)} .meaning-card{display:grid;gap:var(--app-gap-12px);align-content:start} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1388. Overrides earlier properties: None Adds new properties: padding */ .meaning-card { padding: var(--app-padding-28px); } .good-soft{background:linear-gradient(180deg,#f7fff9,#fff);border-color:#cdeed8}.purple-soft{background:linear-gradient(180deg,#fbf7ff,#fff);border-color:#e2d6ff}.action-soft{background:linear-gradient(180deg,#fffaf3,#fff);border-color:#ffe2bd}.check-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--app-gap-10px)}.check-list li{position:relative;padding-left:var(--app-gap-24px);color:#4f463c}.check-list li:before{content:"✓";position:absolute;left:0;color:#18a55a;font-weight:900}.kdc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--app-padding-12px)}.kdc-grid div{display:grid;gap:var(--app-gap-8px)}.kdc-grid b{color:#242018}.kdc-grid span{font-size:var(--app-font-size-9rem);color:#4f463c}.soft-danger{background:linear-gradient(180deg,#fff7f7,#fff)}.soft-danger h3{color:#e02d4f} @media(max-width:1380px){.perception-kpi-row{grid-template-columns:repeat(4,1fr)}.perception-kpi-row .flow-kpi:nth-child(4){border-right:0}.perception-kpi-row .flow-kpi:nth-child(n/**/+5){border-top:1px solid #eadfce}.perception-card-grid,.perception-bottom-grid{grid-template-columns:1fr 1fr}.moment-labels{grid-template-columns:repeat(3,1fr)}} @media(max-width:1180px){.perception-layout{grid-template-columns:1fr}.perception-kpi-row{grid-template-columns:repeat(2,1fr)}.perception-card-grid,.perception-bottom-grid{grid-template-columns:1fr}.moment-labels{grid-template-columns:1fr 1fr}.emotion-heatmap{grid-template-columns:110px repeat(var(--chapter-count,22), 28px)}} @media(max-width:720px){.perception-kpi-row{grid-template-columns:1fr}.sentiment-chart{min-height:260px}.sentiment-column{grid-template-rows:170px 24px}.sentiment-stack{height:170px}.kdc-grid{grid-template-columns:1fr}.moment-labels{grid-template-columns:1fr}} /* Shared analytics three-column safeguards for Reader Perception */ .perception-layout .story-primary,.perception-layout .story-side-panel{min-width:0}.perception-layout .story-side-panel{position:sticky;top:76px;display:grid;gap:var(--app-gap-16px);width:var(--app-width-340px);max-width:var(--app-max-width-340px);z-index:1} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1591. Overrides earlier properties: max-width, width Adds new properties: None */ .perception-layout .story-side-panel { width: var(--app-width-380px); max-width: var(--app-max-width-380px); } .perception-layout .story-primary>.card,.perception-layout .story-side-panel .card{width:100%;box-sizing:border-box}.reader-perception-page{width:100%;max-width:none;min-width:0} @media(max-width:1180px){.perception-layout{grid-template-columns:1fr}.perception-layout .story-side-panel{position:static;width:100%;max-width:none}} /* Revision Plan redesign */ .revision-plan-page{width:100%;max-width:none;min-width:0}.analytics-actions{display:flex;gap:var(--app-gap-12px);align-items:center}.purple-outline{border-color:#d6c3ff;color:#6f3ff0;background:#fff} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 999. Overrides earlier properties: border-color, color Adds new properties: None */ .purple-outline { color: #6f3ff0; border-color: #d8c8ff; } .revision-hero{border-color:#ffd7dc;background:linear-gradient(90deg,#fff1f4,#fff7f3)}.revision-hero .hero-icon{background:#ffd7dc;color:#e02d4f}.revision-hero .eyebrow{color:#e02d4f}.roadmap-card{margin-top:var(--app-gap-20px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1391. Overrides earlier properties: None Adds new properties: padding */ .roadmap-card { padding: var(--app-padding-30px); } .roadmap-table-wrap{overflow-x:auto}.roadmap-table{min-width:980px}.roadmap-table td,.roadmap-table th{padding:var(--app-padding-16px-14px);vertical-align:top}.roadmap-table th{color:#4f463c}.roadmap-table small{color:#6f665d}.priority-badge{display:grid;place-items:center;width:var(--app-width-36px);height:var(--app-height-36px);border-radius:var(--app-border-radius-12px);background:#fff0f2;color:#242018;font-weight:900} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1394. Overrides earlier properties: border-radius, height, width Adds new properties: font-size */ .priority-badge { width: var(--app-width-42px); height: var(--app-height-42px); border-radius: var(--app-border-radius-14px); font-size: var(--app-font-size-1-08rem); } .effort{display:inline-block;border-radius:var(--app-border-radius-999px);padding:var(--app-border-radius-4px) var(--app-9px);font-weight:850;font-size:.8rem}.effort-low{background:#e7f8ed;color:#168c4a}.effort-medium{background:#fff2bd;color:#9a5a00} .effort-high{background:#ffe1e5;color:#e02d4f}.todo-dot{display:inline-block;width:var(--app-gap-16px);height:var(--app-gap-16px);border:2px solid #82786a;border-radius:var(--app-border-radius-50pct);vertical-align:-3px;margin-right:6px}.revision-summary-grid{display:grid;grid-template-columns:1fr 1.15fr 1.25fr;gap:var(--app-gap-18px);margin:var(--app-gap-18px) 0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1397. Overrides earlier properties: gap, margin Adds new properties: None */ .revision-summary-grid { gap: var(--app-gap-22px); margin: var(--app-margin-24px-0); } .impact-card,.next-step-card,.focus-heatmap-card{min-height:var(--app-140px)}.big-green{font-size:var(--app-font-size-3rem);line-height:var(--app-line-height-1);font-weight:950;color:#18a55a;margin:8px 0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1401. Overrides earlier properties: font-size Adds new properties: None */ .big-green { font-size: var(--app-font-size-3-6rem); } .next-step-card .button{display:inline-flex;margin-top:var(--app-gap-8px)}.focus-scale{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--app-gap-6px);margin:var(--app-gap-24px) 0 var(--app-gap-10px)}.focus-cell{height:var(--app-height-30px);border-radius:var(--app-gap-4px)} .focus-good{background:#39b96f}.focus-watch{background:#bdeed0}.focus-high{background:#ffb06f}.focus-critical{background:#ff384f}.focus-labels{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--app-gap-6px);color:#6f665d;font-size:var(--app-font-size-82rem);text-align:center}.focus-labels span{display:grid;gap:var(--app-gap-3px);line-height:1.15}.focus-labels strong{color:#4f463c;font-size:.84rem}.focus-labels small{font-size:var(--app-font-size-76rem);color:#81776b}.revision-detail-grid{display:grid;grid-template-columns:1fr 1.35fr 1fr 1fr;gap:var(--app-gap-18px);align-items:stretch} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1402. Overrides earlier properties: gap Adds new properties: None */ .revision-detail-grid { gap: var(--app-gap-22px); } .priorities-card,.plan-impact-card{grid-column:span 2}.priority-list{list-style:none;padding:0;margin:0;display:grid;gap:18px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1403. Overrides earlier properties: gap Adds new properties: None */ .priority-list { gap: var(--app-gap-22px); } .priority-list li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:var(--app-gap-14px);align-items:start}.priority-list li>span{display:grid;place-items:center;width:var(--app-width-32px);height:var(--app-height-32px);border-radius:var(--app-border-radius-999px);background:#fff0f2;font-weight:900}.priority-list small{display:block;color:#6f665d;margin-top:5px}.plan-impact-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #eadfce;border-radius:var(--app-border-radius-16px);overflow:hidden;margin:12px 0 18px}.plan-impact-grid div{padding:var(--app-padding-18px);border-right:1px solid #eadfce} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1404. Overrides earlier properties: padding Adds new properties: None */ .plan-impact-grid div { padding: var(--app-padding-24px); } .plan-impact-grid div:last-child{border-right:0}.plan-impact-grid strong{display:block;font-size:var(--app-font-size-2rem);line-height:var(--app-line-height-1);font-weight:950}.plan-impact-grid span{display:block;color:#6f665d;margin-top:8px}.confidence-strip{border-top:1px solid #eadfce;padding-top:var(--app-gap-16px);display:grid;gap:var(--app-margin-6px)} .confidence-strip span{color:#18a55a;letter-spacing:2px}.confidence-strip small{color:#6f665d}.theme-card{display:grid;grid-template-columns:var(--app-min-width-120px)\ minmax(0,1fr);gap:var(--app-gap-18px);align-items:center} .theme-card h3{grid-column:1 / -1}.theme-donut{width:var(--app-width-110px);height:110px;border-radius:var(--app-border-radius-50pct);background:var(--theme-donut,conic-gradient(#ece7df 0 100%));display:grid;place-items:center;position:relative} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1405. Overrides earlier properties: height, width Adds new properties: None */ .theme-donut { width: var(--app-height-150px); height: var(--app-height-150px); } .theme-donut:before{content:"";position:absolute;inset:var(--app-gap-24px);background:#fff;border-radius:50%}.theme-donut strong,.theme-donut span{position:relative;z-index:1}.theme-donut strong{font-size:var(--app-font-size-2rem);line-height:1} .theme-donut span{font-size:var(--app-font-size-78rem);color:#6f665d;margin-top:var(--app-gap-28px)}.theme-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--app-gap-10px)}.theme-list li{display:flex;gap:var(--app-gap-8px);align-items:center;color:#4f463c}.theme-list i{width:var(--app-width-12px);height:var(--app-height-12px);border-radius:var(--app-border-radius-50pct);display:inline-block} .theme-danger{background:#ff384f}.theme-warn{background:#f08b21}.theme-purple{background:#6f3ff0}.theme-good{background:#18a55a}.theme-list strong{margin-left:auto}.coverage-card ul,.actions-card{display:grid;gap:var(--app-gap-12px)}.coverage-card ul{list-style:none;padding:0;margin:0}.coverage-card li{display:flex;justify-content:space-between;gap:var(--app-gap-12px);align-items:center} .coverage-card small{color:#6f665d}.coverage-card em{font-style:normal;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-5px-9px);font-weight:850;font-size:var(--app-font-size-78rem)}.coverage-good{background:#e7f8ed;color:#168c4a}.coverage-watch{background:#fff2bd;color:#9a5a00}.coverage-needs-work{background:#ffe1e5;color:#e02d4f}.actions-card a{color:#4f463c;text-decoration:none;border-bottom:1px solid #f1e8dc;padding-bottom:var(--app-gap-10px);font-weight:800}.actions-card a:hover{color:#6f3ff0} .revision-bottom-cta{position:sticky;bottom:0;margin-top:var(--app-margin-top-22px);background:linear-gradient(90deg,#fbf7ff,#fff);border:1px solid #e2d6ff;border-radius:18px 18px 0 0;padding:var(--app-padding-18px-22px);display:flex;gap:var(--app-gap-18px);align-items:center;box-shadow:0 -8px 24px rgba(91,46,234,.08)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1407. Overrides earlier properties: padding Adds new properties: min-height */ .revision-bottom-cta { min-height: var(--app-62px); padding: var(--app-gap-18px) var(--app-gap-24px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1620. Overrides earlier properties: None Adds new properties: z-index */ .revision-bottom-cta { z-index: 4; } .revision-bottom-cta strong{color:#6f3ff0}.revision-bottom-cta span{flex:1;color:#4f463c}.revision-bottom-cta a{font-weight:900;color:#6f3ff0;text-decoration:none} @media(max-width:1380px){.revision-summary-grid{grid-template-columns:1fr 1fr}.focus-heatmap-card{grid-column:1 / -1}.revision-detail-grid{grid-template-columns:1fr 1fr}.priorities-card,.plan-impact-card{grid-column:span 2}.theme-card{grid-template-columns:120px 1fr}} @media(max-width:900px){.revision-summary-grid,.revision-detail-grid{grid-template-columns:1fr}.priorities-card,.plan-impact-card{grid-column:span 1}.plan-impact-grid{grid-template-columns:1fr}.plan-impact-grid div{border-right:0;border-bottom:1px solid #eadfce}.plan-impact-grid div:last-child{border-bottom:0}.priority-list li{grid-template-columns:36px 1fr}.priority-list em{grid-column:2}.theme-card{grid-template-columns:1fr}.revision-bottom-cta{position:static;display:grid}.roadmap-table{min-width:760px}} /* Reader management dashboard enhancements */ .reader-hero-insight{display:flex;gap:var(--app-gap-18px);align-items:center;border:1px solid #cfeedd;border-radius:var(--app-border-radius-18px);background:linear-gradient(135deg,#f3fff8,#ffffff);padding:var(--app-padding-28px-30px);margin:var(--app-gap-18px) 0 var(--app-gap-18px);box-shadow:0 1px 2px #00000008} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1301. Overrides earlier properties: None Adds new properties: margin-top */ .reader-hero-insight { margin-top: var(--app-gap-24px); } .reader-hero-icon{width:var(--app-64px);height:var(--app-64px);border-radius:var(--app-border-radius-50pct);display:grid;place-items:center;background:#dcf7e6;color:#0f8a4b;font-size:var(--reader-font-size-32px);flex:0 0 auto} .reader-hero-insight .hero-kicker{text-transform:uppercase;letter-spacing:.12em;font-size:var(--app-font-size-78rem);font-weight:900;margin-bottom:var(--app-gap-8px)} .reader-hero-insight .hero-kicker.green{color:#079455}.reader-hero-insight h2{margin:var(--app-margin-0-0-8px);font-size:var(--app-font-size-1-65rem);line-height:1.15} .reader-hero-insight p{margin:0;color:#5f564b;font-size:var(--app-font-size-1-03rem);line-height:1.45}.reader-metrics-enhanced{grid-template-columns:1.35fr repeat(5,minmax(0,1fr));align-items:stretch} .reader-metrics-enhanced .metric-card{min-height:var(--app-104px)}.reader-metrics-enhanced .metric-card small{font-size:var(--reader-font-size-48em);color:#5f564b}.reader-quality-card .metric-icon{display:inline-grid;width:var(--app-width-28px);height:var(--app-height-28px);border-radius:var(--app-border-radius-50pct);place-items:center;background:#e8fff0;margin-bottom:var(--app-gap-7px)} .reader-quality-card strong{color:#079455}.reader-quality-card em{display:block;margin-top:var(--app-margin-top-8px);color:#5f564b;font-style:normal;font-size:var(--reader-font-size-84rem);line-height:1.3}.reader-insight-panels{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:var(--app-gap-18px);margin:var(--app-gap-20px) 0 var(--app-gap-4px)} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1317. Overrides earlier properties: gap Adds new properties: margin-top */ .reader-insight-panels { gap: var(--app-gap-22px); margin-top: var(--app-margin-top-28px); } .reader-insight-card{min-height:var(--app-height-190px)} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1318. Overrides earlier properties: min-height Adds new properties: padding */ .reader-insight-card { min-height: var(--app-230px); padding: var(--app-padding-26px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 3020. Overrides earlier properties: min-height, padding Adds new properties: None */ .reader-insight-card { padding: var(--app-card-padding); min-height: var(--app-card-min-height-large); } .reader-insight-card h3{margin:0 0 14px}.mini-line-chart span{flex:1;background:linear-gradient(180deg,#20b86f,#c7f5d8);border-radius:var(--app-border-radius-8px) var(--app-border-radius-8px) 0 0;min-height:18px}.success-note{color:#087443;font-weight:800;margin:12px 0 0}.reader-donut{width:116px;height:var(--app-height-116px);border-radius:var(--app-border-radius-50pct);background:conic-gradient(#18a957 0 calc(var(--finished)*1%),#6f3ff0 calc(var(--finished)*1%) calc(var(--reading)*1%),#ece6dc calc(var(--reading)*1%) 100%);display:grid;place-items:center;margin:0 auto 14px;position:relative} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1320. Overrides earlier properties: height, width Adds new properties: None */ .reader-donut { width: 140px; height: 140px; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 2345. Overrides earlier properties: background Adds new properties: None */ .reader-donut{background:conic-gradient( #18a957 0 calc(var(--finished)*1%), #6f3ff0 calc(var(--finished)*1%) calc(var(--reading-end)*1%), #f2b91f calc(var(--reading-end)*1%) calc(var(--risk-end)*1%), #e5485d calc(var(--risk-end)*1%) calc(var(--dropped-end)*1%), #d8d0c4 calc(var(--dropped-end)*1%) 100% )} .reader-donut:after{content:"";position:absolute;inset:22px;background:#fff;border-radius:50%} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1321. Overrides earlier properties: inset Adds new properties: None */ .reader-donut:after { inset: 27px; } .reader-donut strong,.reader-donut span{position:relative;z-index:1;text-align:center}.reader-donut strong{font-size:1.65rem}.reader-donut span{display:block;margin-top:36px;color:#6d6256;font-size:var(--app-font-size-78rem)}.reader-breakdown-list,.reader-tips-card ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}.reader-breakdown-list li{display:flex;justify-content:space-between;gap:var(--app-gap-8px);align-items:center} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2354. Overrides earlier properties: display, justify-content Adds new properties: grid-template-columns */ .reader-breakdown-list li{display:grid;grid-template-columns:auto 1fr auto;justify-content:normal} .dot{width:var(--app-width-10px);height:var(--app-height-10px);border-radius:var(--app-border-radius-50pct);display:inline-block;margin-right:7px}.dot.finished{background:#18a957}.dot.reading{background:#6f3ff0}.dot.waiting{background:#d8d0c4}.reader-activity-card dl{display:grid;gap:var(--app-gap-14px);margin:0}.reader-activity-card dl div{display:flex;justify-content:space-between;gap:var(--app-gap-16px);border-bottom:1px solid #f0ebe4;padding-bottom:12px} /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1322. Overrides earlier properties: None Adds new properties: padding */ .reader-activity-card dl div { padding: 12px 0 14px; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1526. Overrides earlier properties: display Adds new properties: align-items, grid-template-columns */ .reader-activity-card dl div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; } .reader-activity-card dt{color:#5f564b}.reader-activity-card dd{margin:0;font-weight:900} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1535. Overrides earlier properties: None Adds new properties: white-space */ .reader-activity-card dd { white-space: nowrap; } .source-row{display:grid;grid-template-columns:1fr minmax(90px,150px) 44px;gap:var(--app-gap-10px);align-items:center;margin:12px 0} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1323. Overrides earlier properties: grid-template-columns Adds new properties: None */ .source-row { grid-template-columns: 1fr minmax(140px, 220px) 54px; } .source-row div{height:var(--app-height-8px);background:#eee7dd;border-radius:var(--app-border-radius-999px);overflow:hidden} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1324. Overrides earlier properties: height Adds new properties: None */ .source-row div { height: var(--app-height-11px); } .source-row i{display:block;height:100%;background:#6f3ff0;border-radius:999px}.source-row strong{text-align:right}.reader-tips-card li{display:grid;gap:var(--app-gap-3px);border-bottom:1px solid #f0ebe4;padding-bottom:10px} /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1541. Overrides earlier properties: None Adds new properties: padding */ .reader-tips-card li { padding: 14px 0; } .reader-tips-card li span{color:#5f564b;font-size:var(--app-font-size-92rem)}.reader-tips-card{background:linear-gradient(180deg,#ffffff,#fbf8ff)}@media(max-width:1100px){.reader-metrics-enhanced{grid-template-columns:repeat(2,minmax(0,1fr))}.reader-insight-panels{grid-template-columns:1fr}.reader-hero-insight{align-items:flex-start}}@media(max-width:700px){.reader-hero-insight{flex-direction:column}.reader-metrics-enhanced{grid-template-columns:1fr}} /* Book Health overview and readers full-width analytics layout */ .book-health-shell .analytics-main, .readers-analytics-shell .analytics-main { max-width: none; width: 100%; } .readers-analytics-main .readers-shell { max-width: none; width: 100%; margin: 0; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1299. Overrides earlier properties: None Adds new properties: padding-bottom */ .readers-analytics-main .readers-shell { padding-bottom: 34px; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1494. Overrides earlier properties: max-width, width Adds new properties: None */ .readers-analytics-main .readers-shell { max-width: var(--reader-max-width-1680px); width: 100%; } .readers-analytics-main .reader-table-card, .readers-analytics-main .join-links-summary, .readers-analytics-main .readers-empty-state, .readers-analytics-main .invite-workflow-card, .readers-analytics-main .invite-success-card { width: 100%; } .book-health-main .analytics-actions { display: flex; gap: var(--app-gap-10px); flex-wrap: wrap; justify-content: flex-end; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1475. Overrides earlier properties: flex-wrap, justify-content Adds new properties: None */ .book-health-main .analytics-actions { flex-wrap: wrap; justify-content: flex-end; } .book-health-main .analytics-actions form { margin: 0; } .book-health-hero { display: grid; grid-template-columns: var(--app-width-280px) minmax(0, 1fr) var(--app-grid-320px); gap: var(--app-gap-32px); align-items: center; padding: var(--app-padding-32px); background: linear-gradient(135deg, #fbf7ff, #ffffff); border-color: #eadffd; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1262. Overrides earlier properties: gap, grid-template-columns, padding Adds new properties: min-height */ .book-health-hero { grid-template-columns: var(--app-grid-330px) minmax(0, 1fr) var(--app-grid-380px); gap: var(--app-gap-42px); padding: var(--app-padding-46px); min-height: var(--app-min-height-300px); } .health-score-block { display: grid; justify-items: center; gap: var(--app-gap-10px); border-right: 1px solid #eadfce; padding-right: var(--app-padding-28px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1268. Overrides earlier properties: padding-right Adds new properties: None */ .health-score-block { padding-right: var(--app-padding-40px); } .health-gauge { width: 178px; height: var(--app-height-112px); border-radius: var(--app-height-180px) var(--app-height-180px) 0 0; background: conic-gradient(from 270deg, #39a935 calc(var(--score) * 1.8deg), #e5e0d7 0 180deg, transparent 0); position: relative; display: grid; place-items: end center; padding-bottom: var(--app-padding-bottom-12px); box-sizing: border-box; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1269. Overrides earlier properties: height, padding-bottom, width Adds new properties: None */ .health-gauge { width: var(--app-width-220px); height: var(--app-height-138px); padding-bottom: var(--app-padding-bottom-16px); } .health-gauge::after { content: ""; position: absolute; left: var(--app-gap-24px); right: var(--app-gap-24px); bottom: 0; height: var(--app-height-72px); border-radius: var(--app-min-width-120px) var(--app-min-width-120px) 0 0; background: #fff; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1270. Overrides earlier properties: height, left, right Adds new properties: None */ .health-gauge::after { left: var(--app-width-30px); right: var(--app-width-30px); height: var(--app-height-88px); } .health-gauge strong, .health-gauge span { position: relative; z-index: 1; } .health-gauge strong { font-size: var(--app-font-size-3-2rem); line-height: .9; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1271. Overrides earlier properties: font-size Adds new properties: None */ .health-gauge strong { font-size: var(--app-font-size-4-2rem); } .health-gauge span { color: #6f665d; font-size: var(--app-font-size-1-2rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1272. Overrides earlier properties: font-size Adds new properties: None */ .health-gauge span { font-size: var(--app-font-size-1-35rem); } .health-stars { color: #39a935; letter-spacing: var(--app-gap-4px); font-size: var(--app-font-size-1-65rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1273. Overrides earlier properties: font-size, letter-spacing Adds new properties: None */ .health-stars { font-size: var(--app-font-size-2rem); letter-spacing: var(--app-5px); } .health-label { color: #39a935; font-size: var(--app-font-size-1-15rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1274. Overrides earlier properties: font-size Adds new properties: None */ .health-label { font-size: var(--app-font-size-1-35rem); } .editor-summary .eyebrow, .fix-one-card .eyebrow { text-transform: uppercase; letter-spacing: .1em; font-size: var(--app-font-size-78rem); font-weight: 900; } .editor-summary .purple, .fix-one-card .purple { color: #6f3ff0; } .editor-summary h2 { font-size: var(--app-font-size-2rem); line-height: var(--app-line-height-1-12); margin: .25rem 0 1rem; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1275. Overrides earlier properties: font-size Adds new properties: None */ .editor-summary h2 { font-size: var(--app-font-size-clamp-2rem-2-3vw-2-65rem); } .editor-summary p { color: #4f463c; font-size: var(--app-font-size-1-05rem); line-height: var(--app-line-height-1-55); max-width: var(--app-max-width-720px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1276. Overrides earlier properties: font-size, line-height Adds new properties: None */ .editor-summary p { font-size: var(--app-font-size-1-12rem); line-height: var(--app-line-height-1-65); } .fix-one-card { background: #fff; border: 1px solid #eadfce; border-radius: var(--app-border-radius-18px); padding: var(--app-padding-24px); box-shadow: 0 var(--app-gap-12px) var(--app-width-34px) #0000000d; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1277. Overrides earlier properties: border-radius, padding Adds new properties: None */ .fix-one-card { padding: var(--app-padding-30px); border-radius: var(--app-border-radius-20px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1482. Overrides earlier properties: None Adds new properties: align-self */ .fix-one-card { align-self: center; } .target-icon { width: var(--app-width-58px); height: var(--app-height-58px); border-radius: var(--app-border-radius-50pct); display: grid; place-items: center; border: 2px solid #d8c8ff; color: #6f3ff0; font-size: var(--app-font-size-2rem); margin-bottom: var(--app-margin-top-14px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1278. Overrides earlier properties: font-size, height, width Adds new properties: None */ .target-icon { width: var(--app-width-70px) ; height: var(--app-height-70px); font-size: var(--app-font-size-2-25rem); } .fix-one-card h3 { font-size: var(--app-font-size-1-25rem); margin: .35rem 0 1.2rem; line-height: var(--app-line-height-1-25); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1279. Overrides earlier properties: font-size Adds new properties: None */ .fix-one-card h3 { font-size: var(--app-font-size-1-45rem); } .fix-one-card hr { border: 0; border-top: 1px solid #eadfce; margin: var(--app-margin-18px-0); } .impact-number { color: #13964f; font-weight: 900; font-size: var(--app-font-size-2rem); margin: .3rem 0 0; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1280. Overrides earlier properties: font-size Adds new properties: None */ .impact-number { font-size: var(--app-font-size-2-5rem); } .impact-number span { font-size: var(--app-font-size-1rem); display: block; color: #13964f; } .health-highlight-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--app-gap-22px); margin: var(--app-margin-24px-0); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1281. Overrides earlier properties: gap, margin Adds new properties: None */ .health-highlight-grid { gap: var(--app-padding-26px); margin: var(--app-width-30px) 0; } .health-highlight-card { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: var(--app-gap-16px); padding: var(--app-padding-24px); } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1282. Overrides earlier properties: gap, grid-template-columns, padding Adds new properties: min-height */ .health-highlight-card { padding: var(--app-padding-30px); grid-template-columns: 66px minmax(0,1fr); gap: var(--app-gap-20px); min-height: var(--app-height-190px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1485. Overrides earlier properties: None Adds new properties: min-width */ .health-highlight-card { min-width: 0; } .highlight-icon { width: var(--app-width-48px); height: var(--app-height-48px); border-radius: var(--app-border-radius-50pct); display: grid; place-items: center; font-size: var(--app-font-size-1-7rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1283. Overrides earlier properties: font-size, height, width Adds new properties: None */ .highlight-icon { width: var(--app-width-58px); height: var(--app-height-58px); font-size: var(--app-font-size-1-95rem); } .strength-card .highlight-icon { background: #ffe2ea; color: #ff315d; } .issue-card .highlight-icon { background: #fff0dd; color: #fb7c20; } .next-card .highlight-icon { background: #dcf7e6; color: #0f8a4b; } .highlight-label { margin: var(--app-margin-0-0-10px); font-weight: 900; } .strength-card .highlight-label { color: #ff315d; } .issue-card .highlight-label { color: #fb7c20; } .next-card .highlight-label { color: #0f8a4b; } .health-highlight-card h3 { margin: var(--app-margin-0-0-10px); font-size: var(--app-font-size-1-2rem); line-height: var(--app-line-height-1-25); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1284. Overrides earlier properties: font-size Adds new properties: None */ .health-highlight-card h3 { font-size: var(--app-font-size-1-35rem); } .health-highlight-card p { color: #5f564b; line-height: var(--app-line-height-1-45); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1285. Overrides earlier properties: line-height Adds new properties: font-size */ .health-highlight-card p { font-size: var(--app-font-size-1-02rem); line-height: var(--app-line-height-1-55); } .health-highlight-card a { font-weight: 850; text-decoration: none; } .evidence-trust-card { padding: var(--app-padding-24px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1286. Overrides earlier properties: padding Adds new properties: None */ .evidence-trust-card { padding: var(--app-padding-30px); } .evidence-trust-card h2 { margin-top: 0; } .evidence-trust-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid #f0e8dc; margin-top: var(--app-margin-top-14px); } .evidence-trust-grid > div { padding: var(--app-gap-22px) var(--app-gap-24px); border-right: 1px solid #f0e8dc; min-height: var(--app-width-96px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1287. Overrides earlier properties: min-height, padding Adds new properties: None */ .evidence-trust-grid > div { padding: var(--app-padding-28px-30px); min-height: var(--app-min-width-120px); } .evidence-trust-grid > div:last-child { border-right: 0; } .evidence-trust-grid .metric-icon { display: inline-grid; place-items: center; width: var(--app-width-42px); height: var(--app-height-42px); border-radius: var(--app-border-radius-50pct); margin-right: var(--app-gap-14px); vertical-align: middle; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1289. Overrides earlier properties: height, width Adds new properties: None */ .evidence-trust-grid .metric-icon { width: var(--app-width-50px); height: var(--app-height-50px); } .metric-icon.purple { background: #f0e6ff; color: #6f3ff0; } .metric-icon.green { background: #ddf7e5; color: #0f8a4b; } .metric-icon.blue { background: #e7f0ff; color: #316bff; } .evidence-trust-grid strong { font-size: var(--app-font-size-1-35rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1288. Overrides earlier properties: font-size Adds new properties: None */ .evidence-trust-grid strong { font-size: var(--app-font-size-1-75rem); } .evidence-trust-grid p { margin: var(--app-margin-8px-0-4px); font-weight: 800; } .evidence-trust-grid small { color: #6f665d; } .explore-next-section { margin: var(--app-gap-28px) 0; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1290. Overrides earlier properties: margin Adds new properties: None */ .explore-next-section { margin: var(--app-width-34px) 0; } .explore-next-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--app-gap-18px); } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1291. Overrides earlier properties: gap, grid-template-columns Adds new properties: None */ .explore-next-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: var(--app-gap-20px); } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1457. Overrides earlier properties: grid-template-columns Adds new properties: None */ .explore-next-grid { grid-template-columns: repeat(auto-fit, minmax(var(--app-height-260px), 1fr)); } .explore-card { display: grid; grid-template-columns: var(--app-width-44px) minmax(0, 1fr) auto; gap: var(--app-gap-12px); align-items: center; border: 1px solid #eadfce; border-radius: var(--app-border-radius-16px); padding: var(--app-padding-18px); text-decoration: none; color: #242018; background: #fff; box-shadow: 0 1px 2px #00000008; } /* DUPLICATE SELECTOR — occurrence 2 of 3 Moved from original line 1292. Overrides earlier properties: align-items, grid-template-columns, padding Adds new properties: min-height */ .explore-card { grid-template-columns: var(--app-52px) minmax(0, 1fr) var(--app-gap-22px); padding: var(--app-padding-22px); min-height: var(--app-min-height-112px); align-items: center; } /* DUPLICATE SELECTOR — occurrence 3 of 3 Moved from original line 1460. Overrides earlier properties: align-items, display, grid-template-columns Adds new properties: column-gap, grid-template-areas, min-width, row-gap */ .explore-card { display: grid; grid-template-columns: var(--app-52px) minmax(0, 1fr) var(--app-padding-26px); grid-template-areas: "icon title arrow" "icon body arrow"; column-gap: var(--app-gap-16px); row-gap: var(--app-gap-4px); align-items: center; min-width: 0; } .explore-card span { width: var(--app-width-42px); height: var(--app-height-42px); border-radius: var(--app-border-radius-12px); display: grid; place-items: center; font-size: var(--app-font-size-1-4rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1293. Overrides earlier properties: font-size, height, width Adds new properties: None */ .explore-card span { width: var(--app-width-50px); height: var(--app-height-50px); font-size: var(--app-font-size-1-55rem); } .explore-card.purple span { background: #f0e6ff; color: #6f3ff0; } .explore-card.red span { background: #fff0f2; color: #ff315d; } .explore-card.orange span { background: #fff2dd; color: #fb7c20; } .explore-card.green span { background: #ddf7e5; color: #0f8a4b; } .explore-card strong { display: block; font-weight: 900; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1294. Overrides earlier properties: None Adds new properties: font-size, line-height */ .explore-card strong { font-size: var(--app-font-size-1-05rem); line-height: 1.18; } .explore-card em { display: block; font-style: normal; color: #5f564b; font-size: var(--app-font-size-9rem); line-height: var(--app-line-height-1-35); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1295. Overrides earlier properties: font-size, line-height Adds new properties: None */ .explore-card em { font-size: var(--app-font-size-95rem); line-height: var(--app-line-height-1-4); } .explore-card b { font-size: var(--app-font-size-1-3rem); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1296. Overrides earlier properties: None Adds new properties: justify-self */ .explore-card b { justify-self: end; } .book-health-note { text-align: center; color: #6f665d; } .readers-analytics-shell .readers-header { margin-top: 0; } .readers-analytics-shell .reader-metrics-grid.reader-metrics-enhanced { grid-template-columns: 1.35fr repeat(5,minmax(0,1fr)); } .readers-analytics-shell .reader-insight-panels { grid-template-columns: 1.2fr 1fr 1fr; } @media (max-width: 1300px) { .book-health-hero { grid-template-columns: 1fr; } .health-score-block { border-right: 0; border-bottom: 1px solid #eadfce; padding: 0 0 24px; } .health-highlight-grid, .evidence-trust-grid, .explore-next-grid { grid-template-columns: 1fr 1fr; } .readers-analytics-shell .reader-metrics-grid.reader-metrics-enhanced { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 760px) { .health-highlight-grid, .evidence-trust-grid, .explore-next-grid { grid-template-columns: 1fr; } .evidence-trust-grid > div { border-right: 0; border-bottom: 1px solid #f0e8dc; } .evidence-trust-grid > div:last-child { border-bottom: 0; } } /* Final analytics polish pass: spacing, hierarchy, chart weight */ .analytics-nav a.active { background: #eadbff; color: #6f3ff0; } .analytics-page-head .subtle { font-size: var(--app-font-size-1-02rem); line-height: var(--app-line-height-1-55); } .analytics-actions .secondary-button, .secondary-button, .buttonlike.secondary { min-height: var(--app-min-height-42px); padding: 10px 16px; border-radius: var(--app-border-radius-12px); } .analytics-main .card, .readers-shell .card, .side-card { border-radius: var(--bb-card-radius); border-color: var(--bb-border); box-shadow: var(--bb-shadow-soft); } .analytics-main .card { padding: var(--app-padding-24px); } .analytics-main h2 { letter-spacing: -.025em; } .analytics-main h3 { letter-spacing: -.015em; } /* Hero banners */ .hero-insight, .reader-hero-insight { min-height: 118px; padding: 34px 38px; margin: var(--app-margin-24px-0); border-radius: var(--app-border-radius-20px); } .hero-icon, .reader-hero-icon { width: var(--app-width-72px); height: var(--app-height-72px); font-size: var(--app-font-size-2-25rem); } .hero-insight h2, .reader-hero-insight h2 { font-size: var(--reader-font-size-clamp-1-85rem-2vw-2-45rem); line-height: var(--app-line-height-1-12); } .hero-insight p, .reader-hero-insight p { font-size: var(--app-font-size-1-08rem); line-height: var(--reader-line-height-1-5); } .hero-insight .eyebrow, .reader-hero-insight .hero-kicker { font-size: var(--app-font-size-82rem); letter-spacing: .14em; } /* Metric/KPI cards */ .flow-kpi-row, .understanding-kpi-row, .perception-kpi-row, .reader-metrics-grid, .reader-metrics-enhanced { margin: 22px 0 28px; } .reader-metrics-enhanced .metric-card, .reader-metrics-grid .metric-card { min-height: 126px; padding: var(--app-padding-26px); } .reader-metrics-grid .metric-card strong { font-size: var(--reader-font-size-2-45rem); } /* Book Health polish */ /* Readers page polish */ .reader-quality-card .stars, .reader-quality-card::after { content: "★★★★★"; display: block; margin-top: 12px; color: #18a55a; letter-spacing: 3px; font-size: var(--app-font-size-1-15rem); } .reader-table-card table td, .reader-table-card table th { padding: var(--app-padding-16px-14px); } .reader-progress-track, .progress-track { height: var(--app-height-10px); border-radius: var(--app-border-radius-999px); } .reader-progress-fill, .progress-fill { height: var(--app-height-10px); border-radius: var(--app-border-radius-999px); } /* Story Flow polish */ .story-layout, .understanding-layout, .perception-layout { grid-template-columns: minmax(0, 1fr) 370px; gap: var(--app-gap-28px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2965. Overrides earlier properties: gap, grid-template-columns Adds new properties: None */ .story-layout, .understanding-layout, .perception-layout { grid-template-columns: minmax(0, 1fr) var(--app-side-panel-width); gap: var(--app-content-rail-gap); } .story-side-panel, .understanding-side-panel, .perception-layout .story-side-panel { width: 370px; max-width: 370px; gap: var(--app-gap-20px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2971. Overrides earlier properties: gap, max-width, width Adds new properties: None */ .story-side-panel, .understanding-side-panel, .perception-layout .story-side-panel { width: var(--app-side-panel-width); max-width: var(--app-side-panel-width); gap: var(--app-side-panel-gap); } .flow-chart-card { padding: var(--app-padding-32px); } .timeline-card { padding: var(--app-padding-30px); } .unit-drilldown-card { padding: var(--app-padding-30px); } .story-unit-table td, .story-unit-table th { padding: 15px 12px; } /* Story Understanding polish */ .investigation-card table td, .investigation-card table th { padding: 14px 12px; } /* Reader Perception polish */ .perception-card-grid, .perception-bottom-grid { gap: var(--app-gap-22px); } /* Revision Plan polish */ .roadmap-table td, .roadmap-table th { padding: 20px 16px; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 1610. Overrides earlier properties: None Adds new properties: line-height */ .roadmap-table td, .roadmap-table th { line-height: var(--app-line-height-1-45); } .effort, .severity { padding: 6px 11px; } .impact-card, .next-step-card, .focus-heatmap-card { min-height: 170px; padding: var(--app-padding-28px); } .action-list li { padding: 13px 0; } @media (max-width: 1380px) { .story-layout, .understanding-layout, .perception-layout { grid-template-columns: minmax(0, 1fr); } .story-side-panel, .understanding-side-panel, .perception-layout .story-side-panel { position: static; width: 100%; max-width: none; } .book-health-hero { grid-template-columns: 1fr; } .health-score-block { border-right: 0; border-bottom: 1px solid var(--bb-border); padding: 0 0 28px; } } @media (max-width: 900px) { .analytics-shell { grid-template-columns: 1fr; } .analytics-sidebar { position: static; height: auto; } .analytics-main { padding: var(--app-padding-28px-18px); } .hero-insight, .reader-hero-insight { grid-template-columns: 1fr; padding: var(--app-padding-26px); } .flow-kpi-row, .understanding-kpi-row, .perception-kpi-row { grid-template-columns: 1fr 1fr; } .flow-chart { min-height: var(--app-min-height-330px); } } /* UX polish wave 2: tighten final dashboard layouts without altering flows */ .analytics-main > .analytics-page-head, .analytics-main > .hero-insight, .analytics-main > .reader-hero-insight, .analytics-main > .flow-kpi-row, .analytics-main > .understanding-kpi-row, .analytics-main > .perception-kpi-row, .analytics-main > .book-health-hero, .analytics-main > .health-highlight-grid, .analytics-main > .evidence-trust-card, .analytics-main > .explore-next-section, .analytics-main > .readers-shell, .analytics-main > .story-layout, .analytics-main > .understanding-layout, .analytics-main > .perception-layout, .analytics-main > .revision-summary-grid, .analytics-main > .revision-detail-grid, .analytics-main > .roadmap-card, .analytics-main > .revision-bottom-cta { max-width: var(--reader-max-width-1680px); margin-left: auto; margin-right: auto; } /* Book Health: prevent explore-card text from colliding and improve scanability */ .explore-card > span { grid-area: icon; } .explore-card > strong { grid-area: title; min-width: 0; } .explore-card > em { grid-area: body; min-width: 0; } .explore-card > b { grid-area: arrow; align-self: center; } .book-health-hero .editor-summary { align-self: center; } .health-highlight-card h3, .health-highlight-card p { overflow-wrap: anywhere; } /* Readers: keep current invite management behavior, but make widgets feel complete */ .reader-metrics-enhanced .metric-card strong small { font-size: var(--reader-font-size-42em); vertical-align: .1em; } .reader-table-card, .join-links-summary { border-radius: var(--app-border-radius-18px); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 3024. Overrides earlier properties: None Adds new properties: margin-bottom */ .reader-table-card, .join-links-summary { margin-bottom: var(--app-gap-lg); } .reader-management-table td, .reader-management-table th { white-space: nowrap; } .reader-management-table td:first-child, .reader-management-table th:first-child { white-space: normal; min-width: 220px; } .reader-activity-card dt, .reader-activity-card dd { min-width: 0; } .reader-sources-card .source-row { grid-template-columns: minmax(120px, 1fr) minmax(160px, 260px) 60px; } /* Story Flow: slightly stronger chart and right rail rhythm */ .flow-chart-card .section-title-row { margin-bottom: 4px; } .story-phases .phase { min-height: 54px; } /* Story Understanding: make dense evidence areas more readable */ .confusion-matrix-wrap { overflow-x: auto; padding-bottom: 4px; } .understanding-card-grid .card, .reader-perception-page .card, .revision-plan-page .card { min-width: 0; } /* Reader Perception: correct heatmap label alignment and improve bottom cards */ .emotion-heatmap-wrap, .perception-chart-card { overflow-x: auto; } .perception-bottom-grid .card { min-height: 210px; } /* Revision Plan: improve table legibility and keep bottom CTA unobtrusive */ .roadmap-table th:nth-child(2), .roadmap-table td:nth-child(2) { min-width: 250px; } .roadmap-table th:nth-child(3), .roadmap-table td:nth-child(3) { min-width: 330px; } .roadmap-table th:nth-child(6), .roadmap-table td:nth-child(6) { min-width: 160px; } @media (max-width: 1380px) { .story-layout, .understanding-layout, .perception-layout { grid-template-columns: 1fr; } .story-side-panel, .understanding-side-panel, .perception-layout .story-side-panel { width: 100%; max-width: none; } .reader-management-table td, .reader-management-table th { white-space: normal; } } /* Profile page polish + uploaded image containment */ body:has(.profile-layout-polished) main { max-width: var(--app-max-width-1120px); padding: 44px 28px; } .polished-profile-header { align-items: center; margin-bottom: var(--app-margin-bottom-28px); } .polished-profile-header h1 { font-size: var(--app-font-size-clamp-2rem-3vw-2-6rem); letter-spacing: -0.04em; margin: var(--app-margin-0-0-10px); } .polished-profile-header .buttonlike { white-space: nowrap; } .profile-layout-polished { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--app-gap-24px); align-items: start; } .profile-main-column { min-width: 0; display: grid; gap: var(--app-gap-16px); } .profile-form-polished { margin: 0; padding: var(--app-padding-28px); display: grid; gap: var(--app-gap-18px); overflow: hidden; } .profile-card-heading h2, .profile-preview-polished h2 { margin: var(--app-margin-0-0-12px); font-size: var(--app-font-size-1-5rem); letter-spacing: -0.025em; } .profile-card-heading p, .profile-preview-polished > p { margin: 0; line-height: var(--app-line-height-1-45); } .field-with-meta { display: grid; gap: var(--app-gap-8px); font-weight: 850; } .field-with-meta span { color: #5f564b; font-weight: 650; } .field-with-meta input, .field-with-meta textarea { width: 100%; box-sizing: border-box; margin: 0; } .profile-photo-field { display: grid; gap: var(--app-gap-10px); } .field-label { font-weight: 850; } .profile-photo-row { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--app-gap-18px); align-items: center; border: 1px solid #eadfce; border-radius: var(--app-border-radius-16px); padding: var(--app-padding-16px); background: #fffdf9; } .profile-photo-thumb { width: var(--app-width-112px); height: var(--app-height-112px); max-width: 112px; max-height: 112px; border-radius: var(--app-border-radius-999px); object-fit: cover; display: block; overflow: hidden; border: 1px solid #eadfce; background: #fffaf3; flex: 0 0 auto; } .profile-photo-placeholder { display: grid; place-items: center; font-size: var(--app-font-size-2-2rem); font-weight: 900; color: #242018; } .profile-upload-panel { min-width: 0; display: grid; gap: var(--app-gap-8px); } .profile-upload-panel strong { font-size: var(--app-font-size-1rem); } .profile-upload-panel p { margin: 0; line-height: var(--app-line-height-1-4); } .photo-upload-button { width: fit-content; cursor: pointer; } .photo-upload-button input { position: absolute; width: var(--app-width-1px); height: var(--app-height-1px); opacity: 0; pointer-events: none; } .photo-file-name { display: block; font-size: var(--app-font-size-9rem); overflow-wrap: anywhere; } .profile-actions { display: flex; justify-content: flex-end; align-items: center; gap: var(--app-gap-12px); margin-top: 6px; } .discard-button { background: #fff; color: #242018; border: 1px solid #eadfce; } .collapsed-profile-section { margin: 0; padding: 0; overflow: hidden; } .collapsed-profile-section summary { cursor: pointer; padding: var(--app-padding-18px-22px); font-weight: 900; } .collapsed-profile-form { display: grid; gap: var(--app-gap-14px); padding: 0 22px 22px; } .collapsed-profile-form label { display: grid; gap: var(--app-gap-7px); font-weight: 800; } .collapsed-profile-form input { width: 100%; box-sizing: border-box; margin: 0; } .profile-preview-polished { position: sticky; top: 90px; margin: 0; padding: var(--app-padding-24px); overflow: hidden; } .reader-profile-card { position: relative; overflow: hidden; margin-top: var(--app-margin-top-18px); border: 1px solid #eadfce; border-radius: var(--app-border-radius-18px); background: #fff; text-align: center; padding: 0 18px 22px; } .reader-profile-banner { height: 74px; margin: 0 -18px 0; background: linear-gradient(135deg, #f1e3ff, #fff0f4 55%, #fff8e8); } .reader-profile-avatar { width: var(--app-width-96px); height: var(--app-height-96px); max-width: 96px; max-height: 96px; border-radius: var(--app-border-radius-999px); object-fit: cover; display: block; overflow: hidden; margin: -48px auto 12px; border: 4px solid #fff; background: #fffaf3; box-shadow: 0 4px 16px rgba(36, 32, 24, .12); } .reader-profile-avatar.placeholder-avatar { display: grid; place-items: center; font-size: var(--app-font-size-2rem); font-weight: 900; } .reader-profile-card h3 { margin: var(--app-margin-8px-0-4px); font-size: var(--app-font-size-1-25rem); } .reader-role { margin: var(--app-margin-0-0-12px); color: #82786a; font-weight: 800; } .reader-preview-bio { margin: 0; color: #5f564b; line-height: var(--reader-line-height-1-5); overflow-wrap: anywhere; } .preview-help-box { margin-top: 16px; border-radius: var(--app-border-radius-14px); background: #fffaf3; border: 1px solid #eadfce; padding: var(--app-padding-14px); color: #5f564b; line-height: var(--app-line-height-1-4); font-weight: 650; } @media (max-width: 900px) { body:has(.profile-layout-polished) main { padding: var(--app-padding-28px-18px); } .polished-profile-header { align-items: flex-start; } .profile-layout-polished { grid-template-columns: 1fr; } .profile-preview-polished { position: static; } .profile-photo-row { grid-template-columns: 1fr; justify-items: start; } .profile-actions { display: grid; grid-template-columns: 1fr; } .profile-actions .buttonlike, .profile-actions button { width: 100%; box-sizing: border-box; text-align: center; } } /* Reader Perception: character/relationship sentiment cards + cleaner heatmap */ .sentiment-insight-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--app-gap-18px); margin-bottom: 18px; } .sentiment-mini-card { display: grid; gap: var(--app-gap-14px); } .compact-title-row { align-items: center; margin-bottom: 2px; } .compact-title-row h2 { margin: 0; } .sentiment-tabs { display: flex; gap: var(--app-gap-8px); flex-wrap: wrap; } .sentiment-tabs span { border: 1px solid #f1e8dc; border-radius: var(--app-border-radius-8px); padding: var(--app-padding-8px-14px); font-size: var(--app-font-size-82rem); font-weight: 850; color: #4f463c; background: #fff; } .sentiment-tabs span.active { color: #6f3ff0; background: #f4edff; border-color: #eadfff; } .sentiment-trend-list { display: grid; gap: var(--app-gap-12px); } .sentiment-trend-row { display: grid; grid-template-columns: 34px minmax(110px, 1fr) minmax(120px, 1.2fr) 56px; gap: var(--app-gap-10px); align-items: center; } .relationship-trend-row { grid-template-columns: minmax(145px, 1fr) minmax(120px, 1.1fr) 56px 80px; } .sentiment-trend-row b { font-size: var(--app-font-size-92rem); color: #242018; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sentiment-trend-row svg { width: 100%; height: 34px; overflow: visible; } .sentiment-trend-row polyline { fill: none; stroke: #18a55a; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; } .sentiment-trend-row:has(.score-negative) polyline { stroke: #ff4f68; } .sentiment-trend-row:has(.score-mixed) polyline { stroke: #ffbd60; } .character-avatar { width: var(--app-width-30px); height: var(--app-height-30px); border-radius: var(--app-border-radius-999px); display: grid; place-items: center; font-weight: 950; color: #fff; background: #6f3ff0; box-shadow: inset 0 0 0 2px rgba(255,255,255,.45); } .avatar-positive { background: #18a55a; } .avatar-negative { background: #ff4f68; } .avatar-mixed { background: #ffad7a; } .score-positive { color: #18a55a; } .score-negative { color: #e02d4f; } .score-mixed { color: #a56a00; } .sentiment-trend-row strong { font-size: var(--app-font-size-92rem); font-weight: 950; text-align: right; } .sentiment-trend-row em { font-style: normal; color: #6f665d; font-weight: 800; font-size: var(--app-font-size-85rem); text-align: right; } .card-link { color: #6f3ff0; font-weight: 900; text-decoration: none; } .emotion-card { overflow: hidden; } .emotion-heatmap-wrap { width: 100%; overflow-x: auto; padding-bottom: var(--app-padding-bottom-6px); } .heatmap-corner { min-width: var(--app-min-width-92px); } .heat-row-label { min-width: var(--app-min-width-92px); white-space: nowrap; text-align: left; font-size: var(--app-font-size-94rem); color: #4f463c; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2270. Overrides earlier properties: min-width Adds new properties: overflow, text-overflow */ .heat-row-label { min-width: 140px; overflow: hidden; text-overflow: ellipsis; } .heatmap-legend span { display: inline-flex; align-items: center; gap: var(--app-gap-7px); font-size: var(--app-font-size-88rem); } @media(max-width:1380px){ .sentiment-insight-grid { grid-template-columns: 1fr; } } @media(max-width:720px){ .sentiment-trend-row, .relationship-trend-row { grid-template-columns: 30px minmax(0,1fr) 64px; } .relationship-trend-row { grid-template-columns: minmax(0,1fr) 64px; } .sentiment-trend-row svg, .sentiment-trend-row em { display: none; } } /* Book Health empty/pre-analysis state */ .health-score-block.pending .health-gauge, .health-gauge.pending-gauge { background: conic-gradient(from 270deg, #d8d2c9 0 180deg, transparent 0); } .health-score-block.pending .health-gauge::after, .health-gauge.pending-gauge::after { background: #fff; } .health-score-block.pending .health-gauge strong, .health-score-block.pending .health-label, .muted-stars { color: #8b8177; } .health-score-block.pending .health-gauge strong { font-size: var(--app-font-size-4-8rem); } .health-stars.muted-stars { color: #d8d2c9; } /* Story Flow empty-state and pace UX refinements */ .flow-empty-hero { background: linear-gradient(135deg, #fff8f5, #fff) !important; } .flow-kpi-empty strong { color: var(--ink, #241f1a); } .flow-chart-empty { position: relative; opacity: 1; } .flow-chart-empty .flow-chapter { cursor: default; } .flow-chart-empty .flow-bar span { background: #e8e1d7 !important; } .flow-chart-empty .flow-count, .timeline-empty .timeline-cell { color: #7d7266; } .flow-empty-message { position: absolute; inset: 34% 18% auto 18%; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: var(--app-gap-4px); padding: 16px 20px; border: 1px solid #eadfce; border-radius: var(--app-border-radius-18px); background: rgba(255,255,255,.92); box-shadow: 0 10px 30px rgba(43,32,20,.08); text-align: center; } .flow-empty-message strong, .story-empty-card strong { font-size: var(--app-font-size-1-05rem); } .flow-empty-message span, .story-empty-card p, .empty-helper { color: #7d7266; } .story-empty-card { padding: var(--app-padding-22px); border: 1px dashed #d9ccbb; border-radius: var(--app-border-radius-18px); background: #fffaf4; } .story-empty-card p { max-width: 640px; margin-bottom: 0; } .story-unit-table th:nth-child(4), .story-unit-table th:nth-child(5), .story-unit-table td:nth-child(4), .story-unit-table td:nth-child(5) { white-space: nowrap; } .empty-inline-card { margin-top: var(--app-margin-top-18px); padding: var(--app-padding-14px-16px); border-radius: var(--app-border-radius-14px); background: #faf7f2; border: 1px solid #eee4d8; display: grid; gap: var(--app-gap-4px); color: #4f473f; } .empty-inline-card strong { color: #211d19; } .empty-inline-card span { color: #7d7268; } .empty-card-copy { margin-top: var(--app-margin-top-14px); line-height: var(--app-line-height-1-45); } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2268. Overrides earlier properties: None Adds new properties: color, margin */ .empty-card-copy { color: #6f665d; margin: 4px 0; } .chart-empty-state { min-height: var(--app-min-height-150px); border: 1px dashed #e4d8c9; border-radius: var(--app-border-radius-14px); background: #fbfaf7; display: flex; align-items: center; justify-content: center; text-align: center; color: #84786f; padding: var(--app-padding-20px); } .empty-panel-state { padding: var(--app-padding-22px); border: 1px dashed #e4d8c9; border-radius: var(--app-border-radius-14px); background: #fbfaf7; display: grid; gap: var(--app-gap-6px); color: #7d7268; } .empty-panel-state strong { color: #211d19; } /* Reader Perception derived-data tabs */ .sentiment-tabs button { border: 1px solid #f1e8dc; border-radius: var(--app-border-radius-8px); padding: var(--app-padding-8px-14px); font-size: var(--app-font-size-82rem); font-weight: 850; color: #4f463c; background: #fff; cursor: pointer; } .sentiment-tabs button.active { color: #6f3ff0; background: #f4edff; border-color: #eadfff; } .sentiment-tab-panel { display: none; } .sentiment-tab-panel.active { display: block; } .entity-breakdown-list, .entity-driver-list { display: grid; gap: var(--app-gap-10px); } .entity-breakdown-list > div, .entity-driver-list > div { display: grid; grid-template-columns: minmax(120px, 1fr) repeat(3, auto) auto; gap: var(--app-gap-10px); align-items: center; border-bottom: 1px solid #f1e8dc; padding: var(--app-padding-8px-0); } .entity-driver-list > div { grid-template-columns: minmax(120px, 1fr) repeat(3, auto); } .entity-breakdown-list > div:last-child, .entity-driver-list > div:last-child { border-bottom: 0; } .entity-breakdown-list b, .entity-driver-list b { color: #242018; } .entity-breakdown-list span, .entity-driver-list span { color: #6f665d; font-size: var(--app-font-size-88rem); font-weight: 750; } .entity-breakdown-list strong { color: #6f3ff0; font-size: var(--app-font-size-88rem); } @media(max-width:1180px){.emotion-heatmap{grid-template-columns:120px repeat(var(--chapter-count,22), 28px)}.heat-row-label{min-width:120px}} /* Reader Perception completion pass */ .reader-perception-page .derived-note { color: var(--muted, #667085); font-size: var(--reader-font-size-0-78rem); font-weight: 600; } .reader-perception-page .emotion-heatmap { display: grid; grid-template-columns: minmax(88px, auto) repeat(var(--chapter-count), minmax(24px, 1fr)); gap: var(--app-gap-6px); align-items: center; min-width: max-content; } .reader-perception-page .heat-row-label { position: sticky; left: 0; z-index: 2; background: var(--card-bg, #fff); text-align: left; white-space: nowrap; padding-right: 10px; font-weight: 600; } .reader-perception-page .heat-col-label { text-align: center; font-size: var(--reader-font-size-0-72rem); color: var(--muted, #667085); } .reader-perception-page .heat-cell { width: 100%; min-width: 24px; aspect-ratio: 1 / 1; border-radius: var(--app-border-radius-5px); } .reader-perception-page .emotion-heatmap-wrap { overflow-x: auto; padding-bottom: var(--app-padding-bottom-6px); } .reader-perception-page .empty-card-copy { color: var(--muted, #667085); line-height: var(--reader-line-height-1-5); } /* Revision Plan evidence-first empty state */ .revision-empty-hero { background: #faf8f5; border-color: #e7dfd4; } .revision-empty-card { min-height: 240px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: var(--app-gap-10px); color: #756d63; } .revision-empty-card h3 { margin: 0; color: #28241f; } .revision-empty-card p { max-width: 560px; margin: var(--app-margin-0-0-8px); } .revision-empty-icon { width: var(--app-width-48px); height: var(--app-height-48px); border-radius: var(--app-border-radius-50pct); display: grid; place-items: center; background: #f3ecff; color: #6f3ff5; font-size: var(--app-font-size-24px); } .compact-empty-state { min-height: var(--app-min-height-150px); display: grid; place-items: center; text-align: center; color: #8a8177; background: #fbfaf8; border: 1px dashed #ded5ca; border-radius: var(--app-border-radius-12px); padding: var(--app-padding-20px); } .source-pill { display: inline-block; padding: var(--app-padding-4px-8px); border-radius: var(--app-border-radius-999px); background: #f2edff; color: #6336df; font-size: var(--app-font-size-12px); font-weight: 700; white-space: nowrap; } .focus-empty { background: #ece7df !important; } .muted-value { color: #8b8379 !important; } .empty-inline-copy { margin: 12px 0 0; color: #8a8177; font-size: var(--app-font-size-13px); } .coverage-neutral { background: #f0ece6; color: #6f675e; border-radius: var(--app-border-radius-999px); padding: var(--app-padding-4px-8px); font-style: normal; font-size: var(--app-font-size-12px); } .analytics-actions button:disabled { opacity: .45; cursor: not-allowed; } .theme-blue{background:#2f80ed}.theme-teal{background:#16a6a1}.theme-gold{background:#d9a400} /* Beta Readers: lifecycle statuses and derived pages-read activity */ .status-at-risk{background:#fff0bf;color:#875d00} .status-dropped{background:#ffe1e5;color:#b4233f} .reads-by-day-card{grid-column:span 1} .reader-card-title-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px} .reader-card-title-row span{color:#82786a;font-size:var(--app-font-size-82rem);font-weight:700} .reads-by-day-chart{height:var(--app-height-138px);display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:var(--app-gap-7px);align-items:end;padding:8px 2px 0} .reads-day{height:100%;display:grid;grid-template-rows:var(--app-gap-20px) 1fr var(--app-gap-20px);gap:var(--app-gap-4px);align-items:end;text-align:center;min-width:0} .reads-day strong{font-size:var(--app-font-size-72rem);color:#4e463e;opacity:0;transition:opacity .15s ease} .reads-day:hover strong{opacity:1} .reads-bar-track{height:var(--app-height-88px);display:flex;align-items:flex-end;justify-content:center;background:#f5f0e8;border-radius:var(--app-border-radius-6px);overflow:hidden} .reads-bar-track i{display:block;width:100%;min-height:0;background:linear-gradient(180deg,#20b86f,#a8e9c5);border-radius:6px 6px 0 0} .reads-day span{font-size:var(--app-font-size-68rem);color:#82786a;white-space:nowrap;overflow:hidden;text-overflow:clip} .dot.at-risk{background:#f2b91f} .dot.dropped{background:#e5485d} .reader-breakdown-list li .dot{margin-right:0} tr[hidden]{display:none} @media(max-width:700px){.reads-by-day-chart{gap:3px}.reads-day span{font-size:.58rem}.reader-card-title-row{align-items:flex-start;flex-direction:column}} /* Beta Readers: keep donut and legend synchronized and center the total cleanly */ .reader-breakdown-card .reader-donut{ width:132px; height:132px; margin:var(--app-gap-4px) auto var(--app-gap-18px); } .reader-breakdown-card .reader-donut:after{ inset:28px; } .reader-breakdown-card .reader-donut-center{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--app-gap-2px); line-height:var(--app-line-height-1); text-align:center; } .reader-breakdown-card .reader-donut-center strong{ font-size:var(--app-font-size-1-8rem); line-height:var(--app-line-height-1); margin:0; } .reader-breakdown-card .reader-donut-center span{ display:block; margin:0; color:#6d6256; font-size:var(--app-font-size-78rem); line-height:var(--reader-line-height-1-2); } .reader-breakdown-card .reader-breakdown-list{ width:100%; gap:var(--reader-gap-9px); } .reader-breakdown-card .reader-breakdown-list li{ display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:center; column-gap:10px; } .reader-breakdown-card .reader-breakdown-list li>span:nth-child(2){ min-width:0; } .reader-breakdown-card .reader-breakdown-list strong{ min-width:1.5ch; text-align:right; font-variant-numeric:tabular-nums; } .health-state-indicator{width:var(--app-width-112px);height:var(--app-height-112px);border-radius:var(--app-border-radius-50pct);display:grid;place-items:center;background:#eef1f5;border:10px solid #d7dce3;margin:auto}.health-state-indicator span{width:var(--app-width-48px);height:var(--app-height-48px);border-radius:var(--app-border-radius-50pct);background:#aeb7c2}.health-state-indicator.strong{border-color:#b7e2c7;background:#eefaf2}.health-state-indicator.strong span{background:#28a866}.health-state-indicator.attention{border-color:#f0d68a;background:#fff9e8}.health-state-indicator.attention span{background:#d49b13}.health-state-indicator.struggling{border-color:#efb1b1;background:#fff1f1}.health-state-indicator.struggling span{background:#d94a4a}.health-state-indicator.pending span{background:#aeb7c2} /* Analytics evidence deep-dive drawer */ .evidence-link:hover{text-decoration:underline}.evidence-actions{display:flex;gap:var(--app-gap-14px);flex-wrap:wrap;margin-top:10px}.evidence-drawer{position:fixed;inset:0;z-index:1200;pointer-events:none}.evidence-drawer.open{pointer-events:auto}.evidence-drawer-backdrop{position:absolute;inset:0;background:rgba(24,22,35,.34);opacity:0;transition:opacity .2s}.evidence-drawer.open .evidence-drawer-backdrop{opacity:1}.evidence-drawer-panel{position:absolute;top:0;right:0;height:100%;width:min(540px,94vw);background:#fff;box-shadow:-18px 0 50px rgba(25,22,45,.18);transform:translateX(105%);transition:transform .24s ease;display:flex;flex-direction:column}.evidence-drawer.open .evidence-drawer-panel{transform:translateX(0)}.evidence-drawer-head{padding:var(--app-gap-24px) var(--app-padding-26px) var(--app-gap-18px);border-bottom:1px solid #ebe8f2;display:flex;justify-content:space-between;gap:var(--app-gap-20px)}.evidence-drawer-head h2{margin:0 0 5px}.evidence-drawer-head p{margin:0;color:#777185}.evidence-drawer-close{border:0;background:#f3f0f8;width:var(--app-width-36px);height:var(--app-height-36px);border-radius:var(--app-border-radius-50pct);font-size:var(--app-font-size-22px);cursor:pointer}.evidence-drawer-body{padding:var(--app-gap-20px) var(--app-padding-26px);overflow:auto;display:grid;gap:var(--app-gap-14px)}.evidence-drawer-footer{padding:16px 26px;border-top:1px solid #ebe8f2}.evidence-comment-card{border:1px solid #e9e5f0;border-radius:var(--app-border-radius-14px);padding:var(--app-padding-16px);background:#fff}.evidence-comment-head{display:flex;justify-content:space-between;gap:var(--app-gap-12px);color:#716b7c;font-size:.86rem}.evidence-comment-head strong{color:#2b2732}.evidence-comment-card blockquote{margin:var(--app-margin-12px-0);border-left:3px solid #8b63e6;padding-left:12px;line-height:1.5}.evidence-comment-card a{font-weight:700;color:#6d43d8}.evidence-labels{display:flex;gap:var(--app-gap-6px);flex-wrap:wrap;margin:8px 0 12px}.evidence-labels span{background:#f3effc;border-radius:var(--app-border-radius-999px);padding:var(--app-padding-4px-8px);font-size:var(--app-font-size-75rem);color:#6845b7}.evidence-empty{padding:30px 12px;text-align:center;color:#766f7e}.heat-cell[data-evidence],.matrix-cell[data-evidence]{cursor:pointer;outline-offset:2px}.heat-cell[data-evidence]:hover,.matrix-cell[data-evidence]:hover{outline:2px solid #6d43d8} /* Reader Perception: stacked sentiment bars with emotional-intensity line */ .sentiment-column:hover, .sentiment-column:focus, .sentiment-column:active { background: transparent; color: inherit; box-shadow: none; transform: none; } .sentiment-column:focus-visible .sentiment-stack { outline: 3px solid rgba(111, 63, 240, .35); outline-offset: 3px; } .sentiment-intensity-line { position: absolute; z-index: 2; pointer-events: none; left: calc(22px + 23px); right: calc(22px + 23px); top: 42px; height: var(--app-height-260px); width: calc(100% - 90px); overflow: visible; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2525. Overrides earlier properties: z-index Adds new properties: None */ .sentiment-intensity-line { z-index: 5; } .sentiment-intensity-line polyline { fill: none; stroke: #6f3ff0; stroke-width: 4; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2529. Overrides earlier properties: stroke-width Adds new properties: None */ .sentiment-intensity-line polyline { stroke-width: 3; } .sentiment-intensity-line circle { fill: #6f3ff0; stroke: #fff; stroke-width: 2; } /* DUPLICATE SELECTOR — occurrence 2 of 2 Moved from original line 2533. Overrides earlier properties: stroke-width Adds new properties: r */ .sentiment-intensity-line circle { r: 4px; stroke-width: 1.5; } @media (max-width: 720px) { .sentiment-column { grid-template-rows: 170px 24px; min-width: 38px; } .sentiment-stack { width: var(--app-width-28px); height: var(--app-height-170px); } .sentiment-intensity-line { left: calc(18px + 19px); right: calc(18px + 19px); top: 34px; height: var(--app-height-170px); width: calc(100% - 74px); } } /* Reader Perception: final emotional-intensity overlay polish */ /* Home dashboard: full-width layout, first-login profile onboarding, and author preview */ body:has(.home-author-shell) main{max-width:none;padding:0} .home-author-shell{display:block;min-height:calc(100vh - 56px);background:linear-gradient(115deg,#fffdf9 0%,#faf7f1 55%,#f7efe6 100%)} .home-author-main{max-width:1320px;margin:var(--app-margin-0-auto);padding:44px clamp(28px,5vw,72px) 42px} .home-dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:var(--app-gap-22px);align-items:start} .home-setup-card{margin:0;min-width:0} .setup-card-heading-row{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--app-gap-20px)} .setup-card-heading-row h2{margin:0 0 8px} .setup-card-heading-row p{margin:0} .setup-card-heading-row .buttonlike{white-space:nowrap} .setup-steps-five{grid-template-columns:repeat(5,minmax(0,1fr))} .setup-steps-five .setup-step{padding:0 8px} .setup-steps-five .setup-step:not(:last-child):after{left:calc(50% + 32px);right:calc(-50% + 32px)} .setup-steps-five .setup-step strong{font-size:var(--app-font-size-92rem)} .setup-steps-five .setup-step em{font-size:.82rem} .home-profile-preview{margin:0;padding:var(--app-padding-22px);overflow:hidden} .home-profile-preview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--app-gap-14px)} .home-profile-preview-heading h2{font-size:var(--app-font-size-1-25rem);margin:var(--app-margin-0-0-7px);letter-spacing:-.025em} .home-profile-preview-heading p{font-size:var(--app-font-size-92rem);line-height:var(--app-line-height-1-4);margin:0} .home-profile-preview-heading a{font-weight:800;text-decoration:none;white-space:nowrap} .home-reader-profile-card{margin-top:16px} .home-reader-profile-card .reader-profile-banner{height:62px} .home-reader-profile-card .reader-profile-avatar{width:82px;height:82px;max-width:82px;max-height:82px;margin-top:-41px} .home-reader-profile-card h3{font-size:1.15rem} .home-reader-profile-card .reader-preview-bio{font-size:var(--app-font-size-92rem)} .home-profile-cta{display:block;text-align:center;margin-top:var(--app-margin-top-14px);padding:var(--app-padding-11px-12px);border-radius:var(--app-border-radius-11px);background:#f0e6ff;color:#6f3ff0;text-decoration:none;font-weight:850} .home-author-main .home-section{margin-top:30px} @media(max-width:1120px){.home-dashboard-grid{grid-template-columns:1fr}.home-profile-preview{max-width:none}.setup-steps-five{grid-template-columns:repeat(5,minmax(120px,1fr));overflow-x:auto;padding-bottom:8px}} @media(max-width:760px){.home-author-main{padding:var(--app-padding-28px-18px)}.setup-card-heading-row{display:grid}.setup-card-heading-row .buttonlike{width:100%;box-sizing:border-box;text-align:center}.home-dashboard-grid .setup-steps,.home-dashboard-grid .setup-steps-five{grid-template-columns:1fr;overflow:visible}.home-dashboard-grid .setup-step:not(:last-child):after{display:none}.home-section .section-heading-row{align-items:flex-start}.home-section .section-heading-row .buttonlike{font-size:var(--app-font-size-88rem)}} /* Pre-analytics manuscript flow: full-width, sidebar-free onboarding pages */ .author-shell-no-sidebar{grid-template-columns:minmax(0,1fr)} .author-shell-no-sidebar>.author-main{max-width:1180px;margin:var(--app-margin-0-auto);width:100%} /* Keep the create-beta step within a typical desktop viewport. */ .create-beta-shell>.author-main{padding-top:28px;padding-bottom:18px} .create-beta-shell .create-beta-header h1{margin-top:0} .create-beta-shell .setup-step span{width:var(--app-width-44px);height:44px} .create-beta-shell .create-beta-layout{margin:0 0 14px;gap:var(--app-gap-16px);grid-template-columns:280px minmax(0,1fr)} .create-beta-shell .trust-card{padding:var(--app-gap-20px)} .create-beta-shell .trust-card h3{margin-bottom:14px} .create-beta-shell .trust-item{margin-bottom:var(--app-margin-bottom-12px);gap:var(--app-gap-2px);line-height:1.3} .create-beta-shell .trust-card a{margin-top:2px} .create-beta-shell .create-beta-card{padding:18px 22px} .create-beta-shell .upload-form.create-upload-form{gap:10px} .create-beta-shell .dropzone{padding:18px} .create-beta-shell .cover-dropzone{padding:13px} .create-beta-shell .dropzone-inner{gap:5px} .create-beta-shell .dropzone-inner:before{font-size:1.55rem} .create-beta-shell .dropzone-inner em{padding:8px 16px} .create-beta-shell .upload-form.create-upload-form input{margin-top:5px} .create-beta-shell .privacy-footer{margin-top:10px;padding-top:12px} @media(max-width:980px){ .author-shell-no-sidebar>.author-main{max-width:none} .create-beta-shell .create-beta-layout{grid-template-columns:1fr} } /* Invite-individuals form balance */ .invite-reader-details-grid{ grid-template-columns:minmax(300px,.9fr) minmax(380px,1.1fr); gap:var(--app-gap-20px); align-items:stretch; } .invite-reader-details-grid .invite-form-block{ display:flex; flex-direction:column; min-width:0; padding:var(--app-padding-20px-22px); } .invite-reader-details-grid .invite-specific-form, .invite-reader-details-grid .invite-bulk-form{ flex:1; } .invite-reader-details-grid .invite-one-form{ grid-template-rows:auto auto 1fr auto; } .invite-reader-details-grid .invite-one-form button{ align-self:end; } .invite-reader-details-grid .invite-bulk-form{ grid-template-rows:1fr auto auto; } .invite-reader-details-grid .invite-bulk-form textarea{ min-height:var(--reader-min-height-128px); resize:vertical; } .invite-reader-details-grid button{ width:100%; } @media(max-width:900px){ .invite-reader-details-grid{grid-template-columns:1fr;} } /* Reader invitation: make the author identity part of the welcome experience. */ .welcome-author{display:flex;align-items:center;gap:var(--app-gap-18px);margin:28px 0 24px;padding:var(--app-padding-18px-20px);border:1px solid #eadfce;border-radius:var(--app-border-radius-18px);background:linear-gradient(135deg,#faf0ff 0%,#fff8ef 100%)} .welcome-author-photo{width:76px;height:76px;flex:0 0 76px;border-radius:var(--app-border-radius-50pct);object-fit:cover;border:var(--app-gap-4px) solid #fff;box-shadow:0 var(--app-5px) var(--app-gap-16px) #2a1d4218} .welcome-author-placeholder{display:grid;place-items:center;background:#f7f0e6;color:#242018;font-size:var(--app-font-size-2rem);font-weight:800} .welcome-author-copy{min-width:0} .welcome-author-label{display:block;color:#7b6f62;font-size:var(--app-font-size-75rem);font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin-bottom:3px} .welcome-author-copy h2{margin:0 0 5px;font-size:1.35rem} .welcome-author-copy p{margin:0;color:#62594f;line-height:1.5} .welcome-thanks{margin-top:26px!important} /* Comments are anchored to stable chapter/paragraph locations, not device pages. */ .recent-comment-link{display:block;color:#242018;text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s} .recent-comment-link:hover{border-color:#cbb8e8;box-shadow:0 5px 14px #35264b12;transform:translateY(-1px)} .comment-context{display:block;margin-top:var(--app-margin-top-8px);color:#82786a;line-height:var(--app-line-height-1-4);font-style:italic} #selectedParaLabel{line-height:1.45} @media(max-width:800px){ .welcome-author{align-items:flex-start;padding:16px} .welcome-author-photo{width:62px;height:62px;flex-basis:62px} .welcome-author-copy h2{font-size:var(--app-font-size-1-15rem) !important;margin:0 0 4px!important} .welcome-author-copy p{font-size:var(--app-font-size-95rem) !important;line-height:1.45!important} } /* Reader guidance and invitation preview */ .review-preview-actions{display:flex;gap:var(--app-gap-10px);flex-wrap:wrap;justify-content:flex-end} .review-side-stack{display:grid;gap:var(--app-gap-18px);align-items:start} .reader-guidance-card{padding:var(--app-padding-24px);border-radius:18px} .reader-guidance-card h3{font-size:var(--app-font-size-1-2rem);margin:0 0 8px} .reader-guidance-card form{display:grid;gap:var(--app-gap-10px);margin-top:16px} .reader-guidance-card label{font-weight:800} .reader-guidance-card textarea{min-height:var(--app-min-height-150px);resize:vertical;line-height:1.45} .reader-guidance-card small{color:#82786a} .reader-guidance-card button{width:100%;margin-top:2px} .guidance-saved{display:block;text-align:center;color:#16743a;font-weight:800;font-size:.9rem} .invite-preview-notice{margin:var(--app-gap-20px) auto 0;padding:var(--app-padding-10px-14px);width:fit-content;border-radius:var(--app-border-radius-999px);background:#f0e4ff;color:#6931df;font-weight:800;font-size:.9rem} .preview-disabled{pointer-events:none;cursor:default;opacity:.8} @media(max-width:900px){.review-preview-actions{width:100%;justify-content:stretch}.review-preview-actions .buttonlike{flex:1;text-align:center}} /* Review page rebalance: make reader guidance a primary, visible setup task */ .reader-guidance-card-main{margin:var(--app-margin-0-0-20px);padding:var(--app-padding-24px-26px);border-radius:18px} .reader-guidance-card-main .reader-guidance-heading{display:flex;justify-content:space-between;gap:var(--app-gap-20px);align-items:flex-start;margin-bottom:16px} .reader-guidance-card-main .eyebrow{display:block;margin-bottom:6px;color:var(--brand);font-size:var(--app-font-size-78rem);font-weight:900;letter-spacing:.12em} .reader-guidance-card-main h2{margin:var(--app-margin-0-0-7px);font-size:var(--app-font-size-1-45rem);letter-spacing:-.025em} .reader-guidance-card-main p{max-width:var(--app-max-width-720px);margin:0;line-height:1.45} .reader-guidance-card-main form{display:grid;gap:var(--reader-gap-9px);margin:0} .reader-guidance-card-main label{font-weight:800} .reader-guidance-card-main textarea{min-height:132px;resize:vertical;line-height:1.48} .reader-guidance-footer{display:flex;align-items:center;justify-content:space-between;gap:16px} .reader-guidance-footer small{color:#82786a} .reader-guidance-save{display:flex;align-items:center;justify-content:flex-end;gap:12px} .reader-guidance-save .guidance-saved{margin:0;white-space:nowrap} .reader-guidance-save button{width:auto;min-width:190px;margin:0} @media(max-width:700px){.reader-guidance-footer{align-items:stretch;flex-direction:column}.reader-guidance-save{align-items:stretch;flex-direction:column}.reader-guidance-save button{width:100%}} /* Persistent escape hatch for manuscript previews opened from beta setup. */ .preview-return-button { position: fixed; top: 78px; left: 50%; transform: translateX(-50%); z-index: 1200; display: inline-flex; align-items: center; justify-content: center; min-height: var(--app-min-height-42px); padding: 0.65rem 1rem; border: 1px solid var(--border, #e8dcc8); border-radius: var(--app-border-radius-999px); background: #211d17; color: #fff; font-weight: 700; text-decoration: none; box-shadow: 0 8px 24px rgba(33, 29, 23, 0.18); } .preview-return-button:hover { transform: translateX(-50%) translateY(-1px); } @media (max-width: 760px) { .preview-return-button { top: 64px; width: calc(100% - 2rem); max-width: 320px; } } /* Beta setup: reader-to-reader comment visibility */ .reader-comment-visibility-option { display: flex; align-items: flex-start; gap: 0.7rem; margin-top: var(--app-margin-top-1rem); font-weight: 700; line-height: var(--app-line-height-1-35); cursor: pointer; } .reader-comment-visibility-option input[type="checkbox"] { width: 1.1rem; height: 1.1rem; margin: 0.12rem 0 0; flex: 0 0 auto; accent-color: var(--purple, #6c3df4); } .reader-comment-visibility-help { margin: 0.35rem 0 0 1.8rem; color: var(--muted, #7f7568); font-size: var(--reader-font-size-0-9rem); line-height: var(--app-line-height-1-4); } .reader-comments-note { margin-top: -0.35rem; } /* ========================================================= SHARED APPLICATION DESIGN SYSTEM — AUTHORITATIVE LAYER --------------------------------------------------------- This final layer centralizes application typography, spacing, controls, tables, charts, side rails, and reader sizing. Values intentionally reproduce the current interface. Tune density from these tokens before adding page exceptions. ========================================================= */ /* Design tokens moved to the top of this file. */ /* ---------- Shared page structure ---------- */ .app-page { width: 100%; max-width: none; padding: var(--app-page-padding-y) var(--app-page-padding-x); } .app-page-header { margin-bottom: var(--app-page-header-gap); } .app-page-title { font-size: var(--app-font-size-page-title); line-height: var(--app-line-height-heading); letter-spacing: -.035em; } .app-page-subtitle { font-size: var(--app-font-size-page-subtitle); line-height: var(--app-line-height-page-subtitle); } .app-page-actions { display: flex; align-items: center; gap: var(--app-gap-sm); } /* ---------- Shared controls ---------- */ .app-button, .analytics-main .primary-button, .analytics-main .secondary-button { min-height: var(--app-button-min-height); padding: var(--app-button-padding-y) var(--app-button-padding-x); border-radius: var(--app-button-radius); } /* ---------- Shared cards ---------- */ .app-card { border-radius: var(--app-card-radius); border-color: var(--app-color-border); box-shadow: var(--app-shadow-card); } .analytics-main .app-card { padding: var(--app-card-padding); } .app-card-large { padding: var(--app-card-padding-large); } .app-card-compact { padding: var(--app-card-padding-compact); } .app-section-header { display: flex; justify-content: space-between; align-items: center; gap: var(--app-gap-md); } /* ---------- Shared typography ---------- */ .app-section-title, .analytics-main .app-section-title, .analytics-main .section-title-row > h2, .analytics-main .explore-next-section > h2, .analytics-main .readers-header h1 { font-size: var(--app-font-size-section-title); line-height: var(--app-line-height-heading); margin-bottom: var(--app-heading-margin-bottom); } .app-card-title, .analytics-main .app-card-title, .analytics-main .side-card h3, .analytics-main .reader-insight-card h3, .analytics-main .health-highlight-card h3, .analytics-main .meaning-card h3, .analytics-main .revision-summary-grid h3, .analytics-main .revision-detail-grid h3, .analytics-main .perception-chart-card h3, .analytics-main .timeline-card h3, .analytics-main .unit-drilldown-card h3, .analytics-main .investigation-card h3, .analytics-main .understanding-heatmap-card h3, .analytics-main .roadmap-card h3, .analytics-main .theme-card h3, .analytics-main .coverage-card h3, .analytics-main .priorities-card h3, .analytics-main .actions-card h3 { font-size: var(--app-font-size-card-title); line-height: var(--app-line-height-heading); margin-bottom: var(--app-heading-margin-bottom); } .app-body-copy, .analytics-main .health-highlight-card p, .analytics-main .editor-summary p, .analytics-main .reader-comment-item p, .analytics-main .meaning-card p, .analytics-main .empty-card-copy, .analytics-main .reader-insight-card p, .analytics-main .side-card p { font-size: var(--app-font-size-body); line-height: var(--app-line-height-body); } .app-supporting-copy, .analytics-main .flow-count, .analytics-main .moment-labels, .analytics-main .explore-card em, .analytics-main .subtle, .analytics-main .derived-note, .analytics-main .tip-line, .analytics-main .empty-helper { font-size: var(--app-font-size-supporting); line-height: var(--app-line-height-compact); } .app-label, .analytics-main .health-label, .analytics-main .highlight-label, .analytics-main .flow-label, .analytics-main .metric-card span, /*.analytics-main .reader-status,*/ /*.analytics-main .severity,*/ /*.analytics-main .effort,*/ .analytics-main .priority-badge, .analytics-main .source-pill { font-size: var(--app-font-size-label); line-height: var(--app-line-height-compact); } .app-small-copy, .analytics-main .workflow-kicker, .analytics-main .eyebrow, .analytics-main .hero-kicker, .analytics-main .muted-heading { font-size: var(--app-font-size-small); line-height: var(--app-line-height-compact); } /* ---------- Shared hero ---------- */ .app-hero { min-height: var(--app-hero-min-height); padding: var(--app-hero-padding-y) var(--app-hero-padding-x); margin: var(--app-hero-margin-y) 0; border-radius: calc(var(--app-card-radius) + 2px); } .app-hero .hero-icon, .app-hero .reader-hero-icon { width: var(--app-hero-icon-size); height: var(--app-hero-icon-size); font-size: var(--app-font-size-2-25rem); } .app-hero h2 { font-size: var(--app-font-size-hero-title); line-height: var(--app-line-height-hero-title); } .app-hero p { font-size: var(--app-font-size-hero-copy); line-height: var(--app-line-height-hero-copy); } .app-hero .eyebrow, .app-hero .hero-kicker { font-size: var(--app-font-size-eyebrow); letter-spacing: .14em; } /* ---------- Shared KPI cards ---------- */ .app-kpi-grid { margin: 22px 0 var(--app-section-gap); gap: var(--app-gap-md); } .app-kpi-card, .flow-kpi, .understanding-kpi, .metric-card { min-height: var(--app-kpi-min-height); padding: var(--app-kpi-padding-y) var(--app-kpi-padding-x); } .flow-kpi.app-kpi-card strong, .understanding-kpi.app-kpi-card strong, .metric-card.app-kpi-card strong, .metric-card .metric-value { font-size: var(--app-font-size-kpi-value); line-height: var(--app-line-height-1-05); } .flow-kpi.app-kpi-card span, .understanding-kpi.app-kpi-card span, .metric-card.app-kpi-card span { font-size: var(--app-font-size-kpi-label); } /* ---------- Shared tables and pills ---------- */ .app-data-table td, .app-data-table th, .reader-management-table td, .reader-management-table th { padding: var(--app-table-cell-padding-y) var(--app-table-cell-padding-x); font-size: var(--app-table-font-size); min-height: var(--app-table-row-min-height); } .story-unit-table td, .story-unit-table th, .investigation-card table td, .investigation-card table th, .roadmap-table td, .roadmap-table th { padding: var(--app-table-cell-padding-dense-y) var(--app-table-cell-padding-dense-x); } .app-status-pill, .reader-status { padding: var(--app-status-padding-y) var(--app-status-padding-x); font-size: var(--app-status-font-size); } /* ---------- Shared side rails ---------- */ .app-side-panel { display: grid; gap: var(--app-side-panel-gap); position: sticky; top: 76px; } /* ---------- Shared charts and data cards ---------- */ .app-chart-card, .flow-chart-card, .perception-chart-card, .timeline-card, .unit-drilldown-card, .understanding-heatmap-card, .investigation-card, .roadmap-card, .focus-heatmap-card { padding: var(--app-chart-card-padding); } .app-chart, .flow-chart, .sentiment-chart { min-height: var(--app-chart-height); gap: var(--app-chart-gap); } .app-chart-compact, .reread-bars, .mini-line-chart { min-height: var(--app-chart-height-compact); } .perception-card-grid, .perception-bottom-grid, .understanding-card-grid, .revision-summary-grid, .revision-detail-grid, .plan-impact-grid, .priority-list, .reader-insight-panels, .health-highlight-grid, .explore-next-grid { gap: var(--app-gap-lg); } /* ---------- Shared readers-management components ---------- */ /* ---------- Reader manuscript interface ---------- */ .app-reader-content, .reader-shell.reader .book-page { font-family: var(--app-font-family-reading); font-size: var(--reader-font-size-desktop); line-height: var(--reader-line-height-desktop); padding: var(--reader-content-padding-top) var(--reader-content-padding-x) var(--reader-content-padding-bottom); } .app-reader-paragraph, .reader-shell.reader .para { margin: var(--reader-paragraph-gap) 0; padding: var(--reader-paragraph-padding-y) var(--reader-paragraph-padding-x); } .app-reader-controls, .reader-shell.reader .readerbar { padding-top: var(--reader-controls-padding-top); margin-top: var(--reader-controls-margin-top); } /* ---------- Responsive shared behavior ---------- */ @media (max-width: 1380px) { .story-layout, .understanding-layout, .perception-layout { grid-template-columns: minmax(0, 1fr); } .story-side-panel, .understanding-side-panel, .perception-layout .story-side-panel { width: 100%; max-width: none; } } @media (max-width: 900px) { .app-page { padding: var(--app-padding-28px-18px); } .app-hero { padding: var(--app-padding-26px); } .readers-empty-state { padding: 34px 20px; } .reader-shell.reader { --reader-bottom: var(--reader-mobile-bottom-offset); --reader-side: var(--reader-mobile-side-padding); } .reader-shell.reader .mobile-icon-button { width: var(--reader-mobile-header-button-size); height: var(--reader-mobile-header-button-size); } .app-reader-content, .reader-shell.reader .book-page { padding: var(--reader-mobile-content-top) var(--reader-mobile-side-padding) calc(var(--reader-bottom) + 42px); font-size: var(--reader-mobile-font-size); line-height: var(--reader-mobile-line-height); } .app-reader-paragraph, .reader-shell.reader .para { margin: var(--reader-mobile-paragraph-gap) 0; } .reader-shell.reader .readerbar { padding-top: var(--reader-mobile-bottom-bar-padding-y); } .reader-shell.reader .readerbar button, .reader-shell.reader #saveComment { min-height: var(--reader-mobile-control-height); } } /* Added Override */ /* Reader table: intentional desktop column proportions */ .reader-management-table { width: 100%; table-layout: fixed; } /* Reader */ .reader-management-table th:nth-child(1), .reader-management-table td:nth-child(1) { width: 24%; min-width: 0; } /* Status */ .reader-management-table th:nth-child(2), .reader-management-table td:nth-child(2) { width: 11%; } /* Progress */ .reader-management-table th:nth-child(3), .reader-management-table td:nth-child(3) { width: 25%; } /* Last activity */ .reader-management-table th:nth-child(4), .reader-management-table td:nth-child(4) { width: 14%; } /* Invite */ .reader-management-table th:nth-child(5), .reader-management-table td:nth-child(5) { width: 10%; } /* Actions */ .reader-management-table th:nth-child(6), .reader-management-table td:nth-child(6) { width: 16%; } /* Override the existing 260px minimum */ .reader-progress-cell { min-width: 0; width: 100%; } /* Give the actions actual usable space */ .reader-action-icons { min-width: 0; width: 100%; gap: var(--app-gap-14px); } /* Prevent a long reader name from forcing the column wider */ .reader-management-table td:first-child { overflow: hidden; text-overflow: ellipsis; } /* Story Flow: show the entire chapter chart without horizontal scrolling */ .flow-chart { width: 100%; max-width: 100%; box-sizing: border-box; overflow-x: hidden; gap: clamp(2px, 0.45vw, 8px); justify-content: stretch; } .flow-chapter { flex: 1 1 0; min-width: 0; width: auto; } /* Allow bars to become narrower when there are many chapters */ .flow-bar { width: clamp(14px, 1.8vw, 27px); max-width: 100%; } .flow-count, .flow-label { font-size: clamp( var(--app-font-size-68rem), 0.75vw, var(--app-font-size-85rem) ); } /* Keep the phase summary aligned to the full chart width */ .story-phases { width: 100%; box-sizing: border-box; grid-template-columns: repeat(4, minmax(0, 1fr)); } /* Confusion Over Time: keep all bars inside the card */ .understanding-side-panel .mini-line-chart { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; overflow: hidden; gap: clamp(2px, 0.4vw, 8px); } .understanding-side-panel .mini-line-chart .mini-point { flex: 1 1 0; min-width: 0; max-width: none; } /* Character Sentiment: keep tab controls compact */ .sentiment-mini-card { align-content: start; grid-auto-rows: max-content; } .sentiment-tabs { align-self: start; align-items: center; align-content: flex-start; height: auto; min-height: 0; } .sentiment-tabs span { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; width: auto; height: auto; min-height: 0; max-height: 38px; box-sizing: border-box; white-space: nowrap; line-height: 1.2; } /* Targeted onboarding flow improvements */ .setup-demo-cta{display:flex;align-items:center;justify-content:space-between;gap:var(--app-gap-12px,12px);margin-top:var(--app-margin-16px,16px);padding-top:var(--app-padding-16px,16px);border-top:1px solid #eee4d7}.setup-demo-cta span{color:#6f665d;font-weight:700}.profile-flow-note{margin:12px 0 0;padding:12px 14px;border-radius:var(--app-border-radius-10px);background:#f7f2ff;color:#3f2a76}.field-required-note{margin-left:8px;font-size:.8em;color:#6f3ff0}.cover-preview{display:none;width:72px;height:96px;border-radius:8px;background-position:center;background-size:cover;background-repeat:no-repeat;box-shadow:0 4px 12px rgba(36,32,24,.15)}.cover-dropzone.has-file .cover-preview{display:block}.cover-dropzone.has-file .dropzone-inner:before{display:none}@media(max-width:700px){.setup-demo-cta{align-items:flex-start;flex-direction:column}}