.photo-frame[data-rot="0"] img{transform:rotate(0deg)}.photo-frame[data-rot="90"] img{transform:rotate(90deg)}.photo-frame[data-rot="180"] img{transform:rotate(180deg)}.photo-frame[data-rot="270"] img{transform:rotate(270deg)}.photo-frame[data-ct="0"] img{--ct:0%}.photo-frame[data-ct="5"] img{--ct:5%}.photo-frame[data-ct="10"] img{--ct:10%}.photo-frame[data-ct="15"] img{--ct:15%}.photo-frame[data-ct="20"] img{--ct:20%}.photo-frame[data-ct="25"] img{--ct:25%}.photo-frame[data-ct="30"] img{--ct:30%}.photo-frame[data-ct="35"] img{--ct:35%}.photo-frame[data-ct="40"] img{--ct:40%}.photo-frame[data-ct="45"] img{--ct:45%}.photo-frame[data-cr="0"] img{--cr:0%}.photo-frame[data-cr="5"] img{--cr:5%}.photo-frame[data-cr="10"] img{--cr:10%}.photo-frame[data-cr="15"] img{--cr:15%}.photo-frame[data-cr="20"] img{--cr:20%}.photo-frame[data-cr="25"] img{--cr:25%}.photo-frame[data-cr="30"] img{--cr:30%}.photo-frame[data-cr="35"] img{--cr:35%}.photo-frame[data-cr="40"] img{--cr:40%}.photo-frame[data-cr="45"] img{--cr:45%}.photo-frame[data-cb="0"] img{--cb:0%}.photo-frame[data-cb="5"] img{--cb:5%}.photo-frame[data-cb="10"] img{--cb:10%}.photo-frame[data-cb="15"] img{--cb:15%}.photo-frame[data-cb="20"] img{--cb:20%}.photo-frame[data-cb="25"] img{--cb:25%}.photo-frame[data-cb="30"] img{--cb:30%}.photo-frame[data-cb="35"] img{--cb:35%}.photo-frame[data-cb="40"] img{--cb:40%}.photo-frame[data-cb="45"] img{--cb:45%}.photo-frame[data-cl="0"] img{--cl:0%}.photo-frame[data-cl="5"] img{--cl:5%}.photo-frame[data-cl="10"] img{--cl:10%}.photo-frame[data-cl="15"] img{--cl:15%}.photo-frame[data-cl="20"] img{--cl:20%}.photo-frame[data-cl="25"] img{--cl:25%}.photo-frame[data-cl="30"] img{--cl:30%}.photo-frame[data-cl="35"] img{--cl:35%}.photo-frame[data-cl="40"] img{--cl:40%}.photo-frame[data-cl="45"] img{--cl:45%}
:root{
  color-scheme:light;
  --paper:#faf9f7;--surface:#fff;--ground:#f5f3ef;--sunk:#f0ede7;
  --ink:#221e1b;--muted:#75726e;--line:#e7e2db;--line-strong:#d8d1c7;
  --accent:#8f4d39;--accent-strong:#6f3627;--accent-soft:#eadbd5;--accent-wash:#f6edea;
  --ok-bg:#e7f0e4;--ok-ink:#2f6b47;--warn-bg:#fdf3e6;--warn-ink:#8a5426;
  --info-bg:#e5f1fc;--info-ink:#2c5f8a;--rest-bg:#eeecea;--rest-ink:#5c5a57;
  --radius:10px;--radius-sm:7px;
  --serif:"Songti SC","Source Han Serif SC","Noto Serif CJK SC","SimSun",serif;
  font:16px/1.65 system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink)}
button,input,textarea,select{font:inherit;max-width:100%}
a{color:var(--accent)}
button,a,input,textarea,select,summary{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button{cursor:pointer;border:1px solid transparent;border-radius:var(--radius-sm);background:var(--accent);color:#fff;padding:10px 18px;line-height:1.5;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;font-weight:500}
button:hover:not(:disabled){background:var(--accent-strong)}
button:disabled{opacity:.45;cursor:not-allowed}
button.secondary{background:var(--surface);color:var(--accent);border-color:var(--accent-soft)}
button.secondary:hover:not(:disabled){background:var(--accent-wash);border-color:var(--accent)}
button.text-button{background:transparent;color:var(--accent);border-color:transparent;padding:8px 6px;min-height:40px;font-weight:500}
button.text-button:hover:not(:disabled){background:var(--accent-wash)}
svg.feather{flex-shrink:0;vertical-align:middle}
input:not([type=checkbox]),textarea,select{display:block;width:100%;padding:11px 13px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink)}
textarea{resize:vertical;line-height:1.75}
input[type=checkbox]{width:21px;height:21px;flex-shrink:0;accent-color:var(--accent);margin:3px 0}
label{display:block;font-weight:500;margin:14px 0}
h1,h2,h3,p{margin-top:0}
h1{font-size:31px;font-weight:600;letter-spacing:.4px}
h2{font-size:21px;font-weight:600}
h3{font-size:16px;font-weight:600}
small,.muted{color:var(--muted);font-size:14px}
.eyebrow{color:var(--muted);font-size:13px;letter-spacing:1.2px;margin-bottom:6px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-80px;left:16px;z-index:20;padding:12px;background:var(--surface);border-radius:var(--radius-sm)}
.skip-link:focus{top:10px}

main{display:grid;grid-template-columns:252px minmax(0,1fr) 320px;min-height:100vh}
body.aux-collapsed main{grid-template-columns:252px minmax(0,1fr)}
body.aux-collapsed .aux{position:fixed;right:12px;top:12px;width:auto;height:auto;padding:0;border:0;background:transparent;z-index:5}
body.aux-collapsed .aux-head h2,body.aux-collapsed #aux-body{display:none}
body.aux-collapsed .aux-head{padding:0}
.book-badge #book-byline,.book-badge #account-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.save-state{border-top:1px solid var(--line-strong);padding-top:16px;margin-top:24px;font-size:14px;color:var(--muted)}
.making-flow{line-height:2.2;padding-left:26px}
.welcome-home main{grid-template-columns:252px minmax(0,1fr)}
.welcome-home .workspace{padding:0;min-width:0}
.welcome-home .object-bar,.welcome-home #status:empty,.welcome-home .aux{display:none}
.welcome-home #status:not(:empty){margin:12px 24px}
.welcome-screen{container-type:inline-size;position:relative;aspect-ratio:1530/1028;background:#faf9f7 url('/home-story.png') center/100% 100% no-repeat;color:#221e1b}
.welcome-brand{position:absolute;top:3%;left:3.9%;font-family:'Songti SC','STSong',serif;font-size:2.6cqw;font-weight:700;color:#8f4d39}
.welcome-copy{position:absolute;left:6.55%;top:13.5%;width:40%}
.welcome-copy h2{font-family:'Songti SC','STSong',serif;font-size:4.65cqw;line-height:1.28;font-weight:700;margin:0 0 1.45cqw;letter-spacing:0}
.welcome-intro{font-size:1.9cqw;color:#73716d;margin:0 0 3cqw;line-height:1.5}
.welcome-copy #start-making{width:21.5cqw;height:5.8cqw;min-height:48px;padding:0;border-radius:.8cqw;font-family:'Songti SC','STSong',serif;font-size:2.35cqw;font-weight:500;background:#96543e}
.welcome-copy #start-making span{margin-left:1cqw}
.welcome-help{font-size:1.45cqw;color:#73716d;margin:1cqw 0 0}
.welcome-arrow{position:absolute;top:71.9%;color:#8b9375}.welcome-arrow.first{left:30.5%}.welcome-arrow.second{left:62%}.welcome-arrow svg{width:4.8cqw;height:2.7cqw;stroke-width:1}.welcome-copy button svg{width:2.5cqw;height:2.5cqw;margin-left:1cqw}
.welcome-steps{position:absolute;top:83.7%;left:2.5%;right:2.5%;display:grid;grid-template-columns:repeat(3,1fr);list-style:none;margin:0;padding:0;text-align:center}
.welcome-steps h3{font-family:'Songti SC','STSong',serif;font-size:2.15cqw;line-height:1.3;margin:0 0 .7cqw;font-weight:700}
.welcome-steps p{font-size:1.65cqw;color:#73716d;margin:0}
@media(max-width:900px){.welcome-home main{display:block}.welcome-screen{aspect-ratio:auto;min-height:820px;background-size:auto 460px;background-position:60% 0}.welcome-brand{display:none}.welcome-copy{position:relative;left:auto;top:auto;width:auto;padding:340px 24px 20px;background:none}.welcome-copy h2{font-size:34px;line-height:1.25;margin-bottom:12px}.welcome-intro{font-size:18px;margin-bottom:20px}.welcome-copy #start-making{width:100%;height:58px;font-size:24px;border-radius:8px}.welcome-help{font-size:15px;margin-top:12px}.welcome-steps{position:relative;top:auto;left:auto;right:auto;padding:8px 16px 28px;gap:10px}.welcome-steps h3{font-size:18px;margin-bottom:8px}.welcome-steps p{font-size:14px}}
.sidebar{background:var(--ground);border-right:1px solid var(--line);padding:22px 18px 20px;display:flex;flex-direction:column;gap:18px}
.sidebar-head{position:sticky;top:0;z-index:2;background:var(--ground);padding-bottom:2px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font:600 21px/1.2 var(--serif)}
.logo-badge{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--accent);color:#fff;font:600 17px/1 var(--serif)}
.book-badge{padding-bottom:18px;border-bottom:1px solid var(--line-strong)}
.book-badge p{margin:0}
#book-name{font:600 22px/1.35 var(--serif);overflow-wrap:anywhere}
#book-byline{font-size:13px;margin-top:4px;overflow-wrap:anywhere}
.project-switch{margin:14px 0 0}
.project-switch select{padding:7px 9px;font-size:13px;background:transparent;border-color:var(--line-strong);color:var(--muted)}
.sidebar nav{display:grid;gap:2px}
.nav-label{margin:14px 12px 5px;color:var(--muted);font-size:12px;letter-spacing:1.6px}
.sidebar nav a{display:flex;align-items:center;gap:12px;text-decoration:none;color:#4d4945;padding:9px 13px;border-radius:var(--radius-sm);font-size:15px}
.sidebar nav a svg{color:var(--muted)}
.sidebar nav a:hover{background:var(--sunk)}
.sidebar nav a[aria-current=page]{background:var(--accent-soft);color:var(--accent-strong);font-weight:600}
.sidebar nav a[aria-current=page] svg{color:var(--accent)}
.chapter-nav{border-top:1px solid var(--line-strong);padding-top:18px}
.chapter-nav>p{margin:0 12px 8px;font-size:12px;letter-spacing:1.6px}
.chapter-button{background:transparent;color:var(--ink);text-align:left;justify-content:flex-start;width:100%;font-size:14px;font-weight:400;margin:0 0 2px;padding:9px 13px;min-height:40px;overflow-wrap:anywhere;border-radius:var(--radius-sm)}
.chapter-button:hover:not(:disabled){background:var(--sunk)}
.chapter-button[aria-current=true]{background:var(--accent-soft);color:var(--accent-strong);font-weight:600}
.sidebar-bottom{margin-top:auto;display:grid;gap:8px;font-size:13px}
.sidebar-bottom button{width:100%;justify-content:flex-start;font-size:13px;min-height:38px;padding:7px 12px}
.sidebar-bottom #create{justify-content:center}
.workspace-tools{display:grid;gap:6px}
.runtime-info summary{padding:4px 0;font-size:13px}
.runtime-info p{font-size:13px;margin:6px 0 0}
#role{font-size:12px;color:var(--muted);margin:6px 0 0}
.tagline{color:var(--muted);font-size:12px;border-top:1px solid var(--line-strong);padding-top:14px;margin:6px 0 0}

.workspace{min-width:0;padding:0 34px 48px;display:flex;flex-direction:column}
.object-bar{display:flex;align-items:flex-start;gap:24px;flex-wrap:wrap;padding:30px 0 22px}
.object-name{min-width:0;margin-right:auto}
.object-bar .eyebrow{font-size:12px;margin:0 0 4px}
.object-bar h1{margin:0;overflow-wrap:anywhere}
#object-subtitle{color:var(--muted);font-size:15px;margin:6px 0 0}
#object-action{display:flex;gap:12px;flex-wrap:wrap;padding-top:6px}
#object-action:empty{display:none}
.version-picker{margin:0;padding-top:6px;display:grid;gap:5px;font-size:12px;color:var(--muted);letter-spacing:1px}
.version-picker select{width:auto;max-width:420px;padding:7px 10px;font-size:13px}
#status:empty{display:none}
#status:not(:empty){padding:13px 16px;margin:0 0 18px;border-radius:var(--radius);color:var(--accent-strong);background:var(--accent-wash);border:1px solid var(--accent-soft);overflow-wrap:anywhere}

section{padding:0 0 28px;scroll-margin-top:20px}
.card,.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.panel{padding:26px 28px;margin:0 0 18px}
.panel>h2{margin-bottom:18px}
.panel-head{display:flex;align-items:center;gap:16px;margin-bottom:6px}
.panel-head h2{margin:0;margin-right:auto}
.resume-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 22px;margin:0 0 18px;font-size:15px}
.resume-bar .text-button{margin-left:auto}
.list-row{display:flex;align-items:center;gap:18px;padding:16px 2px;border-top:1px solid var(--line);text-align:left;width:100%;background:transparent;color:var(--ink);font-weight:400;min-height:56px;border-radius:0}
.list-row:first-of-type{border-top:0}
.list-row:hover:not(:disabled){background:var(--accent-wash)}
.row-index{color:var(--muted);font-variant-numeric:tabular-nums;font-size:15px;min-width:26px}
.row-main{min-width:0;flex:1 1 200px}
.row-main strong{display:block;font-weight:600;font-size:16px;overflow-wrap:anywhere}
.row-main span{display:block;color:var(--muted);font-size:13px;margin-top:3px;overflow-wrap:anywhere}
.row-meta{color:var(--muted);font-size:13px;white-space:nowrap}
.chevron{color:var(--muted);font-size:17px}
.list-row select{width:auto;max-width:230px;font-size:13px;padding:6px 9px}
.card .list-row{flex-wrap:wrap;row-gap:8px}
.card .list-row .text-button{font-size:13px;min-height:36px}
.badge{display:inline-block;padding:5px 11px;background:var(--rest-bg);color:var(--rest-ink);border-radius:99px;font-size:13px;white-space:nowrap}
.badge[data-status=approved]{background:var(--ok-bg);color:var(--ok-ink)}
.badge[data-status=draft],.badge[data-status=changes_requested]{background:var(--warn-bg);color:var(--warn-ink)}
.badge[data-status=stale],.badge[data-status=blocked],.badge[data-status=rejected]{background:#fbeae4;color:#8c3d22}
.badge[data-status=superseded],.badge[data-status=missing]{background:var(--rest-bg);color:var(--rest-ink)}
.card{padding:20px 22px;margin:0 0 14px;overflow-wrap:anywhere}
.notice{padding:14px 18px;border-radius:var(--radius);background:var(--accent-wash);border:1px solid var(--accent-soft);font-size:14px;margin:0 0 16px}
.row{display:flex;gap:16px;align-items:center;justify-content:space-between}
.row>label{flex:1;min-width:0}
blockquote{margin:14px 0;padding:2px 0 2px 16px;border-left:2px solid var(--accent-soft);white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--serif);font-size:18px;line-height:1.85}
.prose{font-family:var(--serif);font-size:20px;line-height:1.95;white-space:pre-wrap;overflow-wrap:anywhere}
.prose-question{font-family:var(--serif);font-weight:600;font-size:27px;line-height:1.55;margin:4px 0 18px;overflow-wrap:anywhere}
.consent{display:flex;align-items:flex-start;gap:11px;font-weight:400;font-size:14px;line-height:1.65;margin:18px 0}
summary{cursor:pointer;color:var(--accent);padding:11px 0;font-size:15px}
details small{overflow-wrap:anywhere}
pre{white-space:pre-wrap;overflow-wrap:anywhere}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.compare>div{min-width:0}
form{margin-bottom:18px}
[hidden]{display:none!important}

.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 18px}
.stat-card{display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:18px;min-height:104px;text-align:left;font-weight:400}
.stat-card:hover:not(:disabled){background:var(--accent-wash);border-color:var(--accent-soft)}
.stat-card strong{font-size:27px;line-height:1.2;font-weight:600}
.stat-card span{font-size:14px}
.stat-card small{color:var(--muted);font-size:12px}
.todo-list{list-style:none;padding:0;margin:0}
.todo-list li{border-top:1px solid var(--line)}
.todo-list li:first-child{border-top:0}
.todo-list button{width:100%;justify-content:flex-start;text-align:left;padding:13px 2px;background:transparent;color:var(--ink);font-weight:400;min-height:48px;border-radius:var(--radius-sm)}
.todo-list button .chevron{margin-left:auto}
.todo-list button:hover:not(:disabled){background:var(--accent-wash)}
.cover-card{display:grid;place-items:center;gap:8px;padding:28px 20px;border-radius:var(--radius-sm);background:linear-gradient(180deg,#f3ece2,#e8ded1);border:1px solid var(--line-strong);text-align:center}
.excerpt{font-family:var(--serif);font-size:16px;line-height:1.9;overflow-wrap:anywhere;margin:10px 0 16px}
.cover-card strong{font:600 23px/1.4 var(--serif);overflow-wrap:anywhere}
.cover-card span{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.book-outline{list-style:none;padding:0;margin:0}
.book-outline li{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line)}
.book-outline li:first-child{border-top:0}
.story-actions{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px 0;margin:20px 0}
.diff-row{border-top:1px solid var(--line);padding:16px 0}
.diff-row .eyebrow{font-size:13px;letter-spacing:0;margin:0 0 10px}
.diff-row h3{font-size:13px;color:var(--muted);font-weight:500}
.diff-row .prose{font-size:18px}
.diff-old{background:var(--warn-bg)}
.diff-new{background:var(--ok-bg)}

.timeline-entry .list-row{border:0;padding-top:0}
.row-meta.when{min-width:6.5em;color:var(--accent);font-weight:600;white-space:normal}
.voice-button{margin:6px 0 0;background:var(--surface);color:var(--accent);border-color:var(--accent-soft);min-height:38px;padding:6px 14px;font-size:14px}
.voice-button:hover:not(:disabled){background:var(--accent-wash);border-color:var(--accent)}
.voice-button.is-leading{background:var(--accent);color:#fff;border-color:var(--accent);border-radius:99px;padding:12px 24px;font-size:16px;min-height:50px;margin-top:12px}
.voice-button.is-recording{background:var(--accent);color:#fff;border-color:var(--accent)}
label>.voice-button{margin-top:8px}
.photo-card{display:grid;gap:14px}
.photo-frame{--rot:0deg;--ct:0%;--cr:0%;--cb:0%;--cl:0%;background:var(--sunk);border-radius:var(--radius-sm);overflow:hidden;display:grid;place-items:center;max-height:340px}
.photo-frame img{display:block;max-width:100%;max-height:340px;transform:rotate(var(--rot));clip-path:inset(var(--ct) var(--cr) var(--cb) var(--cl))}
.photo-thumb{width:76px;height:76px;flex-shrink:0}
.photo-thumb img{max-height:76px;object-fit:cover}
.photo-question{font-size:21px;margin:0}
.photo-card .row{align-items:flex-start}
#photo-strip{display:grid;gap:14px;margin-top:14px}
.manuscript{min-width:0;max-width:720px;padding:4px 0 20px}
.manuscript h1{font-family:var(--serif);font-size:30px;margin:0 0 22px;overflow-wrap:anywhere}
.paragraph{padding:12px 14px;margin:0 0 10px;border-radius:var(--radius-sm);position:relative}
.paragraph .prose{margin:0;display:inline}
.paragraph.is-selected{background:var(--accent-wash)}
.citation-button{background:transparent;color:var(--accent);min-height:32px;padding:0 5px;font-size:14px;vertical-align:baseline;border-radius:4px}
.review-heading{display:flex;align-items:center;gap:14px;padding:0 0 14px;border-bottom:1px solid var(--line);min-height:48px;overflow-wrap:anywhere}
.review-heading button{margin-left:auto;flex-shrink:0}
.review-footer{display:flex;align-items:center;gap:14px;border-top:1px solid var(--line);padding:16px 0;flex-wrap:wrap}
.review-footer small{margin-right:auto}
.review-footer label{display:flex;align-items:center;gap:10px;margin:0;font-size:14px}
.review-footer select{width:auto;min-width:140px;font-size:14px}
.empty-state{padding:70px 24px;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.empty-state h2{font-family:var(--serif);font-size:26px}
.empty-state p{color:var(--muted)}
.empty-state a{display:inline-block;margin-top:16px}
.generation{font-size:15px}
.evidence-item{padding-bottom:12px;border-bottom:1px solid var(--line)}
.evidence-item>summary{color:var(--ink);font-size:15px;padding:8px 0}
.evidence-item dl{display:grid;grid-template-columns:88px 1fr;gap:10px;margin:14px 0;font-size:14px}
.evidence-item dt{color:var(--muted)}
.evidence-item dd{margin:0;overflow-wrap:anywhere}
.evidence-item details summary{font-size:12px;padding:4px 0}
.evidence-item .muted{font-size:13px;margin:10px 0}

.aux{border-left:1px solid var(--line);padding:30px 24px 48px;min-width:0;background:var(--ground)}
.aux-head{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.aux-head h2{font-size:15px;margin:0;margin-right:auto}
.aux-head button{font-size:13px;min-height:34px;padding:4px 8px}
.aux p,.aux li{font-size:14px}
.aux ul{padding-left:20px;margin:10px 0}
.aux .card{padding:16px 18px;margin-bottom:12px}
.aux blockquote{font-size:16px}

@media(min-width:1250px){.sidebar,.aux{position:sticky;top:0;height:100vh;overflow:auto}}
@media(max-width:1250px){
  main,body.aux-collapsed main{grid-template-columns:236px minmax(0,1fr)}
  .aux{grid-column:2;border-left:0;border-top:1px solid var(--line);background:transparent;padding:24px 34px 48px}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  main,body.aux-collapsed main{display:block}
  .sidebar{border-right:0;border-bottom:1px solid var(--line);padding:16px}
  .brand{font-size:19px}
  .book-badge{padding-bottom:12px}
  #book-name{font-size:19px}
  .nav-label{display:none}
  .sidebar nav{display:flex;overflow:auto;gap:4px}
  .sidebar nav a{white-space:nowrap;padding:9px 12px;font-size:14px;gap:8px}
  .sidebar nav a svg{display:none}
  .chapter-nav{border:0;padding:0}
  .chapter-nav>p{display:none}
  #chapter-list{display:flex;overflow:auto;gap:8px}
  .chapter-button{width:auto;min-width:110px;white-space:nowrap}
  .sidebar-bottom{grid-auto-flow:column;justify-content:start;gap:10px;margin:0}
  .sidebar-bottom button{width:auto}
  .tagline,.workspace-tools,#role{display:none}
  .workspace,.aux{padding-left:18px;padding-right:18px}
  .object-bar{padding:22px 0 16px;gap:14px}
  h1{font-size:25px}
  .panel{padding:20px 18px}
  .prose{font-size:19px}
  .prose-question{font-size:23px}
  .photo-question{font-size:19px}
  .photo-frame,.photo-frame img{max-height:240px}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .list-row{gap:12px;flex-wrap:wrap}
  .row-meta{font-size:12px}
  .compare{grid-template-columns:1fr}
  .review-footer{gap:12px}
  .review-footer small{width:100%;margin:0}
  .row{flex-direction:column;align-items:stretch}
  .empty-state{padding:48px 16px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

body[data-workbench-view=interview] .aux{display:none}
body[data-workbench-view=interview] main{grid-template-columns:252px minmax(0,1fr)}
@media(max-width:1250px){body[data-workbench-view=interview] main{grid-template-columns:236px minmax(0,1fr)}}
body[data-workbench-view=interview] .workspace{padding:0;min-width:0;height:100dvh;overflow:hidden;display:flex;flex-direction:column}
body[data-workbench-view=interview] .object-bar{padding:12px 34px 8px;gap:10px;flex:0 0 auto}
body[data-workbench-view=interview] .object-bar h1{font-size:19px}
body[data-workbench-view=interview] .object-bar .eyebrow{font-size:11px;margin:0}
body[data-workbench-view=interview] #object-subtitle{display:none}
body[data-workbench-view=interview] #status{margin:0 34px 8px}
body[data-workbench-view=interview] #status:not(:empty){padding:8px 14px;font-size:13px}
body[data-workbench-view=interview] #content{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.chat-view{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;height:auto;padding:0;overflow:hidden}
.chat-scroll-wrap{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.chat-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding:30px 34px 18px;scroll-behavior:smooth}
#chat-feed{display:flex;flex-direction:column;gap:18px;max-width:1040px;margin:0 auto}
.chat-row{display:flex;gap:10px;align-items:flex-end}
.chat-row.chat-interviewer{justify-content:flex-start}
.chat-row.chat-user{justify-content:flex-start;flex-direction:row-reverse}
.chat-avatar{flex:0 0 auto;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#fff;background:var(--accent)}
.chat-row.chat-user .chat-avatar{background:var(--ink)}
.chat-col{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:78%}
.chat-row.chat-interviewer .chat-col{align-items:flex-start}
.chat-row.chat-user .chat-col{align-items:flex-end}
.chat-label{display:block;font-size:11px;letter-spacing:.6px;color:var(--muted);margin:0 2px}
.chat-bubble{max-width:100%;padding:14px 20px;border-radius:16px;font-size:22px;line-height:1.6;overflow-wrap:anywhere}
.chat-interviewer .chat-bubble{background:var(--accent-wash);border:1px solid var(--accent-soft);color:var(--ink);border-bottom-left-radius:4px}
.chat-user .chat-bubble{background:var(--surface);border:1px solid var(--line);color:var(--ink);border-bottom-right-radius:4px}
.chat-bubble .chat-question{font-family:var(--serif);font-weight:600;margin:0 0 6px}
.chat-bubble .chat-answer{margin:0;white-space:pre-wrap}
.chat-bubble .photo-bubble summary{display:flex;gap:12px;align-items:center;cursor:pointer;list-style:none}
.chat-bubble .photo-bubble .photo-thumb{width:64px;height:64px;border-radius:10px;overflow:hidden}
.chat-bubble .photo-bubble .photo-thumb img{width:100%;height:100%;object-fit:cover}
.chat-bubble audio{max-width:100%}
.composer{flex:0 0 auto;position:relative;border-top:1px solid var(--line);background:var(--surface);padding:14px 34px 16px}
#composer-popover{position:absolute;bottom:100%;left:34px;right:34px;margin-bottom:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 6px 24px rgba(0,0,0,.1);padding:10px;max-height:min(70vh,480px);overflow-y:auto}
.composer-form{max-width:1040px;margin:0 auto;display:flex;flex-direction:column;gap:8px}
.composer-input-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
/* The expanded textarea takes the whole first row (order:0, basis 100%) so every other toolbar
   control (plus, typing toggle, voice, wrap-up, send) wraps onto one row together below it, instead
   of splitting across the row before and the row after the text. Narrow widths keep that single
   packed row; a desktop width switches the row itself to a grid so the attachment+typing group,
   the microphone and the "今天先聊到这里"/send pair land in their own left/center/right column
   instead of all bunching at the left edge. */
#composer-text{order:0;flex:1 1 100%;resize:none;max-height:160px;border-radius:var(--radius);font-size:16px}
.composer-left{order:1;flex:0 0 auto;display:flex;align-items:center;gap:8px 10px}
#composer-plus{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 16px;border-radius:22px;background:var(--surface);color:var(--accent);border:1px solid var(--accent-soft);font-size:14px;white-space:nowrap}
#composer-plus:hover:not(:disabled){background:var(--accent-wash)}
.composer-input-row .voice-button.is-leading{order:2;margin:0;flex:0 0 auto}
.composer-right{order:3;flex:0 0 auto;display:flex;align-items:center;gap:8px 10px;margin-left:auto}
.composer-wrapup{padding:0}
.composer-send{border-radius:50%;width:44px;height:44px;padding:0}
@media(min-width:901px){
  .composer-input-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
  #composer-text{grid-column:1/-1}
  .composer-left{grid-column:1;justify-self:start}
  .composer-input-row .voice-button.is-leading{grid-column:2;justify-self:center}
  .composer-right{grid-column:3;justify-self:end;margin-left:0}
}
.composer-consent{font-size:13px;margin:0}
.sheet-head{display:none}
.sheet-close{display:inline-flex;align-items:center;gap:6px}
#wrap-up:not([open]){display:none}
#wrap-up{position:absolute;bottom:100%;left:34px;right:34px;margin-bottom:8px;max-width:1040px;margin-left:auto;margin-right:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 6px 24px rgba(0,0,0,.1);max-height:min(70vh,560px);overflow-y:auto}
#wrap-up summary{text-align:center;padding:12px 16px}
#wrap-up form{padding:0 16px 16px}
@media(max-width:900px){
  /* [claude-fix] The general mobile rule stacks main as a plain block with no height of its own, so
     the sidebar's natural height and a merely max-height-capped chat-scroll-wrap left the composer
     wherever normal flow put it — often below the fold on a short phone viewport, with no way to
     reach it short of scrolling the whole page. main becomes a height:100dvh flex column instead:
     the sidebar (unchanged, still the same nav in the same stacked position) keeps only the height
     its own content needs, and the workspace takes all the height that is left, using the exact same
     flex/overflow sizing its children already use at desktop widths so the composer always ends up
     pinned at the bottom of whatever room the workspace actually has — never past the viewport.
  */
  body[data-workbench-view=interview] main{display:flex;flex-direction:column;height:100dvh;overflow:hidden}
  body[data-workbench-view=interview] .sidebar{flex:0 0 auto}
  body[data-workbench-view=interview] .workspace{flex:1 1 auto;min-height:0;height:auto}
  .chat-scroll{padding:18px 16px 14px}
  .chat-col{max-width:88%}
  .chat-bubble{font-size:20px}
  .composer{padding:12px 16px 14px}
  /* [claude-fix] #content clips overflow on short mobile viewports, and bottom:100% anchored these
     panels to .composer's top edge — which on a short phone sits well above #content's own top,
     so the anchored panel got clipped there instead of showing its full height. position:fixed
     anchors both panels to the viewport itself, the one containing block nothing here clips.
  */
  #composer-popover,#wrap-up{position:fixed;left:16px;right:16px;top:auto;bottom:16px;margin:0;max-width:none;max-height:min(78dvh,calc(100dvh - 32px))}
  .sheet-head{display:flex;justify-content:flex-end;padding:0 0 6px}
  /* [claude-fix] Expanding to typing adds a full-width textarea row, a second wrapped toolbar row
     and the consent line to a composer that previously fit in one short row; on a short phone
     viewport the surrounding chrome (object bar, chat padding, composer padding) that was never
     competing for room now has to give some back so the composer itself never crosses the bottom of
     the viewport. This only trims chrome that is present anyway — nothing in the toolbar is hidden or
     shrunk below a usable size, and the chat stays genuinely scrollable, just with tighter edges.
  */
  body.composer-expanded[data-workbench-view=interview] .object-bar{padding:6px 16px 2px}
  body.composer-expanded[data-workbench-view=interview] .chat-scroll{padding:8px 16px 6px}
  body.composer-expanded[data-workbench-view=interview] .composer{padding:8px 16px 10px}
  body.composer-expanded[data-workbench-view=interview] .composer-form{gap:6px}
  body.composer-expanded[data-workbench-view=interview] .composer-consent{line-height:1.35}
}

#speech-jobs audio, #transcript-list audio { max-width:100%; } #recording-form input[type=file] { max-width:100%; }
.live-panel { margin:0 0 8px; padding:8px 12px; border:1px solid #d8cfc2; border-radius:10px; background:#fffaf2; } .live-panel p { margin:2px 0; } .live-panel[data-state="blocked"] { border-color:#b54a3a; } .live-panel .live-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; } .live-panel .live-actions button[hidden] { display:none; }