/* The signed-in landing page (Round 5C, redesigned 2026-10-21): app/home.js's
   pieces, in the landing page's own palette (its :root tokens). Every rule
   is scoped to a home-* class, body.signed-in or html.annex-nav-on, so the
   signed-out page renders exactly as it did before this file existed.

   Home is a summary that fits one phone screen at 390×844 (the redesign):
   a compact Today, This week, the games side by side and the tools with
   something to say. The nav (app/app.css) replaces the sidebar. */

body.home-pending main,
body.home-pending .sidebar-nav{visibility:hidden;}

.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* The nav replaces the sidebar, so the page is one column. */
html.annex-nav-on .layout,
body.signed-in .layout{display:block; min-height:0;}
body.signed-in .sidebar{display:none;}
body.signed-in main{padding:28px 32px 32px; max-width:860px;}

.home-date{margin-bottom:4px;}
h1.home-greeting{
  font-size:28px; font-weight:600; margin:0 0 18px; letter-spacing:-0.2px;
}

/* ── the compact Today ── */
body.signed-in #dashboard-widgets .widget{padding:16px 18px; margin-bottom:12px;}
body.signed-in .widget-head{margin-bottom:8px;}
body.signed-in .widget .run-text{font-size:19px; margin:0 0 4px;}
body.signed-in .widget .day-label{margin-bottom:4px;}
body.signed-in .session-breakdown,
body.signed-in .session-detail,
body.signed-in .week-note,
body.signed-in .pace-chips,
body.signed-in .pace-meta{display:none;}
body.signed-in .session-total{margin:0 0 4px;}
body.signed-in .widget-foot{margin-top:8px;}
.pace-line{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--ink);
  margin:4px 0 0; line-height:1.45;
}
.pace-line-how{color:var(--ink-soft);}

/* Today's logged status, inside index.html's Today widget. */
.home-done-pill{
  font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600;
  text-transform:uppercase; letter-spacing:0.6px;
  color:var(--paper-white); background:var(--moss);
  border-radius:2px; padding:3px 8px; margin-right:auto; margin-left:10px; order:1;
}
body.signed-in .widget-head .phase-pill{order:0;}
body.signed-in .widget-head .day-nav{order:2;}
/* 44 px day arrows, signed in: the app is used with a thumb. */
body.signed-in .day-nav-btn{width:44px; height:44px; font-size:16px;}
body.signed-in .day-nav-label{min-width:64px;}
.home-status{
  font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--ink-soft);
  margin:0 0 4px; line-height:1.5;
}
.home-status a{color:var(--stamp); border-bottom:1px dotted var(--stamp);}
.home-strava{display:inline-flex; align-items:center; gap:10px; margin-left:12px; vertical-align:middle;}
.home-strava img{display:block;}
.home-strava a{color:#C3410C; border-bottom:1px dotted #C3410C;}

/* ── cards: This week, the games ── */
.widget.home-card{padding:12px 16px; margin-bottom:12px;}
.home-card-head{
  display:flex; justify-content:space-between; gap:10px;
  font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase;
  letter-spacing:0.6px; color:var(--ink-soft); margin:0 0 8px;
}
.home-card-foot{margin:8px 0 0;}
.home-card-foot img{display:block;}
.home-wk{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; text-align:center;
}
.home-wd{
  display:flex; flex-direction:column; gap:3px;
  font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--ink-soft);
}
.home-wd.today{color:var(--stamp); font-weight:600;}
.home-wb{display:block; height:22px; border-radius:3px; background:#A9BFA0;}
.home-wb.long{background:#7E9A74;}
.home-wb.rest{background:repeating-linear-gradient(135deg,var(--paper-white),var(--paper-white) 3px,var(--rule) 3px,var(--rule) 4px);}
.home-wb.done{background:var(--moss);}
.home-wd.today .home-wb{outline:2px solid var(--stamp); outline-offset:1px;}

.home-games{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:12px;}
.home-games .widget{margin-bottom:0;}
a.home-game{display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:12px 14px; min-height:44px;}
a.home-game:hover{background:#D4CCB6;}
a.home-game .home-card-head{margin:0;}
.home-daily{font-weight:600; font-size:15px;}
a.home-game .open-btn{margin-top:6px; padding:6px 14px;}
a.home-game:hover .open-btn{background:var(--stamp); border-color:var(--stamp); color:var(--paper-white);}
.home-streak{
  display:flex; align-items:center; flex-wrap:wrap; gap:6px;
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--ink-soft);
}
.home-streak:empty{display:none;}
.home-boxes{display:inline-flex; gap:3px;}
.home-box{width:10px; height:10px; border:1.5px solid var(--ink); border-radius:1px;}
.home-box.on{background:var(--ink);}

/* ── tools with something to say ── */
.home-lines{background:var(--panel); border-radius:6px; overflow:hidden; margin-bottom:12px;}
.home-line{
  display:flex; align-items:center; gap:10px; min-height:48px; padding:0 14px;
  color:var(--ink); font-weight:600; font-size:15px;
}
.home-line + .home-line{border-top:1px solid var(--rule);}
.home-line:hover{background:#D4CCB6;}
.home-line:focus-visible{outline:2px solid var(--stamp); outline-offset:-2px;}
.home-line-name{white-space:nowrap;}
.home-line-info{margin-left:auto; font-weight:400; font-size:13px; color:var(--ink-soft); text-align:right;}

/* Install hint: a quiet link, on Home once (app.js draws it). */
.home-install{margin-top:14px; font-size:14px; color:var(--ink-soft);}
.home-install summary{cursor:pointer; color:var(--stamp); width:fit-content; list-style:none; min-height:32px; display:flex; align-items:center;}
.home-install summary::-webkit-details-marker{display:none;}
.home-install summary::before{content:'\2193  '; white-space:pre;}
.home-install-steps{margin:10px 0 6px; line-height:1.5;}
.home-install-row{display:flex; gap:10px; align-items:center; margin:0;}
.home-primary{
  font:inherit; font-weight:600; font-size:14px; min-height:44px; padding:0 16px; cursor:pointer;
  border:0; border-radius:4px; background:var(--ink); color:var(--paper-white);
}
.home-link-btn{
  font:inherit; font-size:14px; min-height:44px; padding:0 8px; cursor:pointer;
  border:0; background:none; color:var(--ink-soft); text-decoration:underline;
}
.home-install button:focus-visible,.home-install summary:focus-visible{outline:2px solid var(--stamp); outline-offset:2px;}

@media (max-width:820px){
  body.signed-in main{padding:14px 14px 16px;}
  h1.home-greeting{font-size:22px; margin-bottom:12px;}
  body.signed-in #dashboard-widgets .widget{padding:12px 14px;}
  body.signed-in .widget .run-text{font-size:17px;}
}
@media (min-width:1100px){
  /* The laptop's two columns (canvas row 7): Today and the week on the left,
     the games and the tools on the right. */
  body.signed-in main{
    display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); column-gap:20px; align-content:start; max-width:1100px;
  }
  body.signed-in main > .eyebrow,
  body.signed-in main > h1,
  body.signed-in main > .home-install{grid-column:1 / -1;}
  body.signed-in .home-col{align-self:start; min-width:0;}
  body.signed-in .home-games{grid-template-columns:1fr;}
}