
.novels{--novel-bg:#19182c;--novel-panel:#211e36;--novel-line:#47405e;--novel-ink:#fff9ef;--novel-muted:#dbd4e8;--novel-accent:#f8c17e;max-width:860px;margin:auto}
.novel-heading{display:grid;gap:12px;margin:3px 0 17px}
.novel-heading .link{justify-self:start;font-size:15px;padding:5px 0}
.novel-heading h1{font-size:clamp(34px,7vw,62px);letter-spacing:-.065em;line-height:1.04;text-wrap:balance}
.novel-heading p{color:var(--novel-muted);margin-top:9px;max-width:46ch}
.novel-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.novel-card{display:grid;grid-template-columns:108px minmax(0,1fr);align-items:center;gap:12px;padding:8px;text-align:left;color:var(--novel-ink);background:linear-gradient(115deg,var(--novel-theme),#221f34 73%);border:1px solid #575069;border-radius:16px;min-height:104px}
.novel-card:hover{border-color:var(--novel-accent)}
.novel-card-copy{display:grid;gap:3px;align-content:center;line-height:1.2;min-width:0}
.novel-card-copy strong{font-size:clamp(16px,3vw,22px);letter-spacing:-.035em;overflow-wrap:anywhere}
.novel-card-copy small{color:var(--novel-accent);font-weight:780;font-size:12px}
.novel-card-copy>span{font-size:13px;color:var(--novel-muted)}
.novel-cover-image{display:block;max-width:100%;object-fit:cover;background:#31294a}
.novel-card .novel-cover-image{width:108px;height:84px;border-radius:11px}
.novel-portrait{display:block;flex:none;background-color:#31294a;background-size:500% 400%;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px #fff2}
.novel-portrait[data-sheet="a"]{background-image:url("/portraits-a.jpg")}
.novel-portrait[data-sheet="b"]{background-image:url("/portraits-b.jpg")}
[data-theme="school"]{--novel-theme:#354428;--novel-accent:#dced9f}
[data-theme="garage"]{--novel-theme:#49302c;--novel-accent:#ffc38c}
[data-theme="romance"]{--novel-theme:#503047;--novel-accent:#ffbad8}
[data-theme="campus"]{--novel-theme:#443854;--novel-accent:#e3c5ff}
[data-theme="office"]{--novel-theme:#293d50;--novel-accent:#b8e3ff}
[data-theme="cyber"]{--novel-theme:#223e56;--novel-accent:#8ff3f6}
[data-theme="village"]{--novel-theme:#3a4029;--novel-accent:#f5da8c}
[data-theme="train"]{--novel-theme:#383453;--novel-accent:#e3cbff}
[data-theme="flat"]{--novel-theme:#4b3039;--novel-accent:#ffc5cc}
[data-theme="shift"]{--novel-theme:#214333;--novel-accent:#b9f3c7}
.novel-detail,.novel-phone{max-width:610px;margin:auto;background:var(--novel-panel);border:1px solid var(--novel-line);border-radius:19px;overflow:hidden}
.novel-cover{display:grid;grid-template-columns:minmax(0,1fr) clamp(78px,24vw,145px);align-items:center;gap:16px;padding:22px;background:linear-gradient(125deg,var(--novel-theme),#221e35 85%)}
.novel-cover .eyebrow,.novel-ending .eyebrow{color:var(--novel-accent);font-size:12px;letter-spacing:.035em;text-transform:none}
.novel-cover h2,.novel-ending h2{font-size:clamp(29px,6vw,52px);line-height:1.06;letter-spacing:-.06em;margin:6px 0 10px;text-wrap:balance}
.novel-cover p:not(.eyebrow),.novel-ending>p:last-of-type{font-size:17px;line-height:1.55;color:var(--novel-ink)}
.novel-cover .novel-cover-image{width:100%;aspect-ratio:1;border-radius:14px;align-self:center}
.novel-cast{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0;padding:16px 22px 10px}
.novel-cast li{min-width:0;text-align:center;color:var(--novel-muted);font-size:14px;line-height:1.25;overflow-wrap:anywhere}
.novel-cast .novel-portrait{width:min(100%,67px);aspect-ratio:1;border-radius:50%;margin:0 auto 6px}
.novel-actions{display:flex;flex-wrap:wrap;gap:8px;padding:12px 22px 21px}
.novel-actions .primary,.novel-compose .primary{background:var(--novel-accent);border-color:var(--novel-accent);color:#1d1725}
.novel-phone{background:var(--novel-bg)}
.novel-chathead{display:flex;align-items:center;gap:10px;background:var(--novel-theme);padding:12px 15px;border-bottom:1px solid var(--novel-line)}
.novel-chathead .novel-portrait{width:44px;height:44px;border-radius:50%}
.novel-chathead h2{font-size:19px;line-height:1.2}
.novel-chathead p{font-size:13px;color:var(--novel-muted);line-height:1.3;margin-top:3px}
.novel-signal{color:var(--novel-accent);font-size:8px;letter-spacing:3px;margin-left:auto;white-space:nowrap}
.novel-recap{padding:6px 15px;border-bottom:1px solid var(--novel-line);font-size:13px;color:var(--novel-muted)}
.novel-recap summary{cursor:pointer}
.novel-recap p{white-space:pre-line;padding:4px 0}
.novel-log{min-height:116px;display:flex;flex-direction:column;gap:10px;padding:14px}
.novel-message{display:flex;gap:7px;align-items:end;width:100%}
.novel-message .novel-portrait{width:33px;height:33px;border-radius:50%;margin-bottom:2px}
.novel-bubble{max-width:min(86%,450px);min-width:0;padding:7px 11px 8px;border-radius:12px 12px 12px 3px;background:#2b283f;color:var(--novel-ink);overflow-wrap:anywhere}
.novel-person{display:block;font-size:13px;color:var(--novel-accent);font-weight:770;margin-bottom:1px}
.novel-bubble p{font-size:17px;line-height:1.49}
.novel-you{justify-content:flex-end}
.novel-you .novel-bubble{background:#363b45;border-radius:12px 12px 3px 12px}
.novel-system{justify-content:center;text-align:center}
.novel-system .novel-bubble{background:#262238;border-radius:25px;color:var(--novel-muted)}
.novel-system .novel-bubble p{font-size:14px;line-height:1.45}
.novel-compose{border-top:1px solid var(--novel-line);padding:10px 14px 13px;background:#232036}
.novel-compose>.button{width:100%}
.novel-typing{display:flex;align-items:center;gap:5px;min-height:30px;color:var(--novel-muted)}
.novel-typing>span{display:block;background:var(--novel-accent);width:6px;height:6px;border-radius:50%;animation:novel-dot 1.05s ease-in-out infinite}
.novel-typing>span:nth-child(2){animation-delay:.13s}
.novel-typing>span:nth-child(3){animation-delay:.26s}
.novel-typing button{margin-left:7px}
.novel-choices{display:grid;gap:6px}
.novel-choice{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;padding:9px 11px;font-weight:670;font-size:15px;line-height:1.3;background:#302b46;color:var(--novel-ink);border:1px solid #5b526d;border-radius:10px;min-height:43px}
.novel-choice span{color:var(--novel-accent);font-size:18px;font-weight:800}
.novel-choice:hover:not(:disabled){border-color:var(--novel-accent);background:#3b3453}
.novel-ending{padding:24px;background:radial-gradient(ellipse at 10% 0%,var(--novel-theme),var(--novel-panel) 69%)}
.novel-ending .novel-portrait{width:110px;height:110px;border-radius:15px;margin-bottom:16px}
.novel-ending .novel-actions{padding:17px 0 0}
.novel-appear{animation:novel-bubble-in .23s ease-out both}
@keyframes novel-bubble-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes novel-dot{0%,65%,100%{opacity:.45;transform:translateY(0)}35%{opacity:1;transform:translateY(-3px)}}
@media(max-width:520px){
  .novel-catalog{gap:7px}
  .novel-card{grid-template-columns:1fr;gap:6px;padding:7px;align-content:start;min-height:0}
  .novel-card .novel-cover-image{width:100%;height:auto;aspect-ratio:1.44}
  .novel-card-copy{padding:3px 2px 5px}
  .novel-cover{grid-template-columns:1fr;padding:15px;gap:11px}
  .novel-cover .novel-cover-image{grid-row:1;aspect-ratio:2.15;border-radius:11px}
  .novel-cover p:not(.eyebrow){font-size:15px}
  .novel-cast,.novel-actions{padding-left:14px;padding-right:14px}
  .novel-actions .primary{flex:1 0 auto}
  .novel-bubble{max-width:calc(100% - 40px)}
}
@media(prefers-reduced-motion:reduce){.novel-appear,.novel-typing>span{animation:none}}
.novel-portrait[data-slot="0"]{background-position:0% 0%}
.novel-portrait[data-slot="1"]{background-position:25% 0%}
.novel-portrait[data-slot="2"]{background-position:50% 0%}
.novel-portrait[data-slot="3"]{background-position:75% 0%}
.novel-portrait[data-slot="4"]{background-position:100% 0%}
.novel-portrait[data-slot="5"]{background-position:0% 33.333333333333336%}
.novel-portrait[data-slot="6"]{background-position:25% 33.333333333333336%}
.novel-portrait[data-slot="7"]{background-position:50% 33.333333333333336%}
.novel-portrait[data-slot="8"]{background-position:75% 33.333333333333336%}
.novel-portrait[data-slot="9"]{background-position:100% 33.333333333333336%}
.novel-portrait[data-slot="10"]{background-position:0% 66.66666666666667%}
.novel-portrait[data-slot="11"]{background-position:25% 66.66666666666667%}
.novel-portrait[data-slot="12"]{background-position:50% 66.66666666666667%}
.novel-portrait[data-slot="13"]{background-position:75% 66.66666666666667%}
.novel-portrait[data-slot="14"]{background-position:100% 66.66666666666667%}
.novel-portrait[data-slot="15"]{background-position:0% 100%}
.novel-portrait[data-slot="16"]{background-position:25% 100%}
.novel-portrait[data-slot="17"]{background-position:50% 100%}
.novel-portrait[data-slot="18"]{background-position:75% 100%}
.novel-portrait[data-slot="19"]{background-position:100% 100%}

[data-theme="blackout"]{--novel-theme:#381c23;--novel-accent:#ffc0b6}
[data-theme="score"]{--novel-theme:#1c294b;--novel-accent:#dafa92}
.novel-portrait[data-sheet="c"]{background-image:url("/portraits-c.jpg");background-size:400% 200%}
.novel-layout-switch{display:flex;flex-wrap:wrap;gap:5px;width:fit-content;margin-top:14px;padding:4px;background:#1f1d33;border:1px solid #514964;border-radius:13px}
.novel-layout-switch button{border:1px solid transparent;border-radius:9px;background:none;color:#e7dff3;padding:7px 11px;font-size:14px;font-weight:700}
.novel-layout-switch button[aria-pressed="true"]{background:#d9c7ff;color:#21182f}
.novel-heading h1{letter-spacing:-.059em}
.novel-card{min-width:0;overflow:hidden}
.novel-card-copy strong,.novel-cover h2{text-wrap:balance}
.novel-card[data-featured="true"] .novel-card-copy strong{font-family:"Archivo Black",Impact,"Segoe UI",sans-serif;font-weight:900;letter-spacing:-.015em}
.novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"]{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:clamp(228px,36vw,355px);padding:15px;background:#161425;border-radius:19px}
.novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"] .novel-cover-image{position:absolute;inset:0;width:100%;height:100%;border-radius:0;object-position:center 42%;z-index:-2}
.novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"]::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0d0d1800 38%,#0c0918c0 68%,#0c0918 98%)}
.novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"] .novel-card-copy{gap:4px}
.novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"] .novel-card-copy strong{font-size:clamp(26px,6.8vw,54px);line-height:.97;text-shadow:0 2px 8px #09071d}
.novels[data-layout="cinema"] .novel-card[data-featured="true"]:hover{border-color:#f5d5ac}
.novels[data-layout="neon"]{--novel-panel:#181e36;--novel-bg:#10152b;--novel-line:#455982}
.novels[data-layout="neon"] .novel-heading h1{color:#c9f6ff;text-shadow:0 0 23px #56a2d64d}
.novels[data-layout="neon"] .novel-layout-switch button[aria-pressed="true"]{background:#abf0fd;color:#122837}
.novels[data-layout="neon"] .novel-card{border-color:#5b7c9f;background:#1d2540;box-shadow:inset 0 0 15px #599ed015}
.novels[data-layout="neon"] .novel-card[data-featured="true"]{border-color:#91d9f9;box-shadow:0 0 20px #40a6e32b}
.novels[data-layout="tiles"] .novel-catalog{gap:8px}
.novels[data-layout="tiles"] .novel-card{border-radius:12px;box-shadow:none}
.novels[data-layout="tiles"] .novel-layout-switch button[aria-pressed="true"]{background:#dcf395;color:#25321b}
.novel-detail:is([data-theme="blackout"],[data-theme="score"]) .novel-cover-image{object-position:center 39%}
.novel-detail .novel-actions{gap:8px}
.novel-detail .novel-actions>.button{min-height:43px}
@media(min-width:700px){.novels[data-layout="tiles"] .novel-catalog{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){
  .novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"]{padding:9px;min-height:clamp(198px,56vw,270px);border-radius:14px}
  .novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"] .novel-card-copy strong{font-size:clamp(19px,6.4vw,32px)}
  .novels:is([data-layout="cinema"],[data-layout="neon"]) .novel-card[data-featured="true"] .novel-card-copy>span{font-size:12px}
  .novels[data-layout="tiles"] .novel-card .novel-cover-image{aspect-ratio:1.82}
  .novel-detail:is([data-theme="blackout"],[data-theme="score"]) .novel-cover-image{aspect-ratio:1.65}
  .novel-detail .novel-actions #novel-start.primary{flex-basis:100%}
}
.novel-portrait[data-sheet="c"][data-slot="0"]{background-position:0% 0%}
.novel-portrait[data-sheet="c"][data-slot="1"]{background-position:33.333333333333336% 0%}
.novel-portrait[data-sheet="c"][data-slot="2"]{background-position:66.66666666666667% 0%}
.novel-portrait[data-sheet="c"][data-slot="3"]{background-position:100% 0%}
.novel-portrait[data-sheet="c"][data-slot="4"]{background-position:0% 100%}
.novel-portrait[data-sheet="c"][data-slot="5"]{background-position:33.333333333333336% 100%}
.novel-portrait[data-sheet="c"][data-slot="6"]{background-position:66.66666666666667% 100%}
.novel-portrait[data-sheet="c"][data-slot="7"]{background-position:100% 100%}
.novel-extras{margin:8px 15px 2px;border:1px solid var(--novel-line);padding:9px 11px;border-radius:10px;color:var(--novel-muted)}
.novel-extras summary{cursor:pointer;font-weight:700}
.novel-extras h3{font-size:14px;margin:10px 0 4px}
.novel-extras .link{display:block;padding:5px 0}
.novel-extras details p{font-size:14px;padding:5px 0}
