/* Customer Care Directory — component styles.
   Used standalone with any theme; the CareDial theme ships the same components in its own stylesheet. */
:root{
  --ccd-brand:#1f4fd1;--ccd-brand-ink:#fff;--ccd-call:#0e9f6e;--ccd-call-ink:#fff;
  --ccd-bg:#f6f7fb;--ccd-surface:#fff;--ccd-ink:#0f172a;--ccd-muted:#5b6475;--ccd-line:#e4e7ee;
  --ccd-warn-bg:#fff7e6;--ccd-warn-line:#f5c16c;--ccd-warn-ink:#7a4b00;--ccd-radius:14px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ccd-brand:#7c9bff;--ccd-brand-ink:#0b1020;--ccd-call:#34d399;--ccd-call-ink:#04130d;
  --ccd-bg:#0b1020;--ccd-surface:#121a2e;--ccd-ink:#e7ecf6;--ccd-muted:#9aa6bd;--ccd-line:#24304a;
  --ccd-warn-bg:#2a2110;--ccd-warn-line:#6b5220;--ccd-warn-ink:#f7d58c;}}
:root[data-theme="dark"]{
  --ccd-brand:#7c9bff;--ccd-brand-ink:#0b1020;--ccd-call:#34d399;--ccd-call-ink:#04130d;
  --ccd-bg:#0b1020;--ccd-surface:#121a2e;--ccd-ink:#e7ecf6;--ccd-muted:#9aa6bd;--ccd-line:#24304a;
  --ccd-warn-bg:#2a2110;--ccd-warn-line:#6b5220;--ccd-warn-ink:#f7d58c;}

.ccd-ico{flex:none;vertical-align:middle}
.ccd-intro{font-size:1.06rem;color:var(--ccd-muted);margin:0 0 1.25rem}
.ccd-card{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);padding:1.1rem 1.1rem .6rem;margin:0 0 1.75rem;box-shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px -12px rgba(15,23,42,.12)}
.ccd-card-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.4rem}
.ccd-card-head h2{font-size:1.15rem;margin:0}
.ccd-badge{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:600;color:var(--ccd-call);background:color-mix(in srgb,var(--ccd-call) 12%,transparent);padding:.25rem .6rem;border-radius:99px}
.ccd-contact-list{list-style:none;margin:0;padding:0}
.ccd-contact{display:flex;align-items:center;gap:.85rem;padding:.8rem 0;border-top:1px solid var(--ccd-line)}
.ccd-contact:first-child{border-top:0}
.ccd-contact-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:color-mix(in srgb,var(--ccd-brand) 10%,transparent);color:var(--ccd-brand);flex:none}
.ccd-contact.is-phone .ccd-contact-ico{background:color-mix(in srgb,var(--ccd-call) 12%,transparent);color:var(--ccd-call)}
.ccd-contact-body{display:flex;flex-direction:column;min-width:0;flex:1}
.ccd-contact-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ccd-muted);font-weight:600}
.ccd-contact-value{font-size:1.05rem;font-weight:600;color:var(--ccd-ink);text-decoration:none;overflow-wrap:anywhere}
.ccd-contact.is-phone .ccd-contact-value{font-size:1.25rem;font-variant-numeric:tabular-nums;letter-spacing:.01em}
a.ccd-contact-value:hover{color:var(--ccd-brand)}
.ccd-actions{display:flex;gap:.4rem;flex:none}
.ccd-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:40px;padding:.45rem .95rem;border-radius:10px;border:1px solid transparent;background:var(--ccd-brand);color:var(--ccd-brand-ink);font:inherit;font-weight:600;font-size:.92rem;cursor:pointer;text-decoration:none;line-height:1}
.ccd-btn:hover{filter:brightness(1.07)}
.ccd-btn-call{background:var(--ccd-call);color:var(--ccd-call-ink)}
.ccd-btn-ghost{background:transparent;color:var(--ccd-ink);border-color:var(--ccd-line)}
.ccd-btn-ghost:hover{border-color:var(--ccd-brand);color:var(--ccd-brand)}
.ccd-copy{width:40px;padding:0}.ccd-copy.is-done{color:var(--ccd-call);border-color:var(--ccd-call)}
.ccd-pending{display:flex;gap:.7rem;align-items:flex-start;background:var(--ccd-bg);border-radius:10px;padding:.8rem;color:var(--ccd-muted);margin:.4rem 0}
.ccd-pending p{margin:0}
.ccd-source{font-size:.82rem;color:var(--ccd-muted);margin:.4rem 0 .5rem}
.ccd-section{margin:2rem 0}
.ccd-section h2{font-size:1.3rem;margin:0 0 .8rem}
.ccd-table-wrap{overflow-x:auto}
.ccd-table{width:100%;border-collapse:collapse;font-size:.95rem}
.ccd-table th,.ccd-table td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--ccd-line)}
.ccd-table th{font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ccd-muted)}
.ccd-faq details{border:1px solid var(--ccd-line);border-radius:12px;background:var(--ccd-surface);margin:0 0 .6rem}
.ccd-faq summary{cursor:pointer;padding:.9rem 1rem;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.ccd-faq summary::-webkit-details-marker{display:none}
.ccd-faq summary::after{content:"+";font-size:1.3rem;line-height:1;color:var(--ccd-muted)}
.ccd-faq details[open] summary::after{content:"–"}
.ccd-faq details>div{padding:0 1rem 1rem;color:var(--ccd-muted)}
.ccd-safety{display:flex;gap:.8rem;background:var(--ccd-warn-bg);border:1px solid var(--ccd-warn-line);color:var(--ccd-warn-ink);border-radius:12px;padding:1rem;margin:2rem 0}
.ccd-safety p{margin:.25rem 0 0;font-size:.93rem}
.ccd-feedback{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;padding:1rem;border:1px dashed var(--ccd-line);border-radius:12px;margin:1.5rem 0}
.ccd-feedback span{font-weight:600;margin-right:.3rem}.ccd-feedback small{color:var(--ccd-muted);flex-basis:100%}
.ccd-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.7rem}
.ccd-tile{display:flex;align-items:center;gap:.75rem;padding:.8rem .9rem;border:1px solid var(--ccd-line);border-radius:12px;background:var(--ccd-surface);color:var(--ccd-ink);text-decoration:none;height:100%;box-sizing:border-box;transition:border-color .15s,transform .15s}
.ccd-tile:hover{border-color:var(--ccd-brand);transform:translateY(-1px)}
.ccd-tile>.ccd-ico:last-child{color:var(--ccd-muted);margin-left:auto}
.ccd-tile-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--ccd-brand) 10%,transparent);color:var(--ccd-brand);flex:none}
.ccd-tile-body{display:flex;flex-direction:column;min-width:0}
.ccd-tile-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ccd-tile-num{font-size:.85rem;color:var(--ccd-muted);font-variant-numeric:tabular-nums}
.ccd-types{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.8rem}
.ccd-types a{display:flex;gap:.8rem;align-items:center;padding:1rem;border-radius:14px;border:1px solid var(--ccd-line);background:var(--ccd-surface);color:var(--ccd-ink);text-decoration:none}
.ccd-types a:hover{border-color:var(--ccd-brand)}
.ccd-types small{display:block;color:var(--ccd-muted)}
.ccd-type-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--ccd-brand) 10%,transparent);color:var(--ccd-brand)}
.ccd-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.ccd-chips a{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .85rem;border-radius:99px;border:1px solid var(--ccd-line);background:var(--ccd-surface);color:var(--ccd-ink);text-decoration:none;font-weight:600;font-size:.92rem}
.ccd-chips a:hover{border-color:var(--ccd-brand);color:var(--ccd-brand)}
.ccd-chips small{color:var(--ccd-muted);font-weight:400}
.ccd-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem;margin:0 0 1rem;padding:0;font-size:.85rem;color:var(--ccd-muted)}
.ccd-crumbs li+li::before{content:"/";margin-right:.3rem;opacity:.6}
.ccd-crumbs a{color:inherit;text-decoration:none}.ccd-crumbs a:hover{color:var(--ccd-brand)}
.ccd-search{position:relative;display:flex;align-items:center;gap:.5rem;background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:14px;padding:.35rem .35rem .35rem .9rem;box-shadow:0 10px 30px -15px rgba(15,23,42,.25)}
.ccd-search>.ccd-ico{color:var(--ccd-muted)}
.ccd-search input[type=search]{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:1.05rem;color:var(--ccd-ink);padding:.6rem 0;outline:none}
.ccd-search:focus-within{border-color:var(--ccd-brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--ccd-brand) 18%,transparent)}
.ccd-suggest{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:50;list-style:none;margin:0;padding:.35rem;background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:12px;box-shadow:0 16px 40px -12px rgba(15,23,42,.3);max-height:60vh;overflow:auto;text-align:left}
.ccd-suggest a{display:flex;flex-direction:column;padding:.6rem .7rem;border-radius:8px;color:var(--ccd-ink);text-decoration:none;font-weight:600}
.ccd-suggest a small{font-weight:400;color:var(--ccd-muted)}
.ccd-suggest a:hover,.ccd-suggest a.is-active{background:var(--ccd-bg)}
.ccd-sg-empty{padding:.6rem .7rem;color:var(--ccd-muted)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
@media (max-width:560px){
  .ccd-contact{flex-wrap:wrap}
  .ccd-contact.is-phone .ccd-actions{width:100%;padding-left:calc(40px + .85rem)}
  .ccd-contact.is-phone .ccd-btn-call{flex:1}
  .ccd-search .ccd-btn{display:none}
}
.ccd-unverified{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:600;color:var(--ccd-muted);background:var(--ccd-bg);border:1px solid var(--ccd-line);padding:.2rem .6rem;border-radius:99px}

/* ---------- v1.2 engagement components ---------- */
.ccd-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.ccd-muted{color:var(--ccd-muted)}
.ccd-actionbar{display:flex;flex-wrap:wrap;gap:.5rem;margin:.9rem 0 0}
.ccd-actionbar .ccd-btn{min-height:36px;padding:.35rem .8rem;font-size:.88rem}
[data-ccd-save].is-on{border-color:#f5b400;color:#b77f00}
[data-ccd-save].is-on .ccd-star{fill:#f5b400;stroke:#f5b400}
.ccd-open{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:700;padding:.25rem .65rem;border-radius:99px}
.ccd-open::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.ccd-open.is-open{color:var(--ccd-call);background:color-mix(in srgb,var(--ccd-call) 12%,transparent)}
.ccd-open.is-closed{color:#c2410c;background:color-mix(in srgb,#c2410c 10%,transparent)}
.ccd-live{display:flex;align-items:center;gap:.5rem;margin:-1rem 0 1.25rem;font-size:.9rem;font-weight:600;color:var(--ccd-call)}
.ccd-live::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ccd-call);box-shadow:0 0 0 4px color-mix(in srgb,var(--ccd-call) 20%,transparent)}
.ccd-statuslink{display:flex;align-items:center;gap:.8rem;padding:.8rem 1rem;border:1px solid var(--ccd-line);border-radius:12px;background:var(--ccd-surface);color:var(--ccd-ink);text-decoration:none;margin:0 0 1.5rem}
.ccd-statuslink span:nth-child(2){display:flex;flex-direction:column;flex:1}
.ccd-statuslink small{color:var(--ccd-muted)}
.ccd-statuslink:hover{border-color:var(--ccd-brand)}
.ccd-status-dot{width:12px;height:12px;border-radius:50%;background:var(--ccd-call);flex:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--ccd-call) 18%,transparent)}
.ccd-statuslink.is-hot .ccd-status-dot{background:#dc2626;box-shadow:0 0 0 4px color-mix(in srgb,#dc2626 18%,transparent)}

.ccd-human h2,.ccd-track h2{display:flex;align-items:center;gap:.5rem}
.ccd-ivr{list-style:none;counter-reset:i;margin:0 0 1rem;padding:0;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.ccd-ivr li{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border:1px solid var(--ccd-line);border-radius:12px;background:var(--ccd-surface)}
.ccd-ivr li+li::before{content:"→";color:var(--ccd-muted);margin-right:.25rem}
.ccd-ivr kbd{display:grid;place-items:center;min-width:30px;height:30px;padding:0 .4rem;border-radius:8px;background:var(--ccd-brand);color:var(--ccd-brand-ink);font:700 .95rem/1 var(--font,inherit)}
.ccd-tips{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.6rem}
.ccd-tips li{display:grid;grid-template-columns:1fr auto;gap:.2rem .8rem;align-items:center;padding:.8rem 1rem;border:1px solid var(--ccd-line);border-radius:12px;background:var(--ccd-surface)}
.ccd-tips p{margin:0;font-weight:600}.ccd-tips small{color:var(--ccd-muted);grid-column:1}
.ccd-tips .ccd-tip-up{grid-row:1/3;grid-column:2;min-height:34px;font-size:.85rem}
.ccd-tipform summary,.ccd-track summary{cursor:pointer;font-weight:600;color:var(--ccd-brand)}
.ccd-tipform form,.ccd-track-form{display:grid;gap:.7rem;margin-top:.8rem;max-width:560px}
.ccd-tipform label,.ccd-track-form label{display:grid;gap:.3rem;font-size:.88rem;font-weight:600}
.ccd-tipform textarea,.ccd-tipform input,.ccd-track-form input,.ccd-sub input[type=email]{width:100%;box-sizing:border-box;padding:.65rem .8rem;border:1px solid var(--ccd-line);border-radius:10px;background:var(--ccd-surface);color:var(--ccd-ink);font:inherit}
.ccd-tipform form .ccd-btn,.ccd-track-form .ccd-btn{justify-self:start}
.ccd-grid2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.ccd-sub-msg{margin:.3rem 0 0;font-size:.88rem;color:var(--ccd-call);font-weight:600;min-height:1em}
.ccd-track{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);padding:1.1rem}
.ccd-track-after{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end;margin-top:1rem;padding-top:1rem;border-top:1px dashed var(--ccd-line)}
.ccd-sub-inline{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.ccd-sub-inline .ccd-sub-text{margin:0;font-size:.88rem;color:var(--ccd-muted)}
.ccd-sub-row{display:flex;gap:.5rem;flex-wrap:wrap}
.ccd-sub-row label{flex:1;min-width:200px}
.ccd-sub-title{display:block;font-size:1.05rem;margin-bottom:.2rem}
.ccd-sub-text{margin:0 0 .6rem;color:var(--ccd-muted);font-size:.92rem}
.ccd-watch{border:1px dashed var(--ccd-line);border-radius:12px;padding:1rem;margin:1.5rem 0}
.ccd-news{display:flex;gap:1rem;align-items:flex-start;background:linear-gradient(135deg,color-mix(in srgb,var(--ccd-brand) 10%,var(--ccd-surface)),var(--ccd-surface));border:1px solid var(--ccd-line);border-radius:16px;padding:1.2rem;margin:2rem 0}
.ccd-news>.ccd-ico{color:var(--ccd-brand);margin-top:.2rem}
.ccd-news-body{flex:1;display:grid;gap:.6rem}
.ccd-wa-follow{justify-self:start}

.ccd-escalate .ccd-steps{list-style:none;counter-reset:st;margin:0;padding:0;border-left:2px solid var(--ccd-line);margin-left:15px}
.ccd-escalate .ccd-steps li{counter-increment:st;position:relative;padding:0 0 1.2rem 1.6rem}
.ccd-escalate .ccd-steps li::before{content:counter(st);position:absolute;left:-16px;top:-2px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--ccd-surface);border:2px solid var(--ccd-brand);color:var(--ccd-brand);font-weight:700;font-size:.85rem}
.ccd-escalate .ccd-steps p{margin:.2rem 0 .5rem;color:var(--ccd-muted)}
.ccd-step-links{display:flex;flex-wrap:wrap;gap:.4rem}
.ccd-step-links .ccd-btn{min-height:34px;font-size:.85rem;padding:.3rem .75rem}

.ccd-status{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);padding:1.2rem;margin:0 0 1.75rem}
.ccd-status-head{display:flex;gap:.9rem;align-items:center;margin-bottom:1rem}
.ccd-status-head .ccd-status-dot{width:16px;height:16px}
.ccd-status-text{display:block;font-size:1.2rem}
.ccd-status-meta{color:var(--ccd-muted)}
.ccd-status.is-issues .ccd-status-dot{background:#f59e0b;box-shadow:0 0 0 5px color-mix(in srgb,#f59e0b 20%,transparent)}
.ccd-status.is-down .ccd-status-dot{background:#dc2626;box-shadow:0 0 0 5px color-mix(in srgb,#dc2626 20%,transparent);animation:ccd-pulse 1.4s infinite}
@keyframes ccd-pulse{50%{box-shadow:0 0 0 9px color-mix(in srgb,#dc2626 0%,transparent)}}
.ccd-bars{display:flex;align-items:flex-end;gap:3px;height:90px;padding:.5rem 0;border-bottom:1px solid var(--ccd-line)}
.ccd-bars span{flex:1;height:max(3px,var(--h));background:color-mix(in srgb,var(--ccd-brand) 70%,transparent);border-radius:3px 3px 0 0}
.ccd-status.is-down .ccd-bars span:last-child,.ccd-status.is-issues .ccd-bars span:last-child{background:#dc2626}
.ccd-bars-axis{display:flex;justify-content:space-between;font-size:.75rem;color:var(--ccd-muted);margin-top:.3rem}
.ccd-status-top{font-size:.9rem;color:var(--ccd-muted);display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.ccd-chip-sm{display:inline-block;padding:.15rem .55rem;border-radius:99px;background:var(--ccd-bg);border:1px solid var(--ccd-line);color:var(--ccd-ink);font-size:.8rem}
.ccd-report{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--ccd-line)}
.ccd-report p{margin:0 0 .6rem}
.ccd-report-btns{display:flex;flex-wrap:wrap;gap:.45rem}
.ccd-report-btns .ccd-btn{min-height:36px;font-size:.88rem}
.ccd-report-msg{color:var(--ccd-call);font-weight:600;margin-top:.6rem!important}

.ccd-notice,.ccd-overdue{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;padding:.65rem 16px;font-size:.92rem;font-weight:600;text-align:center}
.ccd-notice{background:color-mix(in srgb,var(--ccd-call) 14%,var(--ccd-surface));color:var(--ccd-ink)}
.ccd-overdue{background:#fff4e5;color:#7a4b00;border-bottom:1px solid #f5c16c}
.ccd-overdue a{color:inherit}
.ccd-overdue-x{border:0;background:transparent;color:inherit;font-size:1.3rem;line-height:1;cursor:pointer;padding:0 .3rem}
.ccd-overdue[hidden],.ccd-notice[hidden]{display:none}

.ccd-mytile{display:flex;align-items:stretch;gap:.4rem}
.ccd-mytile .ccd-tile{flex:1;min-width:0}
.ccd-mytile-act{display:flex;gap:.35rem;align-items:center}
.ccd-mytile-act .ccd-btn{width:40px;padding:0}
.ccd-changed{display:inline-block;margin-top:.2rem;font-size:.72rem;font-weight:700;color:#b45309;background:#fef3c7;border-radius:99px;padding:.05rem .5rem;align-self:flex-start}
.ccd-empty{list-style:none;color:var(--ccd-muted);grid-column:1/-1}
.ccd-complaints{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.ccd-complaint{border:1px solid var(--ccd-line);border-radius:12px;background:var(--ccd-surface);padding:.9rem 1rem;display:grid;gap:.4rem}
.ccd-complaint.is-resolved{opacity:.65}
.ccd-complaint-head{display:flex;justify-content:space-between;gap:1rem;align-items:center}
.ccd-complaint-head a{font-weight:700;color:var(--ccd-ink);text-decoration:none}
.ccd-daycount{font-size:.8rem;font-weight:700;padding:.15rem .6rem;border-radius:99px;background:var(--ccd-bg)}
.ccd-daycount.is-late{background:#fee2e2;color:#b91c1c}
.ccd-complaint-act{display:flex;flex-wrap:wrap;gap:.4rem}
.ccd-complaint-act .ccd-btn{min-height:34px;font-size:.85rem;padding:.3rem .75rem}
.ccd-my-install{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:14px;padding:1rem;margin-bottom:1.5rem}
.ccd-my-install p{margin:0;flex:1;min-width:220px}
.ccd-my-install[hidden],.ccd-ios[hidden],[data-install][hidden]{display:none}
.ccd-lang{font-weight:700;font-size:.9rem;text-decoration:none;color:var(--ccd-ink);padding:.45rem .6rem;border-radius:8px;border:1px solid var(--ccd-line)}
.ccd-lang:hover{border-color:var(--ccd-brand);color:var(--ccd-brand)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ccd-overdue{background:#2a2110;color:#f7d58c;border-color:#6b5220}:root:not([data-theme="light"]) .ccd-changed{background:#3b2a0a;color:#fbbf24}:root:not([data-theme="light"]) .ccd-daycount.is-late{background:#3b1111;color:#fca5a5}}
:root[data-theme="dark"] .ccd-overdue{background:#2a2110;color:#f7d58c;border-color:#6b5220}
:root[data-theme="dark"] .ccd-changed{background:#3b2a0a;color:#fbbf24}
:root[data-theme="dark"] .ccd-daycount.is-late{background:#3b1111;color:#fca5a5}
@media (max-width:560px){.ccd-grid2{grid-template-columns:1fr}.ccd-news{flex-direction:column}}
.ccd-track-after[hidden],.ccd-live[hidden],.ccd-open[hidden]{display:none}
.ccd-sub-inline .ccd-sub-row label{min-width:180px}

/* ===== At-a-glance, experiences, problem picker, leaderboard (v1.3) ===== */
.ccd-glance{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);padding:.9rem 1rem;margin:0 0 1.5rem}
.ccd-glance ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.ccd-glance li{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .7rem;border-radius:99px;font-size:.86rem;font-weight:600;background:color-mix(in srgb,var(--ccd-muted) 12%,transparent);color:var(--ccd-ink)}
.ccd-glance li.is-good{background:color-mix(in srgb,var(--ccd-call) 14%,transparent);color:var(--ccd-call)}
.ccd-glance li.is-mid{background:var(--ccd-warn-bg);color:var(--ccd-warn-ink)}
.ccd-glance li.is-bad{background:color-mix(in srgb,#dc2626 14%,transparent);color:#dc2626}
.ccd-glance li.is-info{background:color-mix(in srgb,var(--ccd-brand) 12%,transparent);color:var(--ccd-brand)}
.ccd-glance p{margin:.6rem 0 0;font-size:.9rem;color:var(--ccd-muted)}
.ccd-glance a{color:var(--ccd-brand);font-weight:600}

.ccd-fix .ccd-issue-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin:.6rem 0 1rem}
.ccd-chip-btn{font:inherit;font-size:.9rem;font-weight:600;padding:.45rem .85rem;border-radius:99px;border:1px solid var(--ccd-line);background:var(--ccd-surface);color:var(--ccd-ink);cursor:pointer}
.ccd-chip-btn:hover,.ccd-chip-btn.is-on{border-color:var(--ccd-brand);color:var(--ccd-brand);background:color-mix(in srgb,var(--ccd-brand) 8%,transparent)}
.ccd-fix-panel{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);padding:1rem 1.1rem}
.ccd-fix-panel h3{margin:0 0 .5rem;font-size:1.05rem}
.ccd-fix-steps{margin:0 0 1rem;padding-left:1.2rem;display:grid;gap:.35rem}
.ccd-letter{border-top:1px solid var(--ccd-line);padding-top:1rem;display:grid;gap:.7rem}
.ccd-letter label,.ccd-expform label,.ccd-claim label{display:grid;gap:.25rem;font-weight:600;font-size:.9rem}
.ccd-letter input,.ccd-letter textarea,.ccd-expform input:not([type=radio]):not([type=checkbox]),.ccd-expform select,.ccd-expform textarea,.ccd-claim input{font:inherit;padding:.55rem .7rem;border:1px solid var(--ccd-line);border-radius:10px;background:var(--ccd-bg);color:var(--ccd-ink);width:100%;box-sizing:border-box}
.ccd-letter-out{font-family:ui-monospace,Menlo,Consolas,monospace!important;font-size:.88rem!important;line-height:1.5}
.ccd-letter-act{display:flex;flex-wrap:wrap;gap:.5rem}
.ccd-fine{font-size:.8rem;color:var(--ccd-muted);margin:.4rem 0 0}

.ccd-exp-stats{display:flex;flex-wrap:wrap;gap:.75rem;margin:.5rem 0 1rem}
.ccd-exp-stats>div{flex:1 1 110px;background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:12px;padding:.7rem .9rem;display:grid;gap:.1rem}
.ccd-exp-stats b{font-size:1.5rem;line-height:1.1}.ccd-exp-stats b small{font-size:.85rem;color:var(--ccd-muted);font-weight:600}
.ccd-exp-stats span{font-size:.8rem;color:var(--ccd-muted)}
.ccd-exp-issues h3{font-size:.95rem;margin:.2rem 0 .5rem}
.ccd-bar{display:grid;grid-template-columns:minmax(120px,40%) 1fr 2.2rem;align-items:center;gap:.6rem;font-size:.86rem;margin:.3rem 0}
.ccd-bar i{display:block;height:10px;border-radius:99px;background:color-mix(in srgb,var(--ccd-brand) 14%,transparent);position:relative;overflow:hidden}
.ccd-bar i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--ccd-brand);border-radius:99px}
.ccd-bar b{text-align:right}
.ccd-exp-tip{display:flex;gap:.5rem;align-items:flex-start;background:color-mix(in srgb,var(--ccd-call) 10%,transparent);border-radius:12px;padding:.7rem .9rem;font-size:.92rem;margin:1rem 0}
.ccd-exp-list{list-style:none;margin:1rem 0;padding:0;display:grid;gap:.8rem}
.ccd-exp{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-left:4px solid var(--ccd-muted);border-radius:12px;padding:.85rem 1rem}
.ccd-exp.is-resolved{border-left-color:var(--ccd-call)}.ccd-exp.is-unresolved{border-left-color:#dc2626}.ccd-exp.is-pending{border-left-color:#d99a00}
.ccd-exp-top{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.35rem}
.ccd-stars{color:#e0a100;letter-spacing:1px}
.ccd-exp-chip,.ccd-exp-out{font-size:.76rem;font-weight:700;padding:.15rem .55rem;border-radius:99px;background:color-mix(in srgb,var(--ccd-muted) 14%,transparent)}
.ccd-exp-out.is-resolved{background:color-mix(in srgb,var(--ccd-call) 16%,transparent);color:var(--ccd-call)}
.ccd-exp-out.is-unresolved{background:color-mix(in srgb,#dc2626 14%,transparent);color:#dc2626}
.ccd-exp-body{margin:.2rem 0;overflow-wrap:anywhere}
.ccd-exp-meta{margin:.2rem 0 .5rem;font-size:.8rem;color:var(--ccd-muted)}
.ccd-exp-reply{background:color-mix(in srgb,var(--ccd-brand) 8%,transparent);border-radius:10px;padding:.55rem .8rem;margin:.4rem 0;font-size:.9rem}
.ccd-exp-reply p{margin:.2rem 0 0}
.ccd-exp-act{display:flex;align-items:center;gap:.8rem}
.ccd-exp-act .ccd-btn{min-height:32px;font-size:.82rem;padding:.25rem .7rem}
.ccd-link{background:none;border:0;padding:0;font:inherit;font-size:.8rem;color:var(--ccd-muted);text-decoration:underline;cursor:pointer}
.ccd-expform,.ccd-claim{border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);background:var(--ccd-surface);padding:.2rem 1rem;margin:1rem 0}
.ccd-expform>summary,.ccd-claim>summary{cursor:pointer;font-weight:700;padding:.8rem 0}
.ccd-expform form,.ccd-claim form{display:grid;gap:.8rem;padding-bottom:.6rem}
.ccd-radios,.ccd-rate{border:0;padding:0;margin:0}.ccd-radios legend,.ccd-rate legend{font-weight:600;font-size:.9rem;margin-bottom:.3rem}
.ccd-radios label{display:inline-flex;flex-direction:row;align-items:center;gap:.35rem;margin-right:1rem;font-weight:500}
.ccd-rate{display:flex;flex-direction:row-reverse;justify-content:flex-end;flex-wrap:wrap;gap:.1rem}
.ccd-rate legend{flex:0 0 100%;order:99;float:none}
.ccd-rate input{position:absolute;opacity:0;width:1px;height:1px}
.ccd-rate label{font-size:2rem;line-height:1;color:var(--ccd-line);cursor:pointer;display:block;padding:0 .1rem}
.ccd-rate input:checked~label,.ccd-rate label:hover,.ccd-rate label:hover~label{color:#e0a100}
.ccd-rate input:focus-visible+label{outline:2px solid var(--ccd-brand);border-radius:6px}
.ccd-check{display:flex!important;grid-template-columns:none!important;flex-direction:row;align-items:flex-start;gap:.5rem;font-weight:500!important}
.ccd-claim summary{font-weight:600;font-size:.92rem;color:var(--ccd-muted)}

.ccd-lbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.ccd-lb{background:var(--ccd-surface);border:1px solid var(--ccd-line);border-radius:var(--ccd-radius);padding:.9rem 1.1rem}
.ccd-lb h3{margin:0 0 .5rem;font-size:1rem}
.ccd-lb ol{margin:0;padding-left:1.2rem;display:grid;gap:.35rem}
.ccd-lb li small{display:block;color:var(--ccd-muted);font-size:.78rem}
.ccd-lb a{color:var(--ccd-ink);font-weight:600;text-decoration:none}.ccd-lb a:hover{color:var(--ccd-brand)}
@media (max-width:520px){.ccd-bar{grid-template-columns:1fr 2.2rem}.ccd-bar i{grid-column:1/-1;order:3}}