/* Order fulfillment: countdown, timeline, 7-step stepper, work panel (dashboards),
   draft review and download pages, tracking page extras. Builds on style.css variables. */
:root{
  --fl-amber:#B7791F; --fl-amber-soft:#F6E7CF;
  --fl-blue:#2F5F8A; --fl-blue-soft:#DCE5EA;
}
[data-mode="dark"]{
  --fl-amber:#E8B65A; --fl-amber-soft:#3A2E17;
  --fl-blue:#7FB6E8; --fl-blue-soft:#173C55;
}
@media (prefers-color-scheme: dark){
  :root:not([data-mode]){
    --fl-amber:#E8B65A; --fl-amber-soft:#3A2E17;
    --fl-blue:#7FB6E8; --fl-blue-soft:#173C55;
  }
}

/* ---- 7-step stepper: smaller labels so seven fit ---- */
.tstepper.seven .tstep{font-size:12px; line-height:1.3;}
@media (min-width:601px) and (max-width:900px){ .tstepper.seven .tstep{font-size:11px;} }

/* ---- Countdown ---- */
.countdown{display:grid; grid-template-columns:1fr auto; gap:6px 12px; align-items:center; margin:12px 0; padding:12px 14px; border-radius:10px; border:1px solid var(--success); background:var(--success-soft); color:var(--text);}
.countdown .cd-text{font-weight:700; font-family:'Space Grotesk',sans-serif; font-size:17px; color:var(--success);}
.countdown .cd-due{font-size:13px; color:var(--text-secondary); text-align:right;}
.countdown .cd-bar{grid-column:1 / -1; height:6px; border-radius:999px; background:rgba(0,0,0,.08); overflow:hidden;}
.countdown .cd-bar i{display:block; height:100%; border-radius:inherit; background:var(--success); transition:width 400ms ease;}
.countdown.tone-amber{border-color:var(--fl-amber); background:var(--fl-amber-soft);}
.countdown.tone-amber .cd-text{color:var(--fl-amber);}
.countdown.tone-amber .cd-bar i{background:var(--fl-amber);}
.countdown.tone-red{border-color:var(--attention); background:var(--attention-soft);}
.countdown.tone-red .cd-text{color:var(--attention);}
.countdown.tone-red .cd-bar i{background:var(--attention);}
.countdown.overdue{animation:flPulse 1.6s ease-in-out infinite;}
.overdue-tag{animation:flPulse 1.6s ease-in-out infinite;}
@keyframes flPulse{0%,100%{box-shadow:0 0 0 0 rgba(156,67,38,.35);} 50%{box-shadow:0 0 0 6px rgba(156,67,38,0);}}
@media (prefers-reduced-motion: reduce){ .countdown.overdue, .overdue-tag{animation:none;} }

/* ---- Timeline (newest first; blue = automatic, green = team, amber = customer) ---- */
.ot-list{list-style:none; margin:0; padding:0;}
.ot-item{position:relative; display:flex; gap:12px; padding:0 0 16px;}
.ot-item:not(:last-child)::before{content:''; position:absolute; left:6px; top:16px; bottom:0; width:2px; background:var(--border);}
.ot-dot{flex:none; width:14px; height:14px; margin-top:4px; border-radius:50%; background:var(--fl-blue); box-shadow:0 0 0 3px var(--fl-blue-soft);}
.actor-staff .ot-dot{background:var(--success); box-shadow:0 0 0 3px var(--success-soft);}
.actor-customer .ot-dot{background:var(--fl-amber); box-shadow:0 0 0 3px var(--fl-amber-soft);}
.ot-body{min-width:0;}
.ot-msg{font-size:14px; line-height:1.45; overflow-wrap:anywhere;}
.ot-meta{font-size:12px; color:var(--text-muted);}

/* ---- Work panel (dashboards) ---- */
.work-panel{border-color:var(--accent);}
.wp-head{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:6px;}
.wp-head h3{margin:0;}
.work-panel form{margin:10px 0 0;}
.draft-form h4{margin:14px 0 10px; font-size:14px;}
.draft-slots{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px;}
.draft-slot{display:flex; flex-direction:column; gap:4px; padding:10px 12px; border:1px dashed var(--border-strong); border-radius:10px; background:var(--surface-2); font-size:13px;}
.draft-slot .ds-name{font-weight:600;}
.draft-slot small{color:var(--text-muted);}
.draft-slot input[type=file]{max-width:100%; font-size:12px;}
.ds-chosen{font-size:12px; color:var(--success); overflow-wrap:anywhere;}
.ds-notes{display:block; margin:12px 0; font-size:13px; font-weight:600;}
.ds-notes textarea{display:block; width:100%; margin-top:6px; font:inherit; font-weight:400;}
.feedback-box{margin:10px 0; padding:12px 14px; border-left:4px solid var(--fl-amber); border-radius:0 8px 8px 0; background:var(--fl-amber-soft); font-size:14px; line-height:1.55; overflow-wrap:anywhere;}
.feedback-box strong{display:block; margin-bottom:4px;}
.ref-pics{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px;}
.ref-pics img{width:96px; height:72px; object-fit:cover; border-radius:6px; border:1px solid var(--border);}
.cust-email-form{display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px; margin-top:16px !important; padding-top:12px; border-top:1px solid var(--border); font-size:13px;}
.cust-email-form label{display:flex; flex-direction:column; gap:4px; flex:1 1 240px; font-weight:600;}
.cust-email-form input{font:inherit; font-weight:400;}
.draft-list{list-style:none; margin:0; padding:0;}
.draft-list > li{padding:12px 0; border-bottom:1px solid var(--border);}
.draft-list > li:last-child{border-bottom:none;}
.dl-head{display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:14px;}
.dl-head .muted{font-size:12px;}
.dl-files{margin:8px 0; padding-left:18px; font-size:13px;}
.stage-override{margin-top:10px; font-size:13px;}
.stage-override summary{cursor:pointer; color:var(--text-secondary);}
.stage-override form{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}

/* ---- Review page ---- */
.review-doc{padding:30px 32px 22px;}
.draft-files{display:grid; gap:18px;}
.draft-file{margin:0; padding:12px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2);}
.draft-file figcaption{display:flex; justify-content:space-between; gap:10px; margin-bottom:8px; font-size:14px;}
.draft-file img{display:block; width:100%; max-height:520px; object-fit:contain; border-radius:6px; background:#fff;}
.pdf-frame{display:block; width:100%; height:min(70vh,560px); border:1px solid var(--border); border-radius:6px; background:#fff;}
.df-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px;}
.review-actions{padding:22px 0 6px;}
.review-actions h2{margin:0 0 14px; font-size:20px;}
.review-choices{display:grid; gap:14px;}
.review-approve .btn-confirm{width:100%;}
.review-changes summary{list-style:none; display:block; width:100%; padding:14px 18px; border:2px solid var(--accent); border-radius:10px; text-align:center; font-weight:700; color:var(--accent); cursor:pointer;}
.review-changes summary::-webkit-details-marker{display:none;}
.review-changes[open] summary{border-bottom-left-radius:0; border-bottom-right-radius:0;}
.review-changes form{display:grid; gap:8px; padding:14px; border:2px solid var(--accent); border-top:none; border-radius:0 0 10px 10px;}
.review-changes label{font-weight:600; font-size:14px;}
.review-changes textarea{font:inherit; width:100%;}

/* ---- Download page ---- */
.dl-list{list-style:none; margin:0; padding:0;}
.dl-list li{display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--border);}
.dl-list li:last-child{border-bottom:none;}
.dl-icon{flex:none; width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:var(--accent-soft); color:var(--accent); font-size:11px; font-weight:700; letter-spacing:.04em;}
.dl-name{flex:1; min-width:0; display:flex; flex-direction:column; overflow-wrap:anywhere;}
.dl-name small{color:var(--text-muted);}
.dl-all{margin:16px 0 0;}
.dl-all .btn-confirm{display:block; text-align:center; text-decoration:none;}
.dl-help p{margin:0 0 8px;}
.dl-help a{color:var(--accent); font-weight:600;}

/* ---- Tracking page extras ---- */
.track-action{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin:14px 0; padding:14px 16px; border-radius:10px; border:1px solid var(--fl-amber); background:var(--fl-amber-soft);}
.track-action.done{border-color:var(--success); background:var(--success-soft);}
.track-action strong{display:block;}
.track-action span{font-size:14px; color:var(--text-secondary);}
.tl-title{margin:18px 0 10px; font-size:16px;}

@media (max-width:600px){
  .review-doc{padding:22px 16px 16px;}
  .countdown{grid-template-columns:1fr;}
  .countdown .cd-due{text-align:left;}
  .track-action .btn{width:100%; text-align:center;}
}

/* ---- Task checklist card (top of the order page) ---- */
.task-card{border:2px solid var(--accent); background:linear-gradient(180deg, var(--accent-soft), var(--surface) 70%); padding:18px 20px;}
.task-card.all-done{border-color:var(--success); background:linear-gradient(180deg, var(--success-soft), var(--surface) 70%);}
.tc-head{margin-bottom:10px;}
.tc-kicker{display:block; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted);}
.task-card .tc-head h3{margin:2px 0 0; font-size:20px; letter-spacing:-.01em;}
.task-card.all-done .tc-head h3{color:var(--success);}
.tc-list{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
.tc-list li{display:flex; align-items:flex-start; gap:10px; font-size:15px; line-height:1.45; overflow-wrap:anywhere;}
.tc-done span:last-child{color:var(--text-secondary);}
.tc-icon{flex:none; width:22px; height:22px; margin-top:1px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;}
.tc-icon svg{width:14px; height:14px;}
.tc-icon.done{background:var(--success); color:#fff;}
.tc-icon.todo{border:2px solid var(--border-strong); background:var(--surface);}
.tc-icon.wait{color:var(--fl-amber);}
.tc-icon.wait svg{width:22px; height:22px;}
.task-card .countdown{margin:14px 0 0;}

/* ---- Order lists: completed rows (admin Orders tab) ---- */
.adm-table tr.done-row td{background:color-mix(in srgb, var(--success-soft) 55%, transparent);}
.list-head{margin:6px 0 10px; font-size:17px;}
.list-head .muted{font-weight:400; font-size:14px;}

/* ---- Work panel: messages, final files, "Mark as ready" confirmation ---- */
.wp-flash{margin:8px 0 12px;}
.final-files h4{margin:14px 0 4px; font-size:15px;}
.final-slots{list-style:none; margin:12px 0; padding:0; display:grid; gap:10px;}
.fs{padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2);}
.fs.missing{border-color:var(--attention); border-style:dashed;}
.fs.have{border-color:var(--success);}
.fs-head{display:flex; flex-wrap:wrap; align-items:center; gap:8px;}
.fs-head small{margin-left:auto;}
.fs-file{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:6px; font-size:14px; overflow-wrap:anywhere;}
.fs-file .muted{font-size:12px;}
.fs-remove{margin:0 0 0 auto !important;}
.fs-upload{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px !important;}
.fs-upload input[type=file]{flex:1 1 200px; min-width:0; font-size:13px;}
.btn-ghost{background:transparent; border:1px solid var(--border-strong); color:var(--text-secondary);}
.ready-confirm{margin-top:6px;}
.ready-confirm > summary{list-style:none; display:inline-flex; cursor:pointer;}
.ready-confirm > summary::-webkit-details-marker{display:none;}
.rc-box{margin-top:10px; padding:14px; border:2px solid var(--success); border-radius:10px; background:var(--success-soft);}
.rc-box ul{margin:6px 0 12px; padding-left:20px; font-size:14px;}
.final-list{margin:6px 0 0; padding-left:20px; font-size:14px;}

/* ---- Download page: done ---- */
.dl-complete{margin:16px 0 0; padding:12px 14px; border-radius:10px; border:1px solid var(--success); background:var(--success-soft); color:var(--text);}
.dl-complete strong{color:var(--success);}
.dl-complete a{color:var(--accent); font-weight:600;}

/* The 7-step stepper in the narrow "Stage" card of the dashboards: one step per line. */
.detail-col .tstepper.seven{flex-direction:column;}
.detail-col .tstepper.seven .tstep{flex-direction:row; align-items:flex-start; gap:10px; text-align:left; padding-bottom:12px; line-height:24px; font-size:13px;}
.detail-col .tstepper.seven .tstep:last-child{padding-bottom:0;}
.detail-col .tstepper.seven .tstep::after{top:24px; left:11px; width:2px; height:calc(100% - 24px);}
.detail-col .tstepper.seven .tstep.current::after{background:linear-gradient(180deg,var(--accent),var(--border-strong));}

/* ---- Work order code (internal) ---- */
.wo-code{display:inline-block; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; font-weight:600; letter-spacing:.02em; padding:2px 8px; border-radius:6px; background:var(--surface-2); border:1px solid var(--border); color:var(--text-secondary); white-space:nowrap; vertical-align:middle;}
.wo-code .wo-label{font-family:'Inter',sans-serif; font-weight:500; color:var(--text-muted);}
.wo-sep{color:var(--text-muted); font-weight:400;}
.detail-title .wo-code{font-size:13px; position:relative; top:-3px;}

/* ---- Designer workspace: previews, source files, customer's changes ---- */
.ws-card h3 .wo-code{margin-left:6px;}
.ws-previews{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:6px;}
.ws-preview{margin:0;}
.ws-preview img, .ws-sketch{display:block; width:100%; max-height:300px; object-fit:contain; border:1px solid var(--border); border-radius:10px; background:#fff;}
.ws-sketch{padding:16px; color:var(--text-secondary); background:var(--surface-2);}
.ws-preview figcaption{margin-top:6px; font-size:13px; color:var(--text-secondary);}
@media (max-width:700px){ .ws-previews{grid-template-columns:1fr;} }
.ws-files{margin-top:18px; padding-top:16px; border-top:1px solid var(--border);}
.ws-files > h3{margin-bottom:2px;}
a.btn.ws-cad-btn{display:block; width:100%; margin:12px 0 4px; padding:14px 18px; font-size:16px; font-weight:700; text-align:center; border-radius:10px; background:var(--accent); border-color:var(--accent); color:var(--surface);}
a.btn.ws-cad-btn:hover{filter:brightness(1.1);}
a.btn.ws-dl-cad{background:var(--accent); border-color:var(--accent); color:var(--surface);}
.ws-cad-missing{margin:12px 0 4px;}
.ws-group{margin-top:14px; padding-top:12px; border-top:1px dashed var(--border);}
.ws-group h4{margin:0 0 8px; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted);}
.ws-list{list-style:none; margin:0; padding:0; display:grid; gap:6px;}
.ws-file{display:flex; align-items:center; gap:12px; padding:8px 10px; border-radius:10px; border:1px solid var(--border); background:var(--surface);}
.ws-file.empty{opacity:.55; background:transparent; border-style:dashed;}
.ws-file.cad-hl{border:2px solid var(--accent); background:var(--accent-soft);}
.ws-icon{flex:none; width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:var(--accent-soft); color:var(--accent); font-size:11px; font-weight:700; letter-spacing:.04em;}
.ws-file.empty .ws-icon{background:var(--surface-2); color:var(--text-muted);}
.ws-thumb{flex:none; width:64px; height:44px; border-radius:8px; overflow:hidden; border:1px solid var(--border); background:#fff;}
.ws-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.ws-name{flex:1; min-width:0; display:flex; flex-direction:column; overflow-wrap:anywhere;}
.ws-name small{color:var(--text-muted); font-size:12px;}
.ws-dl{flex:none;}
.ws-changes .ws-callout{margin:0 0 12px; padding:12px 14px; border-left:4px solid var(--fl-amber); border-radius:0 8px 8px 0; background:var(--fl-amber-soft); font-size:14px; line-height:1.55; overflow-wrap:anywhere;}
.ws-callout strong{display:block; margin-bottom:4px;}
.ws-callout ul{margin:0; padding-left:18px;}
.ws-mods{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
.ws-mod{--tier:var(--text-muted); padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface);}
.ws-mod.tier-2{--tier:var(--accent);} .ws-mod.tier-3{--tier:var(--fl-amber);} .ws-mod.tier-4{--tier:var(--attention);}
.ws-mod-head{display:flex; align-items:center; gap:10px;}
.ws-mod-head .dot{flex:none; width:9px; height:9px; border-radius:50%; background:var(--tier);}
.ws-details{margin:6px 0 0 19px; padding:0; list-style:none; display:grid; gap:4px; font-size:14px; color:var(--text-secondary);}
.ws-details li::before{content:'– '; color:var(--text-muted);}
.ws-details li.ws-arch{display:flex; align-items:center; gap:8px; padding:6px 10px; border-radius:8px; background:var(--accent-soft); color:var(--text);}
.ws-details li.ws-arch::before{content:none;}
.ws-person{flex:none; width:16px; height:16px; color:var(--accent);}

/* ---- Order cards (dashboards and My Orders): stage, progress, time left, priority, next step ---- */
:root{--oc-teal:#2A7A78; --oc-teal-soft:#D5ECEA;}
[data-mode="dark"]{--oc-teal:#6FD3CB; --oc-teal-soft:#123A3A;}
@media (prefers-color-scheme: dark){ :root:not([data-mode]){--oc-teal:#6FD3CB; --oc-teal-soft:#123A3A;} }
.b-teal{background:var(--oc-teal-soft); color:var(--oc-teal);}
.oc-list{display:grid; gap:10px; container-type:inline-size;}
.ocard{position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) 250px; gap:10px 20px; align-items:center;
  padding:14px 30px 14px 16px; border:1px solid var(--border); border-left:4px solid var(--border-strong); border-radius:10px; background:var(--surface);
  transition:transform 180ms ease, box-shadow 180ms ease;}
.ocard:hover{transform:translateY(-2px); box-shadow:0 8px 22px rgba(36,31,23,.09);}
.ocard.type-modified{border-left-color:var(--fl-blue);}
.ocard.type-call, .ocard.type-call_waiting{border-left-color:var(--fl-amber);}
.ocard.type-quoted{border-left-color:var(--oc-teal);}
.ocard.done{border-left-color:var(--success); background:linear-gradient(90deg, var(--success-soft), var(--surface) 22%); padding-top:10px; padding-bottom:10px;}
.oc-dot{display:inline-block; width:10px; height:10px; border-radius:50%; flex:none; background:var(--text-muted);}
.ocard > .oc-dot{position:absolute; top:12px; right:12px;}
.oc-dot.dot-red{background:var(--attention); animation:ocPulse 1.6s ease-in-out infinite;}
.oc-dot.dot-amber{background:var(--fl-amber);}
.oc-dot.dot-green{background:var(--success);}
.oc-dot.dot-grey{background:var(--border-strong);}
@keyframes ocPulse{0%,100%{box-shadow:0 0 0 0 rgba(156,67,38,.45);} 50%{box-shadow:0 0 0 6px rgba(156,67,38,0);}}
.oc-id{min-width:0; display:grid; gap:3px;}
.oc-codes{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px;}
.oc-code{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:16px; color:var(--accent); text-decoration:none; letter-spacing:.02em;}
.oc-code:hover{text-decoration:underline;}
.oc-wo{font-size:12px; color:var(--text-muted); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;}
.oc-cust{font-size:14px; overflow-wrap:anywhere;}
.oc-tel{white-space:nowrap; color:var(--accent); text-decoration:none; font-size:13px;}
.oc-tel .ic, .ocard .badge .ic, .oc-btn .ic{width:13px; height:13px; vertical-align:-2px; margin-right:3px;}
.oc-design{font-size:13px; color:var(--text-secondary); overflow-wrap:anywhere;}
.oc-dcode{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; color:var(--text-muted);}
.oc-staff{font-size:12px; color:var(--text-secondary);}
.oc-mid{min-width:0; display:grid; gap:6px;}
.oc-badges{display:flex; flex-wrap:wrap; gap:6px;}
.oc-pulse{animation:ocPulse 1.6s ease-in-out infinite;}
.oc-bar{height:4px; border-radius:999px; background:var(--surface-2); overflow:hidden;}
.oc-bar i{display:block; height:100%; border-radius:inherit; background:var(--success);}
.oc-bar.bar-amber i{background:var(--fl-amber);}
.oc-bar.bar-red i{background:var(--attention);}
.oc-stage{font-size:13px; color:var(--text);}
.oc-pct{font-size:12px; color:var(--text-muted); font-variant-numeric:tabular-nums;}
.oc-side{display:flex; flex-direction:column; align-items:flex-end; gap:8px; text-align:right;}
.oc-count{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:16px; font-weight:600; line-height:1.3; font-variant-numeric:tabular-nums;}
.oc-count.tone-green{color:var(--success);}
.oc-count.tone-amber{color:var(--fl-amber);}
.oc-count.tone-red{color:var(--attention);}
.oc-count.tone-grey{color:var(--text-secondary); font-size:14px;}
.oc-count.overdue{font-weight:800;}
.ocard.done .oc-count{font-size:14px;}
.oc-btn{display:inline-flex; align-items:center; padding:6px 12px; border-radius:8px; font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap; border:1px solid transparent;}
.oc-btn.oc-primary{background:var(--accent); color:var(--surface);}
.oc-btn.oc-call{background:var(--fl-amber); color:#fff;}
.oc-btn.oc-wait{background:var(--surface-2); color:var(--text-secondary); border-color:var(--border); font-weight:500;}
.oc-btn.oc-view{background:transparent; color:var(--accent); border-color:var(--border-strong);}
.oc-btn:hover{filter:brightness(1.08);}
[data-mode="dark"] .oc-btn.oc-call{color:#12233A;}
@media (prefers-color-scheme: dark){ :root:not([data-mode]) .oc-btn.oc-call{color:#12233A;} }
.ocard{grid-template-areas:"id mid side";}
.oc-id{grid-area:id;} .oc-mid{grid-area:mid;} .oc-side{grid-area:side;}
/* Medium width: who + time on top, progress underneath. Phone: everything stacked, full width. */
@container (max-width:900px){
  .ocard{grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"id side" "mid mid";}
}
@container (max-width:560px){
  .ocard{grid-template-columns:minmax(0,1fr); grid-template-areas:"id" "mid" "side";}
  .oc-side{flex-direction:row; flex-wrap:wrap; justify-content:space-between; align-items:center; text-align:left;}
}
.oc-dash{display:grid; grid-template-columns:minmax(0,1fr); gap:18px;}
.oc-attn-card .oc-attn{grid-template-columns:repeat(auto-fill, minmax(min(100%, 340px), 1fr));}
.oc-done{margin-top:14px;}
.oc-done > summary{cursor:pointer; font-weight:600; color:var(--text-secondary); padding:6px 0;}
.oc-done[open] > summary{margin-bottom:8px;}
.oc-more{margin:4px 0 0; font-size:13px;}
.oc-more a{color:var(--accent); font-weight:600;}
.oc-filter{margin:0 0 12px;}
.oc-page{padding:14px;}
/* Overview numbers */
.oc-stats{margin-bottom:12px;}
.oc-stats.small{grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:20px;}
.oc-stats.small .stat{padding:10px 14px;}
.oc-stats.small .stat-value{font-size:22px;}
.oc-stats .stat-value small{font-size:14px; font-weight:500;}
.stat.oc-hot{border-top-color:var(--attention); background:var(--attention-soft);}
.stat.oc-hot .stat-value{color:var(--attention);}
.stat.oc-bad{border-top-color:var(--attention); background:var(--attention); color:#fff;}
.stat.oc-bad .stat-label, .stat.oc-bad .stat-hint{color:#fff;}
.stat.oc-good{border-top-color:var(--success); background:var(--success-soft);}
.stat.oc-good .stat-value{color:var(--success);}
@media (max-width:600px){ .oc-stats.small{grid-template-columns:minmax(0,1fr);} }
/* "Needs your attention" lines */
.oc-attn{list-style:none; margin:0 0 6px; padding:0; display:grid; gap:6px;}
.oc-attn a{display:flex; align-items:baseline; gap:10px; padding:9px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:inherit; text-decoration:none; font-size:14px; line-height:1.4;}
.oc-attn a:hover{border-color:var(--accent);}
.oc-attn .oc-dot{position:relative; top:1px;}
.oc-attn .attn-red a{border-left:3px solid var(--attention);}
.oc-attn .attn-amber a{border-left:3px solid var(--fl-amber);}
.oc-attn .attn-green a{border-left:3px solid var(--success);}
@media (prefers-reduced-motion: reduce){ .oc-dot.dot-red, .oc-pulse{animation:none;} .ocard, .ocard:hover{transition:none; transform:none;} }