:root { font-family:"Microsoft YaHei",system-ui,sans-serif; font-size:15px; line-height:1.65; color:#222b30; background:#f8fafb; letter-spacing:0; }
* { box-sizing:border-box; } [hidden] { display:none !important; }
body { margin:0; } header { display:flex; align-items:center; gap:24px; padding:16px 28px; min-height:72px; border-bottom:1px solid #dce3e6; background:white; }
header span { color:#586771; flex:1; } a { color:#126c58; } .brand { font-size:23px; font-weight:700; text-decoration:none; }
main { max-width:1240px; margin:auto; padding:24px; } h1 { font-size:25px; margin:0 0 8px; line-height:1.4; } h2 { font-size:21px; margin:0; } h3 { font-size:15px; margin:20px 0 6px; }
p { margin:10px 0; overflow-wrap:anywhere; } .muted { color:#63717a; } .small { font-size:13px; }
button,input,textarea { font:inherit; } button { min-height:42px; padding:8px 16px; border:1px solid #bccbd0; border-radius:5px; background:white; color:#283b43; cursor:pointer; }
button:hover { background:#eef4f3; } button:disabled { cursor:default; opacity:.55; } .primary { background:#126f59; color:white; border-color:#126f59; } .primary:hover { background:#0d5c49; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid #498bb5; outline-offset:2px; }
label { display:block; margin:14px 0; } input:not([type=checkbox]),textarea { display:block; width:100%; padding:10px 12px; border:1px solid #b8c7cc; border-radius:4px; background:white; color:#222b30; }
input[type=checkbox] { width:18px; height:18px; flex:0 0 18px; margin:4px 0 0; } .checkbox { display:flex; gap:10px; align-items:flex-start; }
#login-section { max-width:420px; margin:42px auto; } #message { color:#9a332a; min-height:24px; } .toolbar,.actions,.case-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.notice { padding:12px 16px; border-left:3px solid #b58a2d; background:#fff9eb; color:#68551f; margin:16px 0 24px; }
.workspace { display:grid; grid-template-columns:300px minmax(0,1fr); border-top:1px solid #d2dde1; border-bottom:1px solid #d2dde1; }
#case-list { max-height:950px; overflow:auto; border-right:1px solid #d2dde1; padding:14px 12px 14px 0; }
.case-button { width:100%; text-align:left; margin-bottom:6px; padding:10px 12px; min-height:84px; display:grid; grid-template-columns:1fr auto; gap:3px 8px; border-color:transparent; background:transparent; }
.case-button .case-question { grid-column:1/-1; font-size:13px; color:#586771; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }
.case-button[aria-current=true] { border-color:#61a18c; background:#e8f4ee; } .case-button .outcome { font-size:12px; color:#956917; } .case-button .passed { color:#126d51; }
#case-detail { padding:24px; min-width:0; background:white; } .question { padding-bottom:14px; border-bottom:1px solid #e0e7ea; color:#41545d; }
audio { width:100%; height:54px; margin-top:16px; } details { margin:20px 0; } summary { cursor:pointer; color:#355b60; } .source { font-size:13px; border-left:2px solid #c9d7dd; padding-left:10px; margin:12px 0; }
.proof { font-family:Consolas,monospace; font-size:12px; color:#67747c; overflow-wrap:anywhere; } fieldset { border:0; padding:0; margin:22px 0 10px; } legend { font-weight:700; } #checks label { margin:9px 0; }
.withdraw { margin-top:28px; color:#745b40; } .withdraw input { max-width:420px; } footer { max-width:1240px; padding:20px 24px 32px; margin:auto; color:#6a787d; font-size:13px; }
#script { white-space:pre-line; }
.preferred-scenes { margin-bottom:20px; justify-content:flex-start; }
#preference-form { max-width:720px; }
#preference-form fieldset { margin:18px 0; padding:16px; border:1px solid #d2dde1; background:white; }
#preference-form label { margin:10px 0; }
#owner-direction { margin:12px 0; }
#emotion-round { margin-top:26px; }
.emotion-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:14px 0; }
.emotion-card { min-width:0; padding:14px 16px; background:white; border:1px solid #d2dde1; border-radius:6px; }
.emotion-card h3 { margin:0; } .emotion-card p { color:#63717a; font-size:13px; }
.emotion-card .actions { justify-content:flex-start; gap:16px; }
.emotion-card a { padding:5px 2px; } .emotion-card a[aria-current=true] { font-weight:bold; color:#094b3d; background:#e8f4ee; outline:2px solid #61a18c; outline-offset:2px; }
@media(max-width:520px) { .emotion-grid { grid-template-columns:1fr; } }
select { display:block; width:100%; max-width:560px; min-height:44px; margin-top:6px; padding:8px 12px; border:1px solid #b8c7cc; border-radius:4px; background:white; color:#222b30; font:inherit; }
@media(max-width:760px) { header { padding:14px 18px; gap:12px; flex-wrap:wrap; } header span { font-size:12px; } main { padding:18px; } .workspace { grid-template-columns:minmax(0,1fr); } #case-list { max-height:240px; border-right:0; border-bottom:1px solid #d2dde1; padding:10px 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; } .case-button { min-height:92px; } #case-detail { padding:20px 12px; } .actions { justify-content:flex-start; } h1 { font-size:23px; } }
