/* Daily: settings button + panel, footer, no-flicker */
.dy-pending .page-columns { opacity: 0; }
.page-columns { transition: opacity .2s ease; }

.dy-fab { position: fixed; right: 16px; bottom: 16px; z-index: 50; width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18); background: rgba(22,26,38,.82); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  color: hsl(37, 91%, 62%); font-size: 22px; line-height: 1; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.dy-fab:hover, .dy-fab:focus-visible { border-color: hsl(37, 91%, 55%); outline: none; }

.dy-overlay { position: fixed; inset: 0; z-index: 60; display: none; align-items: center; justify-content: center; background: rgba(6,8,14,.6); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); padding: 16px; }
.dy-overlay.open { display: flex; }
.dy-panel { width: min(440px, 100%); max-height: 90vh; overflow: auto; border-radius: 16px; padding: 20px 22px;
  background: rgba(24,28,42,.96); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 20px 50px rgba(0,0,0,.55);
  color: hsl(220, 24%, 88%); font-size: 1.4rem; }
.dy-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.dy-head h2 { margin: 0; font-size: 1.7rem; letter-spacing: .08em; text-transform: uppercase; color: hsl(220, 30%, 96%); }
.dy-x { background: none; border: 0; color: hsl(220, 20%, 78%); font-size: 2.4rem; line-height: 1; cursor: pointer; padding: 0 4px; }
.dy-x:hover { color: hsl(37, 91%, 62%); }
.dy-panel fieldset { border: 1px solid rgba(255,255,255,.12); border-radius: 12px; margin: 12px 0; padding: 8px 14px 10px; }
.dy-panel legend { padding: 0 6px; font-size: 1.15rem; letter-spacing: .12em; text-transform: uppercase; color: hsl(220, 18%, 70%); }
.dy-opt { display: flex; align-items: center; gap: 10px; padding: 6px 0; cursor: pointer; }
.dy-opt input { width: 18px; height: 18px; accent-color: hsl(37, 91%, 55%); flex-shrink: 0; }
.dy-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.dy-btn { border: 1px solid hsl(37, 91%, 55%); background: hsla(37,91%,55%,.14); color: hsl(37, 91%, 68%); border-radius: 10px; padding: 8px 14px; cursor: pointer; font: inherit; }
.dy-btn:hover, .dy-btn:focus-visible { background: hsla(37,91%,55%,.28); outline: none; }
.dy-btn.dy-ghost { border-color: rgba(255,255,255,.25); background: none; color: hsl(220, 20%, 82%); }
.dy-note { margin: 12px 0 0; font-size: 1.15rem; color: hsl(220, 18%, 68%); }
.dy-footer { text-align: center; color: hsl(220, 18%, 66%); font-size: 1.1rem; max-width: 760px; margin: 0 auto; line-height: 1.5; }
@media (max-width: 600px) { .dy-overlay { align-items: flex-end; padding: 0; } .dy-panel { width: 100%; border-radius: 16px 16px 0 0; } }
/* keep the settings button clear of Glance's bottom navigation bar on phones/tablets */
@media (max-width: 1199px) { .dy-fab { bottom: 92px; } }

/* ===== Mobile: bottom bar with 4 icons, one section visible at a time (Glance's own 3-dot bar is hidden) ===== */
.dy-tabbar { display: none; }
@media (max-width: 1190px) {
  .mobile-navigation, .mobile-navigation-offset { display: none !important; }
  .page-columns { display: block !important; }
  .page-column { display: block !important; width: 100% !important; flex-shrink: 1; }
  html[data-dy-section] .page-column > .widget { display: none !important; }
  html[data-dy-section="sports"] .sports-group:not([style*="display: none"]),
  html[data-dy-section="news"] .news-group:not([style*="display: none"]),
  html[data-dy-section="weather"] .wx-widget:not([style*="display: none"]),
  html[data-dy-section="markets"] .markets-widget:not([style*="display: none"]) { display: block !important; }
  body { padding-bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
  .dy-tabbar { display: flex; position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 55;
    height: 64px; border-radius: 18px; border: 1px solid rgba(255,255,255,.16); background: rgba(22,26,38,.9);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 8px 24px rgba(0,0,0,.45); }
  .dy-tab { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; background: none; border: 0;
    color: hsl(220, 18%, 72%); font: inherit; font-size: 1.05rem; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; border-radius: 16px; }
  .dy-tab svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .dy-tab.active { color: hsl(37, 91%, 62%); }
  .dy-tab.active svg { filter: drop-shadow(0 0 6px hsla(37,91%,55%,.5)); }
  .dy-tab:focus-visible { outline: 2px solid hsl(37, 91%, 55%); outline-offset: -2px; }
  .dy-fab { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
}

/* ===== Mobile: larger text (Glance sizes everything in rem from a 10px root) ===== */
@media (max-width: 1190px) {
  :root { font-size: 12.5px; }
  .dy-tab { font-size: .95rem; }
  .dy-footer { font-size: .95rem; }
}

/* Weather location label + picker */
.wx-loc { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; padding: 0 0 10px; color: var(--color-text-paragraph); font: inherit; font-size: 1.3rem; letter-spacing: .05em; cursor: pointer; text-align: left; }
.wx-loc:hover, .wx-loc:focus-visible { color: hsl(37, 91%, 62%); outline: none; }
.wx-loc-e { opacity: .6; font-size: 1.1rem; }
.dy-search { width: 100%; box-sizing: border-box; padding: 11px 13px; border-radius: 10px; border: 1px solid rgba(255,255,255,.22); background: rgba(10,12,20,.65); color: inherit; font: inherit; margin: 6px 0 8px; }
.dy-search:focus { outline: 2px solid hsl(37, 91%, 55%); outline-offset: 0; }
.dy-res { display: flex; flex-direction: column; gap: 6px; max-height: 38vh; overflow: auto; }
.dy-pick { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; width: 100%; padding: 9px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); color: inherit; font: inherit; cursor: pointer; }
.dy-pick:hover, .dy-pick:focus-visible { border-color: hsl(37, 91%, 55%); outline: none; }
.dy-pick b { color: hsl(220, 30%, 96%); font-weight: 600; }
.dy-pick span, .dy-hint { color: hsl(220, 18%, 70%); font-size: 1.15rem; }
.dy-hint { padding: 6px 2px; }
.dy-locrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 0; }
.dy-geo { width: 100%; margin: 4px 0 6px; text-align: center; }

/* ===================== Light mode (Settings -> Appearance). Dark is the default. ===================== */
html[data-dy-theme="light"]:root, html[data-dy-theme="light"]:root[data-scheme], html[data-dy-theme="light"]:root[data-theme] {
  --accent: hsl(30, 92%, 31%); --accent-soft: hsla(30, 92%, 31%, .5); --teal: hsl(172, 70%, 28%);
  --glass-bg: rgba(255,255,255,.80); --glass-bg-inner: rgba(241,244,250,.92); --glass-border: rgba(25,35,60,.12); --glass-border-strong: rgba(25,35,60,.18);
  --bgh: 220; --bgs: 30%; --bgl: 95%;
  --color-text-highlight: hsl(222, 38%, 11%); --color-text-paragraph: hsl(222, 28%, 19%); --color-text-base: hsl(222, 20%, 27%);
  --color-text-base-muted: hsl(222, 16%, 33%); --color-text-subdue: hsl(222, 14%, 38%);
  --color-primary: hsl(30, 92%, 31%); --color-positive: hsl(150, 65%, 24%); --color-negative: hsl(0, 70%, 40%);
  --color-background: hsl(220, 30%, 95%); --color-widget-background: rgba(255,255,255,.80); --color-widget-content-border: rgba(25,35,60,.12);
  --color-widget-background-highlight: rgba(25,35,60,.06); --color-separator: rgba(25,35,60,.14);
  --color-popover-background: #ffffff; --color-popover-border: rgba(25,35,60,.18); --color-progress-border: rgba(25,35,60,.2);
  --color-progress-value: hsl(222, 16%, 46%); --color-graph-gridlines: rgba(25,35,60,.10);
  color-scheme: light;
}
html[data-dy-theme="light"], html[data-dy-theme="light"] body { background-color: #eef1f7; }
html[data-dy-theme="light"] body { background: radial-gradient(1100px 600px at 15% -10%, rgba(255,214,150,.38), transparent 60%), radial-gradient(900px 500px at 100% 0%, rgba(150,190,255,.32), transparent 55%), #eef1f7; background-attachment: fixed; }
html[data-dy-theme="light"]:root .flat-icon { filter: none; }
html[data-dy-theme="light"] .widget-content:not(.widget-content-frameless), html[data-dy-theme="light"] .widget-content-frame {
  box-shadow: 0 8px 24px rgba(30,45,80,.10), inset 0 1px 0 rgba(255,255,255,.8);
  background-image: linear-gradient(135deg, rgba(255,255,255,.7), rgba(255,255,255,0) 45%); background-color: var(--glass-bg); }
html[data-dy-theme="light"] .widget-group-content .widget-content:not(.widget-content-frameless) { box-shadow: none; background-image: none; background-color: var(--glass-bg-inner); }
html[data-dy-theme="light"] .widget-header { color: hsl(222, 16%, 34%); border-bottom-color: rgba(25,35,60,.28); }
html[data-dy-theme="light"] hr, html[data-dy-theme="light"] .margin-block-10 { border-color: rgba(25,35,60,.12); }
html[data-dy-theme="light"] .wx-sep { background: rgba(25,35,60,.14); }
html[data-dy-theme="light"] .wx-track { background: rgba(25,35,60,.10); }
html[data-dy-theme="light"] .wx-day .p { color: hsl(208, 75%, 34%); }
html[data-dy-theme="light"] .sp-card { background: rgba(25,35,60,.035); }
html[data-dy-theme="light"] .sp-foot::before, html[data-dy-theme="light"] .sp-foot::after { background: rgba(25,35,60,.16); }
html[data-dy-theme="light"] .expand-toggle-button, html[data-dy-theme="light"] .cards-grid.collapsible-container + .expand-toggle-button {
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.96)); border-top-color: rgba(25,35,60,.22); color: var(--accent); }
html[data-dy-theme="light"] .expand-toggle-button:hover { color: hsl(30, 95%, 28%); background: linear-gradient(180deg, rgba(255,255,255,.7), #fff); }
html[data-dy-theme="light"] input, html[data-dy-theme="light"] textarea, html[data-dy-theme="light"] select { background: rgba(25,35,60,.05); color: var(--color-text-highlight); }
html[data-dy-theme="light"] .dy-fab { background: rgba(255,255,255,.92); border-color: rgba(25,35,60,.22); color: hsl(30, 90%, 34%); box-shadow: 0 6px 18px rgba(30,45,80,.22); }
html[data-dy-theme="light"] .dy-overlay { background: rgba(228,234,246,.68); }
html[data-dy-theme="light"] .dy-panel { background: rgba(255,255,255,.98); border-color: rgba(25,35,60,.16); color: hsl(222, 28%, 19%); box-shadow: 0 20px 50px rgba(30,45,80,.28); }
html[data-dy-theme="light"] .dy-head h2, html[data-dy-theme="light"] .dy-pick b { color: hsl(222, 38%, 11%); }
html[data-dy-theme="light"] .dy-x { color: hsl(222, 16%, 34%); } html[data-dy-theme="light"] .dy-x:hover { color: hsl(30, 90%, 34%); }
html[data-dy-theme="light"] .dy-panel fieldset { border-color: rgba(25,35,60,.16); }
html[data-dy-theme="light"] .dy-panel legend, html[data-dy-theme="light"] .dy-note, html[data-dy-theme="light"] .dy-footer, html[data-dy-theme="light"] .dy-pick span, html[data-dy-theme="light"] .dy-hint { color: hsl(222, 14%, 38%); }
html[data-dy-theme="light"] .dy-opt input { accent-color: hsl(30, 90%, 40%); }
html[data-dy-theme="light"] .dy-btn { border-color: hsl(30, 90%, 36%); background: hsla(30,90%,40%,.12); color: hsl(30, 90%, 28%); }
html[data-dy-theme="light"] .dy-btn:hover, html[data-dy-theme="light"] .dy-btn:focus-visible { background: hsla(30,90%,40%,.24); }
html[data-dy-theme="light"] .dy-btn.dy-ghost { border-color: rgba(25,35,60,.30); background: none; color: hsl(222, 28%, 19%); }
html[data-dy-theme="light"] .dy-search { border-color: rgba(25,35,60,.28); background: #ffffff; }
html[data-dy-theme="light"] .dy-pick { border-color: rgba(25,35,60,.16); background: rgba(25,35,60,.03); }
html[data-dy-theme="light"] .dy-tabbar { background: rgba(255,255,255,.95); border-color: rgba(25,35,60,.16); box-shadow: 0 8px 24px rgba(30,45,80,.2); }
html[data-dy-theme="light"] .dy-tab { color: hsl(222, 14%, 38%); }
html[data-dy-theme="light"] .dy-tab.active { color: hsl(30, 90%, 32%); }
html[data-dy-theme="light"] .dy-tab.active svg { filter: drop-shadow(0 0 5px hsla(30,90%,40%,.35)); }
html[data-dy-theme="light"] .wx-loc:hover, html[data-dy-theme="light"] .wx-loc:focus-visible { color: hsl(30, 90%, 30%); }
/* keep the footer clear of the floating settings button on phones */
@media (max-width: 1190px) { .dy-footer { margin-bottom: 70px; padding-right: 8px; } }

/* Today's date line */
.dy-date { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: calc(14px + env(safe-area-inset-top, 0px)) 4px 4px; font-size: 1.45rem; color: var(--color-text-paragraph); letter-spacing: .03em; }
.dy-date b { color: var(--accent); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: 1.2rem; }
.dy-date b::after { content: '·'; margin-left: 10px; color: var(--color-text-subdue); }
.dy-pending .dy-date { opacity: 0; }

/* Golf tab */
.gp { display: inline-block; min-width: 2.6em; color: var(--color-text-subdue); }
.sp-sub.gp-sa { white-space: normal; text-align: left; margin-top: 6px; color: var(--color-text-base); }

.dy-toast { position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 70; background: rgba(22,26,38,.95); color: #fff; padding: 10px 16px; border-radius: 12px; border: 1px solid rgba(255,255,255,.2); font-size: 1.3rem; max-width: 90vw; text-align: center; }