/* Both cards keep the sample's proportions and the site's existing palette. */
.hc-card { --exam-mark:var(--warm); --hc-primary:var(--a2); --muted:var(--fg2); --hc-shadow:0 1px 0 var(--surface) inset,0 24px 48px -34px var(--muted); position:relative;background:var(--apple);color:var(--fg);border-radius:32px;padding:22px 20px 18px;display:grid;gap:18px;overflow:hidden;box-shadow:var(--hc-shadow);min-width:0;align-self:start; }
.hc-card [hidden] { display:none!important; }
.hc-card :where(div,p,span,dl,dd,h2,h3) { min-width:0; }
.hc-card button { font:inherit;cursor:pointer;touch-action:manipulation;color:inherit; }
.hc-card button:not(.hc-day) { min-height:44px; }
.hc-card button:focus-visible,.hc-card [tabindex]:focus-visible { outline:2px solid var(--hc-primary);outline-offset:3px;border-radius:12px; }
.hc-card .hc-day:focus-visible { border-radius:50%; }
.hc-card h2,.hc-card h3,.hc-card p { margin:0; }
.hc-card .btn { color:var(--on-accent);background:var(--btn) var(--button-shade);background-blend-mode:multiply; }
.hc-card .btn.ghost { background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1px var(--muted); }
.hc-card .link { color:var(--muted); }
.hc-card .btn.ghost:disabled { background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px var(--faint);cursor:default; }
.hc-calendar-top { display:flex;align-items:flex-start;justify-content:space-between;gap:12px; }
.hc-count { display:grid;gap:2px;text-align:left;border-radius:20px;padding:4px 6px;margin:-4px -6px;min-width:0;background:none;border:0; }
.hc-count-label,.hc-when { display:inline-block;color:var(--muted);font-size:13px; }
.hc-count-big { display:flex;align-items:baseline;gap:6px;line-height:1; }
.hc-count-number { font-size:76px;font-weight:700;letter-spacing:-.045em;font-variant-numeric:tabular-nums; }
.hc-unit { font-size:20px;font-weight:600; }
.hc-when { margin-top:6px; }
.hc-tally { display:grid;justify-items:center;gap:1px;min-width:92px;padding:11px 8px 4px;border-radius:22px;background:var(--surface);box-shadow:0 1px 0 var(--surface) inset,0 8px 20px -16px var(--muted);flex:none; }
.hc-sprout { width:30px;height:30px;color:var(--hc-primary); }
.hc-tally-line { display:flex;align-items:baseline;gap:3px;line-height:1.1; }
.hc-tally-number { display:inline-block;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums; }
.hc-tally-unit { font-size:12px;font-weight:600; }
.hc-tally small { font-size:11px;color:var(--muted); }
/* “这周 x/y 天”：44px 高的点按区域，里面一颗小胶囊；达标那周胶囊带一点渐变 */
.hc-week { display:grid;place-items:center;border:0;background:none;padding:0 2px;border-radius:14px;margin-top:2px; }
.hc-week-pill { display:inline-block;font-size:12px;font-weight:600;white-space:nowrap;padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--fg) 7%,transparent);font-variant-numeric:tabular-nums;transition:background-color .35s cubic-bezier(.32,.72,0,1),box-shadow .35s cubic-bezier(.32,.72,0,1); }
.hc-tally.hc-met .hc-week-pill { background:color-mix(in srgb,var(--hc-primary) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--hc-primary) 45%,transparent); }
.hc-ask { display:grid;gap:8px;padding:14px 14px 12px;border-radius:22px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line); }
.hc-ask-q { font-size:15px;font-weight:600;text-wrap:balance; }
.hc-ask-note { font-size:12px;color:var(--muted); }
.hc-ask-row { display:flex;gap:6px;flex-wrap:wrap;align-items:center; }
.hc-ask-row .link { padding:0 8px;font-size:14px; }
.hc-key { display:flex;align-items:center;flex-wrap:wrap;gap:4px 6px;font-size:11.5px;color:var(--muted);line-height:1.5;margin:-6px 0 0!important; }
.hc-key i { display:inline-block;width:12px;height:12px;border-radius:50%;vertical-align:-1px;flex:none; }
.hc-key-solid { background:var(--hc-primary); }
.hc-key-hollow { box-shadow:inset 0 0 0 1.5px var(--hc-primary); }
.hc-cal { display:grid;gap:10px;min-width:0; }
.hc-calhead { display:flex;justify-content:space-between;align-items:center;gap:4px; }
.hc-month-label { font-size:14px;font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.hc-cal-actions { display:flex;align-items:center;gap:2px;margin-left:auto;flex:none; }
.hc-toggle,.hc-back,.hc-arrow { border:0;background:none;border-radius:14px; }
.hc-toggle { display:flex;align-items:center;gap:4px;font-size:13px!important;color:var(--muted)!important;padding:0 4px; }
.hc-toggle span,.hc-fold span { display:inline-block; }
.hc-toggle span:last-child,.hc-fold span:last-child { transition:transform .45s cubic-bezier(.32,.72,0,1); }
.hc-toggle[aria-expanded=true] span:last-child,.hc-fold[aria-expanded=true] span:last-child { transform:rotate(180deg); }
.hc-back { font-size:12px!important;font-weight:600!important;padding:0 5px; }
.hc-month-nav { display:flex;gap:6px;margin-right:4px; }
.hc-arrow { width:40px;height:40px;min-height:40px!important;border-radius:50%;display:grid;place-items:center;font-size:22px!important;line-height:1;background:color-mix(in srgb,var(--fg) 6%,transparent); }
.hc-arrow.hc-week-menu { background:none;color:var(--muted)!important;font-size:19px!important; }
.hc-dow,.hc-grid { display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center; }
.hc-dow { font-size:11px;color:var(--muted); }
.hc-grid { position:relative;row-gap:12px;will-change:transform; }
.hc-gridbox { overflow:hidden;padding:4px 0 16px;touch-action:pan-y;user-select:none;-webkit-user-select:none; }
.hc-day { position:relative;aspect-ratio:1;width:100%;max-width:46px;min-height:0;margin:0 auto;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;font-size:14px!important;font-weight:600!important;font-variant-numeric:tabular-nums;transition:background-color .28s cubic-bezier(.32,.72,0,1),box-shadow .28s cubic-bezier(.32,.72,0,1),color .28s cubic-bezier(.32,.72,0,1),opacity .28s cubic-bezier(.32,.72,0,1); }
.hc-day.hc-out { color:var(--fg3); }
.hc-day.hc-future { color:var(--muted);font-weight:500!important; }
.hc-day.hc-done { background:var(--hc-primary);color:var(--on-primary); }
/* 空心勾：自己记的，一圈主色描边、勾也是主色 */
.hc-day.hc-self { box-shadow:inset 0 0 0 2px var(--hc-primary);color:var(--hc-primary); }
.hc-day.hc-today:not(.hc-done):not(.hc-self) { box-shadow:inset 0 0 0 2px var(--hc-primary); }
.hc-day.hc-today:not(.hc-done):not(.hc-self)::after { content:'点我';position:absolute;bottom:-15px;font-size:10px;color:var(--accent-ink);font-weight:600; }
/* 达标那周：一条渐变的底从周一亮到周日（每格是同一条渐变的第几段） */
.hc-band { position:absolute;grid-column:1 / -1;inset:3px 0;z-index:-1;border-radius:999px;pointer-events:none;transform-origin:left center;background:linear-gradient(90deg,color-mix(in srgb,var(--a1) 30%,transparent),color-mix(in srgb,var(--a2) 30%,transparent),color-mix(in srgb,var(--a3) 30%,transparent)); }
.hc-band[data-state=off] { background:color-mix(in srgb,var(--fg) 8%,transparent); }
/* 放假、休息的那周灰掉 */
.hc-day.hc-off { color:var(--fg3); }
.hc-day.hc-off.hc-done { background:var(--fg3);color:var(--apple); }
.hc-day.hc-off.hc-self { box-shadow:inset 0 0 0 2px var(--fg3);color:var(--fg3); }
.hc-off-mark { position:absolute;top:-4px;left:0;font-size:9px;line-height:1;font-weight:700;padding:3px 4px;border-radius:8px;background:var(--surface);color:var(--fg2);box-shadow:inset 0 0 0 1px var(--faint);pointer-events:none; }
.hc-day-label { transition:opacity .25s cubic-bezier(.32,.72,0,1); }
.hc-done .hc-day-label,.hc-self .hc-day-label { opacity:0; }
.hc-exam-mark { position:absolute;top:-3px;right:-2px;font-size:9px;line-height:1;font-weight:700;padding:3px 4px;border-radius:8px;background:color-mix(in srgb,var(--exam-mark) 85%,var(--fg));color:var(--on-primary); }
.hc-check { position:absolute;inset:0;width:100%;height:100%;pointer-events:none; }
.hc-gaokao { display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--faint);padding-top:12px;color:var(--muted);font-size:12px; }
.hc-gaokao b { font-size:15px;color:var(--fg);font-variant-numeric:tabular-nums;white-space:nowrap; }
.hc-pop { background:var(--surface);border-radius:24px;padding:16px 16px 14px;display:grid;gap:10px;overflow:hidden;scroll-margin:96px 0 120px; }
.hc-pop h3 { font-size:16px; }
.hc-pop p { color:var(--muted);font-size:14px;line-height:1.55;overflow-wrap:anywhere; }
.hc-row { display:flex;gap:10px;justify-content:flex-end;align-items:center;flex-wrap:wrap; }
.hc-types { display:flex;gap:6px;flex-wrap:wrap; }
.hc-chip { padding:0 12px;border-radius:22px;background:transparent;border:1px solid var(--muted);font-size:14px!important;transition:background-color .28s cubic-bezier(.32,.72,0,1),color .28s cubic-bezier(.32,.72,0,1),box-shadow .28s cubic-bezier(.32,.72,0,1); }
.hc-chip[aria-pressed=true] { color:var(--on-primary);background:var(--hc-primary); }
.hc-burst { position:absolute;inset:0;pointer-events:none;overflow:visible; }
.hc-burst i { position:absolute;width:7px;height:7px; }
.hc-celebration { position:absolute;inset:0;pointer-events:none;border-radius:32px;display:grid;place-items:center;align-content:center;gap:6px;background:color-mix(in srgb,var(--apple) 72%,transparent);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);z-index:2; }
.hc-celebration .hc-sprout { width:44px;height:44px; }
.hc-cele-number { font-size:96px;font-weight:700;letter-spacing:-.05em;line-height:1.15;font-variant-numeric:tabular-nums; }
.hc-cele-title { font-size:17px;font-weight:600; }
.hc-cele-sub { max-width:90%;font-size:13px;color:var(--muted);text-align:center; }
/* 左右各留 5px 给键盘焦点框（卡片会裁掉超出的部分），外面用负边距抵掉，排版不变 */
.hc-exam { gap:20px;background:transparent;box-shadow:none;padding:0 5px;margin:0 -5px;border-radius:0; }
.hc-exam-head { display:flex;align-items:center;justify-content:space-between;gap:10px; }
.hc-exam-head h2 { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
.hc-exam-head { justify-content:flex-end; }
.hc-which { font-size:12px;color:var(--muted);display:inline-block; }
.hc-sum { display:flex;justify-content:space-between;align-items:flex-end;gap:10px; }
.hc-total-line { display:flex;align-items:baseline;gap:6px;line-height:1; }
.hc-total { font-size:64px;font-weight:700;letter-spacing:-.045em;font-variant-numeric:tabular-nums; }
.hc-total-line>span { color:var(--muted);font-size:15px; }
.hc-exam-sub { font-size:12px;color:var(--muted);margin-top:10px; }
.hc-delta { display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;padding:7px 11px;border-radius:12px;background:var(--surface);white-space:nowrap;font-variant-numeric:tabular-nums; }
.hc-delta-arrow { display:inline-block;transition:transform .5s cubic-bezier(.32,.72,0,1); }
.hc-radarbox { display:grid;place-items:center;margin:-6px 0 -4px;min-width:0; }
.hc-radar { width:100%;max-width:330px;height:auto;overflow:visible; }
.hc-radar-grid { fill:none;stroke:var(--muted);stroke-opacity:.24;stroke-width:1; }
.hc-axis { stroke:var(--muted);stroke-opacity:.12;stroke-width:1; }
.hc-previous { fill:none;stroke:var(--muted);stroke-width:1.3;stroke-dasharray:3 4;stroke-linecap:round;transform-box:fill-box;transform-origin:center; }
.hc-now { fill:var(--hc-primary);fill-opacity:.14;stroke:var(--hc-primary);stroke-width:2.2;stroke-linejoin:round; }
.hc-dot { fill:var(--hc-primary);stroke:var(--hc-primary);stroke-width:1.5; }
.hc-dot.hc-missing { fill:var(--apple); }
.hc-halo { fill:var(--hc-primary);opacity:.14; }
.hc-radar-label,.hc-percent,.hc-ring-label { fill:var(--muted);font-family:var(--font);font-size:12.5px;font-weight:500;transition:fill .25s cubic-bezier(.32,.72,0,1); }
.hc-percent { font-size:11px;font-variant-numeric:tabular-nums; }
.hc-ring-label { font-size:9.5px; }
.hc-radar .hc-selected { fill:var(--fg);font-weight:700; }
.hc-hit { fill:transparent;cursor:pointer;outline:none;transform-box:fill-box;transform-origin:center;transition:fill .2s cubic-bezier(.32,.72,0,1); }
@media(hover:hover) { .hc-hit:hover { fill:color-mix(in srgb,var(--fg) 7%,transparent); } }
.hc-hit:focus-visible { stroke:var(--hc-primary);stroke-width:2; }
.hc-legend { display:flex;gap:14px;justify-content:center;font-size:12px;color:var(--muted);flex-wrap:wrap; }
.hc-legend span::before { content:'';display:inline-block;width:16px;height:0;vertical-align:middle;margin-right:6px;border-top:2px solid var(--hc-primary); }.hc-legend span+span::before { border-top:1.3px dashed var(--muted); }
/* “看每一科”：一个看得出是按钮的小胶囊，居中，只有它本身能点（以前整行都能点） */
.hc-fold { justify-self:center;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:999px;padding:0 16px;font-size:13px!important;font-weight:600;color:var(--fg)!important;background:color-mix(in srgb,var(--fg) 7%,transparent);margin:-6px 0 -4px; }
.hc-exam-more { display:grid;gap:20px; }
.hc-segment { position:relative;display:flex;padding:3px;border-radius:16px;background:color-mix(in srgb,var(--fg) 9%,transparent);overflow-x:auto;scrollbar-width:none;min-width:0; }
.hc-segment::-webkit-scrollbar { display:none; }
.hc-pill { position:absolute;top:3px;bottom:3px;left:0;border-radius:13px;background:var(--surface);box-shadow:0 8px 20px -16px var(--muted);will-change:transform,width; }
.hc-segment button { position:relative;flex:1 0 auto;padding:0 12px;border:0;background:none;border-radius:13px;font-size:13px;white-space:nowrap;color:var(--muted);transition:color .28s cubic-bezier(.32,.72,0,1); }
.hc-segment button[aria-pressed=true] { color:var(--fg);font-weight:600; }
.hc-tags { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.hc-tag { display:grid;gap:3px;text-align:left;padding:13px 14px 12px;border:0;border-radius:20px;background:var(--surface);transition:box-shadow .28s cubic-bezier(.32,.72,0,1);min-width:0; }
.hc-tag[aria-pressed=true] { box-shadow:inset 0 0 0 1.5px var(--hc-primary); }
.hc-tag small { font-size:11.5px;color:var(--muted); }
.hc-tag b { font-size:18px;font-weight:700; }
.hc-tag span { font-size:12px;line-height:1.4;color:var(--muted);overflow-wrap:anywhere; }
.hc-balance { display:grid;gap:9px; }
.hc-balance-text { display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted);flex-wrap:wrap; }
.hc-balance-text b { color:var(--fg); }
.hc-track { position:relative;height:6px;border-radius:3px;background:color-mix(in srgb,var(--fg) 12%,transparent); }
.hc-track i { position:absolute;top:0;bottom:0;left:0;width:0;border-radius:3px;background:var(--hc-primary); }
.hc-scale { display:flex;justify-content:space-between;font-size:10px;color:var(--muted); }
.hc-detailwrap { overflow:hidden;border-radius:24px;background:var(--surface); }
.hc-detail { display:grid;gap:14px;padding:16px; }
.hc-detail-head { display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap; }
.hc-detail h3 { font-size:19px;font-weight:700; }
.hc-subject-score { font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums; }
.hc-kv { display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;font-size:13px;margin:0; }
.hc-kv dt { color:var(--muted); }.hc-kv dd { margin:0;overflow-wrap:anywhere; }
.hc-reasons { display:flex;height:6px;border-radius:3px;overflow:hidden;gap:2px; }.hc-reasons i { display:block;background:var(--hc-primary); }
.hc-spark { width:100%;height:64px;overflow:visible; }
.hc-spark-line { fill:none;stroke:var(--hc-primary);stroke-width:2;stroke-linejoin:round;stroke-linecap:round; }
.hc-spark circle { fill:var(--surface);stroke:var(--hc-primary);stroke-width:2; }.hc-spark circle.hc-current-point { fill:var(--hc-primary); }
.hc-spark text { fill:var(--muted);font-family:var(--font);font-size:9px;font-variant-numeric:tabular-nums; }
.hc-acts { display:flex;gap:8px;flex-wrap:wrap; }.hc-acts .btn { max-width:100%;white-space:normal;overflow-wrap:anywhere; }
.hc-empty { display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:12px;text-align:center;padding:4px 0 6px; }
.hc-empty .hc-radar { max-width:210px; }.hc-empty h3 { font-size:19px;font-weight:700;text-wrap:balance; }
.hc-empty p { width:100%;font-size:14px;color:var(--muted);max-width:24em;line-height:1.6; }
.hc-foot { font-size:12px;color:var(--muted);text-align:center; }
.hc-bars { display:grid;gap:14px;width:100%; }.hc-bars>div { display:flex;align-items:center;gap:10px;font-size:13px; }
.hc-bar-track { flex:1;height:8px;border-radius:5px;background:color-mix(in srgb,var(--fg) 12%,transparent);overflow:hidden; }.hc-bar-track i { display:block;height:100%;background:var(--hc-primary); }
@media(hover:hover) { .hc-back:hover,.hc-toggle:hover { background:color-mix(in srgb,var(--fg) 6%,transparent); }.hc-arrow:hover,.hc-fold:hover { background:color-mix(in srgb,var(--fg) 11%,transparent); } }
/* Override only the old global short-transition rule inside the new cards. */
@media(prefers-reduced-motion:reduce) { .hc-card .hc-day,.hc-card .hc-chip,.hc-card .hc-tag,.hc-card .hc-segment button,.hc-card .hc-week-pill { transition-duration:.28s!important; } }
@media(prefers-reduced-motion:reduce) { .hc-card .hc-toggle span:last-child,.hc-card .hc-fold span:last-child,.hc-card .hc-delta-arrow { transition-property:transform!important;transition-duration:.45s!important;transition-timing-function:cubic-bezier(.32,.72,0,1)!important; }.hc-card .hc-radar-label,.hc-card .hc-percent { transition-property:fill!important;transition-duration:.25s!important; } }
/* 回来的那天（第三块 3C）：学了的格子外面再加一圈 */
.hc-day.hc-back { box-shadow: 0 0 0 2px var(--apple), 0 0 0 4px var(--hc-primary); }