:root{--cv-gold:#a98755;--cv-gold-soft:rgba(169,135,85,.25);--cv-ink:#e7dfd4;--cv-muted:#9c9185;--cv-panel:rgba(16,13,14,.88)}
.celaeno-mode .oracle-visuals{width:min(100%,880px);margin:18px 0 28px;display:grid;gap:14px;position:relative;z-index:3}
.celaeno-mode .oracle-visual{border:1px solid var(--cv-gold-soft);background:linear-gradient(145deg,rgba(24,18,18,.92),rgba(7,7,9,.96));box-shadow:0 18px 70px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.025);padding:16px;overflow:hidden}
.celaeno-mode .oracle-visual-title{font:500 10px/1.3 system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--cv-muted);margin:0 0 12px}
.celaeno-mode .cv-spread{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:12px}
.celaeno-mode .cv-picker-grid{grid-template-columns:repeat(6,minmax(0,1fr));max-height:min(62vh,620px);overflow:auto;padding:2px 4px 8px 2px;scrollbar-width:thin}
.celaeno-mode .cv-card{min-height:192px;aspect-ratio:2/3;border:1px solid rgba(181,145,89,.48);border-radius:7px;padding:9px;background:radial-gradient(circle at 50% 36%,rgba(177,123,55,.20),transparent 34%),linear-gradient(160deg,#221814,#0b0a0d 68%);display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;box-shadow:inset 0 0 0 4px rgba(2,2,3,.38),inset 0 0 0 5px rgba(181,145,89,.16);transform-origin:center;position:relative;overflow:hidden;color:var(--cv-ink);font:inherit}
.celaeno-mode button.cv-card{cursor:pointer;-webkit-appearance:none;appearance:none}
.celaeno-mode button.cv-card:hover{border-color:rgba(212,165,116,.85);transform:translateY(-2px)}
.celaeno-mode button.cv-card:focus-visible{outline:2px solid #d4a574;outline-offset:2px}
.celaeno-mode button.cv-card.is-selected{border-color:#d4a574;box-shadow:0 0 0 2px rgba(212,165,116,.28),0 10px 28px rgba(0,0,0,.45)}
.celaeno-mode button.cv-card.is-selected:after{content:'✓';position:absolute;top:5px;right:5px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#d4a574;color:#120d09;font:700 12px/1 system-ui;z-index:4}
.celaeno-mode button.cv-card:disabled{cursor:default;transform:none}
.celaeno-mode .cv-picker-grid .cv-card{min-height:0;width:100%}
.celaeno-mode .cv-card.is-reversed{transform:rotate(180deg)}
.celaeno-mode .cv-card.is-reversed .cv-card-copy{transform:rotate(180deg)}
.celaeno-mode .cv-card-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0}
.celaeno-mode .cv-card.has-art{padding:0;background:#0a090b;box-shadow:0 12px 30px rgba(0,0,0,.38)}
.celaeno-mode .cv-card.has-art .cv-card-copy{position:absolute;left:0;right:0;bottom:0;padding:20px 8px 8px;background:linear-gradient(transparent,rgba(0,0,0,.86));z-index:2;text-shadow:0 1px 2px #000}
.celaeno-mode .cv-card-back .cv-card-copy{position:relative;z-index:2;margin-top:auto;text-shadow:0 1px 3px #000;color:#f2e7d8}
.celaeno-mode .cv-card-sigil{font:400 30px/1 Georgia,serif;color:#b8915d;opacity:.86;margin-top:18px;z-index:1}
.celaeno-mode .cv-card-copy{width:100%;z-index:1}
.celaeno-mode .cv-card-position{display:block;font:500 8px/1.4 system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#cbb89e;margin-bottom:5px}
.celaeno-mode .cv-card-name{display:block;font:500 14px/1.2 Georgia,serif;color:var(--cv-ink)}
.celaeno-mode .cv-card-state{display:block;font:500 8px/1.3 system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#d2b187;margin-top:5px}
.celaeno-mode .cv-runes{display:flex;flex-wrap:wrap;gap:12px}
.celaeno-mode .cv-rune{flex:1 1 104px;min-height:130px;border:1px solid var(--cv-gold-soft);display:grid;place-items:center;padding:12px;background:radial-gradient(circle,rgba(164,119,57,.14),transparent 55%)}
.celaeno-mode .cv-rune-glyph{font:400 48px/1 serif;color:#c49a61}
.celaeno-mode .cv-rune-label{font:500 9px/1.4 system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--cv-muted);text-align:center}
.celaeno-mode .cv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px}
.celaeno-mode .cv-kv{border:1px solid rgba(169,135,85,.16);padding:11px;background:rgba(255,255,255,.018);min-width:0}
.celaeno-mode .cv-k{font:500 8px/1.3 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.14em;color:#847a70;overflow-wrap:anywhere}
.celaeno-mode .cv-v{font:500 19px/1.25 Georgia,serif;color:var(--cv-ink);margin-top:5px;overflow-wrap:anywhere}
.celaeno-mode .cv-wheel{width:min(280px,76vw);aspect-ratio:1;border:1px solid rgba(180,144,86,.45);border-radius:50%;margin:6px auto 16px;position:relative;background:repeating-conic-gradient(from -15deg,rgba(169,135,85,.13) 0 1deg,transparent 1deg 30deg),radial-gradient(circle,transparent 0 41%,rgba(169,135,85,.16) 41% 42%,transparent 42% 68%,rgba(169,135,85,.22) 68% 69%,transparent 69%)}
.celaeno-mode .cv-wheel:before,.celaeno-mode .cv-wheel:after{content:'';position:absolute;inset:18%;border:1px solid rgba(169,135,85,.22);border-radius:50%}.celaeno-mode .cv-wheel:after{inset:38%;background:radial-gradient(circle,rgba(190,146,80,.23),transparent 68%)}
.celaeno-mode .cv-moon{width:112px;aspect-ratio:1;border-radius:50%;margin:4px auto 16px;background:radial-gradient(circle at 34% 32%,#e7d4ad,#a67a45 46%,#37271d 72%,#0d0b0e);box-shadow:0 0 40px rgba(174,123,64,.18)}
.celaeno-mode .cv-lines{display:grid;gap:6px;max-width:320px;margin:8px auto}.celaeno-mode .cv-line{height:8px;background:linear-gradient(90deg,#a68150 0 43%,transparent 43% 57%,#a68150 57%)}.celaeno-mode .cv-line.solid{background:#a68150}
.celaeno-mode .cv-note{font:400 12px/1.5 system-ui,sans-serif;color:var(--cv-muted);margin-top:10px}
.celaeno-mode .celaeno-memory-notice{position:fixed;left:var(--pad-x);bottom:82px;z-index:31;max-width:min(720px,calc(100vw - 2*var(--pad-x)));font:400 10px/1.45 system-ui,sans-serif;letter-spacing:.02em;color:rgba(231,223,212,.48);pointer-events:none}
@media(max-width:900px){.celaeno-mode .pia-face{display:none!important}.celaeno-mode .pia-text{max-width:none!important;width:auto!important;left:max(18px,env(safe-area-inset-left))!important;right:max(18px,env(safe-area-inset-right))!important;top:92px!important;bottom:calc(108px + env(safe-area-inset-bottom))!important;overflow-y:auto!important;overscroll-behavior:contain;padding-right:4px;padding-bottom:22px}.celaeno-mode header.top{left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));width:auto;display:flex;align-items:center;gap:10px}.celaeno-mode .top-controls{margin-left:auto;display:flex;gap:6px}.celaeno-mode .top-controls .top-btn{font-size:9px;padding:7px 8px}.celaeno-mode .oracle-visuals{width:100%}.celaeno-mode .cv-picker-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.celaeno-mode .celaeno-memory-notice{left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));bottom:calc(76px + env(safe-area-inset-bottom));max-width:none;font-size:9px;line-height:1.35}.celaeno-mode .bottom{left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));width:auto}}
@media(max-width:600px){.celaeno-mode .top-controls #motion-btn{display:none}.celaeno-mode .celaeno-identity{font-size:8px;letter-spacing:.18em}.celaeno-mode .pia-text{top:calc(78px + env(safe-area-inset-top))!important;left:max(14px,env(safe-area-inset-left))!important;right:max(14px,env(safe-area-inset-right))!important;transform:none!important;bottom:calc(142px + env(safe-area-inset-bottom))!important;scroll-padding-top:12px;scroll-padding-bottom:24px}.celaeno-mode .oracle-visual{padding:12px}.celaeno-mode .cv-spread{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.celaeno-mode .cv-picker-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-height:56vh}.celaeno-mode .cv-card{min-height:0;padding:6px}.celaeno-mode .cv-card.has-art{padding:0}.celaeno-mode .cv-card-sigil{font-size:23px;margin-top:12px}.celaeno-mode .cv-card-name{font-size:10px}.celaeno-mode .cv-card-position,.celaeno-mode .cv-card-state{font-size:6.5px;letter-spacing:.08em}.celaeno-mode .cv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.celaeno-mode .cv-v{font-size:16px}}

/* ---- THE FACE OF A DRAWN CARD ----
   Built from what the engine drew and nothing else: suit mark, rank, pips.
   It stands in for missing art and steps aside the moment real art loads. */
.celaeno-mode .cv-face{position:relative;z-index:1;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;width:100%;padding:10px 4px 6px;
  color:#c8a06a}
.celaeno-mode .cv-card.has-art .cv-face{display:none}
.celaeno-mode .cv-face-rank{font:600 15px/1 Georgia,serif;letter-spacing:.06em;opacity:.92}
.celaeno-mode .cv-face-mark{font:400 26px/1 Georgia,serif;opacity:.9}
.celaeno-mode .cv-face-pips{display:grid;grid-template-columns:repeat(2,10px);gap:3px 12px;
  justify-content:center;align-content:center;min-height:34px}
.celaeno-mode .cv-face-pips .cv-pip{font:400 10px/1 Georgia,serif;opacity:.85;text-align:center}
.celaeno-mode .cv-face-major .cv-face-roman{font:600 20px/1 Georgia,serif;letter-spacing:.1em;
  color:#d8b478}
.celaeno-mode .cv-face-major-name{font:400 9px/1.25 Georgia,serif;opacity:.66;text-align:center;
  max-width:74px}
.celaeno-mode .cv-face.is-wands{color:#c98f52}
.celaeno-mode .cv-face.is-cups{color:#8fa8cf}
.celaeno-mode .cv-face.is-swords{color:#b9c2cc}
.celaeno-mode .cv-face.is-pents{color:#b9a463}
.celaeno-mode .cv-card.is-reversed .cv-face{transform:rotate(180deg)}