/* interiors-saved-finish.css — Phase 5 elevation (interiors veil + saved folio). Owner: agent C. Loaded last in ; overrides styles.css naturally. Interiors reel work lives in reel.css. */ /* ═══════════════════ SAVED · PRIVATE FOLIO ═══════════════════ */ /* ---- Empty state: composed, centered ceremony ---------------------------- */ .saved-view .saved-empty{ position:absolute; left:0; right:0; top:32%; bottom:7%; text-align:center; display:none; } .saved-view .saved-empty.is-visible{ display:flex; flex-direction:column; align-items:center; justify-content:center; } /* the bare square → a thin hairline diamond with an inner ring + sand seed */ .saved-view .saved-empty span{ position:relative; display:block; width:46px; height:46px; margin:0 auto 38px; border:1px solid var(--e-line-strong); transform:rotate(45deg); background:none; box-shadow:0 0 28px rgba(63,89,58,.06); } .saved-view .saved-empty span::before{ content:""; position:absolute; inset:6px; border:1px solid var(--e-line); } .saved-view .saved-empty span::after{ content:""; position:absolute; left:50%; top:50%; width:7px; height:7px; margin:-3.5px 0 0 -3.5px; background:var(--e-ink); opacity:.85; box-shadow:0 0 10px rgba(63,89,58,.14); } .saved-view .saved-empty h3{ font:400 30px/1.15 var(--serif); color:var(--e-ink-strong); margin:0 0 12px; letter-spacing:.01em; } .saved-view .saved-empty p{ font-size:12px; line-height:1.7; color:var(--e-ink-soft); letter-spacing:.02em; margin:0 0 26px; max-width:40ch; } .saved-view .saved-empty button{ height:44px; padding:0 26px; font-size:10px; text-transform:uppercase; letter-spacing:.18em; } /* ---- Saved cards ---------------------------------------------------------- */ .saved-view .saved-items{ gap:16px; } .saved-view .saved-card{ border:1px solid var(--e-line); border-radius:10px!important; /* styles.css forces 12px!important; this file loads later */ background:var(--e-surface); overflow:hidden; transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease); } .saved-view .saved-card:hover{ transform:translateY(-3px); border-color:var(--e-line-strong); box-shadow:0 16px 34px rgba(63,89,58,.11); } .saved-view .saved-card:active{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(63,89,58,.10); } .saved-view .saved-card div{ position:relative; padding:14px 16px 15px; } .saved-view .saved-card b{ font:400 15px/1.3 var(--serif); color:var(--e-ink-strong); padding-right:32px; } .saved-view .saved-card span{ font-size:10px; text-transform:uppercase; letter-spacing:.16em; color:var(--e-ink); margin-top:6px; } /* remove control: quiet hairline circle, wakes on touch */ .saved-view .saved-card button{ float:none; position:absolute; right:11px; top:13px; margin:0; width:26px; height:26px; border-radius:50%; border:1px solid var(--e-line); color:var(--e-ink-soft); font-size:13px; line-height:1; display:grid; place-items:center; transition:color .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease); } .saved-view .saved-card button:hover{ color:var(--e-ink-strong); border-color:var(--e-line-strong); background:rgba(63,89,58,.06); }