.customer-dashboard { min-height: 100vh; background: radial-gradient(circle at 50% -20%, #26302e 0, #111515 34%, #090b0b 72%); }
.customer-shell { width: min(1840px, 100%); margin: 0 auto; padding: 16px clamp(14px, 2vw, 34px) 30px; }
.customer-topbar { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.customer-topbar .brand img { width: clamp(130px, 12vw, 178px); }
.dashboard-actions { display: flex; gap: 8px; }
.dash-action { min-height: 44px; padding: 0 15px; border: 1px solid #3b4442; border-radius: 22px; color: #bac2bf; background: #121616; cursor: pointer; font: 650 .78rem/1 inherit; }
.dash-action:hover, .dash-action:focus-visible { color: var(--ink); border-color: #69736f; outline: none; }
.dash-action:disabled { opacity: .5; cursor: wait; }
.customer-identity { min-height: 146px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; border-bottom: 1px solid var(--line); }
.customer-identity h1 { margin: 6px 0 0; font-size: clamp(2rem, 4vw, 4.6rem); }
.customer-clock { text-align: center; }
.customer-clock strong { display: block; font: 300 clamp(3.3rem, 6vw, 6.3rem)/.9 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: -.09em; }
.customer-clock span { display: block; margin-top: 9px; color: var(--muted); font-size: .9rem; }
.customer-place { justify-self: end; display: grid; gap: 3px; text-align: right; }
.customer-place span { color: #e1e5e2; font-weight: 700; }
.customer-place small { color: var(--muted); }
.dashboard-status { min-height: 32px; display: flex; align-items: center; justify-content: center; padding: 7px 12px; color: #aab3b0; font-size: .75rem; text-align: center; }
.dashboard-status:empty { visibility: hidden; }
.customer-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(290px, .65fr); gap: 16px; }
.dashboard-main, .dashboard-side { min-width: 0; display: grid; align-content: start; gap: 16px; }
.module { min-width: 0; overflow: hidden; }
.module[hidden] { display: none; }
.module-head { min-height: 79px; display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 17px 20px 14px; border-bottom: 1px solid var(--line); }
.module-head h2 { margin: 4px 0 0; font-size: clamp(1.45rem, 2vw, 2.15rem); }
.module-head small { flex: none; color: var(--muted); text-align: right; }
.calendar-tools { display: flex; align-items: center; gap: 12px; }
.segmented-control { display: inline-flex; padding: 3px; border: 1px solid var(--line); border-radius: 12px; background: #0d1110; }
.segmented-control button { min-height: 40px; padding: 0 13px; border: 0; border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; font: 750 .72rem/1 inherit; }
.segmented-control button[aria-pressed="true"] { color: #17110a; background: var(--orange); }
.segmented-control button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.calendar-days { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); }
.calendar-day { min-width: 0; min-height: 245px; border-right: 1px solid var(--line); background: transparent; }
.calendar-day:last-child { border-right: 0; }
.calendar-day.is-today { background: linear-gradient(180deg, rgba(255,179,71,.09), transparent); }
.calendar-day-head { width: 100%; min-height: 44px; display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 13px; border: 0; border-bottom: 1px solid var(--line); color: inherit; background: transparent; cursor: pointer; text-align: left; }
.calendar-day-head:hover, .calendar-day-head:focus-visible { background: var(--panel-2); outline: none; }
.calendar-day-head strong { color: var(--orange); font-size: .86rem; }
.calendar-day-head span { color: var(--muted); font: .68rem ui-monospace, monospace; }
.calendar-events { display: grid; gap: 7px; padding: 10px; }
.calendar-event { width: 100%; min-height: 44px; padding: 9px 10px; border: 0; border-left: 3px solid var(--cyan); border-radius: 6px; color: var(--ink); background: #182426; cursor: pointer; font: inherit; text-align: left; }
.calendar-event:nth-child(even) { border-left-color: var(--orange); background: #252015; }
.calendar-event:hover, .calendar-event:focus-visible { background: #223235; outline: 2px solid rgba(129,215,231,.28); }
.calendar-event strong, .calendar-event span { display: block; }
.calendar-event strong { font-size: .8rem; line-height: 1.28; }
.calendar-event span { margin-top: 3px; color: var(--cyan); font: .66rem ui-monospace, monospace; }
.calendar-empty { margin: 0; padding: 14px 10px; color: #69726f; font-size: .76rem; }
.calendar-more { min-height: 40px; padding: 4px 8px; border: 0; border-radius: 8px; color: var(--orange); background: transparent; cursor: pointer; font: 750 .74rem/1 inherit; text-align: left; }
.calendar-more:hover, .calendar-more:focus-visible { background: var(--panel-2); outline: none; }
.month-calendar { padding: 0 12px 12px; }
.month-weekdays, .month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.month-weekdays span { padding: 10px 4px 8px; color: var(--muted); font-size: .65rem; font-weight: 800; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.month-day { position: relative; min-width: 0; min-height: 76px; padding: 9px; border: 0; border-top: 1px solid var(--line); border-right: 1px solid var(--line); color: #dfe3e0; background: transparent; cursor: pointer; text-align: left; }
.month-day:nth-child(7n) { border-right: 0; }
.month-day:hover, .month-day:focus-visible { background: var(--panel-2); outline: none; }
.month-day.is-outside { color: #5e6764; }
.month-day.is-today { color: #17110a; background: var(--orange); font-weight: 850; }
.month-day-number { font: .75rem ui-monospace, monospace; }
.month-event-dots { display: flex; gap: 4px; margin-top: 11px; }
.month-event-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); }
.month-day.is-today .month-event-dots i { background: #15100a; }
.forecast-list { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); }
.forecast-day { min-height: 128px; display: grid; place-items: center; align-content: center; gap: 2px; padding: 10px 5px; border-right: 1px solid var(--line); text-align: center; }
.forecast-day:nth-child(5n) { border-right: 0; }
.forecast-day:nth-child(n+6) { border-top: 1px solid var(--line); }
.forecast-day strong { font-size: .76rem; }
.weather-icon { font-size: 1.5rem; }
.forecast-temp { font: 700 .86rem ui-monospace, monospace; }
.forecast-day small { color: var(--muted); font-size: .67rem; }
.news-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
.news-item { min-width: 0; display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 13px 17px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-decoration: none; }
.news-item:nth-child(even) { border-right: 0; }
.news-item:nth-last-child(-n+2) { border-bottom: 0; }
.news-item:hover, .news-item:focus-visible { background: #191e1e; outline: none; }
.news-index { color: #616b68; font: .68rem ui-monospace, monospace; }
.news-item strong, .news-item small { display: block; }
.news-item strong { font-size: .83rem; line-height: 1.35; }
.news-item small { margin-top: 4px; color: var(--muted); font-size: .68rem; }
.news-category { color: var(--orange); text-transform: uppercase; letter-spacing: .08em; }
.market-list { display: grid; }
.market-row { min-height: 63px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 18px; border-bottom: 1px solid var(--line); }
.market-row:last-child { border-bottom: 0; }
.market-row strong, .market-row span { display: block; }
.market-row strong { font-size: .85rem; }
.market-symbol { color: var(--muted); font: .66rem ui-monospace, monospace; }
.market-value { text-align: right; font: 700 .84rem ui-monospace, monospace; }
.market-change { margin-top: 2px; font-size: .66rem; }
.market-change.up { color: var(--green); }
.market-change.down { color: var(--red); }
.shortcut-list { display: grid; }
.shortcut-link { min-height: 58px; display: flex; align-items: center; padding: 12px 18px; border-bottom: 1px solid var(--line); color: var(--cyan); font-weight: 750; text-decoration: none; }
.shortcut-link:last-child { border-bottom: 0; }
.shortcut-link:hover, .shortcut-link:focus-visible { color: var(--orange); background: #191e1e; outline: none; }
.sports-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
.team-card-live { min-width: 0; padding: 16px 17px; border-right: 1px solid var(--line); }
.team-card-live:last-child { border-right: 0; }
.team-label { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.team-code { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #3c4845; border-radius: 50%; color: var(--cyan); font: 800 .68rem ui-monospace, monospace; }
.team-card-live h3 { margin: 11px 0 13px; font-size: 1.05rem; }
.sports-block { padding-top: 10px; border-top: 1px solid var(--line); }
.sports-block + .sports-block { margin-top: 11px; }
.sports-block span, .sports-block strong, .sports-block small { display: block; }
.sports-block span { color: var(--orange); font-size: .62rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.sports-block .live-label { color: var(--green); }
.sports-block strong { margin-top: 4px; font-size: .75rem; line-height: 1.3; }
.sports-block small { margin-top: 3px; color: var(--muted); font-size: .67rem; }
.module-error { padding: 20px; color: #c5aaa8; font-size: .84rem; }
.module-stale { color: var(--orange) !important; }
.customer-footer { display: flex; justify-content: space-between; gap: 24px; margin-top: 16px; padding: 16px 4px 0; border-top: 1px solid var(--line); color: #747e7a; font-size: .7rem; }
.customer-footer p { max-width: 980px; margin: 0; }
.customer-footer span { flex: none; }
.pin-gate { min-height: 100svh; display: grid; place-items: start center; padding: max(18px, env(safe-area-inset-top)) 24px 24px; }
.pin-gate[hidden] { display: none; }
.pin-card { width: min(440px, 100%); padding: 28px 32px; }
.pin-card .brand { margin-bottom: 16px; }
.pin-card .brand img { width: 138px; }
.pin-card h1 { margin: 7px 0 10px; font-size: clamp(1.9rem, 4vw, 2.35rem); line-height: 1.05; }
.pin-copy { margin: 0 0 18px; color: var(--muted); font-size: .88rem; line-height: 1.45; }
.pin-card label { display: block; margin-bottom: 8px; color: #cbd1ce; font-size: .78rem; font-weight: 700; }
.pin-card input { width: 100%; height: 58px; padding: 0 16px; border: 1px solid #3a4441; border-radius: 10px; color: var(--ink); background: #0d1110; font: 500 1.6rem/1 ui-monospace, monospace; letter-spacing: .25em; }
.pin-card input:focus { border-color: var(--orange); outline: 2px solid rgba(255,179,71,.2); }
.pin-card .button { width: 100%; margin-top: 13px; cursor: pointer; }
.pin-message { min-height: 18px; margin: 8px 0 0; color: var(--red); font-size: .8rem; }
.noscript-message { margin: 30px; color: var(--red); text-align: center; }
.detail-overlay { position: fixed; z-index: 50; inset: 0; display: grid; place-items: start center; overflow-y: auto; padding: max(18px, env(safe-area-inset-top)) 18px max(18px, env(safe-area-inset-bottom)); background: rgba(3,5,5,.82); }
.detail-overlay[hidden] { display: none; }
.detail-dialog { width: min(680px, 100%); max-height: calc(100svh - 36px); overflow-y: auto; box-shadow: 0 26px 90px rgba(0,0,0,.62); }
.detail-head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px; border-bottom: 1px solid var(--line); background: #141818; }
.detail-head h2 { margin: 5px 0 0; font-size: clamp(1.4rem, 4vw, 2rem); }
.detail-close { min-width: 76px; min-height: 48px; border: 1px solid #53605c; border-radius: 24px; color: var(--ink); background: #202625; cursor: pointer; font: 750 .8rem/1 inherit; }
.detail-close:hover, .detail-close:focus-visible { border-color: var(--orange); outline: none; }
.detail-body { display: grid; gap: 14px; padding: 20px; }
.detail-meta { margin: 0; padding-bottom: 13px; border-bottom: 1px solid var(--line); }
.detail-meta dt { color: var(--orange); font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.detail-meta dd { margin: 4px 0 0; color: #dfe3e0; }
.detail-location { color: var(--cyan); }
.detail-location:hover, .detail-location:focus-visible { color: var(--orange); }
.day-event-list { display: grid; gap: 9px; }
.day-event-list .calendar-event { padding: 13px 14px; }
body[data-layout="stocks-only"] .customer-grid { grid-template-columns: 1fr; }
body[data-layout="stocks-only"] .dashboard-main { display: none; }
body[data-layout="stocks-only"] .dashboard-side { width: min(960px, 100%); margin: 0 auto; }
body[data-layout="stocks-only"] .market-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body[data-layout="stocks-only"] .market-row { border-right: 1px solid var(--line); }
body[data-layout="stocks-only"] .market-row:nth-child(3n) { border-right: 0; }
@media (max-height: 720px) {
  .pin-gate { padding-top: max(10px, env(safe-area-inset-top)); }
  .pin-card { padding: 16px 28px; }
  .pin-card .brand { margin-bottom: 10px; }
  .pin-card .brand img { width: 120px; }
  .pin-card h1 { margin: 4px 0 8px; font-size: 1.75rem; }
  .pin-copy { margin-bottom: 12px; }
  .pin-message { min-height: 18px; margin-top: 8px; }
  .pin-card:focus-within .brand,
  .pin-card:focus-within .pin-copy { display: none; }
  .pin-card:focus-within h1 { margin-top: 4px; }
}
@media (max-width: 1100px) {
  .customer-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .customer-shell { padding: 10px 12px 24px; }
  .customer-identity { grid-template-columns: 1fr; gap: 16px; padding: 24px 0; text-align: center; }
  .customer-clock { grid-row: 1; }
  .customer-place { justify-self: center; text-align: center; }
  .calendar-days { grid-template-columns: 1fr; }
  .calendar-day { min-height: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .module-head-calendar { align-items: flex-start; flex-direction: column; }
  .calendar-tools { width: 100%; justify-content: space-between; }
  .month-calendar { padding: 0 5px 5px; }
  .month-day { min-height: 54px; padding: 6px; }
  .month-event-dots { margin-top: 7px; }
  .forecast-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .forecast-day, .forecast-day:nth-child(5n) { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .forecast-day:nth-child(2n) { border-right: 0; }
  .forecast-day:nth-last-child(-n+2) { border-bottom: 0; }
  .news-list, .sports-list { grid-template-columns: 1fr; }
  .news-item, .news-item:nth-child(even), .team-card-live { border-right: 0; border-bottom: 1px solid var(--line); }
  .news-item:last-child, .team-card-live:last-child { border-bottom: 0; }
  .customer-footer { flex-direction: column; gap: 8px; }
  body[data-layout="stocks-only"] .market-list { grid-template-columns: 1fr; }
  body[data-layout="stocks-only"] .market-row { border-right: 0; }
}