
:root{--red:#b11226;--red2:#8f0d1e;--ink:#242424;--muted:#6e6e6e;--line:#e8e3e0;--soft:#faf7f5;--green:#1e7a45;--amber:#a66b00;--danger:#a40014}
*{box-sizing:border-box} body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;color:var(--ink);background:#f7f5f3}
button,input,select,textarea{font:inherit}
.topbar{position:sticky;top:0;z-index:20;height:72px;background:#fff;border-bottom:4px solid var(--red);display:flex;align-items:center;justify-content:space-between;padding:0 5vw;box-shadow:0 2px 10px #00000010}
.brand{display:flex;align-items:center;gap:12px;cursor:pointer}.brandmark{width:46px;height:46px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;border:3px double #fff;box-shadow:0 0 0 2px var(--red);font-weight:900}.brandname{font-weight:900;letter-spacing:.11em;color:var(--red);font-size:16px}.brandsub{font-size:11px;letter-spacing:.14em;color:#555;margin-top:2px}
nav{display:flex;gap:8px}nav button,.hamb{border:0;background:transparent;padding:10px 14px;border-radius:8px;font-weight:700;cursor:pointer}nav button:hover{background:#f5e8ea;color:var(--red)}.hamb{display:none;font-size:23px}
main{max-width:1260px;margin:0 auto;padding:28px 24px 70px}.view{display:none}.view.active{display:block}
.hero{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;border-radius:22px;padding:28px 30px;display:flex;justify-content:space-between;gap:20px;align-items:center;box-shadow:0 8px 30px #7f10252c}.hero h1{margin:0 0 6px;font-size:30px}.hero p{margin:0;opacity:.9}.primary{background:var(--red);color:#fff;border:0;border-radius:11px;padding:12px 18px;font-weight:800;cursor:pointer}.hero .primary{background:#fff;color:var(--red)}.secondary{background:#fff;color:var(--red);border:1px solid #d7bbc0;border-radius:11px;padding:11px 16px;font-weight:800;cursor:pointer}.ghost{background:transparent;color:var(--red);border:1px solid #d7bbc0;border-radius:11px;padding:10px 14px;font-weight:700;cursor:pointer}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:20px 0}.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 3px 14px #00000008}.metric .label{color:var(--muted);font-size:13px}.metric .value{font-size:30px;font-weight:900;margin-top:7px}.metric .sub{font-size:12px;color:#777;margin-top:5px}.accent{color:var(--red)}
.section-title{display:flex;justify-content:space-between;align-items:end;margin:28px 0 12px}.section-title h2{margin:0}.section-title small{color:#777}
.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:16px}.data-table{width:100%;border-collapse:collapse;min-width:850px}.data-table th,.data-table td{padding:12px 14px;border-bottom:1px solid #eee;text-align:left;font-size:13px}.data-table th{background:#faf6f5;color:#69101c;font-weight:800;position:sticky;top:0}.score-pill{display:inline-block;min-width:58px;text-align:center;border-radius:999px;padding:5px 9px;font-weight:800}.good{background:#e4f4ea;color:#166a3c}.warn{background:#fff1d6;color:#875a00}.bad{background:#fde3e5;color:#980015}
.formbar{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:12px;position:sticky;top:82px;z-index:10}.field label{display:block;font-size:11px;color:#666;font-weight:700;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;border:1px solid #d8d2cf;border-radius:9px;padding:10px;background:#fff}
.progress-wrap{margin:14px 0 20px}.progress-meta{display:flex;justify-content:space-between;font-size:12px;color:#666;margin-bottom:6px}.progress{height:8px;background:#e9e5e2;border-radius:99px;overflow:hidden}.progress>div{height:100%;background:var(--red);width:0}
.audit-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 18px}.audit-tabs button{border:1px solid #d9c8cb;background:#fff;color:#72101d;border-radius:999px;padding:9px 14px;font-weight:800;cursor:pointer}.audit-tabs button.active{background:var(--red);color:#fff}
.question-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;margin-bottom:14px}.qhead{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.qid{font-weight:900;color:var(--red)}.weight{font-size:12px;background:#f4eeee;padding:5px 9px;border-radius:999px;white-space:nowrap}.critical{color:#b00016;font-weight:900;font-size:12px}.qtext{font-weight:800;line-height:1.45;margin:8px 0 14px}
.criteria{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.criterion{padding:11px;border-radius:10px;font-size:12px;line-height:1.45}.criterion b{display:block;margin-bottom:4px}.criterion.pass{background:#edf8f1}.criterion.partial{background:#fff7e4}.criterion.fail{background:#fff0f1}
.answers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}.answer{border:1px solid #d7d0cd;background:#fff;border-radius:10px;padding:10px;font-weight:800;cursor:pointer}.answer.selected[data-value="Pass"]{background:#1d7845;color:#fff}.answer.selected[data-value="Partial"]{background:#a96b00;color:#fff}.answer.selected[data-value="Fail"]{background:#a60016;color:#fff}.answer.selected[data-value="N/A"]{background:#555;color:#fff}
.note{margin-top:10px;display:none}.note.show{display:block}.note textarea{width:100%;min-height:70px;border:1px solid #d8d2cf;border-radius:9px;padding:9px}
.audit-actions{display:flex;justify-content:flex-end;gap:10px;margin:22px 0}.report-head{background:#fff;border-top:7px solid var(--red);border-radius:16px;padding:24px;border-left:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.report-title{display:flex;justify-content:space-between;gap:20px}.report-title h1{margin:0;color:var(--red)}.report-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}.report-meta div{background:#faf7f5;border-radius:10px;padding:10px}.report-meta small{display:block;color:#777}.score-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.score-box{background:#fff;border-radius:14px;padding:18px;text-align:center;border:1px solid var(--line)}.score-box b{font-size:28px;display:block}.score-box.total{border:2px solid var(--red)}
.findings{background:#fff;border-radius:16px;border:1px solid var(--line);padding:18px}.finding{padding:12px 0;border-bottom:1px solid #eee}.finding:last-child{border:0}.finding .tag{font-size:11px;font-weight:900;margin-right:7px;color:var(--red)}
.report-actions{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0 20px}
.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;background:#fff;padding:14px;border-radius:14px;border:1px solid var(--line);margin-bottom:18px}.filters select,.filters input{width:100%;padding:10px;border:1px solid #d8d2cf;border-radius:8px}
.chart{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;margin-bottom:16px}.bars{height:220px;display:flex;align-items:flex-end;gap:13px;border-bottom:1px solid #ddd;padding:10px 8px 0}.barcol{flex:1;min-width:36px;text-align:center}.bar{background:linear-gradient(#c83145,#a50d21);border-radius:7px 7px 0 0;min-height:2px;position:relative}.bar span{position:absolute;top:-21px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:800}.barlabel{font-size:10px;margin-top:5px;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.report-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:16px}.empty{padding:30px;text-align:center;color:#777}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.formbar{grid-template-columns:1fr 1fr}.criteria{grid-template-columns:1fr}.report-meta,.score-grid{grid-template-columns:1fr 1fr}.report-grid{grid-template-columns:1fr}.filters{grid-template-columns:1fr 1fr}.hamb{display:block}nav{display:none;position:absolute;top:68px;right:18px;background:#fff;flex-direction:column;border:1px solid #ddd;padding:8px;border-radius:10px;box-shadow:0 8px 20px #0002}nav.open{display:flex}}
@media(max-width:560px){main{padding:18px 12px 50px}.hero{padding:22px 18px;align-items:flex-start;flex-direction:column}.grid{grid-template-columns:1fr 1fr}.formbar{grid-template-columns:1fr;position:static}.answers{grid-template-columns:1fr 1fr}.report-meta,.score-grid{grid-template-columns:1fr 1fr}.filters{grid-template-columns:1fr}.brandname{font-size:13px}.brandsub{font-size:9px}}
@media print{.topbar,footer,.report-actions{display:none!important}body{background:#fff}main{padding:0}.view{display:none!important}#report.active{display:block!important}.report-head,.score-box,.findings{box-shadow:none;break-inside:avoid}}

.photo-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin-top:14px}.photo-thumb{position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}.photo-thumb img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.photo-thumb button{width:100%;border:0;background:#fff0f1;color:var(--red);font-weight:800;padding:8px;cursor:pointer}.report-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.report-photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;border:1px solid var(--line)}@media(max-width:560px){.photo-preview{grid-template-columns:repeat(2,1fr)}.report-photo-grid{grid-template-columns:1fr 1fr}}

.report-filter-pro{display:grid;grid-template-columns:1.5fr 1.2fr 1fr 1fr auto;gap:10px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:12px;align-items:end}.report-selector{display:flex;gap:8px;overflow:auto;padding:4px 0 14px}.report-selector button{white-space:nowrap;border:1px solid #d9c8cb;background:#fff;color:#72101d;border-radius:999px;padding:9px 13px;font-weight:800;cursor:pointer}.report-selector button.active{background:var(--red);color:#fff}.capa-overdue{background:#fff1f2}.overdue-badge{display:inline-block;background:#a40014;color:#fff;border-radius:999px;padding:3px 7px;font-size:10px;font-weight:900;margin-top:4px}.capa-editor{background:#fff;border:2px solid var(--red);border-radius:16px;padding:18px;margin-top:18px;box-shadow:0 8px 24px #00000012}.capa-edit-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.capa-history{margin-top:18px}.capa-filters{grid-template-columns:1fr 1fr auto}@media(max-width:900px){.report-filter-pro{grid-template-columns:1fr 1fr}.capa-edit-grid{grid-template-columns:1fr}.capa-filters{grid-template-columns:1fr 1fr}}@media(max-width:560px){.report-filter-pro,.capa-filters{grid-template-columns:1fr}.report-selector{padding-bottom:10px}}

.audit-capa-card{border:1px solid #e1c4c9;border-left:5px solid var(--red);border-radius:12px;padding:15px;margin:14px 0;background:#fff}.audit-capa-card textarea{width:100%;border:1px solid #d8d2cf;border-radius:9px;padding:10px}.capa-ready{border-left:5px solid var(--green)}.capa-kpi{transition:.15s ease}.capa-kpi:hover{transform:translateY(-2px);box-shadow:0 7px 20px #00000012}.capa-kpi-alert{border:1px solid #efb9bf;background:#fff7f8}

.cms-badge{position:fixed;left:10px;bottom:10px;z-index:9980;font-size:10px;font-weight:900;padding:5px 8px;border-radius:999px;background:#e4f4ea;color:#166a3c;border:1px solid #b9dfc7}.cms-badge.offline{background:#fff1d6;color:#875a00;border-color:#ecd29d}.locked-input{background:#f3f3f3!important;color:#555}.resume-card{border-left:5px solid var(--red);margin:14px 0}

.final-summary{border-top:5px solid var(--red);margin-bottom:16px}.compact-grid{grid-template-columns:repeat(4,1fr);margin:12px 0}.final-status{margin-left:auto;background:#f7ecee;border:1px solid #dfb8bf;border-radius:10px;padding:8px 12px;text-align:center;color:var(--red)}.final-status b{display:block}.final-status small{display:block;color:#666;margin-top:2px}.audit-capa-card textarea{width:100%;border:1px solid #d8d2cf;border-radius:9px;padding:10px}@media(max-width:560px){.compact-grid{grid-template-columns:repeat(2,1fr)}}

.danger-draft{border-color:#b00020!important;color:#b00020!important;background:#fff!important}.danger-draft:hover{background:#fff2f4!important}

.site-logo{display:block;width:230px;max-width:48vw;height:auto;object-fit:contain}.brand{min-width:0}.topbar{min-height:78px;height:auto;padding-top:8px;padding-bottom:8px}@media(max-width:560px){.site-logo{width:190px;max-width:65vw}.topbar{min-height:74px}}

.capa-file-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.capa-file-chip{border:1px solid #ddd;border-radius:999px;padding:7px 10px;background:#fff;font-size:12px}.capa-file-chip.too-large{border-color:#c41230;background:#fff1f3;color:#a00}.activity-files{display:grid;gap:7px;margin-top:9px}.activity-files a{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:9px 10px;border:1px solid #e6d8db;border-radius:9px;background:#fff7f8;color:#8f0f25;text-decoration:none;font-weight:700}.activity-files a small{font-weight:400;color:#666;margin-left:auto}@media(max-width:560px){.activity-files a{align-items:flex-start;flex-direction:column;gap:3px}.activity-files a small{margin-left:0}}

/* QSC responsive production polish v2 */
html{font-size:16px}
body{font-size:15px;line-height:1.5}
main{max-width:1180px;padding:20px 20px 48px}
footer{font-size:12px;color:#777;text-align:center;padding:10px 12px 16px}
.topbar{padding-left:max(18px,3vw);padding-right:max(18px,3vw)}
.site-logo{width:210px;max-width:44vw}

.hero{border-radius:18px;padding:22px 24px;gap:16px}
.hero h1{font-size:26px;line-height:1.2}
.hero p{font-size:14px}
.grid{gap:12px;margin:14px 0 18px}
.card{padding:15px;border-radius:14px}
.metric .value{font-size:27px;margin-top:4px}
.metric .label{font-size:12px}
.metric .sub{font-size:11px;margin-top:2px}

.section-title{margin:20px 0 9px;align-items:center;gap:12px}
.section-title h2{font-size:21px;line-height:1.25}
.section-title small{font-size:12px}
.formbar{grid-template-columns:1.5fr 1fr 1fr 1fr;padding:13px;gap:10px;top:82px}
.field label{font-size:12px;margin-bottom:4px}
.field input,.field select,.field textarea,.filters input,.filters select{font-size:15px;min-height:42px}
.progress-wrap{margin:10px 0 14px}
.audit-tabs{margin:8px 0 13px}
.audit-tabs button{padding:8px 12px;font-size:14px}

.question-card{padding:15px;margin-bottom:10px;border-radius:14px}
.qtext{font-size:17px;line-height:1.5;margin:7px 0 11px}
.criterion{font-size:13.5px;line-height:1.5;padding:10px}
.answers{margin-top:11px}
.answer{font-size:15px;min-height:44px;padding:9px}
.note textarea{font-size:15px;min-height:68px}
.audit-actions{margin:16px 0 8px}

.report-actions{margin:8px 0 14px}
.report-head{padding:18px;border-radius:14px}
.report-title{align-items:flex-start}
.report-title h1{font-size:26px;line-height:1.15}
.report-title>div:last-child{max-width:48%;overflow-wrap:anywhere}
.report-title>div:last-child b{font-size:15px}
.report-title>div:last-child small{font-size:12px}
.report-meta{gap:8px;margin-top:14px}
.report-meta div{padding:9px}
.report-meta small{font-size:12px}
.report-meta b{font-size:15px}
.score-grid{gap:9px;margin:13px 0}
.score-box{padding:14px}
.score-box b{font-size:25px}
.findings,.chart{padding:15px}
.finding{padding:10px 0}

.filters,.report-filter-pro{padding:12px;gap:8px;margin-bottom:12px}
.report-selector{padding-bottom:9px}
.report-selector button{font-size:13px;padding:8px 11px}
.capa-editor{padding:15px;margin-top:12px}
.capa-history{margin-top:12px}
.audit-capa-card{padding:13px;margin:10px 0}
.empty{padding:20px}

.cms-badge{display:none!important}

@media(max-width:900px){
  main{padding:16px 16px 42px}
  .site-logo{width:190px;max-width:50vw}
  .topbar{min-height:70px;padding-top:6px;padding-bottom:6px}
  .formbar{grid-template-columns:1fr 1fr;position:static}
  .report-title>div:last-child{max-width:52%}
}

@media(max-width:560px){
  body{font-size:15px}
  main{padding:10px 10px 34px}
  footer{padding:8px 10px 12px;font-size:11px}
  .topbar{min-height:64px;padding:5px 10px}
  .site-logo{width:166px;max-width:50vw}
  .hamb{font-size:25px;padding:8px}
  nav{top:62px;right:10px;min-width:180px}
  nav button{font-size:15px;text-align:left}

  .hero{padding:16px;border-radius:14px;gap:12px}
  .hero h1{font-size:21px}
  .hero p{font-size:13px;line-height:1.4}
  .hero .primary{width:100%;min-height:44px;font-size:15px}
  .grid{grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 14px}
  .card{padding:12px;border-radius:12px}
  .metric .value{font-size:23px}
  .metric .label{font-size:11.5px}
  .metric .sub{font-size:10.5px}

  .section-title{margin:14px 0 7px;align-items:flex-start}
  .section-title h2{font-size:19px}
  .section-title small{font-size:11.5px}
  .section-title .ghost{padding:8px 10px;font-size:13px}

  .formbar{grid-template-columns:1fr;padding:10px;gap:8px;border-radius:12px}
  .field label{font-size:12px}
  .field input,.field select,.field textarea,.filters input,.filters select{font-size:16px;min-height:44px}
  .progress-wrap{margin:8px 0 11px}
  .audit-tabs{gap:6px;margin:6px 0 10px}
  .audit-tabs button{font-size:13px;padding:7px 10px}

  .question-card{padding:12px;margin-bottom:8px;border-radius:12px}
  .qhead{gap:8px}
  .qid{font-size:15px}
  .weight,.critical{font-size:11px}
  .qtext{font-size:17px;line-height:1.52;margin:6px 0 10px}
  .criteria{gap:7px}
  .criterion{font-size:14px;padding:10px;line-height:1.48}
  .answers{grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}
  .answer{font-size:16px;min-height:46px}
  .note{margin-top:8px}
  .note textarea{font-size:16px}

  .audit-actions{display:grid;grid-template-columns:1fr 1.7fr;gap:8px;margin:13px 0 5px}
  .audit-actions button{width:100%;min-height:48px;font-size:15px;padding:9px 10px}

  .report-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:6px 0 10px}
  .report-actions button{width:100%;min-height:44px;font-size:14px;padding:8px}
  .report-actions button:last-child{grid-column:1/-1}
  .report-head{padding:13px;border-top-width:5px}
  .report-title{display:grid;grid-template-columns:1fr;gap:8px}
  .report-title h1{font-size:25px}
  .report-title>div:last-child{max-width:none}
  .report-title>div:last-child b{font-size:15px;overflow-wrap:anywhere}
  .final-status{margin:0;padding:6px 9px;justify-self:start}
  .report-meta{grid-template-columns:1fr 1fr;gap:7px;margin-top:11px}
  .report-meta div{padding:8px}
  .report-meta small{font-size:11.5px}
  .report-meta b{font-size:14px}
  .score-grid{grid-template-columns:1fr 1fr;gap:7px;margin:10px 0}
  .score-box{padding:11px}
  .score-box b{font-size:23px}

  .findings,.chart{padding:12px;border-radius:12px}
  .finding{font-size:14px;padding:9px 0}
  .filters,.report-filter-pro,.capa-filters{grid-template-columns:1fr;padding:10px;gap:7px}
  .report-selector{gap:6px;margin:0 -2px;padding:2px 2px 8px}
  .report-selector button{font-size:12.5px;padding:7px 9px}

  .table-wrap{border-radius:12px}
  .data-table{min-width:720px}
  .data-table th,.data-table td{font-size:12px;padding:9px 10px}

  .capa-editor{padding:12px;border-radius:12px}
  .capa-edit-grid{gap:8px}
  .audit-capa-card{padding:11px;margin:8px 0}
  .capa-file-chip{font-size:11.5px;padding:6px 8px}
  .activity-files a{font-size:13px;padding:8px}

  .photo-preview{gap:8px;margin-top:9px}
  .photo-thumb{border-radius:9px}
  .report-photo-grid{gap:8px}

  .auth-userbar{gap:4px!important}
  .auth-userbar button{min-height:36px}
}

@media(max-width:380px){
  .site-logo{width:148px}
  .grid{grid-template-columns:1fr 1fr}
  .metric .value{font-size:21px}
  .audit-actions{grid-template-columns:1fr}
  .report-actions{grid-template-columns:1fr}
  .report-actions button:last-child{grid-column:auto}
}

/* QSC rating colors */
.rating-excellent{--rating:#1E7A45;--rating-bg:#EAF7EF;--rating-border:#B8DFC8}
.rating-good{--rating:#2F6FB3;--rating-bg:#EAF2FB;--rating-border:#BFD4EC}
.rating-improve{--rating:#A66B00;--rating-bg:#FFF4D6;--rating-border:#E8D39A}
.rating-unsat{--rating:#B42318;--rating-bg:#FDEBEC;--rating-border:#EAB8B4}
.rating-critical{--rating:#8B0000;--rating-bg:#F8D7DA;--rating-border:#D98A90}
.score-pill.rating-excellent,.score-pill.rating-good,.score-pill.rating-improve,.score-pill.rating-unsat,.score-pill.rating-critical,.rating-badge{background:var(--rating-bg);color:var(--rating);border:1px solid var(--rating-border)}
.rating-badge{display:inline-block;border-radius:999px;padding:4px 9px;font-weight:900}
.score-box.rating-excellent,.score-box.rating-good,.score-box.rating-improve,.score-box.rating-unsat,.score-box.rating-critical{background:var(--rating-bg);border-color:var(--rating-border)}
.score-box.rating-excellent b,.score-box.rating-good b,.score-box.rating-improve b,.score-box.rating-unsat b,.score-box.rating-critical b{color:var(--rating)}
.score-box.total.rating-excellent,.score-box.total.rating-good,.score-box.total.rating-improve,.score-box.total.rating-unsat,.score-box.total.rating-critical{border:2px solid var(--rating)}
.score-box.total em{display:block;margin-top:5px;font-size:11px;font-style:normal;font-weight:900;color:var(--rating);letter-spacing:.02em}

.rating-status-panel{border-left:5px solid var(--rating)!important;background:linear-gradient(90deg,var(--rating-bg),#fff 42%)}
