/* Claude-style ivory paper, charcoal ink, terracotta manuscript emphasis.
   Light surfaces share one paper color; borders and spacing separate sections. */
:root {
  color-scheme:light;
  --page:#faf9f5; --surface:var(--page); --raised:#efece4;
  --ink:#1f1e1d; --secondary:#6e6b64; --muted:var(--secondary);
  --line:#e7e4da; --line-control:#d6d2c6; --line-strong:#c3beb2;
  --hover:#efece4; --selected:#e9e5da; --accent:#b3532f;
  --button:#b3532f; --button-ink:#ffffff; --focus:#b3532f;
  --scene-bg:#f0e7de; --scene-ink:#8f4629; --speaker:#a1502f;
  --notice-bg:#f0e7de; --notice-ink:#4a3f33;
  --fs-small:13px; --fs-body:16px; --fs-section:24px; --fs-title:40px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-synthesis:none;
}
:root[data-theme="dark"] {
  color-scheme:dark;
  --page:#1f1e1d; --surface:var(--page); --raised:#2e2c28;
  --ink:#f5f4ee; --secondary:#b8b3a6;
  --line:#3d3a34; --line-control:#4a463f; --line-strong:#5c5750;
  --hover:#2f2d29; --selected:#3a3733; --accent:#d97757;
  --button:#d97757; --button-ink:#1f1e1d; --focus:#d97757;
  --scene-bg:#332c26; --scene-ink:#f0b9a0; --speaker:#e89b7d;
  --notice-bg:#332c26; --notice-ink:#e8e3d8;
}
:root[data-reading-size="18"] { --fs-body:18px; }
:root[data-reading-size="20"] { --fs-body:20px; }
* { box-sizing:border-box; }
body { margin:0; background:var(--page); color:var(--ink); font-size:var(--fs-body); line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; color:var(--ink); }
button,select { cursor:pointer; }
button { border:0; }
a,button,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button:disabled { cursor:default; opacity:.4; }
:focus-visible { outline:2px solid var(--focus); outline-offset:4px; }
h1,h2,h3,h4,p { margin:0; }
h1,h2,h3 { line-height:1.35; font-weight:600; }
h1 { font-size:var(--fs-title); letter-spacing:-.035em; }
h2 { font-size:var(--fs-section); letter-spacing:-.02em; }
h3 { font-size:var(--fs-body); }
small,.fine-print,.eyebrow { font-size:var(--fs-small); }
.muted,.eyebrow,.fine-print { color:var(--secondary); }
.page-shell { width:min(1200px,100%); margin:auto; padding:48px 32px 72px; }
.site-header { position:sticky; top:0; z-index:20; border-bottom:.5px solid var(--line); background:var(--page); }
.header-inner { width:min(1200px,100%); min-height:72px; padding:12px 32px; margin:auto; display:flex; align-items:center; gap:32px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-weight:650; white-space:nowrap; }
.brand-mark { display:grid; place-items:center; width:28px; height:28px; border:.5px solid var(--line-strong); border-radius:6px; }
.site-header nav { display:flex; margin-left:auto; align-items:center; gap:28px; }
.site-header nav a { display:flex; align-items:center; min-height:44px; color:var(--secondary); font-size:var(--fs-small); white-space:nowrap; }
.site-header nav a[aria-current="page"] { color:var(--ink); text-decoration:underline; text-underline-offset:9px; }
.header-actions { display:flex; align-items:center; gap:8px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 20px; border-radius:8px; background:var(--button); color:var(--button-ink); font-size:var(--fs-small); font-weight:600; text-align:center; }
.button.secondary { background:transparent; color:var(--ink); border:.5px solid var(--line-control); }
.button.small { padding:8px 14px; white-space:nowrap; }
.button.full { width:100%; }
.icon-button { width:44px; height:44px; background:transparent; border-radius:6px; color:var(--secondary); font-size:var(--fs-section); }
.text-link,.text-button { color:var(--accent); font-size:var(--fs-small); }
.text-button { background:transparent; padding:8px 0; }
.hero { padding:12px 0 36px; max-width:800px; }
.hero p { margin-top:18px; max-width:600px; color:var(--secondary); }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }
.resume-link { display:inline-block; margin-top:20px; color:var(--accent); font-size:var(--fs-small); }
.section { margin-top:40px; }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; margin-bottom:20px; }
.section-heading > a { flex:0 0 auto; }
.section-heading p,.page-intro p { color:var(--secondary); margin-top:10px; }
.script-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.script-card { min-width:0; display:flex; flex-direction:column; border:.5px solid var(--line); border-radius:12px; background:var(--surface); overflow:hidden; }
.cover { padding:24px 24px 20px; min-height:150px; display:flex; flex-direction:column; justify-content:space-between; gap:18px; }
.card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cover-label { font-size:var(--fs-small); color:var(--secondary); }
.trade-badge { flex:0 1 auto; max-width:65%; padding:3px 9px; border:.5px solid var(--line-control); border-radius:5px; background:var(--raised); color:var(--ink); font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.cover h3 { font-size:var(--fs-section); min-height:2.7em; }
.card-body { padding:0 24px 24px; flex:1; display:flex; flex-direction:column; }
.card-meta { color:var(--secondary); font-size:var(--fs-small); margin-bottom:10px; }
.card-logline { color:var(--secondary); font-size:var(--fs-small); line-height:1.8; min-height:70px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.card-foot { border-top:.5px solid var(--line); padding:16px 24px; display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--raised); font-size:var(--fs-small); }
.card-detail { color:var(--secondary); padding:8px 0; white-space:nowrap; }
.card-read { white-space:nowrap; }
.card-detail:hover { color:var(--accent); }
.two-column { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; }
.panel { min-width:0; padding:28px 0; border-top:.5px solid var(--line); }
.panel h3 { font-size:var(--fs-section); margin-bottom:12px; }
.panel p { color:var(--secondary); }
.mini-list { margin:20px 0; }
.mini-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; border-bottom:.5px solid var(--line); }
.mini-row strong { font-weight:500; }
.mini-row span { color:var(--accent); font-size:var(--fs-small); white-space:nowrap; }
.page-intro { max-width:760px; margin-bottom:32px; }
.filters { display:grid; grid-template-columns:minmax(200px,1fr) repeat(2,minmax(140px,180px)); gap:16px; margin-bottom:16px; }
.filters.single { grid-template-columns:minmax(200px,1fr) minmax(140px,200px); }
.market-filters { margin-top:24px; }
.field-label { display:block; font-size:var(--fs-small); color:var(--secondary); margin-bottom:8px; }
input,select,textarea { background:var(--surface); border:.5px solid var(--line-control); border-radius:6px; min-height:44px; width:100%; min-width:0; padding:10px 12px; }
textarea { resize:vertical; }
.result-note { display:flex; gap:16px; color:var(--muted); font-size:var(--fs-small); margin:20px 0; }
.pagination { margin-top:28px; display:flex; justify-content:center; align-items:center; gap:8px; flex-wrap:wrap; }
.page-button { background:transparent; border:.5px solid var(--line-control); min-width:44px; height:44px; padding:0 12px; border-radius:6px; font-size:var(--fs-small); display:inline-flex; align-items:center; justify-content:center; }
.page-button[aria-current="page"] { background:var(--selected); border-color:var(--line-strong); }
.empty { text-align:center; padding:56px 16px; border-top:.5px solid var(--line); color:var(--secondary); }
.empty-title { font-size:var(--fs-section); }
.breadcrumb { display:inline-block; color:var(--secondary); font-size:var(--fs-small); margin-bottom:28px; }
.detail-grid { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:64px; align-items:start; }
.detail-heading { display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; margin:12px 0 20px; }
.detail-heading .detail-title { margin:0; }
.detail-heading .trade-badge { flex:none; }
.detail-title { margin:12px 0 20px; max-width:19em; }
.detail-logline { color:var(--secondary); max-width:44em; }
.synopsis-more { margin-top:16px; color:var(--secondary); }
.synopsis-more summary { color:var(--accent); cursor:pointer; min-height:44px; font-size:var(--fs-small); }
.synopsis-more p { padding:12px 0; }
.metric-records { display:flex; flex-wrap:wrap; gap:40px; padding:24px 0; border-bottom:.5px solid var(--line); }
.metric-record strong { display:block; font-size:var(--fs-section); font-weight:600; font-variant-numeric:tabular-nums; }
.metric-record p { color:var(--secondary); font-size:var(--fs-small); margin-top:8px; }
#main { scroll-margin-top:120px; }
#main:focus { outline:none; }
.facts { margin:24px 0; display:flex; gap:32px; flex-wrap:wrap; }
.facts div { min-width:85px; }
.facts dt { color:var(--muted); font-size:var(--fs-small); }
.facts dd { margin:6px 0 0; }
.contact-side { position:sticky; top:96px; }
.contact-side h3 { font-size:var(--fs-body); }
.contact-side p { margin-bottom:20px; }
.character-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:24px; }
.character { border-top:.5px solid var(--line); padding-top:16px; }
.character p { color:var(--secondary); font-size:var(--fs-small); margin-top:6px; }
.reading { max-width:790px; margin:32px auto 0; }
.reader-toolbar { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.reader-toolbar select { max-width:240px; }
.reader-settings { display:flex; gap:8px; }
.reader-settings button { min-width:44px; height:44px; background:var(--surface); border:.5px solid var(--line-control); border-radius:6px; font-size:var(--fs-small); }
.episode-track { display:flex; flex-wrap:wrap; gap:8px; padding:16px 0 24px; }
.episode-track a,.episode-track button { padding:8px 14px; min-height:44px; background:transparent; border:.5px solid var(--line-control); border-radius:6px; white-space:nowrap; font-size:var(--fs-small); }
.episode-track [aria-current="page"] { background:var(--selected); border-color:var(--line-strong); }
.manuscript { font-size:var(--fs-body); line-height:1.8; padding:32px; border:.5px solid var(--line); border-radius:12px; background:var(--surface); overflow-wrap:anywhere; }
.manuscript + .manuscript { margin-top:24px; }
.manuscript h2 { margin-bottom:12px; }
.scene-heading { display:inline-block; max-width:100%; margin:22px 0 0; padding:5px 12px; border-radius:6px; background:var(--scene-bg); color:var(--scene-ink); font-size:var(--fs-body); font-weight:700; }
.cast-line { color:var(--secondary); font-size:var(--fs-small); margin:8px 0 10px; }
.action-line,.raw-line { color:var(--secondary); font-size:var(--fs-small); margin:7px 0; }
.dialogue-line { margin:7px 0; }
.dialogue-line strong { color:var(--speaker); font-weight:700; }
.emotion { color:var(--secondary); font-size:var(--fs-small); }
.episode-end { margin-top:40px; border-top:.5px solid var(--line); padding-top:24px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.reader-title-anchor { scroll-margin-top:120px; }
.study-reading { width:min(790px,100%); margin:auto; }
.study-with-analysis { display:grid; grid-template-columns:minmax(0,2fr) minmax(240px,1fr); gap:40px; align-items:start; }
.market-method summary { cursor:pointer; min-height:44px; display:flex; align-items:center; }
.market-method p { margin-top:12px; font-size:var(--fs-small); }
.study-list { border-top:.5px solid var(--line); }
.study-row { padding:24px 0; border-bottom:.5px solid var(--line); display:grid; grid-template-columns:minmax(0,1fr) 150px 120px; gap:24px; align-items:center; }
.study-row h3 { margin-bottom:8px; }
.study-row p,.study-row small { color:var(--muted); font-size:var(--fs-small); }
.study-row small { display:block; }
.study-row .row-logline { color:var(--ink); font-size:var(--fs-body); margin-bottom:6px; }
.breakdown-group { margin-top:28px; }
.breakdown-group h3 { font-size:var(--fs-body); margin-bottom:8px; color:var(--accent); }
.chip-list,.relation-list { list-style:none; margin:12px 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.chip-list li,.relation-list li { padding:4px 12px; border:.5px solid var(--line-control); border-radius:999px; font-size:var(--fs-small); }
.study-row a { color:var(--accent); text-align:right; font-size:var(--fs-small); }
.source-note { color:var(--secondary); font-size:var(--fs-small); margin-top:16px; }
.genre-entry { margin:8px 0 28px; }
.genre-entry h2 { font-size:var(--fs-body); margin-bottom:12px; }
.genre-tiles { display:flex; flex-wrap:wrap; gap:8px; }
.genre-tiles a { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border:.5px solid var(--line-control); border-radius:999px; color:var(--ink); min-height:44px; }
.genre-tiles small { color:var(--muted); font-size:var(--fs-small); }
.genre-overview { margin:0 0 32px; padding-bottom:8px; border-bottom:.5px solid var(--line); }
.insight { padding:20px 0; border-top:.5px solid var(--line); }
.insight p { margin:12px 0; }
.market-table-wrap { overflow-x:auto; border-top:.5px solid var(--line); }
table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
th,td { text-align:left; padding:18px 16px; border-bottom:.5px solid var(--line); }
th { font-size:var(--fs-small); font-weight:500; color:var(--secondary); background:var(--surface); }
td { vertical-align:top; }
td small { display:block; color:var(--muted); margin-top:4px; }
.market-title { display:inline-block; font-weight:500; max-width:26em; }
.market-title:hover { text-decoration:underline; }
.number { white-space:nowrap; font-variant-numeric:tabular-nums; }
.site-footer { width:min(1200px,100%); margin:auto; padding:32px; border-top:.5px solid var(--line); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px; color:var(--muted); font-size:var(--fs-small); }
.footer-brand { color:var(--ink); font-weight:600; }
.footer-links { display:flex; align-items:start; gap:24px; flex-wrap:wrap; }
.footer-links .text-button { padding:0; }
dialog { width:min(480px,calc(100% - 32px)); margin:auto; border:.5px solid var(--line-control); border-radius:12px; padding:24px; background:var(--surface); color:var(--ink); max-height:calc(100dvh - 40px); overflow-y:auto; }
dialog::backdrop { background:var(--page); opacity:.8; }
.dialog-top { display:flex; justify-content:flex-end; margin:-12px -12px 0 0; }
dialog h2 { margin-bottom:12px; }
dialog textarea { margin-bottom:16px; }
#contact-method { margin:24px 0; }
#contact-method img { display:block; max-width:150px; margin:12px auto; }
.fine-print { margin-top:12px; }
.toast { display:none; margin-top:16px; padding:12px; background:var(--notice-bg); color:var(--notice-ink); border-radius:6px; font-size:var(--fs-small); }
.toast.visible { display:block; }
.skip-link { position:fixed; left:16px; top:-100px; padding:12px; background:var(--button); color:var(--button-ink); z-index:99; }
.skip-link:focus { top:12px; }
.reading-dock { display:none; }
.no-script { padding:24px; }
.cta-copy { margin:12px 0 24px; }
.cta-link-row { margin-top:24px; }
@media (hover:hover) { .script-card:hover { border-color:var(--line-strong); } .button.secondary:hover,.icon-button:hover { background:var(--hover); } }
@media (max-width:1000px) {
  .script-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .detail-grid { grid-template-columns:minmax(0,1fr) 240px; gap:32px; }
  .header-inner,.site-header nav { gap:20px; }
}
@media (max-width:700px) {
  :root { --fs-title:32px; }
  .header-inner { padding:8px 20px 0; gap:8px; flex-wrap:wrap; }
  .header-actions { margin-left:auto; gap:4px; }
  .site-header nav { order:3; width:100%; margin:0; gap:0; justify-content:space-between; border-top:.5px solid var(--line); }
  .page-shell { padding:32px 20px 48px; }
  .hero { padding:0 0 8px; }
  .section { margin-top:32px; }
  .section-heading { gap:12px; }
  .script-grid,.two-column,.detail-grid,.study-with-analysis { grid-template-columns:minmax(0,1fr); gap:20px; }
  .cover { min-height:112px; padding:20px; }
  .card-body { padding:0 20px 20px; }
  .filters,.filters.single { grid-template-columns:minmax(0,1fr); }
  .contact-side { position:static; }
  .character-list { gap:20px; }
  .reader-toolbar { align-items:center; }
  .manuscript { padding:24px 16px; }
  .scene-heading { padding:5px 12px; }
  .reader-toolbar select { max-width:190px; }
  .episode-track { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:thin; }
  .episode-track a,.episode-track button { flex:0 0 auto; }
  .study-row { grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:20px 0; }
  .study-row .number { grid-column:1; }
  .study-row small { display:inline; margin-left:8px; }
  .study-row > a { grid-column:2; grid-row:1/3; min-height:44px; display:grid; align-items:center; }
  .market-table-wrap table { table-layout:fixed; }
  .market-table-wrap th,.market-table-wrap td { padding:16px 8px; overflow-wrap:anywhere; }
  .market-table-wrap th:nth-child(2) { width:96px; }
  .market-table-wrap th:last-child { width:60px; }
  .market-table-wrap .optional { display:none; }
  .site-footer { padding:28px 20px; grid-template-columns:minmax(0,1fr); }
  .footer-links { gap:20px; }
  .reading-dock { position:fixed; bottom:0; left:0; right:0; z-index:15; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:10px 20px calc(10px + env(safe-area-inset-bottom)); background:var(--surface); border-top:.5px solid var(--line); }
  .reading-dock span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--fs-small); color:var(--secondary); }
  body.is-reading { padding-bottom:85px; }
}
@media (max-width:359px) { .header-inner,.page-shell { padding-left:16px; padding-right:16px; } .button.small { padding:8px 10px; } .reader-toolbar select { max-width:150px; } }
@media print { .site-header,.site-footer,.reading-dock,.reader-toolbar,.episode-track,dialog,.toast { display:none !important; } }
