:root{--tb-primary:#e10600;--tb-accent:#ff6f3b;--tb-bg:#03121f;--tb-surface:#08223e;--tb-surface-2:#101820;--tb-border:#29435f;--tb-text:#f4f7fb;--tb-muted:#a0b4c8;--tb-success:#16a34a;--tb-warning:#f97316;--tb-danger:#dc2626;--tb-radius:16px;--tb-shadow:0 20px 60px rgba(0,0,0,.35)}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at top left,rgba(225,6,0,.18),transparent 32%),linear-gradient(135deg,var(--tb-bg),#02070d 70%);color:var(--tb-text);min-height:100vh}.app-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 24px;background:rgba(3,18,31,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--tb-border)}.brand{display:flex;align-items:center;gap:12px}.brand img{height:48px;max-width:260px;object-fit:contain}.nav{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.nav a,.btn,button{border:1px solid var(--tb-border);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));color:var(--tb-text);padding:10px 14px;border-radius:999px;text-decoration:none;font-weight:800;cursor:pointer}.nav a.active,.primary{background:linear-gradient(135deg,var(--tb-primary),#7a0000)!important}.danger{background:linear-gradient(135deg,var(--tb-danger),#650000)!important}.container{width:min(1400px,94vw);margin:24px auto 60px}.panel,.metric,.batch-card,.settings-section,.status-card{background:linear-gradient(180deg,rgba(8,34,62,.92),rgba(11,21,35,.92));border:1px solid var(--tb-border);border-radius:var(--tb-radius);box-shadow:var(--tb-shadow);padding:18px}.checker{height:8px;background:repeating-linear-gradient(90deg,#fff 0 10px,#111 10px 20px);border-radius:99px}.page-title{font-size:clamp(30px,4vw,56px);text-transform:uppercase;font-weight:1000;font-style:italic;margin:12px 0 4px}.muted{color:var(--tb-muted)}.telemetry{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:14px;margin:18px 0}.metric .label{color:var(--tb-muted);font-size:12px;text-transform:uppercase;letter-spacing:1px}.metric .value{font-size:34px;font-weight:1000}.metric.overdue{border-color:var(--tb-danger)}.metric.soon{border-color:var(--tb-warning)}.grid,.data-card-grid,.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}label{display:block;font-weight:800;margin:12px 0 6px}input,select,textarea{width:100%;padding:12px;border-radius:12px;border:1px solid var(--tb-border);background:#071525;color:var(--tb-text)}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:14px}.badge{border:1px solid var(--tb-border);border-radius:999px;padding:5px 9px;font-size:12px;font-weight:900}.alert{border-left:5px solid var(--tb-warning);padding:12px;border-radius:12px;background:rgba(255,255,255,.05);margin:8px 0}.alert.overdue{border-color:var(--tb-danger)}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.auth-card{width:min(460px,94vw);background:linear-gradient(180deg,rgba(8,34,62,.96),rgba(11,21,35,.96));border:1px solid var(--tb-border);border-radius:20px;box-shadow:var(--tb-shadow);padding:24px}.auth-card img{display:block;max-width:280px;max-height:64px;object-fit:contain;margin:0 auto 18px}.profile-pill{font-size:12px;color:var(--tb-muted);border:1px solid var(--tb-border);border-radius:999px;padding:6px 10px}.tile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}.batch-tile{position:relative;min-height:210px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.batch-tile:before{content:'';position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--tb-primary),var(--tb-accent))}.batch-tile h3{margin:8px 0 6px;font-size:18px;line-height:1.1}.tile-meta{display:grid;gap:4px;color:var(--tb-muted);font-size:13px;font-weight:800}.tile-actions{display:grid;gap:8px;margin-top:12px}.tile-bags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.tile-bag{font-size:12px;border:1px solid var(--tb-border);border-radius:999px;padding:4px 8px;background:rgba(255,255,255,.05)}.tile-bag button{padding:0 4px;border:0;background:transparent;color:var(--tb-text)}.race-ticker{display:flex;align-items:center;overflow:hidden;border:1px solid var(--tb-border);border-radius:14px;background:rgba(0,0,0,.22);margin:18px 0}.race-ticker-tag{background:var(--tb-primary);padding:10px 16px;font-weight:1000;text-transform:uppercase;letter-spacing:.18em}.race-ticker-track{overflow:hidden;flex:1}.race-ticker-inner{display:flex;white-space:nowrap;animation:ticker 38s linear infinite}.race-ticker-item{padding:0 24px;color:var(--tb-muted);font-family:monospace}.race-ticker-item b{color:var(--tb-text)}@keyframes ticker{to{transform:translateX(-50%)}}.race-hero{display:grid!important;grid-template-columns:minmax(280px,1fr) minmax(560px,1.25fr);gap:18px;align-items:stretch}.race-hero-copy{min-width:0}.race-status-strip{display:grid;grid-template-columns:minmax(150px,.75fr) minmax(190px,.9fr) minmax(250px,1.25fr);gap:12px;width:100%;align-items:stretch}.status-card{display:flex;flex-direction:column;justify-content:center;gap:6px;min-width:0}.status-label{color:var(--tb-muted);font-size:11px;line-height:1;font-weight:1000;text-transform:uppercase;letter-spacing:.16em}.status-card strong,.weather-temp{color:var(--tb-success);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(18px,2vw,28px);line-height:1.05;white-space:nowrap}.status-weather #weatherBox{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.weather-detail{color:var(--tb-muted);font-size:12px;font-weight:800}.gauge-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}.gauge-card{text-align:center;background:linear-gradient(180deg,rgba(8,34,62,.95),rgba(6,15,25,.95));border:1px solid var(--tb-border);border-radius:16px;padding:16px}.gauge-title{text-transform:uppercase;letter-spacing:.14em;font-weight:1000;color:var(--tb-muted);font-size:12px}.gauge-value{font-size:42px;font-weight:1000;font-style:italic;margin-top:8px}.progress-row{margin:12px 0}.progress-head{display:flex;justify-content:space-between;gap:12px;color:var(--tb-muted);font-weight:900}.progress-track{height:10px;background:rgba(255,255,255,.07);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--tb-success),var(--tb-accent),var(--tb-primary))}.calendar-layout{display:grid;grid-template-columns:1fr 340px;gap:18px}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.day,.weekday{min-height:105px;border:1px solid var(--tb-border);border-radius:12px;background:rgba(255,255,255,.04);padding:8px}.weekday{text-align:center;font-weight:1000;background:rgba(225,6,0,.18);min-height:auto}.event{font-size:12px;margin-top:6px;padding:4px 6px;border-radius:8px;background:rgba(255,255,255,.09);border-left:3px solid var(--tb-accent)}.event.fruiting{border-color:var(--tb-warning)}.event.harvest{border-color:var(--tb-success)}.calendar-legend{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.legend-item{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--tb-border);border-radius:999px;padding:7px 10px;background:rgba(255,255,255,.045);font-weight:900}.legend-dot{width:12px;height:12px;border-radius:50%;background:var(--tb-accent)}.legend-dot.fruiting{background:var(--tb-warning)}.legend-dot.harvest{background:var(--tb-success)}.settings-section.full{grid-column:1/-1}.settings-topbar{position:sticky;top:82px;z-index:15;display:flex;justify-content:space-between;align-items:center;gap:14px;margin:18px 0;padding:14px 16px;border:1px solid var(--tb-border);border-radius:16px;background:rgba(3,18,31,.92);box-shadow:var(--tb-shadow)}.collapse-panel{padding:0;overflow:hidden}.collapse-panel summary{list-style:none;cursor:pointer;padding:18px;font-size:22px;font-weight:1000;display:flex;justify-content:space-between}.collapse-panel summary::-webkit-details-marker{display:none}.collapse-panel summary:after{content:'+';font-size:28px;color:var(--tb-accent)}.collapse-panel[open] summary:after{content:'–'}.collapse-content{padding:0 18px 18px}.color-control{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center}.color-chip{width:42px;height:42px;border-radius:12px;border:2px solid var(--tb-border)}.color-value{font-family:monospace;color:var(--tb-muted);font-weight:900;min-width:82px}.logo-upload-box{border:1px dashed var(--tb-border);border-radius:14px;padding:14px;background:rgba(255,255,255,.04);margin-top:10px}.logo-preview{display:flex;align-items:center;justify-content:center;min-height:78px;border:1px solid var(--tb-border);border-radius:12px;background:rgba(0,0,0,.18);margin:10px 0}.logo-preview img{max-width:260px;max-height:48px;object-fit:contain}.logo-help{font-size:12px;color:var(--tb-muted);line-height:1.4}#strainLibrary.strain-tile-grid,#strainLibrary.tile-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(330px,1fr))!important;gap:18px!important;align-items:start!important;margin-top:16px}.strain-tile{min-height:0!important;height:auto!important;overflow:visible!important;display:grid!important;grid-template-rows:auto 1fr;gap:14px;padding:18px!important}.strain-tile h3{font-size:20px!important;line-height:1.15!important;margin:8px 0 10px!important;overflow-wrap:anywhere}.strain-tile .tile-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:12px!important;margin-top:0!important;align-items:end}.strain-tile .tile-actions label{margin:0!important;min-width:0}.strain-tile .tile-actions label:first-child{grid-column:1/-1}.strain-tile .tile-actions button{grid-column:1/-1;width:100%;justify-self:stretch}.strain-tile input{width:100%;min-width:0;padding:10px!important}.print-layout{display:grid;grid-template-columns:380px 1fr;gap:18px;align-items:start}.batch-print-list{display:grid;gap:8px;max-height:60vh;overflow:auto}.batch-print-row{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:10px;border:1px solid var(--tb-border);border-radius:12px;background:rgba(255,255,255,.045)}.batch-print-row input{width:auto}.batch-print-meta{font-size:12px;color:var(--tb-muted);font-weight:800}.label-sheet{display:grid;grid-template-columns:repeat(3,2.625in);grid-auto-rows:1in;gap:0 .125in;background:transparent;color:#111;border:none!important;box-shadow:none!important;outline:none!important}.print-label{padding:.08in .1in;border:none!important;outline:none!important;box-shadow:none!important;color:#111;background:white;font-family:Arial,sans-serif;font-size:10pt}.toolbar,.cockpit-head{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-bottom:18px}@media(max-width:1100px){.race-hero{grid-template-columns:1fr!important}.race-status-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.gauge-grid,.data-card-grid,.grid,.calendar-layout,.settings-grid,.print-layout{grid-template-columns:1fr}.telemetry{grid-template-columns:repeat(2,1fr)}.app-header,.cockpit-head,.settings-topbar{flex-direction:column;align-items:flex-start}.settings-topbar{position:static}}@media(max-width:760px){.race-status-strip{grid-template-columns:1fr}#strainLibrary.strain-tile-grid,#strainLibrary.tile-grid{grid-template-columns:1fr!important}.strain-tile .tile-actions{grid-template-columns:1fr}}@media print{.app-header,.toolbar,.no-print{display:none!important}body{background:white}.container{margin:0;width:auto}.print-layout{display:block}.print-label,.label-sheet .print-label{border:none!important;outline:none!important;box-shadow:none!important}.label-sheet{border:none!important;outline:none!important;box-shadow:none!important;background:white!important}}

/* ===============================
   Role-based UI hiding (RBAC).
   The body gets a class on page load (set by TB.loadCurrentRole in app.js):
     .tb-role-admin / .tb-role-manager / .tb-role-operator / .tb-role-none
   Plus, if the user is a global superuser:
     .tb-super-admin
   Superusers ALWAYS see everything regardless of per-farm role — enforced via
   :is() in every selector below (so .tb-super-admin overrides role hiding).

   Server-side checks remain authoritative; these rules only hide things from
   people who can't use them.
   =============================== */

/* Hide elements scoped to specific roles. Superusers exempt. */
body:not(.tb-super-admin).tb-role-operator [data-tb-hide-from~="operator"],
body:not(.tb-super-admin).tb-role-manager [data-tb-hide-from~="manager"],
body:not(.tb-super-admin).tb-role-admin [data-tb-hide-from~="admin"],
body:not(.tb-super-admin).tb-role-none [data-tb-hide-from~="none"],
/* Defensive comma support — see show-only rules below for rationale. */
body:not(.tb-super-admin).tb-role-operator [data-tb-hide-from*="operator,"],
body:not(.tb-super-admin).tb-role-operator [data-tb-hide-from*=",operator"],
body:not(.tb-super-admin).tb-role-manager [data-tb-hide-from*="manager,"],
body:not(.tb-super-admin).tb-role-manager [data-tb-hide-from*=",manager"],
body:not(.tb-super-admin).tb-role-admin [data-tb-hide-from*="admin,"],
body:not(.tb-super-admin).tb-role-admin [data-tb-hide-from*=",admin"]{display:none !important}

/* Show only to specific roles — default-hidden, then unhide for matches.
   Superusers always unhide. */
[data-tb-show-only]{display:none !important}
body.tb-super-admin [data-tb-show-only],
body.tb-role-admin [data-tb-show-only~="admin"],
body.tb-role-manager [data-tb-show-only~="manager"],
body.tb-role-operator [data-tb-show-only~="operator"],
/* Defensive: also match comma-separated tokens (e.g. data-tb-show-only="admin,manager")
   so future typos don't silently hide content from authorized roles. The token
   is bracketed by string boundaries OR commas, which keeps "managerial" from
   falsely matching "manager". */
body.tb-role-admin [data-tb-show-only*="admin,"],
body.tb-role-admin [data-tb-show-only*=",admin"],
body.tb-role-manager [data-tb-show-only*="manager,"],
body.tb-role-manager [data-tb-show-only*=",manager"],
body.tb-role-operator [data-tb-show-only*="operator,"],
body.tb-role-operator [data-tb-show-only*=",operator"]{display:revert !important}

/* Show only to superusers (e.g. the Create Farm button). */
[data-tb-show-only="super_admin"]{display:none !important}
body.tb-super-admin [data-tb-show-only="super_admin"]{display:revert !important}

/* Form field "view-only" — disable interactivity but keep field visible. */
body:not(.tb-super-admin).tb-role-operator [data-tb-readonly-from~="operator"]{
  pointer-events:none;opacity:.7;filter:grayscale(.3);
}

/* Role badge in the header. */
.tb-role-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:99px;
  font-family:var(--font-mono,ui-monospace,monospace);
  font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  background:rgba(255,255,255,.06);
  border:1px solid var(--tb-border);
  color:var(--tb-muted);
  margin-left:8px;
}
.tb-role-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
body.tb-role-admin .tb-role-badge{color:var(--tb-primary);border-color:rgba(225,6,0,.35)}
body.tb-role-manager .tb-role-badge{color:var(--tb-warning);border-color:rgba(249,115,22,.35)}
body.tb-role-operator .tb-role-badge{color:#1e90ff;border-color:rgba(30,144,255,.35)}
/* Superuser badge wins over role badge — gold border, glow effect. */
body.tb-super-admin .tb-role-badge{
  color:#fbbf24;border-color:rgba(251,191,36,.55);
  background:rgba(251,191,36,.12);
  box-shadow:0 0 16px rgba(251,191,36,.3);
}

/* TB.toast styles (carried forward from earlier turn) */
#tbToastHost{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column-reverse;gap:10px;z-index:9999;pointer-events:none;max-width:calc(100vw - 48px)}
.tb-toast{pointer-events:auto;display:flex;align-items:center;gap:12px;min-width:260px;max-width:420px;padding:14px 18px 14px 16px;border-radius:12px;background:linear-gradient(180deg,rgba(var(--tb-surface-rgb,8,34,62),.96),rgba(var(--tb-surface-2-rgb,11,21,35),.96));border:1px solid var(--tb-border);border-left:5px solid var(--tb-success);color:var(--tb-text);font-weight:600;font-size:14px;box-shadow:0 16px 40px rgba(0,0,0,.45);cursor:pointer;opacity:0;transform:translateX(120%);transition:opacity .22s ease,transform .28s cubic-bezier(.2,.8,.25,1)}
.tb-toast.in{opacity:1;transform:translateX(0)}
.tb-toast-info{border-left-color:#1e90ff}
.tb-toast-warn{border-left-color:var(--tb-warning)}
.tb-toast-error{border-left-color:var(--tb-danger)}
.tb-toast-mark{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--tb-success);position:relative;box-shadow:0 0 14px rgba(22,163,74,.45)}
.tb-toast-mark::after{content:'';position:absolute;left:7px;top:4px;width:5px;height:10px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}
.tb-toast-info .tb-toast-mark{background:#1e90ff;box-shadow:0 0 14px rgba(30,144,255,.45)}
.tb-toast-info .tb-toast-mark::after{content:'i';position:static;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border:0;font-family:var(--font-mono,ui-monospace,monospace);font-style:italic;font-weight:800;color:#fff;font-size:13px;transform:none}
.tb-toast-warn .tb-toast-mark{background:var(--tb-warning);box-shadow:0 0 14px rgba(249,115,22,.45)}
.tb-toast-warn .tb-toast-mark::after{content:'!';position:static;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border:0;font-weight:900;color:#fff;font-size:14px;transform:none}
.tb-toast-error .tb-toast-mark{background:var(--tb-danger);box-shadow:0 0 14px rgba(220,38,38,.45)}
.tb-toast-error .tb-toast-mark::after{content:'!';position:static;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border:0;font-weight:900;color:#fff;font-size:14px;transform:none}
.tb-toast-msg{flex:1;line-height:1.35}
.tb-toast-anchored{position:fixed;z-index:10000;transform:translateY(-8px);transition:opacity .22s ease,transform .22s cubic-bezier(.2,.8,.25,1)}
.tb-toast-anchored.in{transform:translateY(0)}
.tb-toast-anchored.tb-toast-below{transform:translateY(8px)}
.tb-toast-anchored.tb-toast-below.in{transform:translateY(0)}
.tb-toast-anchored::after{content:'';position:absolute;top:100%;left:var(--tb-toast-arrow-left,50%);transform:translateX(-50%);border:8px solid transparent;border-top-color:var(--tb-border);filter:drop-shadow(0 1px 0 rgba(0,0,0,.2))}
.tb-toast-anchored.tb-toast-below::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:var(--tb-border)}
@media (prefers-reduced-motion:reduce){.tb-toast{transition:opacity .15s}.tb-toast-anchored{transition:opacity .15s}}

.location-manager{display:grid;gap:8px;margin-top:14px}
.location-manager .location-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:8px;border:1px solid var(--tb-border);border-radius:12px;background:rgba(255,255,255,.04)}
.location-manager .location-row input{padding:10px}

/* Batch Control: filter + bulk-move toolbar + dialog */
.batch-toolbar{display:flex;flex-direction:column;gap:10px;margin:18px 0 12px}
.batch-toolbar-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.batch-toolbar-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.batch-filter-label{margin:0;font-weight:800;display:flex;align-items:center;gap:8px}
.batch-filter-label select{padding:8px 10px;width:auto;min-width:200px}
.bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px;border:1px solid var(--tb-accent);border-radius:12px;background:rgba(255,111,59,.08)}
.bulk-bar .bulk-count{font-weight:1000}
.bulk-move-label{margin:0;display:flex;align-items:center;gap:8px;font-weight:800}
.bulk-move-label select{padding:8px 10px;width:auto;min-width:200px}
.batch-tile{position:relative}
.batch-tile.is-selected{outline:2px solid var(--tb-accent);outline-offset:-1px}
.batch-select-label{position:absolute;top:10px;right:10px;display:flex;align-items:center;gap:6px;margin:0;cursor:pointer;background:rgba(0,0,0,.35);padding:4px 8px;border-radius:99px}
.batch-select-label input{width:auto;margin:0}
/* <dialog> styling */
dialog.tb-modal{border:1px solid var(--tb-border);border-radius:var(--tb-radius);background:var(--tb-surface);color:var(--tb-text);box-shadow:var(--tb-shadow);padding:22px;max-width:480px;width:90vw}
dialog.tb-modal::backdrop{background:rgba(0,0,0,.6)}
dialog.tb-modal h3{margin:0 0 8px}
dialog.tb-modal .actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}