/* The remaining portraits share the player, but keep individual type and materials. */
:root[data-collection="remaining"] {
  --title-font:'Noto Serif KR',Batang,serif;--copy-font:'Noto Sans KR','Malgun Gothic',sans-serif;
  --muted:#796d5c;--line:rgba(125,100,60,.25);--paper-rgb:245,238,220;
  --panel:rgba(255,255,255,.24);--rail-bg:var(--paper);--title-weight:400;
  scrollbar-color:var(--gold) var(--paper);
}
:root[data-theme="nezumi"] {--title-font:'Gowun Batang',serif;--copy-font:'Gowun Dodum',sans-serif;--muted:#717557;--line:rgba(134,118,66,.25);--paper-rgb:245,238,220;--rail-bg:#e9e2c9;color-scheme:light;}
:root[data-theme="anna"] {--title-font:'Noto Sans KR',sans-serif;--title-weight:500;--muted:#6c7c74;--line:rgba(80,116,102,.23);--paper-rgb:238,241,234;--rail-bg:#e0e7df;color-scheme:light;}
:root[data-theme="omae"] {--title-font:'Noto Serif KR',serif;--muted:#c7b79c;--line:rgba(212,179,116,.28);--paper-rgb:38,21,27;--panel:rgba(255,255,255,.06);--rail-bg:#211116;color-scheme:dark;}
:root[data-theme="gaho"] {--title-font:'Nanum Myeongjo',serif;--title-weight:700;--muted:#beb2c3;--line:rgba(199,170,114,.27);--paper-rgb:32,27,37;--panel:rgba(255,255,255,.05);--rail-bg:#1c1820;color-scheme:dark;}
:root[data-theme="qupi"] {--title-font:'Gowun Batang',serif;--copy-font:'Gowun Dodum',sans-serif;--muted:#94647b;--line:rgba(177,106,137,.24);--paper-rgb:255,240,244;--rail-bg:#f8dfe9;color-scheme:light;}
:root[data-theme="temur"] {--title-font:'Nanum Myeongjo',serif;--title-weight:700;--muted:#b9abc9;--line:rgba(190,163,219,.28);--paper-rgb:23,20,34;--panel:rgba(255,255,255,.05);--rail-bg:#13111c;color-scheme:dark;}
:root[data-theme="bongsik"] {--title-font:'Gowun Dodum',sans-serif;--muted:#787663;--line:rgba(115,121,84,.25);--paper-rgb:241,237,223;--rail-bg:#e4e3d2;color-scheme:light;}
:root[data-theme="haetnyang"] {--title-font:Jua,sans-serif;--copy-font:'Gowun Dodum',sans-serif;--muted:#758165;--line:rgba(126,143,94,.3);--paper-rgb:251,241,223;--rail-bg:#e6edda;color-scheme:light;}
:root[data-theme="hazel"] {--title-font:'Gowun Batang',serif;--copy-font:'Gowun Batang',serif;--muted:#c8a6aa;--line:rgba(207,155,158,.25);--paper-rgb:41,23,29;--panel:rgba(255,255,255,.05);--rail-bg:#231319;--fact-cols:1;color-scheme:dark;}

:root[data-collection="remaining"] .film {background:var(--paper);}
:root[data-collection="remaining"] .film:after {background:linear-gradient(90deg,rgba(var(--paper-rgb),.98),rgba(var(--paper-rgb),.9) 25%,transparent 45%,transparent 64%,rgba(var(--paper-rgb),.94) 82%,var(--paper)),linear-gradient(0deg,var(--paper),transparent 24%,transparent 78%,rgba(var(--paper-rgb),.8));}
:root[data-collection="remaining"] .stage:before {border-color:var(--line);}
:root[data-collection="remaining"] h1 {font-family:var(--title-font);font-size:clamp(42px,4.7vw,70px);font-weight:var(--title-weight);line-height:1.35;letter-spacing:-.055em;color:var(--ink);text-shadow:0 2px 26px var(--paper);}
:root[data-collection="remaining"] .stage:not([data-scene="0"]) h1 {font-size:28px;line-height:1.3;}
:root[data-collection="remaining"] h1 .character-alias {font:13px/1.5 var(--title-font);color:var(--gold);letter-spacing:.04em;margin-top:16px;}
:root[data-collection="remaining"] h1 span:not(.character-alias) {font:9px/1.7 Cinzel,Georgia,serif;color:var(--muted);letter-spacing:.09em;margin-top:16px;}
:root[data-collection="remaining"] :is(.eyebrow,.edition span,.facts dt,.hobby>span,.caption>span) {color:var(--gold);}
:root[data-collection="remaining"] .edition {font-family:Cinzel,Georgia,serif;letter-spacing:.1em;font-size:9px;}
:root[data-collection="remaining"] .identity:before {display:block;width:max-content;color:var(--gold);margin-bottom:23px;}
:root[data-collection="remaining"] .stage:not([data-scene="0"]) .identity:before {display:none;}
:root[data-collection="remaining"] .profile {top:28%;right:5%;width:25%;max-width:295px;}
:root[data-collection="remaining"] .profile .eyebrow {font-size:9px;letter-spacing:.08em;line-height:1.7;}
:root[data-collection="remaining"] .occupation {font-family:var(--title-font);font-weight:var(--title-weight);font-size:25px;max-width:none;line-height:1.65;margin-bottom:21px;}
:root[data-collection="remaining"] .facts {display:grid;grid-template-columns:repeat(var(--fact-cols,3),minmax(0,1fr));gap:12px;padding:16px 0;}
:root[data-collection="remaining"] .facts dt {font-size:10px;margin-bottom:9px;}
:root[data-collection="remaining"] .facts dd {font-family:var(--copy-font);font-size:14px;line-height:1.65;overflow-wrap:anywhere;word-break:keep-all;}
:root[data-collection="remaining"] .facts dd small {font-size:10px;line-height:1.5;color:var(--muted);white-space:normal;}
:root[data-collection="remaining"] .hobby {gap:17px;padding-top:17px;}
:root[data-collection="remaining"] .hobby>span {font-size:11px;}
:root[data-collection="remaining"] .hobby p {font-family:var(--copy-font);font-size:13px;line-height:1.8;color:var(--muted);word-break:keep-all;overflow-wrap:anywhere;}
:root[data-collection="remaining"] .story {top:34%;width:32%;max-width:420px;}
:root[data-collection="remaining"] .story .eyebrow {font-size:10px;letter-spacing:.12em;line-height:1.6;margin-bottom:19px;}
:root[data-collection="remaining"] .story h2 {font-family:var(--title-font);font-size:clamp(25px,2.5vw,36px);font-weight:var(--title-weight);color:var(--ink);line-height:1.5;letter-spacing:-.035em;white-space:pre-line;margin-bottom:19px;}
:root[data-collection="remaining"] .story>p:not(.eyebrow) {font-family:var(--copy-font);font-size:16px;line-height:1.85;color:var(--muted);white-space:pre-line;overflow-wrap:anywhere;}
:root[data-collection="remaining"] .quote-mark {color:var(--gold);opacity:.25;}
:root[data-collection="remaining"] .story-rule {width:95px;background:linear-gradient(90deg,var(--gold),transparent);}
:root[data-collection="remaining"] .story:has(.biography-open:not([hidden])) .story-rule {display:none;}
:root[data-collection="remaining"] .caption h2 {font-family:var(--title-font);font-size:23px;font-weight:var(--title-weight);}
:root[data-collection="remaining"] :is(.caption p,.scroll-hint) {color:var(--muted);}
:root[data-collection="remaining"] .motion {background:rgba(var(--paper-rgb),.8);border-color:var(--line);color:var(--ink);}
:root[data-collection="remaining"] .motion:hover {background:var(--paper);}
:root[data-collection="remaining"] .progress-track {background:var(--line);}
:root[data-collection="remaining"] .character-rail {background:var(--rail-bg);color:var(--ink);border-right-color:var(--line);}
:root[data-collection="remaining"] :is(.rail-brand span,.rail-bottom,.rail-heading span) {color:var(--muted);}
:root[data-collection="remaining"] :is(.rail-heading,.member-badge) {color:var(--gold);}
:root[data-collection="remaining"] :is(.member-badge,.character-card img) {border-color:var(--line);}
:root[data-collection="remaining"] .character-card[aria-pressed="true"] {background:var(--panel);border-color:var(--gold);}
:root[data-collection="remaining"] .character-card:hover {background:var(--panel);}
:root[data-collection="remaining"] .biography-open {font:13px/1.5 var(--copy-font);color:var(--ink);border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:10px 15px;box-shadow:none;margin-top:7px;}
:root[data-collection="remaining"] .biography-open:hover {background:var(--paper);border-color:var(--gold);transform:translateY(-1px);}
:root[data-collection="remaining"] .biography-dialog {background:var(--paper);color:var(--ink);border:1px solid var(--gold);border-radius:12px;box-shadow:0 25px 100px rgba(0,0,0,.3);scrollbar-color:var(--gold) transparent;}
:root[data-collection="remaining"] .biography-dialog h2 {font-family:var(--title-font);color:var(--ink);font-size:30px;font-weight:var(--title-weight);}
:root[data-collection="remaining"] .biography-dialog p {font-family:var(--copy-font);color:var(--ink);line-height:1.9;overflow-wrap:anywhere;}
:root[data-collection="remaining"] .biography-sticker {font:11px/1.7 Cinzel,Georgia,serif;letter-spacing:.12em;color:var(--gold);margin:12px 0 18px;}
:root[data-collection="remaining"] .biography-close {position:sticky;top:0;z-index:1;background:var(--paper);color:var(--ink);border-color:var(--line);font-family:var(--copy-font);}
.facts>[hidden],.facts[hidden],.occupation[hidden] {display:none!important;}

/* NEZUMI — a sunlit storybook, olive cloth and the fourth prince's bookmark. */
:root[data-theme="nezumi"] .identity:before {content:'IV';font:25px/1.5 Cinzel,serif;border-bottom:1px solid var(--gold);padding:0 9px 6px;}
:root[data-theme="nezumi"] .profile {border-top:3px double var(--line);padding-top:20px;}
:root[data-theme="nezumi"] .occupation {font-size:24px;}
:root[data-theme="nezumi"] .story h2 {font-weight:700;}
:root[data-theme="nezumi"] .character-card img {border-radius:48% 48% 3px 3px;}
:root[data-theme="nezumi"] .biography-dialog {border-radius:2px 16px 16px 2px;border-left:7px solid #8d965e;}
:root[data-theme="nezumi"] .story .eyebrow {border-left:3px solid #9ca571;padding-left:11px;}
@media(min-width:801px){
  :root[data-theme="nezumi"] .stage[data-scene="2"] .story {left:auto;right:5%;width:28%;}
  :root[data-theme="nezumi"] .stage[data-scene="2"] .caption {right:auto;left:5%;}
  :root[data-theme="nezumi"] .stage[data-scene="2"] .film:after {background:linear-gradient(90deg,rgba(245,238,220,.6),transparent 26%,transparent 62%,rgba(245,238,220,.96) 80%,#f5eedc),linear-gradient(0deg,#f5eedc,transparent 24%,transparent 78%,rgba(245,238,220,.8));}
}

/* ANNA — clean sage stationery with a quiet violet after-hours accent. */
:root[data-theme="anna"] .identity:before {content:'＋';font:32px/1 sans-serif;border:1px solid var(--line);padding:8px 10px;border-radius:50%;}
:root[data-theme="anna"] h1 {letter-spacing:-.07em;}
:root[data-theme="anna"] .occupation {font-size:21px;}
:root[data-theme="anna"] .story[data-panel="2"] h2 {color:#6e5279;}
:root[data-theme="anna"] .story-rule {background:linear-gradient(90deg,#8d7298,transparent);}
:root[data-theme="anna"] .character-card img {border-radius:8px;}
:root[data-theme="anna"] .facts>div:first-child dd {font-size:12px;}
:root[data-theme="anna"] .biography-dialog {border-radius:7px;border-top:4px solid #9b87a5;}

/* OMAE — burgundy velvet, brass rules and five lines of a musical staff. */
:root[data-theme="omae"] .identity:before {content:'OPUS / I';font:11px Cinzel,serif;letter-spacing:.2em;padding:14px 0 18px;width:100px;background:repeating-linear-gradient(0deg,transparent 0 5px,rgba(212,179,116,.16) 5px 6px) bottom/100% 25px no-repeat;}
:root[data-theme="omae"] .stage:before {border-top:3px double var(--line);border-bottom:3px double var(--line);}
:root[data-theme="omae"] .story h2 {color:#f4ddb3;}
:root[data-theme="omae"] .story .eyebrow {font-family:Cinzel,serif;letter-spacing:.2em;}
:root[data-theme="omae"] .character-card img {border-radius:50% 50% 2px 2px;}
:root[data-theme="omae"] .biography-dialog {border-radius:0;border:3px double var(--gold);}

/* GAHO — tarnished gold, a broken sun and a violet curse in the margins. */
:root[data-theme="gaho"] .identity:before {content:'☼';font:44px/1 'Segoe UI Symbol',serif;color:#b39463;text-shadow:7px 3px 0 rgba(161,112,180,.15);}
:root[data-theme="gaho"] .stage:before {border-style:solid;border-bottom-color:#897297;}
:root[data-theme="gaho"] .story[data-panel="1"]>p:not(.eyebrow) {font-family:'Noto Sans KR',sans-serif;font-size:14px;letter-spacing:.03em;color:#c3aed2;}
:root[data-theme="gaho"] .story[data-panel="2"]>p:not(.eyebrow):last-of-type {font-size:13px;padding:13px 15px;border-left:2px solid #80648d;background:rgba(0,0,0,.1);}
:root[data-theme="gaho"] .character-card img {border-radius:2px;}
:root[data-theme="gaho"] .biography-dialog {border-radius:2px;border-right:4px solid #8c6da5;}
:root[data-theme="gaho"] #biography-copy {font-family:'Noto Sans KR',sans-serif;word-break:normal;}

/* QUPI — rose stationery, soft serifs and a sealed love letter. */
:root[data-theme="qupi"] .identity:before {content:'♡';font:45px/1 Georgia,serif;transform:rotate(-9deg);}
:root[data-theme="qupi"] .stage:before {border-radius:40% 40% 0 0/8% 8% 0 0;}
:root[data-theme="qupi"] .story h2 {color:#a5597b;font-weight:700;}
:root[data-theme="qupi"] .profile {border-top:1px solid var(--line);padding-top:19px;}
:root[data-theme="qupi"] .story-rule:after {content:'♡';display:block;color:var(--gold);position:relative;left:104px;top:-9px;font:17px Georgia,serif;}
:root[data-theme="qupi"] .biography-open {border-radius:24px;border-color:#dca9bf;}
:root[data-theme="qupi"] .biography-dialog {border:1px solid #d4a5b8;border-radius:24px;background:linear-gradient(145deg,#fff8f6,#ffeaf1);}
:root[data-theme="qupi"] .character-card[aria-pressed="true"] {border-radius:18px;background:#fff6f6;}

/* TEMUR — moonlit obsidian, amethyst and the weight of an ancient grimoire. */
:root[data-theme="temur"] .identity:before {content:'✧';font:45px/1 Georgia,serif;text-shadow:0 0 23px #9776ca;}
:root[data-theme="temur"] .edition {letter-spacing:.15em;}
:root[data-theme="temur"] h1 {letter-spacing:.015em;}
:root[data-theme="temur"] .profile {border-right:1px solid var(--line);padding-right:20px;}
:root[data-theme="temur"] .occupation {font-size:22px;}
:root[data-theme="temur"] .story h2 {color:#dfc8f4;}
:root[data-theme="temur"] .story-rule {width:125px;}
:root[data-theme="temur"] .facts dd {font-size:13px;}
:root[data-theme="temur"] .biography-dialog {border:3px double #9e83ba;border-radius:3px;}

/* BONGSIK — warm linen, sage and the unhurried tone of a personal note. */
:root[data-theme="bongsik"] .identity:before {content:'RP';font:24px/1.5 Georgia,serif;letter-spacing:.06em;border:1px solid #a8ae91;border-radius:50%;width:51px;height:51px;text-align:center;padding-top:7px;}
:root[data-theme="bongsik"] .story h2 {font-weight:400;letter-spacing:-.035em;}
:root[data-theme="bongsik"] .facts {grid-template-columns:.8fr 1.3fr 1.1fr;gap:10px;}
:root[data-theme="bongsik"] .facts dd {font-size:12px;}
:root[data-theme="bongsik"] .profile .hobby p {font-size:12px;}
:root[data-theme="bongsik"] .character-card img {border-radius:14px;}
:root[data-theme="bongsik"] .biography-dialog {border-radius:17px;border-color:#a7ad91;}

/* HAETNYANG — a little scout's scrapbook with strawberry pink and paw marks. */
:root[data-theme="haetnyang"] .identity:before {content:'🐾';font:32px/1.4 sans-serif;transform:rotate(-15deg);background:#f5dfc4;border:2px solid #fff8eb;border-radius:20px;padding:8px 11px;}
:root[data-theme="haetnyang"] .stage:before {border:2px dashed #b8c5a4;border-radius:26px;}
:root[data-theme="haetnyang"] .story h2 {color:#52755b;font-size:clamp(28px,2.8vw,39px);}
:root[data-theme="haetnyang"] .story[data-panel="2"] h2 {color:#b66e83;}
:root[data-theme="haetnyang"] .profile {padding:20px;border:1px dashed #bbc79c;border-radius:24px;background:rgba(255,251,236,.65);}
:root[data-theme="haetnyang"] .profile:after {content:'♡';position:absolute;top:-19px;right:18px;font:32px Georgia,serif;color:#c48a98;transform:rotate(12deg);}
:root[data-theme="haetnyang"] .character-card {border-radius:18px;}
:root[data-theme="haetnyang"] .character-card img {border-radius:40% 40% 15px 15px;}
:root[data-theme="haetnyang"] .character-card[aria-pressed="true"] {background:#fff7e7;border-color:#a2b087;box-shadow:0 3px 0 #d1d9bb;}
:root[data-theme="haetnyang"] .biography-open {font-family:Jua,sans-serif;font-size:15px;background:#fce1e4;border-color:#dab0b8;border-radius:20px;color:#8f5666;box-shadow:0 3px 0 #e6c7ca;}
:root[data-theme="haetnyang"] .biography-dialog {border-radius:25px;border:2px dashed #a8b88a;}
:root[data-theme="haetnyang"] .quote-mark {display:none;}

/* HAZEL — wine-red velvet, stitched edges and a letter held close. */
:root[data-theme="hazel"] .identity:before {content:'♡';font:40px Georgia,serif;border:1px dashed #975d6b;border-radius:50%;width:56px;text-align:center;transform:rotate(-9deg);}
:root[data-theme="hazel"] .stage:before {border-style:dashed;border-color:#794451;}
:root[data-theme="hazel"] .story h2 {color:#edc1c6;}
:root[data-theme="hazel"] .story[data-panel="2"]>p:not(.eyebrow) {font-size:14px;line-height:1.95;color:#cbaeb4;}
:root[data-theme="hazel"] .character-rail {background:linear-gradient(180deg,#341b26,#201119);}
:root[data-theme="hazel"] .profile {max-width:240px;}
:root[data-theme="hazel"] .biography-dialog {border:1px dashed #c48998;border-radius:17px;background:#301c24;}
:root[data-theme="hazel"] #biography-copy {word-break:break-all;line-height:2.1;}
:root[data-theme="hazel"] .biography-open {border-radius:22px;border-style:dashed;border-color:#a66b7c;color:#e7bbc5;}

@media(min-width:801px) and (max-width:1200px){
  :root[data-collection="remaining"] .profile {right:4%;width:27%;}
  :root[data-collection="remaining"] .occupation {font-size:21px;}
  :root[data-collection="remaining"] .story {width:34%;}
  :root[data-collection="remaining"] .story h2 {font-size:28px;}
  :root[data-collection="remaining"] .story>p:not(.eyebrow) {font-size:15px;}
  :root[data-theme="gaho"] .story[data-panel="1"]>p:not(.eyebrow) {font-size:13px;}
}
@media(max-width:800px){
  :root[data-collection="remaining"] .film:after {background:linear-gradient(0deg,var(--paper),transparent 37%,transparent 70%,var(--paper) 90%);}
  :root[data-collection="remaining"] .identity:before {display:none;}
  :root[data-collection="remaining"] .identity,:root[data-collection="remaining"] .stage[data-scene] .identity {top:11%;left:7%;bottom:auto;}
  :root[data-collection="remaining"] h1,:root[data-collection="remaining"] .stage:not([data-scene="0"]) h1 {font-size:28px;line-height:1.3;}
  :root[data-collection="remaining"] h1 .character-alias {font-size:10px;line-height:1.4;letter-spacing:.02em;margin-top:8px;}
  :root[data-collection="remaining"] h1 span:not(.character-alias) {font-size:7px;letter-spacing:.03em;margin-top:7px;}
  :root[data-collection="remaining"] h1 .character-alias~span {display:none;}
  :root[data-collection="remaining"] .profile {top:54%;left:7%;right:7%;width:auto;max-width:none;display:block;border:0;padding:0;background:none;}
  :root[data-collection="remaining"] .profile .eyebrow {font-size:9px;letter-spacing:.03em;margin-bottom:11px;}
  :root[data-collection="remaining"] .occupation {font-size:20px;line-height:1.5;margin-bottom:13px;}
  :root[data-collection="remaining"] .facts {border-top:1px solid var(--line);padding:10px 0;gap:10px;}
  :root[data-collection="remaining"] .facts dt {font-size:9px;margin-bottom:6px;}
  :root[data-collection="remaining"] .facts dd {font-size:13px;line-height:1.5;}
  :root[data-collection="remaining"] .facts dd small {font-size:9px;}
  :root[data-collection="remaining"] .hobby {padding-top:11px;gap:14px;}
  :root[data-collection="remaining"] .hobby p {font-size:12px;line-height:1.75;}
  :root[data-collection="remaining"] .story {top:54%;left:7%;width:86%;max-width:none;}
  :root[data-collection="remaining"] .story .eyebrow {font-size:9px;letter-spacing:.06em;margin-bottom:12px;}
  :root[data-collection="remaining"] .story h2 {font-size:23px;line-height:1.45;margin-bottom:12px;}
  :root[data-collection="remaining"] .story>p:not(.eyebrow) {font-size:14px;line-height:1.75;}
  :root[data-collection="remaining"] .biography-open {font-size:12px;padding:9px 13px;margin-top:5px;}
  :root[data-collection="remaining"] .biography-dialog {padding:21px;max-height:87svh;}
  :root[data-collection="remaining"] .biography-dialog h2 {font-size:25px;}
  :root[data-collection="remaining"] .biography-dialog p {font-size:14px;}
  :root[data-theme="nezumi"] .occupation {font-size:18px;}
  :root[data-theme="anna"] .occupation {font-size:17px;}
  :root[data-theme="gaho"] .story[data-panel="1"]>p:not(.eyebrow) {font-size:12px;line-height:1.8;}
  :root[data-theme="gaho"] .story[data-panel="2"]>p:not(.eyebrow):last-of-type {font-size:12px;padding:10px;}
  :root[data-theme="bongsik"] .facts dd {font-size:11px;}
  :root[data-theme="bongsik"] .profile .hobby p {font-size:11px;}
  :root[data-theme="haetnyang"] .stage:before {border-width:1px;border-radius:18px;}
  :root[data-theme="haetnyang"] .profile:after {display:none;}
  :root[data-theme="hazel"] .story[data-panel="2"]>p:not(.eyebrow) {font-size:13px;line-height:1.8;}
}
@media(max-width:800px) and (max-height:760px){
  :root[data-collection="remaining"] .profile {top:46%;}
  :root[data-collection="remaining"] .profile .eyebrow {margin-bottom:9px;}
  :root[data-collection="remaining"] .occupation {font-size:19px;margin-bottom:11px;}
  :root[data-collection="remaining"] .story {top:47%;}
  :root[data-collection="remaining"] .story h2 {font-size:21px;line-height:1.45;margin-bottom:10px;}
  :root[data-collection="remaining"] .story>p:not(.eyebrow) {font-size:13px;line-height:1.7;}
  :root[data-theme="anna"] .occupation,:root[data-theme="nezumi"] .occupation {font-size:17px;}
  :root[data-theme="gaho"] .story[data-panel="1"]>p:not(.eyebrow) {font-size:12px;}
  :root[data-theme="hazel"] .story[data-panel="2"]>p:not(.eyebrow) {font-size:12px;line-height:1.7;}
}
@media(min-width:500px) and (max-width:800px) and (max-height:760px){
  :root[data-collection="remaining"] .profile {top:54%;}
  :root[data-collection="remaining"] .story {top:55%;}
}