.character-history{--ch-ink:#fff2ed;--ch-muted:#d8becb;--ch-pink:#f1b1cc;--ch-teal:#b3ead9;--ch-line:#ffe6ed2b;color:var(--ch-ink);font-family:inherit;min-width:0;width:100%;max-width:520px;background:linear-gradient(135deg,#532d43d9,#2b3d42e8);border:1px solid var(--ch-line);border-radius:26px;box-shadow:inset 0 1px #ffffff30,0 0 50px #dc8ab81a;backdrop-filter:blur(24px);overflow:hidden;text-align:left;isolation:isolate}.character-history *{box-sizing:border-box}.ch-hero{position:relative;display:flex;gap:18px;align-items:center;padding:29px 25px 24px;background:radial-gradient(ellipse at 4% 0%,#ffc2d827,transparent 75%);min-width:0}.ch-portrait{width:84px;height:84px;flex:0 0 84px;border-radius:50%;padding:3px;background:linear-gradient(140deg,var(--ch-pink),var(--ch-teal));position:relative;box-shadow:0 0 25px #efacca18}.ch-photo{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);border-radius:50%;object-fit:cover;object-position:center 28%}.ch-initials{display:grid;place-items:center;border-radius:50%;width:100%;height:100%;font:32px var(--entrance-sans);background:#603b50;color:var(--ch-pink)}.ch-identity{min-width:0;padding-right:15px}.ch-kicker{display:block;font-size:9px;letter-spacing:1.6px;font-weight:600;line-height:1.6;color:#efc2d3}.ch-name{font:400 39px/1.1 var(--entrance-sans);letter-spacing:-1.3px;margin:6px 0 9px;overflow-wrap:anywhere}.ch-activity{font-size:12px;line-height:1.55;color:var(--ch-muted);margin:0;overflow-wrap:anywhere}.ch-close{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;background:#fff1;border-radius:50%;color:#f5dbe6;font-size:23px;line-height:1;cursor:pointer}.ch-tabs{display:flex;gap:20px;margin:0 25px;border-bottom:1px solid var(--ch-line)}.ch-tab{min-height:46px;max-width:70%;border:0;border-bottom:2px solid transparent;background:none;color:var(--ch-muted);font-family:inherit;font-size:12px;font-weight:500;line-height:1.4;padding:10px 2px;cursor:pointer;overflow-wrap:anywhere}.ch-tab[aria-selected=true]{color:var(--ch-ink);border-bottom-color:var(--ch-teal)}.ch-body{padding:23px 25px 3px;min-height:235px;max-height:min(51vh,510px);overflow:auto;scrollbar-width:thin;scrollbar-color:#e9b5d140 transparent;overscroll-behavior:contain}.ch-section-heading{font-size:14px;font-weight:600;line-height:1.45;letter-spacing:.1px}.ch-section-note{font-size:11px;line-height:1.6;color:var(--ch-muted);margin:7px 0 23px}.ch-timeline{list-style:none;margin:0;padding:0 0 0 5px}.ch-moment{position:relative;display:flex;gap:16px;padding:0 0 23px}.ch-moment:not(:last-child):before{content:'';position:absolute;left:4px;top:11px;bottom:0;border-left:1px solid var(--ch-line)}.ch-moment-mark{width:9px;height:9px;border:1px solid #efbacf;border-radius:50%;flex:0 0 9px;margin-top:5px;position:relative;background:#533a4b}.ch-moment-together .ch-moment-mark{border-radius:2px;transform:rotate(45deg);background:#eab9d05c}.ch-moment-speech .ch-moment-mark{background:#adddce;border-color:#adddce;box-shadow:0 0 12px #a6e6ce30}.ch-moment-copy{min-width:0;flex:1}.ch-moment-title{font-size:13px;line-height:1.5;font-weight:500;margin:0 0 4px}.ch-moment-detail{font-size:11px;line-height:1.65;color:var(--ch-muted);margin:0;overflow-wrap:anywhere}.ch-quote{margin:13px 0 0;padding:12px 14px;border-left:1px solid #e1a4c0;background:#facbdd0b;border-radius:0 10px 10px 0}.ch-quote blockquote{font:italic 15px/1.65 var(--entrance-sans);margin:0;color:#fbe5ef;overflow-wrap:anywhere;white-space:pre-wrap}.ch-quote figcaption{font-size:9px;line-height:1.6;color:#cfb8c6;margin-top:9px}.ch-footer{padding:18px 25px 23px;border-top:1px solid var(--ch-line);display:grid;grid-template-columns:1fr;gap:9px;background:#291e2d30}.ch-action{width:100%;min-height:47px;padding:12px 15px;border-radius:13px;font-family:inherit;font-size:12px;font-weight:600;line-height:1.4;cursor:pointer;overflow-wrap:anywhere}.ch-approach{border:1px solid #e5bcd04d;background:linear-gradient(115deg,#efc0d2,#b8e3d9);color:#432a3c}.ch-invite{border:1px solid #e2bfd04a;background:#f1c6dc0d;color:#f4dce6}.ch-action:disabled{opacity:.48;cursor:default}.ch-gate-reason,.ch-status{font-size:10px;line-height:1.6;color:#d4b8c8;margin:1px 1px 0;overflow-wrap:anywhere}.ch-status:empty{display:none}.ch-status{color:var(--ch-teal)}.ch-empty{font-family:inherit;font-size:13px;line-height:1.75;color:var(--ch-muted,#d8becb);padding:20px 0 30px;max-width:32ch}.ch-relation{margin:0 0 23px}.ch-relation-top{display:flex;gap:14px;justify-content:space-between;align-items:baseline}.ch-relation-top h3{margin:0;font-size:13px;font-weight:500}.ch-meter-value{font-size:11px;font-variant-numeric:tabular-nums;color:#e5c7d5}.ch-meter{height:6px;background:#160f212b;border-radius:8px;margin:10px 0 7px;overflow:hidden}.ch-meter-fill{height:100%;display:block;border-radius:8px;background:linear-gradient(90deg,#d889ad,#f1c5d3);min-width:1px}.ch-relation-trust .ch-meter-fill{background:linear-gradient(90deg,#78b7b1,#bdecd8)}.ch-relation-closeness .ch-meter-fill{background:linear-gradient(90deg,#b2a5c3,#e6c9e0)}.ch-relation-note,.ch-relationship-footnote{font-size:10px;color:var(--ch-muted);line-height:1.6;margin:0}.ch-relationship-footnote{margin:6px 0 22px}.character-history button:focus-visible{outline:2px solid #b4efdb;outline-offset:3px}.character-history button:hover:not(:disabled){filter:brightness(1.08)}.character-history button:active:not(:disabled){transform:translateY(1px)}
@media(max-width:520px){.character-history{border-radius:23px}.ch-hero{padding:24px 20px 20px;gap:14px}.ch-portrait{width:72px;height:72px;flex-basis:72px}.ch-name{font-size:34px}.ch-kicker{font-size:8px;letter-spacing:1.2px}.ch-activity{font-size:11px}.ch-tabs{margin:0 20px;gap:18px}.ch-body{padding:20px 20px 2px;max-height:min(44vh,390px);min-height:205px}.ch-footer{padding:16px 20px 20px}.ch-section-note{margin-bottom:20px}.ch-moment{gap:13px}.ch-quote{padding:10px 12px}.ch-quote blockquote{font-size:14px}}
@media(prefers-reduced-motion:reduce){.character-history *{animation:none;transition:none;scroll-behavior:auto}.character-history button:active:not(:disabled){transform:none}}

/* The game's modal is the overlay; this component is its single visible card.
   Scope the host reset so call sheets, settings and other modals keep their skin. */
#modal:has(#character-history-mount) {
  padding: max(20px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
}
.modal-card:has(#character-history-mount) {
  width: min(100%, 520px);
  max-width: 520px;
  max-height: none;
  padding: 0;
  overflow: visible;
  background: none;
  border: 0;
  border-radius: 26px;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.modal-card:has(#character-history-mount) > .close { display: none; }
#character-history-mount { width: 100%; min-width: 0; }
#character-history-mount .character-history {
  display: flex;
  flex-direction: column;
  max-height: min(800px, calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
  box-shadow: inset 0 1px #ffffff30, 0 24px 80px #20151b66;
}
.character-history .ch-hero { flex: 0 0 auto; padding: 30px 26px 24px; }
.character-history .ch-portrait { overflow: hidden; }
.character-history .ch-photo {
  display: block;
  border-radius: 50%;
  max-width: none;
  width: calc(100% - 6px);
  height: calc(100% - 6px);
  object-fit: cover;
}
.character-history .ch-name {
  font: 400 39px/1.1 var(--entrance-sans);
  letter-spacing: -1.3px;
  margin: 6px 0 9px;
  color: var(--ch-ink);
}
.character-history .ch-activity { font-size: 12px; line-height: 1.55; margin: 0; color: var(--ch-muted); }
.character-history .ch-close { width: 44px; height: 44px; top: 8px; right: 8px; }
.character-history .ch-identity { padding-right: 24px; }
.character-history .ch-tabs { flex: 0 0 auto; }
.character-history .ch-body { flex: 1 1 auto; min-height: 150px; max-height: 410px; }
.character-history .ch-section-note { font-size: 11px; line-height: 1.6; margin: 7px 0 23px; color: var(--ch-muted); }
.character-history .ch-moment-title { font-size: 13px; font-weight: 500; line-height: 1.5; margin: 0 0 4px; color: var(--ch-ink); }
.character-history .ch-moment-detail { font-size: 11px; line-height: 1.65; margin: 0; color: var(--ch-muted); }
.character-history .ch-empty { font-size: 13px; line-height: 1.75; margin: 0; padding: 5px 0 27px; color: var(--ch-muted); }
.character-history .ch-footer { flex: 0 0 auto; }
.character-history .ch-gate-reason,
.character-history .ch-status { font-size: 10px; line-height: 1.6; margin: 1px 1px 0; color: var(--ch-muted); }
.character-history .ch-status { color: var(--ch-teal); }
.character-history .ch-relation-note,
.character-history .ch-relationship-footnote { font-size: 10px; line-height: 1.6; margin: 0; color: var(--ch-muted); }
.character-history .ch-relationship-footnote { margin: 6px 0 22px; }

@media (max-width: 520px) {
  #modal:has(#character-history-mount) { padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)); }
  #character-history-mount .character-history {
    max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    border-radius: 23px;
  }
  .character-history .ch-hero { padding: 24px 20px 20px; }
  .character-history .ch-name { font-size: 34px; }
  .character-history .ch-activity { font-size: 11px; }
  .character-history .ch-body { min-height: 120px; max-height: 370px; }
  .character-history .ch-section-note { margin-bottom: 20px; }
  .character-history .ch-empty { padding-bottom: 23px; }
}
@media (max-height: 640px) {
  .character-history .ch-hero { padding-top: 16px; padding-bottom: 15px; }
  .character-history .ch-portrait { width: 60px; height: 60px; flex-basis: 60px; }
  .character-history .ch-name { font-size: 30px; margin: 3px 0 5px; }
  .character-history .ch-body { min-height: 0; padding-top: 15px; }
  .character-history .ch-footer { padding-top: 12px; padding-bottom: 12px; gap: 7px; }
  .character-history .ch-action { min-height: 44px; padding-top: 9px; padding-bottom: 9px; }
}

/* A cast sequence over the existing world, with light controls instead of extra cards. */
.cast-feed-tabs,.ch-day-nav{display:flex;align-items:center;gap:16px}
.cast-feed-tabs{border-bottom:1px solid #fff2;margin:4px 0 18px}
.cast-feed-tabs button{background:none;border:0;border-bottom:2px solid transparent;color:inherit;opacity:.6;padding:12px 8px;min-height:44px;font:inherit;cursor:pointer}
.cast-feed-tabs button[aria-pressed="true"]{opacity:1;border-color:var(--aura-accent,#e7acd9)}
.cast-feed-note{font-size:12px;line-height:1.65;color:#d1c1d8;margin:12px 0 20px}
.cast-feed-scenes{list-style:none;margin:0;padding:0}
.cast-feed-scenes .cast-feed-scene{border:0;border-bottom:1px solid #ffffff12;border-radius:0;background:transparent;width:100%;padding:16px 0;text-align:left;display:flex;align-items:center;gap:14px}
.cast-feed-scene>span:first-of-type{flex:1;min-width:0}
.cast-feed-scene small{white-space:normal;line-height:1.5}
.cast-feed-scene .cast-feed-location{opacity:.65;margin-top:5px}
.ch-day-nav{justify-content:space-between;margin-bottom:8px}
.ch-day-step{background:transparent;border:1px solid #ffffff20;border-radius:50%;width:44px;height:44px;color:inherit;cursor:pointer}
.ch-day-step:disabled{opacity:.25;cursor:default}
.cast-feed-tabs button:focus-visible,.ch-day-step:focus-visible{outline:2px solid #f0d3ef;outline-offset:3px}