/* ------------------------------------------------------------------
   Shell additions. Everything here uses Aurora's own tokens; nothing
   introduces a colour, a radius or a shadow that Aurora did not define.
   ------------------------------------------------------------------ */
.app{ grid-template-columns: 222px minmax(0,1fr) 348px; }
.app[data-side="off"]{ grid-template-columns: 222px minmax(0,1fr); }
.app[data-side="off"] .side{ display:none; }
@media (max-width:1440px){ .app{ grid-template-columns:206px minmax(0,1fr) 322px } .app[data-side="off"]{ grid-template-columns:206px minmax(0,1fr) } }
@media (max-width:1280px){ .app{ grid-template-columns:190px minmax(0,1fr) 300px } .app[data-side="off"]{ grid-template-columns:190px minmax(0,1fr) } }

.accents{ display:flex; gap:6px; padding:2px 2px 0 }
.accents button{ width:22px; height:22px; padding:0; border:0; background:none; cursor:pointer;
  border-radius:8px; display:grid; place-items:center; transition:box-shadow .14s ease }
.accents button span{ width:14px; height:14px; border-radius:5px; display:block;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.10) }
.accents button[data-accent-set="indigo"] span{ background:#5B4BE8 }
.accents button[data-accent-set="blue"]   span{ background:#1B6FE0 }
.accents button[data-accent-set="teal"]   span{ background:#0E7C8B }
.accents button[data-accent-set="green"]  span{ background:#3F9E57 }
.accents button[data-accent-set="orange"] span{ background:#DD6A12 }
.accents button:hover{ box-shadow:0 0 0 2px var(--hover) }
.accents button[aria-pressed="true"]{ box-shadow:0 0 0 2px var(--surface), 0 0 0 3.5px var(--accent) }
.accents button:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }
.rail{ overflow-y:auto; scrollbar-width:thin; }
.rail::-webkit-scrollbar{ width:8px }
.rail::-webkit-scrollbar-thumb{ background:var(--sunk-2); border-radius:99px; border:2px solid var(--canvas) }
.nav + .nav{ margin-top:2px }

.board-body{ overflow:auto; min-height:0; scrollbar-width:thin; }
.board-body::-webkit-scrollbar{ width:10px; height:10px }
.board-body::-webkit-scrollbar-thumb{ background:var(--sunk-2); border-radius:99px; border:3px solid var(--surface) }
.pad{ padding:2px 16px 18px }

/* a plain table in Aurora's language: no borders, rows separated by hover and rhythm */
.tbl{ width:100%; border-collapse:collapse; font-size:12.5px }
.tbl th{ text-align:left; font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
         color:var(--ink-3); padding:8px 10px; position:sticky; top:0; background:var(--surface); z-index:2 }
.tbl td{ padding:9px 10px; vertical-align:middle; color:var(--ink) }
.tbl tbody tr{ border-radius:9px }
.tbl tbody tr:hover td{ background:var(--sunk) }
.tbl td.n, .tbl th.n{ text-align:right; font-family:var(--mono); font-feature-settings:"tnum" 1; letter-spacing:-.01em }
.tbl td .sub{ display:block; font-size:11px; color:var(--ink-2); margin-top:2px }
.tbl tr.rowbad td{ background:var(--broken-wash) }

/* section heading inside a board */
.sec{ display:flex; align-items:baseline; gap:10px; padding:16px 16px 8px }
.sec h3{ margin:0; font-size:12.5px; font-weight:700; letter-spacing:-.018em }
.sec .hint{ font-size:11.5px; color:var(--ink-2) }
.sec .right{ margin-left:auto; display:flex; gap:8px; align-items:center }

/* a soft grouping used where cards are genuinely separate objects */
.tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; padding:2px 16px 6px }
.tile{ background:var(--surface); border-radius:12px; box-shadow:var(--lift); padding:12px 13px }
.tile .k{ font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3) }
.tile .v{ display:block; font-size:23px; font-weight:700; letter-spacing:-.035em; margin-top:5px; line-height:1.05 }
.tile .v small{ font-size:12px; font-weight:500; color:var(--ink-2); letter-spacing:0 }
.tile .d{ display:block; font-size:11px; color:var(--ink-2); margin-top:4px }
.tile.bad .v{ color:var(--broken) } .tile.warn .v{ color:var(--risk) } .tile.ok .v{ color:var(--good) }

.btn{ display:inline-flex; align-items:center; gap:7px; height:30px; padding:0 12px; border-radius:9px;
      background:var(--raised); color:var(--ink); font-size:12px; font-weight:600; border:0; cursor:pointer;
      box-shadow:var(--lift); transition:box-shadow .14s ease, color .14s ease }
.btn:hover{ box-shadow:var(--lift-2); color:var(--accent) }
.btn:active{ transform:translateY(1px) }
.btn.q{ box-shadow:none; background:transparent; color:var(--ink-2) }
.btn.q:hover{ background:var(--hover); color:var(--ink) }
.btn.danger:hover{ color:var(--broken) }

.empty{ padding:38px 16px; text-align:center; color:var(--ink-3); font-size:12.5px }
.stack{ display:flex; flex-direction:column; gap:10px }
.rowx{ display:flex; align-items:center; gap:9px; flex-wrap:wrap }
.grow{ flex:1 }

.drawer{ position:fixed; inset:0; z-index:60; display:none }
.drawer[data-open="1"]{ display:block }
.drawer .scrim{ position:absolute; inset:0; background:rgba(20,21,28,.28) }
.drawer .sheet{ position:absolute; top:0; right:0; bottom:0; width:min(460px,92vw); background:var(--surface);
                box-shadow:var(--lift-3); display:grid; grid-template-rows:auto minmax(0,1fr) auto;
                animation:slidein .22s cubic-bezier(.2,.7,.3,1) }
@keyframes slidein{ from{ transform:translateX(14px); opacity:0 } to{ transform:none; opacity:1 } }
.drawer .sheet > header{ display:flex; align-items:center; gap:10px; padding:14px 16px 10px }
.drawer .sheet > header h3{ margin:0; font-size:14px; font-weight:700; letter-spacing:-.02em }
.drawer .sheet > footer{ display:flex; gap:8px; padding:12px 16px; }
.drawer .body{ overflow:auto; min-height:0; padding:0 16px 14px; scrollbar-width:thin }

@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important } }

/* ------------------------------------------------------------------
   Console additions on top of the prototype shell: login, live data
   chips, the map surface, the playground grid, the week matrix.
   Tokens only.
   ------------------------------------------------------------------ */
.loginwrap{ min-height:100dvh; display:grid; place-items:center; background:var(--canvas); padding:20px }
.login{ width:min(360px,92vw); background:var(--surface); border-radius:18px; box-shadow:var(--lift-3); padding:26px }
.login label{ display:block; font-size:11.5px; font-weight:600; color:var(--ink-2); margin:14px 0 5px }
.login input{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid var(--hair);
  background:var(--sunk); color:var(--ink); font:inherit }
.login input:focus{ outline:2px solid var(--accent); outline-offset:0; background:var(--surface) }
.login .err{ color:var(--broken); font-size:12px; margin-top:10px; min-height:16px }
.login .note{ color:var(--ink-3); font-size:11px; margin-top:12px; line-height:1.5 }
.brand-mark{ width:30px; height:30px; border-radius:10px; flex:none;
  background:linear-gradient(135deg,var(--accent-2),var(--accent-3)); box-shadow:var(--lift-accent) }

/* dense data chips used inside rows and drawers */
.chip{ display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:999px;
  font-size:10.5px; font-weight:600; background:var(--sunk); color:var(--ink-2); white-space:nowrap }
.chip.win{ background:var(--wash); color:var(--accent) }
.chip.ok{ background:var(--wash); color:var(--good) }
.chip.brk{ background:var(--broken-wash); color:var(--broken) }
.chip.rsk{ background:var(--risk-wash); color:var(--risk-ink, var(--risk)) }
.callout{ margin:8px 16px; padding:10px 14px; border-radius:12px; background:var(--wash);
  font-size:12px; color:var(--ink); line-height:1.55 }
.callout.riskc{ background:var(--broken-wash) }
.rowline{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:4px 12px; align-items:center;
  padding:8px 10px; margin:0 6px; border-radius:11px }
.rowline:hover{ background:var(--sunk) }
.rowline .t{ font-family:var(--mono); font-size:11px; color:var(--ink-2); white-space:nowrap }
.rowline .nm{ font-size:12.5px; font-weight:600; letter-spacing:-.015em }
.rowline .ad{ display:block; font-size:11px; color:var(--ink-2); margin-top:1px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.rowline .chips{ display:flex; gap:5px; flex-wrap:wrap; justify-content:flex-end }
.rowline[data-go]{ cursor:pointer }

/* map + playground */
.mapwrap{ height:100%; min-height:420px; background:var(--sunk) }
.map-abs{ position:relative; height:calc(100% - 0px); min-height:0 }
.leaflet-container{ font:inherit }
.pgnum{ background:var(--accent); color:var(--on-accent); border-radius:50%;
  font:700 11px/22px "Plus Jakarta Sans",sans-serif; text-align:center; box-shadow:0 1px 4px rgba(0,0,0,.3) }
.pg-grid{ display:grid; grid-template-columns:minmax(340px,1fr) minmax(300px,1.1fr); gap:0; height:100%; min-height:0 }
.pg-grid > .pg-list{ overflow:auto; min-height:0; scrollbar-width:thin; padding-bottom:14px }
@media (max-width:1100px){ .pg-grid{ grid-template-columns:1fr } }
.pgrow{ cursor:grab } .pgrow:active{ cursor:grabbing }

/* week matrix */
table.week{ width:100%; border-collapse:collapse; font-size:12px }
table.week th{ text-align:left; font-size:10.5px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-3); padding:8px 10px }
.wcrew{ white-space:nowrap; font-weight:600; font-size:12px; color:var(--ink) }
.wcell{ cursor:pointer; vertical-align:top; min-width:112px; padding:8px 9px; border-radius:10px }
.wcell:hover{ background:var(--sunk) }
.wcell.off{ cursor:default }
.wcell .ad{ display:block; color:var(--ink-3); font-size:10.5px; margin:2px 0 4px; font-family:var(--mono) }
.wcell .chip{ display:inline-flex; margin:1px 2px 1px 0 }

/* small form rows reused across settings and tools */
.frow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:8px 0; font-size:12.5px }
.frow label{ color:var(--ink-2) }
.frow input,.frow select{ padding:7px 10px; border-radius:9px; border:1px solid var(--hair);
  background:var(--sunk); color:var(--ink); font:inherit }
.frow input:focus,.frow select:focus{ outline:2px solid var(--accent); outline-offset:0; background:var(--surface) }
.btn-small{ padding:7px 16px; border-radius:9px; font-weight:700; font-size:12px; border:0; cursor:pointer;
  background:linear-gradient(135deg,var(--accent-2),var(--accent-3)); color:var(--on-accent); box-shadow:var(--lift-accent) }
.btn-small:disabled{ opacity:.5; cursor:default }
.linkish{ background:none; border:0; color:var(--accent); font-size:12px; font-weight:600; cursor:pointer; padding:4px 6px }
.linkish:hover{ text-decoration:underline }
.grid-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px; padding:2px 16px 14px }
