/* Home date / progress / sign-in card · 20260925_home_time_card_v1
   Graphite + champagne gold (docs/mcp-site-main-visual-style.md). New .xl-tc* classes only, so legacy .xl-time-* / home-polish
   rules no longer reach the card. Loaded after home-polish.css. Edge 100 safe: no :has, color-mix or new viewport units. */

/* ---------- structure (all themes) ---------- */
body.home-page-shell .xl-home-time-card { display:flex !important; flex-direction:column; min-width:0; }
body.home-page-shell .xl-home-time-card .xl-tc { box-sizing:border-box; flex:1 1 auto; height:100%; min-height:0; min-width:0; margin:0;
  display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto minmax(0,1fr) auto; grid-template-areas:"head" "date" "progress" "btn";
  row-gap:12px; padding:16px 16px 16px; border:1px solid #3a3833; border-radius:16px; position:relative; overflow:hidden;
  font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif; line-height:1.4; text-align:left; }
body.home-page-shell .xl-home-time-card .xl-tc *, body.home-page-shell .xl-home-time-card .xl-tc *:before, body.home-page-shell .xl-home-time-card .xl-tc *:after { box-sizing:border-box; }
body.home-page-shell .xl-home-time-card .xl-tc:before { content:""; position:absolute; top:-70px; right:-50px; width:200px; height:160px; pointer-events:none; }

body.home-page-shell .xl-home-time-card .xl-tc-head { grid-area:head; display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; position:relative; }
body.home-page-shell .xl-home-time-card .xl-tc-live { display:inline-flex; align-items:center; gap:7px; font-size:12px; letter-spacing:.5px; white-space:nowrap; }
body.home-page-shell .xl-home-time-card .xl-tc-live i { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
body.home-page-shell .xl-home-time-card .xl-tc-weekday { display:inline-flex; align-items:center; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:500; white-space:nowrap; }

body.home-page-shell .xl-home-time-card .xl-tc-date { grid-area:date; display:flex; align-items:center; gap:12px; min-width:0; position:relative; }
body.home-page-shell .xl-home-time-card .xl-tc-day { display:block; font-size:52px; font-weight:700; line-height:1; letter-spacing:-1px; font-variant-numeric:tabular-nums; }
body.home-page-shell .xl-home-time-card .xl-tc-ym { display:flex; flex-direction:column; gap:3px; min-width:0; padding-left:12px; }
body.home-page-shell .xl-home-time-card .xl-tc-ym b { display:block; font-size:17px; font-weight:600; line-height:1.2; white-space:nowrap; }
body.home-page-shell .xl-home-time-card .xl-tc-ym small { display:block; font-size:12px; line-height:1.2; white-space:nowrap; font-variant-numeric:tabular-nums; }
body.home-page-shell .xl-home-time-card .xl-tc-ym span { display:inline; font:inherit; color:inherit; }

body.home-page-shell .xl-home-time-card .xl-tc-progress { grid-area:progress; display:flex; flex-direction:column; justify-content:center; gap:10px; margin:0; padding:12px 0 2px; list-style:none; min-width:0; position:relative; }
body.home-page-shell .xl-home-time-card .xl-tc-row { display:grid; grid-template-columns:auto minmax(0,1fr) 48px; align-items:center; column-gap:10px; margin:0; padding:0; list-style:none; min-width:0; }
body.home-page-shell .xl-home-time-card .xl-tc-row:before, body.home-page-shell .xl-home-time-card .xl-tc-row:after { content:none; display:none; }
body.home-page-shell .xl-home-time-card .xl-tc-label { font-size:13px; white-space:nowrap; }
body.home-page-shell .xl-home-time-card .xl-tc-track { position:relative; display:block; height:6px; border-radius:999px; overflow:hidden; }
body.home-page-shell .xl-home-time-card .xl-tc-track i { position:absolute; left:0; top:0; bottom:0; display:block; width:0; max-width:100%; border-radius:999px; transition:width .6s ease; }
body.home-page-shell .xl-home-time-card .xl-tc-value { font-size:13px; font-weight:600; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }

body.home-page-shell .xl-home-time-card .xl-tc-signin { grid-area:btn; display:flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:9px 14px; border-radius:10px; border:1px solid transparent;
  font-size:14px; font-weight:600; line-height:1.2; letter-spacing:.5px; text-decoration:none; white-space:nowrap; position:relative; transition:background-color .2s, box-shadow .2s, transform .2s, border-color .2s; }
body.home-page-shell .xl-home-time-card .xl-tc-signin svg { display:block; flex-shrink:0; }
body.home-page-shell .xl-home-time-card .xl-tc-signin-icon { width:18px; height:18px; }
body.home-page-shell .xl-home-time-card .xl-tc-signin-arrow { width:16px; height:16px; margin-left:auto; transition:transform .2s; }
body.home-page-shell .xl-home-time-card .xl-tc-signin span { margin-right:auto; }
body.home-page-shell .xl-home-time-card .xl-tc-signin:hover .xl-tc-signin-arrow { transform:translateX(2px); }
body.home-page-shell .xl-home-time-card .xl-tc-signin:active { transform:translateY(1px); }
body.home-page-shell .xl-home-time-card .xl-tc-signin:focus-visible { outline:2px solid #e1c488; outline-offset:2px; }

/* ---------- dark themes (classic presets) ---------- */
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc { background-color:#1a1a1a; background-image:linear-gradient(165deg,#222221 0%,#1a1a19 55%,#161615 100%); border-color:#3a3833; box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 26px rgba(0,0,0,.32); color:#f0eee7; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc:before { background:radial-gradient(ellipse at center,rgba(219,193,140,.12),rgba(219,193,140,0) 70%); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-live { color:#999998; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-live i { background:#dbc18c; box-shadow:0 0 0 3px rgba(219,193,140,.16); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-weekday { color:#e6d3a6; background:rgba(219,193,140,.08); border:1px solid #5c5236; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-day { color:#dbc18c; background-image:linear-gradient(180deg,#f0dcae 0%,#c9a86e 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-ym { border-left:1px solid #3a3833; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-ym b { color:#f0eee7; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-ym small { color:#999998; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-progress { border-top:1px solid #2f2e2c; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-label { color:#a8a7a6; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-value { color:#f0eee7; }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-track { background:#2a2a29; box-shadow:inset 0 1px 2px rgba(0,0,0,.55); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card [data-progress-unit="day"] .xl-tc-track i { background:#a8925c; background-image:linear-gradient(90deg,#7a6a43,#b39b62); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card [data-progress-unit="month"] .xl-tc-track i { background:#c6a36a; background-image:linear-gradient(90deg,#9c8656,#d2b47c); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card [data-progress-unit="year"] .xl-tc-track i { background:#dbc18c; background-image:linear-gradient(90deg,#c6a36a,#ecd8a8); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-signin { color:#28281c; background-color:#d8bb85; background-image:linear-gradient(110deg,#e6ce9a,#c6a36a); border-color:#e1c792; box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 6px 16px rgba(0,0,0,.35); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-signin:hover { color:#28281c; background-color:#ead5a6; background-image:none; box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 20px rgba(198,163,106,.22); }
html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-signin:active { background-color:#d3b67e; }

/* ---------- light themes ---------- */
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc { background-color:#ffffff; background-image:linear-gradient(165deg,#ffffff 0%,#fafaf7 100%); border-color:rgba(0,0,0,.1); box-shadow:0 8px 22px rgba(0,0,0,.06); color:#1c1b19; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc:before { background:radial-gradient(ellipse at center,rgba(122,99,49,.08),rgba(122,99,49,0) 70%); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-live { color:#6f6d68; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-live i { background:#7a6331; box-shadow:0 0 0 3px rgba(122,99,49,.14); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-weekday { color:#5e4b22; background:rgba(122,99,49,.07); border:1px solid rgba(122,99,49,.3); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-day { color:#1c1b19; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-ym { border-left:1px solid rgba(0,0,0,.1); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-ym b { color:#1c1b19; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-ym small { color:#6f6d68; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-progress { border-top:1px solid rgba(0,0,0,.08); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-label { color:#57554f; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-value { color:#1c1b19; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-track { background:rgba(0,0,0,.08); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card [data-progress-unit="day"] .xl-tc-track i { background:#b9a57a; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card [data-progress-unit="month"] .xl-tc-track i { background:#9a8250; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card [data-progress-unit="year"] .xl-tc-track i { background:#7a6331; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-signin { color:#ffffff; background-color:#1c1b19; border-color:#1c1b19; box-shadow:0 6px 16px rgba(0,0,0,.14); }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-signin:hover { color:#ffffff; background-color:#3a3833; border-color:#3a3833; }
html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-signin:focus-visible { outline-color:#7a6331; }

/* ---------- sizes ---------- */
@media (min-width:1600px) {
  body.home-page-shell .xl-home-time-card .xl-tc { padding:20px; row-gap:16px; }
  body.home-page-shell .xl-home-time-card .xl-tc-day { font-size:64px; }
  body.home-page-shell .xl-home-time-card .xl-tc-ym b { font-size:19px; }
  body.home-page-shell .xl-home-time-card .xl-tc-progress { gap:14px; padding-top:16px; }
  body.home-page-shell .xl-home-time-card .xl-tc-label, body.home-page-shell .xl-home-time-card .xl-tc-value { font-size:14px; }
  body.home-page-shell .xl-home-time-card .xl-tc-track { height:7px; }
  body.home-page-shell .xl-home-time-card .xl-tc-signin { min-height:46px; font-size:15px; }
}
/* 1001–1360: narrower/shorter side column (220–300px wide, 237–270px tall) */
@media (min-width:1001px) and (max-width:1360px) {
  body.home-page-shell .xl-home-time-card .xl-tc { padding:13px 14px; row-gap:9px; border-radius:14px; }
  body.home-page-shell .xl-home-time-card .xl-tc-day { font-size:42px; }
  body.home-page-shell .xl-home-time-card .xl-tc-date { gap:10px; }
  body.home-page-shell .xl-home-time-card .xl-tc-ym { padding-left:10px; }
  body.home-page-shell .xl-home-time-card .xl-tc-ym b { font-size:15px; }
  body.home-page-shell .xl-home-time-card .xl-tc-progress { gap:8px; padding-top:9px; }
  body.home-page-shell .xl-home-time-card .xl-tc-row { column-gap:8px; grid-template-columns:auto minmax(0,1fr) 44px; }
  body.home-page-shell .xl-home-time-card .xl-tc-label, body.home-page-shell .xl-home-time-card .xl-tc-value { font-size:12px; }
  body.home-page-shell .xl-home-time-card .xl-tc-signin { min-height:36px; padding:7px 12px; font-size:13px; }
}
/* 768–1000: card becomes a full-width strip under the hero */
@media (min-width:768px) and (max-width:1000px) {
  body.home-page-shell .xl-home-time-card .xl-tc { grid-template-columns:auto minmax(0,1fr) 150px; grid-template-rows:auto auto; grid-template-areas:"head progress btn" "date progress btn";
    column-gap:24px; row-gap:8px; align-items:center; padding:16px 20px; }
  body.home-page-shell .xl-home-time-card .xl-tc-head { justify-content:flex-start; gap:10px; }
  body.home-page-shell .xl-home-time-card .xl-tc-day { font-size:44px; }
  body.home-page-shell .xl-home-time-card .xl-tc-progress { padding:0 0 0 24px; gap:9px; align-self:stretch; }
  html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-progress { border-top:0; border-left:1px solid #2f2e2c; }
  html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-progress { border-top:0; border-left:1px solid rgba(0,0,0,.08); }
  body.home-page-shell .xl-home-time-card .xl-tc-signin { align-self:center; }
}
@media (min-width:768px) and (max-width:900px) {
  body.home-page-shell .xl-home-time-card .xl-tc { grid-template-columns:auto minmax(0,1fr) 118px; column-gap:16px; padding:14px 16px; }
  body.home-page-shell .xl-home-time-card .xl-tc-head { flex-direction:column; align-items:flex-start; gap:5px; }
  body.home-page-shell .xl-home-time-card .xl-tc-day { font-size:40px; }
  body.home-page-shell .xl-home-time-card .xl-tc-progress { padding-left:16px; }
  body.home-page-shell .xl-home-time-card .xl-tc-row { column-gap:8px; grid-template-columns:auto minmax(0,1fr) 44px; }
  body.home-page-shell .xl-home-time-card .xl-tc-label, body.home-page-shell .xl-home-time-card .xl-tc-value { font-size:12px; }
  body.home-page-shell .xl-home-time-card .xl-tc-signin { padding:9px 10px; gap:6px; }
  body.home-page-shell .xl-home-time-card .xl-tc-signin span { margin-right:0; }
}
/* ≤767: compact block — head, date | progress, full-width button */
@media (max-width:767px) {
  body.home-page-shell .xl-home-time-card .xl-tc { grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto auto auto; grid-template-areas:"head head" "date progress" "btn btn";
    column-gap:16px; row-gap:12px; padding:14px; border-radius:14px; }
  body.home-page-shell .xl-home-time-card .xl-tc-date { flex-direction:column; align-items:flex-start; gap:6px; }
  body.home-page-shell .xl-home-time-card .xl-tc-day { font-size:40px; }
  body.home-page-shell .xl-home-time-card .xl-tc-ym { flex-direction:row; align-items:baseline; gap:6px; padding-left:0; }
  html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-ym, html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-ym { border-left:0; }
  body.home-page-shell .xl-home-time-card .xl-tc-ym b { font-size:14px; }
  body.home-page-shell .xl-home-time-card .xl-tc-progress { padding:0 0 0 16px; gap:9px; }
  html:not([data-theme="light"]) body.home-page-shell .xl-home-time-card .xl-tc-progress { border-top:0; border-left:1px solid #2f2e2c; }
  html[data-theme="light"] body.home-page-shell .xl-home-time-card .xl-tc-progress { border-top:0; border-left:1px solid rgba(0,0,0,.08); }
  body.home-page-shell .xl-home-time-card .xl-tc-row { column-gap:8px; grid-template-columns:auto minmax(0,1fr) 44px; }
  body.home-page-shell .xl-home-time-card .xl-tc-label, body.home-page-shell .xl-home-time-card .xl-tc-value { font-size:12px; }
  body.home-page-shell .xl-home-time-card .xl-tc-signin { min-height:44px; }
}
@media (prefers-reduced-motion:reduce) {
  body.home-page-shell .xl-home-time-card .xl-tc-track i, body.home-page-shell .xl-home-time-card .xl-tc-signin, body.home-page-shell .xl-home-time-card .xl-tc-signin-arrow { transition:none; }
  body.home-page-shell .xl-home-time-card .xl-tc-signin:active, body.home-page-shell .xl-home-time-card .xl-tc-signin:hover .xl-tc-signin-arrow { transform:none; }
}