:root { color-scheme: light; --page:#eff5f6; --paper:#fff; --ink:#183c50; --muted:#526976; --accent:#087c78; --line:#bdd2d8; --bad:#a82b40; font-family:"PingFang SC","Microsoft YaHei",sans-serif; color:var(--ink); background:var(--page); }
* { box-sizing:border-box; } [hidden] { display:none !important; }
body { margin:0; min-width:320px; } button,input,select,textarea { font:inherit; } button,a,input,select,textarea,summary { touch-action:manipulation; }
a { color:var(--accent); } button,summary { cursor:pointer; } button,a { -webkit-tap-highlight-color:transparent; }
button { min-height:44px; padding:10px 18px; color:var(--ink); background:white; border:1px solid var(--line); border-radius:8px; font-weight:600; }
button:hover { border-color:var(--accent); } button:disabled { opacity:.55; cursor:wait; }
.primary,.download { background:var(--accent); color:white; border:0; }
:focus-visible { outline:3px solid #db8d20; outline-offset:4px; } input,select,textarea { padding:12px; border:1px solid var(--line); border-radius:6px; background:white; color:var(--ink); max-width:100%; }
input[type=checkbox] { width:20px; height:20px; accent-color:var(--accent); } label { display:grid; gap:8px; } .check { display:flex; align-items:center; }
input[type=radio] { width:20px; height:20px; accent-color:var(--accent); }
h1 { font-size:clamp(28px,4vw,46px); line-height:1.3; font-weight:650; margin:16px 0; } h2 { font-size:22px; } p { line-height:1.7; max-width:70ch; } .hint { font-size:14px; color:var(--muted); }
.masthead { display:flex; align-items:center; gap:28px; padding:20px max(24px,calc((100vw - 1120px)/2)); background:var(--paper); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:12px; font-size:21px; font-weight:700; color:var(--ink); text-decoration:none; white-space:nowrap; }.brand span { background:var(--ink); color:white; padding:8px; border-radius:50% 50% 4px 4px; }
nav { display:flex; gap:8px; flex:1; } nav button { border:0; background:transparent; } nav button[aria-current=page] { background:#dceeed; color:#045e5a; }
main { max-width:1120px; margin:0 auto; padding:38px 24px 80px; } .intro { padding:20px 0 28px; } .lead { color:var(--accent); margin:0; }.intro p { margin-bottom:0; }
.login-panel { max-width:640px; margin:8vh auto; } #loginForm { display:grid; gap:14px; max-width:440px; } #notice { padding:16px; border-left:4px solid var(--accent); background:white; margin-bottom:24px; } #notice.error,.failure { border-left:4px solid var(--bad); color:#852136; background:#fff0f2; padding:20px; }
.drop-zone { position:relative; border:2px dashed #72a6ad; background:white; padding:44px 24px; text-align:center; place-items:center; border-radius:16px; cursor:pointer; gap:14px; }
.drop-zone strong { font-size:24px; }.drop-zone span { color:var(--muted); }.drop-zone.dragging,.drop-zone:focus-within { border-color:var(--accent); background:#e0f1ef; }.paper-mark { font-size:42px; line-height:1; }.drop-zone input { width:min(360px,100%); }
.upload-options { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin:24px 0; }.upload-options input[type=number] { width:110px; }.upload-options p { flex-basis:100%; margin:0; }
.tier-options { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:24px 0 12px; padding:0; border:0; }.tier-options legend { font-weight:600; margin-bottom:10px; }.tier-options label { grid-template-columns:auto 1fr; align-items:start; padding:16px; background:white; border:1px solid var(--line); border-radius:8px; }.tier-options small { display:block; margin-top:6px; color:var(--muted); line-height:1.5; }.intake-advanced { margin:12px 0 24px; }.intake-advanced label { max-width:420px; margin:12px 0; }
.report { background:white; padding:28px; border-radius:12px; margin-top:28px; }.estimate-list { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }.estimate-list dt { color:var(--muted); font-size:14px; }.estimate-list dd { margin:8px 0 0; font-size:20px; }.verdict-ok { color:var(--accent); }.verdict-blocked { color:var(--bad); }.problem-title { font-weight:600; }.problem-list { padding-left:24px; }.problem-list li.is-blocker { color:var(--bad); }.problem-list li.is-warning { color:#865000; }
.section-head,.progress-meta { display:flex; align-items:center; justify-content:space-between; gap:20px; }.filters { display:flex; gap:20px; margin:28px 0; }.filters label:first-child { flex:1; }.video-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }.video-card { background:white; padding:24px; border-radius:12px; display:grid; gap:16px; }.video-card h2 { margin:0; overflow-wrap:anywhere; }.badge { font-size:14px; padding:6px 12px; border-radius:30px; background:#dceeed; width:max-content; }.badge.failed { background:#ffe1e7; color:var(--bad); }.badge.blocked { background:#fff0cb; color:#775200; }
.stages { list-style:none; padding:0; display:grid; grid-template-columns:repeat(6,1fr); margin:32px 0; }.stages li { padding:14px 4px; border-bottom:4px solid var(--line); text-align:center; color:var(--muted); }.stages li.done { border-color:var(--accent); color:var(--accent); }.stages li.active { border-color:#c68516; color:#795100; } progress { width:100%; height:12px; accent-color:var(--accent); margin-top:16px; }.progress-meta p { color:var(--muted); }
.shot-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:14px; margin-bottom:30px; }.shot { overflow:hidden; padding:0; text-align:left; border-bottom:4px solid var(--line); background:white; }.shot img { width:100%; aspect-ratio:9/12; object-fit:cover; display:block; }.shot span { display:block; padding:8px; font-size:13px; }.shot.done { border-color:var(--accent); }.shot.failed { border-color:var(--bad); }.shot.pending { border-color:#c68516; }.shot-placeholder { display:grid; place-items:center; min-height:150px; color:var(--muted); background:#dde9ed; }.part-head { display:flex; align-items:center; gap:16px; }
.shot-card { min-width:0; }.shot-card > .shot { width:100%; }.prompt-panel { margin-top:6px; background:white; border:1px solid var(--line); border-radius:6px; }.prompt-panel summary { font-size:13px; }.prompt-columns { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:0 12px 12px; }.prompt-column { min-width:0; }.prompt-column p,.prompt-extra p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; }.prompt-extra { padding:0 12px 12px; }.param-tags { display:flex; flex-wrap:wrap; gap:6px; }.param-tag { padding:3px 7px; border-radius:4px; background:#e8f0f2; font-size:12px; }.sample-badge { display:inline-block; margin:0 8px 8px; color:#775200; font-size:12px; }.badge-row,.upgrade-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }.coverage { padding:10px 14px; background:#fff7df; border-left:4px solid #c68516; }.upgrade-actions { margin:12px 0 20px; }
#mediaItems { display:grid; gap:24px; }.media-group { background:white; padding:24px; border-radius:12px; }.media-group video { display:block; width:100%; max-height:65vh; margin-bottom:18px; background:#183c50; }.media-group a { display:inline-block; padding:12px 18px; margin:4px; border-radius:8px; }.media-group img { max-width:160px; }.admin-menu { display:grid; gap:12px; position:absolute; z-index:2; right:24px; padding:24px; background:white; border:1px solid var(--line); } summary { padding:12px; } #styleForm { display:grid; gap:16px; margin-top:28px; } #trafficReport,#styleResult { white-space:pre-wrap; }
dialog { max-width:min(90vw,720px); max-height:90vh; border:1px solid var(--line); border-radius:12px; padding:24px; }dialog::backdrop { background:rgba(24,60,80,.55); }dialog img,dialog video { max-width:100%; max-height:65vh; display:block; margin:auto; object-fit:contain; }dialog video { width:100%; background:#183c50; }dialog form { text-align:right; }.shot-modes,.shot-actions { display:flex; gap:8px; margin:12px 0; align-items:center; }.shot-modes button,.shot-actions button,.shot-actions a { min-height:44px; display:inline-flex; align-items:center; padding:8px 14px; }.shot-modes [aria-pressed="true"] { background:var(--accent); color:white; }.shot-actions a { margin-left:auto; }.shot-expanded { width:96vw; max-width:96vw; height:94vh; max-height:94vh; box-sizing:border-box; }.shot-expanded img { width:100%; height:calc(94vh - 190px); max-height:none; cursor:zoom-out; }.shot-zoomable { cursor:zoom-in; }.skip-link { position:absolute; top:-80px; padding:16px; background:white; }.skip-link:focus { top:0; z-index:4; }
@media(max-width:700px) { .masthead { padding:12px 16px; gap:8px; flex-wrap:wrap; }.brand { font-size:18px; }nav { order:2; flex-basis:100%; }main { padding:20px 16px 60px; }.video-cards,.tier-options,.prompt-columns { grid-template-columns:1fr; }.estimate-list { grid-template-columns:repeat(2,1fr); }.stages { grid-template-columns:repeat(3,1fr); }.progress-meta,.section-head { align-items:flex-start; flex-direction:column; gap:4px; }.filters { flex-direction:column; }.report { padding:20px; }.drop-zone { padding:28px 12px; }.drop-zone strong { font-size:20px; }#shotDialog { width:calc(100vw - 16px); max-width:none; max-height:calc(100vh - 16px); padding:12px; box-sizing:border-box; }.shot-actions { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; } }

.badge.queued,.badge.running{background:#e6f0ff;color:#245b99}.badge.succeeded{background:#e4f4e9;color:#246540}.badge.failed,.stage-progress li.failed{background:#ffe9e7;color:#a32f25}.badge.cancelled{background:#eee;color:#666}#stageProgress li.failed{border-color:#c4473c;background:#ffe9e7;color:#a32f25}
#totalProgress.failed{accent-color:#b42318}
#storageCertHint{padding:12px;border-left:4px solid #b54708;background:#fffaeb;color:#713b12}
.activity-panel{margin-top:32px;border-top:1px solid var(--line);padding-top:20px}.activity-panel h2{font-size:18px}.activity-panel button{min-height:36px;padding:6px 12px}#activityLog{height:220px;overflow:auto;background:#102d3d;color:#e8f4f4;padding:14px;font:13px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace}#activityLog p{margin:0;max-width:none;white-space:pre-wrap;overflow-wrap:anywhere}#activityWait{margin:0;padding:8px 14px;background:#102d3d;color:#b9d6d5;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}

.visually-hidden { position:absolute; width:1px !important; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
#management summary { display:block; list-style:none; min-height:44px; padding:10px 18px; border-radius:8px; font-weight:600; }
#management summary::-webkit-details-marker { display:none; }
#roleLabel { font-size:12px; color:var(--muted); }

.section-head > *, .progress-meta > *, nav { min-width:0; }
#productionTitle, #failureReason, #partShots h2 { overflow-wrap:anywhere; }
#failureTechnical { white-space:pre-wrap; overflow-wrap:anywhere; max-width:100%; }
@media(max-width:700px) { nav { flex-wrap:wrap; } .admin-menu { max-width:calc(100vw - 32px); right:16px; } }