:root{
  --bg:#15171A; --bg2:#1E2126; --panel:#23262A; --panel2:#2A2E33;
  --line:#34383E; --line2:#3F444B;
  --text:#E6E8EA; --muted:#9AA2AB; --faint:#6B7077;
  --blue:#4FC3F7; --blue-d:#2A93C7;
  --orange:#FFB74D; --orange-d:#C98A2E;
  --green:#34C759; --green-d:#249a44;
  --amber:#FFCA28; --red:#EF5350;
  --radius:14px; --radius-sm:10px;
  --shadow:0 10px 30px rgba(0,0,0,.45);
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  font-synthesis:none;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  color-scheme:dark;            /* native date pickers, dropdown lists & scrollbars render dark */
}
button{font:inherit;color:inherit;cursor:pointer}
/* Default DARK styling for every form control, so nothing renders as a white box.
   Text boxes = grey surface + light text; dropdowns = grey + green (the app's look).
   Class rules below (e.g. .form-row input, .build-sel) override where they differ. */
input,textarea{font:inherit;color:var(--text);background:#3a3f45;border:1px solid var(--line);border-radius:8px;padding:8px 10px;outline:none}
select{font:inherit;color:#34C759;background:#3a3f45;border:1px solid rgba(52,199,89,.5);border-radius:8px;padding:8px 10px;outline:none;font-weight:600;-webkit-appearance:none;appearance:none;cursor:pointer}
input:focus,textarea:focus,select:focus{border-color:#34C759}
::placeholder{color:var(--faint)}

/* ===== Top bar ===== */
.topbar{
  display:flex; align-items:center; gap:8px 12px; flex-wrap:wrap;
  padding:calc(10px + var(--safe-t)) 16px 10px; min-height:calc(58px + var(--safe-t));
  background:linear-gradient(180deg,var(--panel),var(--bg2));
  border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5;
}
.brand{display:flex;align-items:center;gap:10px;min-width:0;cursor:pointer;user-select:none}
.brand__icon{border-radius:9px;flex:0 0 auto}
.brand__text{min-width:0;overflow:hidden}
.brand__title{font-weight:700;letter-spacing:.2px;font-size:16px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand__sub{color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search{flex:1;min-width:0;max-width:520px;margin:0 auto}
.search input{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:9px 14px;outline:none;color:var(--text)}
.search input:focus{border-color:var(--blue-d)}
.topbar__right{display:flex;align-items:center;gap:8px;flex:0 1 auto;flex-wrap:wrap;justify-content:flex-end;min-width:0;row-gap:6px}
.scanBtn{
  display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:13.5px;
  background:linear-gradient(180deg,var(--green),var(--green-d));border:1px solid var(--green-d);
  color:#04240F;border-radius:999px;padding:8px 14px;box-shadow:0 2px 10px rgba(52,199,89,.25);
}
.scanBtn:hover{filter:brightness(1.07)}
.scanBtn:active{transform:translateY(1px)}
/* Greyed out until signed in: no green, no shadow, not clickable. */
.scanBtn:disabled,.scanBtn.is-disabled{background:var(--panel2);border-color:var(--line);color:var(--faint);
  box-shadow:none;cursor:not-allowed;opacity:.7}
.scanBtn:disabled:hover,.scanBtn.is-disabled:hover{filter:none}
.scanBtn:disabled:active,.scanBtn.is-disabled:active{transform:none}
.syncBtn{background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:var(--muted);font-size:13px}
.syncBtn:hover{color:var(--text);border-color:var(--line2)}
.syncDot{width:10px;height:10px;border-radius:50%;flex:0 0 auto;background:var(--faint);cursor:default}
.syncDot--ok{background:var(--green);box-shadow:0 0 0 3px rgba(52,199,89,.15)}
.syncDot--save{background:var(--amber);animation:syncpulse 1s ease-in-out infinite}
.syncDot--off{background:var(--faint)}
.syncDot--err{background:var(--red)}
@keyframes syncpulse{0%,100%{opacity:1}50%{opacity:.3}}
.version-pill{font-size:12px;color:var(--blue);background:rgba(79,195,247,.12);border:1px solid rgba(79,195,247,.3);border-radius:999px;padding:3px 9px;font-weight:600}
.version-pill.admin{color:var(--orange);background:rgba(255,183,77,.12);border-color:rgba(255,183,77,.35)}
.gear{position:relative;display:grid;place-items:center;width:38px;height:38px;background:var(--bg);border:1px solid var(--line);border-radius:50%;color:var(--muted);transition:transform .4s ease,color .2s}
/* Notifications bell (overdue items + new notes) */
.notifBtn{position:relative;display:grid;place-items:center;width:38px;height:38px;background:var(--bg);border:1px solid var(--line);border-radius:50%;color:var(--muted);cursor:pointer}
/* The icon + badge must NOT intercept taps — so a tap on a phone always lands on
   the button itself (and its delegated data-action fires reliably). */
.notifBtn svg,.notifBtn__badge{pointer-events:none}
.notifBtn:hover{color:var(--blue)}
.notifBtn.has-alert{color:var(--amber);border-color:rgba(255,202,40,.5)}       /* needs attention = yellow */
.notifBtn.has-oos{color:var(--red);border-color:rgba(239,83,80,.7)}           /* out of service = red (wins) */
.notifBtn__badge{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--amber);color:#04120a;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;line-height:1;box-sizing:border-box}
.notifBtn.has-oos .notifBtn__badge{background:var(--red);color:#fff}
.notif{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:7px;cursor:pointer;color:var(--text)}
.notif:hover{border-color:var(--line2)}
.notif--over{border-color:rgba(255,202,40,.45)}
.notif--oos{border-color:var(--red)}
.notif--issue{border-color:rgba(255,202,40,.35)}
.notif--new{border-color:rgba(52,199,89,.4)}
.notif__dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%}
.notif__main{flex:1;min-width:0}
.notif__name{font-weight:700;font-size:13.5px;display:flex;align-items:center;gap:6px}
.notif__sub{color:var(--muted);font-size:12px;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.notif__newtag{flex:0 0 auto;background:var(--green);color:#04240F;font-size:9.5px;font-weight:800;padding:1px 5px;border-radius:6px;letter-spacing:.4px}
.notif__go{color:var(--faint);font-size:18px;flex:0 0 auto}
/* Server Admin login form (a normal-looking login page) */
.login{max-width:330px;margin:0 auto;text-align:center}
.login__icon{font-size:34px;margin:2px 0 6px}
.login__title{font-size:21px;font-weight:800;margin-bottom:4px}
.login__sub{color:var(--muted);font-size:13px;margin:0 0 14px;line-height:1.45}
.login__lbl{display:block;text-align:left;font-weight:600;font-size:12.5px;margin:10px 0 4px;color:var(--muted)}
.login__in{width:100%;box-sizing:border-box;background:var(--bg2);border:1px solid var(--line);border-radius:10px;color:var(--text);font-size:15px;padding:11px 12px}
.login__in:focus{outline:none;border-color:var(--green)}
.login__err{color:var(--red);font-size:12.5px;min-height:16px;margin:9px 0 2px;text-align:left}
.login__go{margin-top:6px;font-size:15px;padding:12px}
/* Password field + Show/Hide toggle */
.pwwrap{display:flex;align-items:stretch;width:100%}
.pwwrap input{flex:1;min-width:0;border-top-right-radius:0;border-bottom-right-radius:0}
.pwtoggle{flex:0 0 auto;border:1px solid var(--line);border-left:none;background:#3a3f45;color:var(--muted);
  font-size:12.5px;font-weight:700;padding:0 13px;border-radius:0 10px 10px 0;cursor:pointer;min-width:52px}
.pwtoggle:hover{color:#34C759}
.pwtoggle.is-on{color:#34C759}
.gear:hover{color:var(--blue)}
.gear:active{transform:rotate(60deg)}
.gear.is-admin{color:var(--green);border-color:rgba(52,199,89,.45)}
.gear__badge{position:absolute;top:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:var(--orange);border:2px solid var(--bg2);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,183,77,.55)}70%{box-shadow:0 0 0 7px rgba(255,183,77,0)}100%{box-shadow:0 0 0 0 rgba(255,183,77,0)}}

/* ===== Content shell ===== */
.content{max-width:920px;margin:0 auto;padding:18px 18px calc(60px + var(--safe-b))}
.view-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap;row-gap:8px}
.backlink{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--blue);font-weight:600;padding:6px 2px}
.backlink:hover{text-decoration:underline}
.view-title{font-size:20px;font-weight:700;display:flex;align-items:center;gap:10px}
.view-title .emo{font-size:22px}
.view-head__spacer{flex:1}
/* Button hierarchy: GREEN = primary action · GREY = secondary · RED = destructive. */
.btn{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-sm);padding:9px 13px;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;transition:border-color .15s,background .15s,filter .15s,transform .04s}
.btn:hover{border-color:var(--line2)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:default;transform:none}
.btn--primary,.btn--green{background:linear-gradient(180deg,var(--green),var(--green-d));border-color:var(--green-d);color:#04240F}
.btn--primary:hover,.btn--green:hover{border-color:var(--green-d);filter:brightness(1.07)}
.btn--ghost{background:transparent;color:var(--muted)}
.btn--ghost:hover{background:rgba(255,255,255,.04);border-color:var(--line2)}
.btn--danger{background:transparent;border-color:rgba(239,83,80,.4);color:var(--red)}
.btn--danger:hover{background:rgba(239,83,80,.10);border-color:var(--red)}
.btn--orange{background:linear-gradient(180deg,#F7A93B,#E8902A);border-color:#D67E18;color:#2A1800;font-weight:700}
.btn--orange:hover{border-color:#D67E18;filter:brightness(1.06)}
/* NFC tag manager */
.nfc-target{width:100%}
.nfc-link{margin:10px 0}
.nfc-readout{font-weight:700;font-size:14px;color:var(--text);word-break:break-word}
.nfc-url{font-size:11.5px;color:var(--muted);word-break:break-all;margin-top:3px;
  background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:7px 9px}
.nfc-actions{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.nfc-hint{font-size:11.5px;color:var(--faint);text-align:center}
.nfc-status{font-size:12.5px;margin:8px 0;min-height:1px}
.nfc-status--busy{color:#F7A93B}
.nfc-status--ok{color:var(--green)}
.nfc-status--err{color:var(--red)}
.nfc-sep{border-top:1px solid var(--line);margin:14px 0 4px}
.nfc-note{font-size:12px;color:var(--muted);line-height:1.5;margin-top:12px;
  background:rgba(247,169,59,.07);border:1px solid rgba(247,169,59,.3);border-radius:10px;padding:10px 12px}
.btn--block{width:100%;display:flex;justify-content:center}
.btn--sm{padding:5px 9px;font-size:12px}
.empty-note{color:var(--faint);text-align:center;padding:34px 16px;font-size:13.5px}

/* ===== Home: class tiles ===== */
.home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.tile{display:flex;flex-direction:column;gap:10px;text-align:left;background:linear-gradient(180deg,var(--bg2),var(--panel));border:1px solid var(--line);border-radius:var(--radius);padding:18px;min-height:128px}
.tile:hover{border-color:var(--line2);transform:translateY(-1px)}
.tile__top{display:flex;align-items:center;justify-content:space-between}
.tile__emo{font-size:30px}
.tile__count{font-size:13px;color:var(--muted)}
.tile__name{font-size:17px;font-weight:700}
.tile__foot{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}
.pill{font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px}
.pill--ok{color:var(--green);background:rgba(52,199,89,.12)}
.pill--due{color:var(--amber);background:rgba(255,202,40,.12)}
.pill--over{color:var(--amber);background:rgba(255,202,40,.12)}
.pill--oos{color:#fff;background:var(--red)}
.pill--none{color:var(--faint);background:var(--panel2)}

/* ===== Asset list (within a class / search) ===== */
.asset-list{display:flex;flex-direction:column;gap:9px}
.assetCard{display:flex;gap:12px;align-items:center;padding:13px;border:1px solid var(--line);background:var(--bg2);border-radius:var(--radius-sm);text-align:left;width:100%}
.assetCard:hover{border-color:var(--line2);background:var(--panel)}
.assetCard__icon{width:42px;height:42px;border-radius:10px;flex:0 0 auto;display:grid;place-items:center;font-size:21px;background:var(--panel2);border:1px solid var(--line);overflow:hidden;position:relative}
.assetCard__main{min-width:0;flex:1}
.assetCard__name{font-weight:600;display:flex;flex-wrap:wrap;align-items:center;gap:3px 6px;min-width:0}
.assetCard__nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:100%}
.assetCard__name .card-chip{margin-left:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.assetCard__meta{color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.assetCard__dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.dot--ok{background:var(--green)} .dot--due{background:var(--amber)} .dot--over{background:var(--amber)} .dot--oos{background:var(--red)} .dot--none{background:var(--faint)}

/* ===== Asset detail ===== */
.dhead{display:flex;align-items:flex-start;gap:14px;margin:4px 0 6px}
.dhead__icon{width:54px;height:54px;border-radius:13px;display:grid;place-items:center;font-size:27px;background:var(--panel2);border:1px solid var(--line);flex:0 0 auto;overflow:hidden;position:relative;padding:0}
.dhead__icon:hover{border-color:var(--blue-d)}
.icon-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.dhead__icon-edit{position:absolute;left:0;right:0;bottom:0;font-size:9px;line-height:1;letter-spacing:.3px;text-transform:uppercase;font-weight:700;color:#fff;background:rgba(0,0,0,.55);padding:3px 0;z-index:1}
.dhead__main{flex:1;min-width:0}
.dhead__name{font-size:22px;font-weight:700;border:1px solid transparent;border-radius:8px;padding:2px 6px;margin:-2px -6px}
.dhead__name:focus{outline:none;border-color:var(--blue-d);background:var(--bg2)}
.dhead__chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:7px}
.chip{font-size:11.5px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:3px 9px}
.chip--cat{color:var(--blue);border-color:rgba(79,195,247,.3);background:rgba(79,195,247,.1)}

.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);padding:16px 16px 14px;margin-top:14px}
.card:first-child{margin-top:0}
/* One consistent card header: section label on the left, action on the right, with
   a hairline beneath so every card reads as a clean, even block. */
.card__head{display:flex;align-items:center;justify-content:space-between;gap:8px 10px;margin:-2px 0 13px;padding-bottom:11px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.card__title{font-size:12px;text-transform:uppercase;letter-spacing:.9px;color:var(--muted);font-weight:700;min-width:0}
.card__title .accent{color:var(--orange)}

/* Static info grid (top) */
.statics{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.field{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 11px}
.field__label{font-size:11.5px;color:var(--faint);margin-bottom:3px;display:flex;justify-content:space-between}
.field input,.field select{width:100%;background:transparent;border:none;border-bottom:1px dashed transparent;padding:2px 0;outline:none;font-size:15px}
.field input:focus,.field select:focus{border-bottom-color:var(--blue-d)}

/* Measurement rows: editable box + latest reading */
.measure{display:flex;flex-direction:column;gap:12px}
.mrow{display:grid;grid-template-columns:1fr auto;gap:12px 16px;align-items:start;border-bottom:1px solid var(--line);padding-bottom:12px}
.mrow:last-child{border-bottom:none;padding-bottom:0}
.mrow__left{min-width:0}
.mrow__name{font-weight:600}
.mrow__sub{font-size:11.5px;color:var(--faint);margin-top:1px}
.mrow__entry{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
.mrow__entry input{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 11px;outline:none}
.mrow__entry input:focus{border-color:var(--blue-d)}
.mrow__ent--val{flex:1 1 120px;min-width:0}
.mrow__ent--num{flex:0 0 auto;width:76px}
.mrow__ent--date{flex:0 0 auto;width:130px;min-width:0}   /* compressed calendar box */
.mrow__ent--save{flex:0 0 auto}
.mrow__right{text-align:right;min-width:120px}
.mrow__status{font-size:11px;font-weight:700;border-radius:999px;padding:3px 9px;display:inline-block;margin-bottom:6px}
.st--ok{color:var(--green);background:rgba(52,199,89,.12)}
.st--due{color:var(--amber);background:rgba(255,202,40,.12)}
.st--over{color:var(--amber);background:rgba(255,202,40,.12)}
.st--none{color:var(--faint);background:var(--panel)}
.mrow__latest{font-size:20px;font-weight:700;line-height:1.1}
.mrow__latest small{font-size:12px;color:var(--muted);font-weight:600}
.mrow__when{font-size:11.5px;color:var(--faint);margin-top:2px}
.hist{margin-top:10px;border-top:1px dashed var(--line);padding-top:8px;display:flex;flex-direction:column;gap:5px}
.hist__row{display:flex;gap:10px;align-items:baseline;font-size:12.5px}
.hist__date{color:var(--faint);flex:0 0 86px}
.hist__val{font-weight:600}
.hist__note{color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hist__del{border:none;background:none;color:var(--red);font-size:13px;padding:0 4px;opacity:.8}
.hist__more{font-size:12px;color:var(--blue);background:none;border:none;padding:2px 0;text-align:left}

/* Notes */
.note-edit textarea{width:100%;min-height:90px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 13px;resize:vertical;outline:none;line-height:1.5}
.note-edit textarea:focus{border-color:var(--blue-d)}
.note-edit__foot{display:flex;align-items:center;gap:10px;margin-top:9px}
.note-edit__foot .muted{color:var(--faint);font-size:12px}
/* Photo on a note (issue reports) */
.note-photo-row{display:flex;align-items:center;gap:10px;margin-top:9px;flex-wrap:wrap}
.note-photo-preview{display:flex}
.note-photo-preview img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.note-photo{width:72px;height:72px;border-radius:8px;border:1px solid var(--line);background-size:cover;background-position:center;cursor:pointer;display:block;margin-top:9px;padding:0}
.note-photo--sm{width:52px;height:52px;margin-top:7px}
.note-hist{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.note-hist__item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 11px;font-size:13px}
.note-hist__ts{font-size:11px;color:var(--faint);margin-bottom:3px;display:flex;justify-content:space-between;gap:8px}
.lock{color:var(--faint);font-size:12.5px;display:inline-flex;align-items:center;gap:6px}

/* Issues / messages (threaded tickets) */
.issues{display:flex;flex-direction:column;gap:12px}
.tk{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:var(--radius-sm);padding:11px 12px}
.tk--fixed{border-left-color:var(--green);opacity:.92}
.tk__head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.tk__title{font-weight:700;font-size:14px}
.tk__meta{font-size:11px;color:var(--faint);margin:2px 0 8px}
.tk__badge{font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:6px;white-space:nowrap;margin-left:6px;vertical-align:middle}
.tk__badge--open{color:var(--amber);background:rgba(255,183,77,.16)}
.tk__badge--oos{color:#fff;background:var(--red)}
.tk__badge--fixed{color:var(--green);background:rgba(52,199,89,.14)}
.tk--oos{border-left-color:var(--red)}
.tk__oos{display:flex;align-items:center;gap:8px;margin-top:9px;font-size:12.5px;font-weight:600;color:var(--red);cursor:pointer}
.tk__oos input{width:16px;height:16px;accent-color:var(--red)}
.tk__repairs{margin-top:9px;padding:8px 10px;background:rgba(79,195,247,.07);border:1px solid var(--line);border-radius:9px;font-size:12.5px}
.tk__repairs-h{font-weight:700;margin-bottom:2px}
.tk__repairitem{color:var(--muted);font-size:12px}
.oos-banner{margin:2px 0 12px;padding:9px 12px;background:var(--red);color:#fff;font-weight:700;font-size:13px;border-radius:9px}
.repair__forissue{display:inline-block;margin-left:6px;font-size:11px;font-weight:700;color:var(--blue);background:rgba(79,195,247,.12);padding:1px 7px;border-radius:6px}
.tk__thread{display:flex;flex-direction:column;gap:7px}
.msg{background:var(--bg2);border:1px solid var(--line);border-radius:9px;padding:7px 10px;font-size:13px}
.msg--fix{border-color:var(--green-d);background:rgba(52,199,89,.08)}
.msg__meta{font-size:10.5px;color:var(--faint);margin-bottom:2px}
.msg__text{white-space:pre-wrap;word-break:break-word}
.tk__closed{font-size:11.5px;color:var(--green);margin-top:8px;font-weight:600}
.tk__reply{display:flex;gap:8px;align-items:flex-end;margin-top:9px}
.tk__replyin{flex:1;min-width:0;resize:vertical;min-height:36px;background:var(--bg2);color:var(--text);border:1px solid var(--line2);border-radius:8px;padding:8px 10px;font:inherit;font-size:13px}
.tk__actions{display:flex;gap:8px;margin-top:9px}
.issues-done{margin-top:4px}
.issues-done>summary{cursor:pointer;font-size:12.5px;color:var(--muted);font-weight:600;padding:4px 2px;user-select:none}
.issues-done[open]>summary{margin-bottom:10px}
.issues-done .tk{margin-bottom:10px}

/* Tag */
.tag{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.tag__code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:var(--orange);background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.tag__hint{color:var(--muted);font-size:12.5px;flex:1;min-width:160px}

/* ===== Modal ===== */
/* Global guard: any element with the `hidden` attribute must stay hidden.
   Author rules like `.modal{display:grid}` otherwise override the UA
   `[hidden]{display:none}` rule, leaving the modal permanently on top of
   the page (dimming + blurring it and swallowing every click/tap). */
[hidden]{display:none!important}
.modal{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:18px}
.modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}
.modal__card{position:relative;background:var(--panel);border:1px solid var(--line2);border-radius:var(--radius);box-shadow:var(--shadow);width:min(560px,100%);max-height:88vh;overflow:auto}
.modal__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel);z-index:1}
.modal__title{font-size:17px;font-weight:700}
.modal__x{background:none;border:none;color:var(--muted);font-size:22px;line-height:1;padding:4px 8px}
.modal__body{padding:18px}
.modal__foot{display:flex;gap:10px;justify-content:flex-end;padding:14px 18px;border-top:1px solid var(--line);position:sticky;bottom:0;background:var(--panel)}
.form-row{margin-bottom:14px}
.form-row label{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
.form-row input,.form-row select,.form-row textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;outline:none}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--blue-d)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.catgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.catpick{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:var(--bg2);border-radius:var(--radius-sm);padding:12px}
.catpick:hover{border-color:var(--line2)}
.catpick.sel{border-color:var(--blue-d);background:rgba(79,195,247,.08)}
.catpick .emo{font-size:22px}

/* Fields manager */
.field__unit{color:var(--faint);font-weight:400}
.field__set{color:var(--faint);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-left:6px}
.field__mult{margin-top:6px;font-size:13px;color:var(--muted);background:rgba(52,199,89,.10);border:1px solid rgba(52,199,89,.30);border-radius:7px;padding:4px 9px;display:inline-block}
.field__mult b{color:var(--green);font-size:15px}
.qtyrow{display:flex;align-items:center;gap:12px}
.qtyrow input{flex:0 0 90px}
.qtyrow .muted{font-size:12.5px}
.frow{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--line)}
.frow:last-of-type{border-bottom:none}
.frow__cls{flex:0 0 auto;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;border-radius:6px;padding:3px 8px}
.cls--static{color:var(--blue);background:rgba(79,195,247,.12)}
.cls--dynamic{color:var(--orange);background:rgba(255,183,77,.12)}
.frow__name{flex:1;min-width:0}
.frow__ctrls{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.frow__name>div:first-child{font-weight:600}
.frow__meta{color:var(--faint);font-size:11.5px}
.choice{display:flex;flex-direction:column;gap:8px}
.choice label{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);background:var(--bg2);border-radius:var(--radius-sm);padding:10px 12px;cursor:pointer}
.choice label.sel{border-color:var(--blue-d);background:rgba(79,195,247,.08)}
.choice label input{margin-top:3px}
.choice label b{display:block;font-size:13.5px}
.choice label small{color:var(--muted);font-size:12px}

/* Admin / updater */
.admin-box{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);padding:14px;margin-bottom:16px}
.admin-box.in{border-color:rgba(255,183,77,.4)}
.admin-box__head{display:flex;align-items:center;gap:8px;font-weight:700;margin-bottom:10px}
.admin-box__head .badge{font-size:10.5px;font-weight:700;border-radius:5px;padding:2px 7px;color:var(--orange);background:rgba(255,183,77,.14)}
.hint{color:var(--faint);font-size:12px;margin-top:8px}
.upd__row{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);margin-bottom:14px}
.upd__status{flex:1}.upd__status b{display:block}.upd__status small{color:var(--muted)}
.changelog{display:flex;flex-direction:column;gap:14px}
.cl{border-left:2px solid var(--line2);padding-left:14px;position:relative}
.cl::before{content:"";position:absolute;left:-6px;top:3px;width:10px;height:10px;border-radius:50%;background:var(--blue);border:2px solid var(--panel)}
.cl.current::before{background:var(--orange)}
.cl__ver{font-weight:700;display:flex;align-items:center;gap:8px}
.cl__date{color:var(--faint);font-size:11.5px;font-weight:400}
.cl__tag{font-size:10px;font-weight:700;color:var(--orange);background:rgba(255,183,77,.12);border-radius:5px;padding:1px 6px}
.cl ul{margin:7px 0 0;padding-left:18px;color:var(--muted);font-size:13px}
.cl li{margin:3px 0}

/* Scan */
.scan-stage{position:relative;background:#000;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:4/3;display:grid;place-items:center;margin-bottom:14px}
.scan-stage video{width:100%;height:100%;object-fit:cover}
.scan-stage__frame{position:absolute;inset:18% 14%;border:2px solid rgba(52,199,89,.9);border-radius:12px;box-shadow:0 0 0 4000px rgba(0,0,0,.25)}
.scan-stage__msg{color:#cfd3d7;font-size:13px;text-align:center;padding:20px}

/* Toast */
.toast{position:fixed;left:50%;bottom:calc(22px + var(--safe-b));transform:translateX(-50%);background:var(--panel2);border:1px solid var(--line2);border-radius:999px;padding:10px 18px;box-shadow:var(--shadow);z-index:60;font-size:13.5px;max-width:90vw}
.toast--ok{border-color:rgba(52,199,89,.5)} .toast--err{border-color:rgba(239,83,80,.5)}

/* ===== Receipts & cost-per-year ===== */
.cost-summary{display:flex;gap:16px;align-items:stretch;margin-bottom:6px}
.cost-chart{flex:1;min-width:0;display:flex;align-items:flex-end;gap:10px;padding:10px 4px 0;min-height:140px;overflow-x:auto}
.cbar{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;flex:1 0 46px;min-width:46px}
.cbar__amt{font-size:11px;color:var(--muted);white-space:nowrap}
.cbar__fill{width:34px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,var(--blue),var(--blue-d));box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.cbar__fill.is-now{background:linear-gradient(180deg,#FF7A78,var(--red))}
.cbar__year{font-size:11.5px;color:var(--faint);font-variant-numeric:tabular-nums}
.cost-now{flex:0 0 130px;align-self:center;background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;text-align:center}
.cost-now__label{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.cost-now__val{font-size:24px;font-weight:800;color:var(--red);line-height:1.15;margin-top:3px;font-variant-numeric:tabular-nums}
.cost-now__sub{font-size:11.5px;color:var(--faint);margin-top:4px}
.receipts{display:flex;flex-direction:column;gap:8px;margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.receipt{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 11px}
.receipt__thumb{width:44px;height:44px;flex:0 0 auto;border-radius:8px;border:1px solid var(--line2);background-size:cover;background-position:center;background-color:var(--panel2);padding:0}
.receipt__thumb--none{display:grid;place-items:center;font-size:9px;line-height:1.1;text-align:center;color:var(--faint);cursor:default}
.receipt__main{flex:1;min-width:0}
.receipt__note{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.receipt__date{color:var(--muted);font-size:12.5px}
.receipt__total{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.receipt-prev{width:100%;height:150px;border-radius:var(--radius-sm);border:1px solid var(--line2);background-size:cover;background-position:center;background-color:var(--panel2)}
/* Repairs & labour */
/* Repair totals time filter: Month / Year / Total segmented toggle. */
.rrange{display:inline-flex;gap:0;margin:0 0 10px;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.rrange__btn{background:var(--bg);color:var(--muted);border:none;border-right:1px solid var(--line);
  padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer}
.rrange__btn:last-child{border-right:none}
.rrange__btn.is-on{background:var(--green);color:#08130b}
.rrange__note{color:var(--faint);font-size:12px;margin:8px 0 4px}
.repair-summary{display:flex;gap:10px;margin-bottom:6px}
.rstat{flex:1;background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 12px;text-align:center}
.rstat__label{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.rstat__val{font-size:21px;font-weight:800;line-height:1.15;margin-top:3px;font-variant-numeric:tabular-nums}
.rstat--accent{border-color:var(--green-d);background:rgba(52,199,89,.10)}
.rstat--accent .rstat__val{color:var(--green)}
.repairs{display:flex;flex-direction:column;gap:8px;margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.repair{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 11px}
.repair__main{flex:1;min-width:0}
.repair__what{font-weight:600}
.repair__status{font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:6px;white-space:nowrap}
.repair__status--active{color:var(--amber);background:rgba(255,183,77,.16)}
.repair__status--done{color:var(--green);background:rgba(52,199,89,.14)}
.repair__note{color:var(--muted);font-size:12.5px;margin-top:3px}
.repair__mark{margin-top:7px}
.repair--active{border-left:3px solid var(--amber)}
.repair__btns{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.repair__date{color:var(--muted);font-size:12.5px}
.repair__nums{display:flex;align-items:center;gap:10px;white-space:nowrap}
.repair__hours{color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums}
.repair__cost{font-weight:800;font-variant-numeric:tabular-nums}
.repair__rcpt{width:40px;height:40px;flex:0 0 auto;border-radius:8px;border:1px solid var(--line2);background-size:cover;background-position:center;background-color:var(--panel2);padding:0;cursor:pointer}
.repair-live{font-size:13px;color:var(--muted);background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 11px;width:100%}
.receipt-prev img{max-width:100%;max-height:160px;border-radius:8px;border:1px solid var(--line);margin-top:6px}
.photo-stage{width:100%;height:200px;border-radius:var(--radius-sm);border:1px dashed var(--line2);background:var(--bg2);display:grid;place-items:center;overflow:hidden}
.photo-stage.has{border-style:solid;background:#000}
.photo-stage img{width:100%;height:100%;object-fit:contain}
.img-view{width:100%;max-height:70vh;overflow:auto;border-radius:var(--radius-sm);background:#000;display:grid;place-items:center}
.img-view img{max-width:100%;max-height:70vh;display:block}
.tagline{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:12.5px}
.tagline__label{text-transform:uppercase;letter-spacing:.4px;font-size:11px;color:var(--faint)}
.tag__code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--panel2);border:1px solid var(--line);border-radius:7px;padding:2px 8px;color:var(--text)}
.tagline__hint{flex-basis:100%;color:var(--faint)}

/* ===== Sticker tags (scannable labels mapped to an asset) ===== */
.labels{display:flex;flex-direction:column;gap:8px}
.label-row{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 11px}
.label-row__main{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}
.label-row__name{font-weight:600;color:var(--text)}
.label-row__code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--orange);background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:2px 7px}
.label-row__kind{font-size:11px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:2px 8px}
.label-row__kind--rigger{color:var(--green);border-color:rgba(52,199,89,.4)}
.label-row--nfc{cursor:pointer;border-color:rgba(247,169,59,.4);background:rgba(247,169,59,.06)}
.label-row--nfc:hover{border-color:rgba(247,169,59,.7)}
.label-row--nfc .label-row__code{color:#F7A93B;border-color:rgba(247,169,59,.4)}
.label-row__manage{font-size:11px;color:#F7A93B;white-space:nowrap}
.nfc-num{width:100%}
.iconbtn{flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;border-radius:8px;border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:17px;line-height:1;cursor:pointer}
.iconbtn:hover{border-color:var(--danger,#e5484d);color:var(--danger,#e5484d)}
/* small inline camera for "add a sticker" */
.scan-stage--sm{aspect-ratio:5/3;margin-bottom:12px}
/* link-an-unknown-sticker picker */
.assign-code{margin:0 0 10px;color:var(--muted);font-size:13px}
.assign-code b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--orange)}
.assign-list{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow:auto;margin-top:6px}
.assign-row{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:left;
  background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--text);cursor:pointer;font-size:14px}
.assign-row:hover{border-color:var(--blue-d);background:var(--bg2)}
.assign-row__name{font-weight:600}
.assign-row__cat{color:var(--faint);font-size:12px;white-space:nowrap}

/* ===== Account picker (first screen: choose a database) ===== */
.acctChip{display:inline-flex;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--line);
  border-radius:999px;padding:6px 11px;color:var(--text);font-size:12.5px;font-weight:600;
  max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acctChip:hover{border-color:var(--blue-d);color:var(--blue)}
.userChip{display:inline-flex;align-items:center;background:var(--bg);border:1.5px solid var(--line);
  border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:700;color:var(--muted);line-height:1.2;
  max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto}
.userChip:hover{filter:brightness(1.12)}
body.picking-account .acctChip,
body.picking-account .search,
body.picking-account #scanBtn,
body.picking-account #syncBtn,
body.picking-account #gearBtn,
body.picking-account #userChip,
body.picking-account #syncDot{display:none}
.picker{max-width:760px;margin:6vh auto 0;padding:0 4px}
.picker__head{text-align:center;margin-bottom:18px}
.picker__title{font-size:24px;font-weight:800;letter-spacing:.2px}
.picker__sub{color:var(--muted);font-size:14px;margin:8px auto 0;max-width:520px;line-height:1.5}
.picker__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.picker__foot{text-align:center;margin-top:24px;display:flex;flex-direction:column;align-items:center;gap:6px}
.picker__foothint{color:var(--faint);font-size:12px}
/* Sign-in card on the choose-database screen (the login lives here too). */
.picker__signin{max-width:520px;margin:0 auto 22px;padding:16px 18px;border:1px solid var(--line);
  border-radius:var(--radius);background:linear-gradient(180deg,var(--bg2),var(--panel));text-align:center}
.picker__signin.is-in{border-color:rgba(52,199,89,.35)}
.picker__signinhead{font-weight:700;font-size:15px}
.picker__signinhint{color:var(--muted);font-size:12.5px;margin:4px 0 12px;line-height:1.45}
.picker__signinrow{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
/* Picker "locked" state — shown until you sign in (no databases revealed). */
.picker__locked{text-align:center;padding:30px 18px;border:1px dashed var(--line);border-radius:var(--radius);background:var(--bg2)}
.picker__lockedicon{font-size:34px;line-height:1;opacity:.85}
.picker__lockedmsg{font-weight:700;font-size:16px;margin:8px 0 4px}
.picker__signedline{display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;margin-bottom:4px}
.picker__dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex:0 0 auto}
.who--blocked{opacity:.5;cursor:not-allowed}
.acct{display:flex;flex-direction:column;align-items:flex-start;gap:10px;text-align:left;
  background:linear-gradient(180deg,var(--bg2),var(--panel));border:1px solid var(--line);
  border-radius:var(--radius);padding:22px;min-height:140px;transition:transform .12s ease,border-color .2s}
.acct:hover{border-color:var(--blue-d);transform:translateY(-2px)}
.acct--blocked{opacity:.5;cursor:not-allowed}
.acct--blocked:hover{transform:none;border-color:var(--line)}
.acct__emo{font-size:36px;line-height:1}
.acct__name{font-size:20px;font-weight:700}
.acct__hint{margin-top:auto;color:var(--blue);font-size:13px;font-weight:600}

/* ===== Rigging (per-seat measurements + diagram) ===== */
.seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px}
.seg__btn{border:none;background:none;color:var(--muted);font-size:12px;font-weight:700;padding:5px 14px;border-radius:999px;letter-spacing:.3px}
.seg__btn.is-on{background:linear-gradient(180deg,var(--blue),var(--blue-d));color:#05222F}
.rig{display:flex;flex-direction:column;gap:10px}
.rig__rows{display:flex;flex-direction:column;gap:10px}
.seat{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 12px}
.seat--cox{border-color:var(--orange-d);background:linear-gradient(180deg,rgba(255,183,77,.06),var(--panel))}
.seat__head{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.seat__pos{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 auto;
  border-radius:7px;background:rgba(79,195,247,.14);color:var(--blue);font-size:12px;font-weight:800}
.seat__pos--cox{width:auto;padding:0 8px;background:rgba(255,183,77,.16);color:var(--orange);text-transform:uppercase;letter-spacing:.6px}
.seat__name{flex:1;min-width:0;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);font-size:14px;font-weight:700;padding:6px 9px}
.seat__name:focus{outline:none;border-color:var(--blue-d)}
.seat__name--cox{flex:1;border:none;background:none;padding:6px 0;font-weight:700}
.cox__loc{flex:0 0 auto;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);font-size:12px;padding:5px 8px}
.seat__del{flex:0 0 auto;border:none;background:none;color:var(--faint);font-size:14px;padding:2px 6px;border-radius:6px}
.seat__del:hover{color:var(--red);background:rgba(239,83,80,.1)}
/* Fixed Port/Starboard side chip on each sweep seat. The side travels with the
   rigger when seats are reordered; tapping flips just this rigger's side. */
.seat__side{flex:0 0 auto;font-weight:700;font-size:11.5px;padding:3px 9px;border-radius:999px;
  background:var(--bg);border:1px solid var(--line);cursor:pointer}
.seat__side--port{color:#FF5252;border-color:rgba(255,82,82,.45)}
.seat__side--stb{color:#34C759;border-color:rgba(52,199,89,.45)}
.seat__side:disabled{cursor:default;opacity:.85}
/* Reorder ▲▼ controls (riggers + oars). Tap-friendly on phones; work everywhere. */
.reorder{flex:0 0 auto;display:inline-flex;gap:2px;margin-left:auto}
.oar .reorder{margin-left:0}
.reorder__btn{border:1px solid var(--line);background:var(--bg);color:var(--text);
  width:30px;height:30px;border-radius:7px;font-size:12px;line-height:1;cursor:pointer;padding:0}
.reorder__btn:hover:not(:disabled){border-color:var(--blue-d);color:var(--blue)}
.reorder__btn:disabled{opacity:.3;cursor:default}
.seat__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.seat__total{margin-top:8px;font-size:13px;color:var(--muted)}
.seat__total b{color:var(--green);font-size:14px;font-variant-numeric:tabular-nums}
/* Matched-oar values shown on a seat (in the rigging list) — one row per oar,
   below the rigger's spread/angle, with clearly-labelled length + in-board. */
.seat__oars{display:block;width:100%;text-align:left;margin-top:9px;padding:11px 13px;
  background:rgba(52,199,89,.06);border:1px solid rgba(52,199,89,.28);border-radius:10px;cursor:pointer;color:var(--text)}
.seat__oars:hover{border-color:rgba(52,199,89,.6)}
.seat__oarshead{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:7px}
.seat__oarrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;padding:3px 0}
.seat__oarside{flex:0 0 auto;font-size:12px;font-weight:800;padding:2px 10px;border-radius:6px;color:var(--muted);background:var(--panel2);min-width:82px}
.seat__oarside--port{color:#FF5252;background:rgba(255,82,82,.12)}
.seat__oarside--stb{color:#34C759;background:rgba(52,199,89,.12)}
.seat__oarval{font-size:14px;color:var(--muted)}
.seat__oarval b{color:var(--green);font-size:16px;font-variant-numeric:tabular-nums}
.rig__f{display:flex;flex-direction:column;gap:4px;min-width:0}
.rig__f--note{grid-column:1/-1}
.rig__flabel{font-size:11px;color:var(--muted);font-weight:600}
.rig__flabel i{color:var(--faint);font-style:normal}
.rig__fhint{display:block;font-size:9.5px;font-weight:600;line-height:1.25;margin-top:1px}
.rig__f input{background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);font-size:14px;padding:7px 9px;width:100%;font-variant-numeric:tabular-nums}
.rig__f input:focus{outline:none;border-color:var(--blue-d)}
.rig__f--cost input{color:var(--orange);font-weight:700}
.rig__build{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 11px}
.rig__buildlbl{font-weight:600;font-size:13px}
.rig__disc{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.rig__disclbl{font-weight:600;font-size:13px}
.rig__discfixed{font-weight:800;font-size:14px;color:var(--text)}
.rig__conv{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;margin:0 0 12px;cursor:pointer}
/* Named layout of the current rig (e.g. "Port (2,3 bucket)") + optional rigging note */
.rig__layout{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.rig__layoutlbl{font-weight:600;font-size:13px;color:var(--muted)}
.rig__layoutname{font-size:14px;color:var(--green)}
.rig__oars{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.rig__oarslbl{font-weight:600;font-size:13px;color:var(--muted);flex:0 0 auto}
.rig__oarslist{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.rig__oarslist .linklike{font-size:13px;color:var(--green)}
.rig__oarchip{display:inline-flex;align-items:center;gap:4px;background:rgba(52,199,89,.08);border:1px solid rgba(52,199,89,.3);border-radius:8px;padding:2px 4px 2px 8px}
.rig__oardetach{appearance:none;border:0;background:transparent;color:var(--faint);font-size:15px;line-height:1;cursor:pointer;padding:0 4px}
.rig__oardetach:hover{color:var(--red)}
.rig__oaradd{max-width:180px;font-size:12.5px}
/* Linked assets in the Static details card (oars on a boat, engine on a launch). */
.linked{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:10px 0 0;padding-top:10px;border-top:1px solid var(--line)}
.linked__lbl{font-weight:700;font-size:13px;color:var(--muted);flex:0 0 auto}
.linked__list{display:flex;flex-wrap:wrap;gap:6px 16px;flex:1 1 auto;min-width:0}
.linked__item{display:inline-flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.linked .linked__name{font-size:13.5px;color:var(--green)}
.linked__vals{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;display:none}
/* Oar/engine values reveal on a larger display (tablet / desktop); phones keep just the link. */
@media (min-width:640px){ .linked__vals{display:inline} }
.rig__note{margin:10px 0 2px}
.rig__notelbl{display:block;font-weight:600;font-size:12.5px;margin:0 0 4px}
.rig__notein{width:100%;box-sizing:border-box;background:#3a3f45;color:var(--text);border:1px solid var(--line);
  border-radius:8px;padding:8px 10px;font:inherit;font-size:13px;resize:vertical;min-height:38px}
.rig__notein:focus{outline:none;border-color:var(--green)}
.rig__noteview{background:#2a2e33;border:1px solid var(--line);border-radius:8px;padding:8px 10px;
  font-size:13px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
/* Saved rig setups (per discipline) */
.rigset{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.rigset__head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.rigset__hint{color:var(--muted);font-size:12.5px;margin:4px 0 10px;line-height:1.45}
.rigset__group{margin-bottom:10px}
.rigset__gh{font-weight:700;font-size:12.5px;color:var(--text);margin:0 0 4px}
.rigset__row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}
.rigset__main{flex:1;min-width:0}
.rigset__name{font-weight:800;font-size:13.5px;color:var(--text)}
.rigset__when{color:var(--muted);font-size:12px;font-weight:500}
.rigset__note{color:var(--muted);font-size:12px;margin-top:2px;line-height:1.4;white-space:pre-wrap;word-break:break-word}
/* Per-oarlock record on a saved setup: seat number, side (colour), sticker number */
.rigset__seats{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.rigset__seat{font-size:11px;font-weight:700;padding:2px 7px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--muted)}
.rigset__seat--port{color:#FF5252;border-color:rgba(255,82,82,.4)}
.rigset__seat--stb{color:#34C759;border-color:rgba(52,199,89,.4)}
.rigset__lock{color:var(--muted);font-weight:600}
.rigset__sub{color:var(--muted);font-size:12px}
.rig__build select{flex:1;min-width:160px}
/* Rigger build: grey dropdown with green text (requested for readability). */
.build-sel{background:#3a3f45;color:#34C759;border:1px solid rgba(52,199,89,.5);border-radius:8px;
  padding:7px 10px;font-size:13px;font-weight:700;-webkit-appearance:none;appearance:none;cursor:pointer}
.build-sel option{background:#3a3f45;color:#34C759;font-weight:700}
.rig__foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:2px}
.rig__hint{color:var(--muted);font-size:12px;line-height:1.4;flex:1;min-width:140px}
.rig__hint b{color:var(--blue)}
.oarspecs{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:10px}
.oarcount{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:7px 11px;font-size:13.5px;margin-bottom:10px}
.oarcount b{color:var(--blue);font-size:15px}
.oars{display:flex;flex-direction:column;gap:10px}
.oar{display:flex;flex-direction:column;gap:9px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 11px}
.oar__head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;row-gap:6px;min-width:0}
.oar__num{flex:0 0 auto;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line);font-weight:700;font-size:13px}
.oar__side{font-weight:700;font-size:12.5px;padding:3px 9px;border-radius:999px;border:1px solid var(--line)}
.oar__side--port{color:#FF5252;border-color:rgba(255,82,82,.45)}
.oar__side--stb{color:#34C759;border-color:rgba(52,199,89,.45)}
.oar__sidehint{color:var(--faint);font-size:11px;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.oar__seat{flex:0 0 auto;font-size:11.5px;font-weight:700;color:var(--text);background:var(--panel);
  border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap}
.oarmatch{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 10px;
  padding:9px 11px;background:rgba(52,199,89,.07);border:1px solid rgba(52,199,89,.32);border-radius:10px}
.oarmatch__on{font-size:12.5px;font-weight:700;color:var(--green)}
.oarmatch__hint{font-size:11.5px;color:var(--muted)}
.oar__measures{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.oar__tag{display:flex;flex-direction:column;gap:6px;min-width:0}
.oar__tagrow{display:flex;gap:8px;align-items:center}
.oar__name{width:100%}
.oar__code{flex:1;min-width:0}
.oarlink{margin-top:8px;font-size:12.5px;color:var(--muted)}
.linklike{background:none;border:none;color:var(--blue);font-weight:600;cursor:pointer;padding:0;font-size:12.5px}
.linklike:hover{text-decoration:underline}
.dgm{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px 8px 8px}
.dgm svg{display:block;margin:0 auto;max-width:380px}
.dgm__hull{fill:var(--panel2);stroke:var(--line2);stroke-width:1.5}
.dgm__rig{stroke:var(--blue);stroke-width:2.5;stroke-linecap:round}
.dgm__lock{fill:var(--bg);stroke:var(--blue);stroke-width:2}
.dgm__seat{fill:var(--bg2);stroke:var(--line2);stroke-width:1.5}
.dgm__seatlbl{fill:var(--muted);font-size:10px;font-weight:700}
.dgm__total{fill:var(--green);font-size:9.5px;font-weight:800;font-variant-numeric:tabular-nums}
.dgm__oar{fill:var(--green);font-size:10.5px;font-weight:700;font-variant-numeric:tabular-nums}
.dgm__spread{fill:var(--text);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}
.dgm__sub{fill:var(--faint);font-size:8.5px;font-weight:600}
.dgm__cox{fill:rgba(255,183,77,.16);stroke:var(--orange-d);stroke-width:1.5}
.dgm__coxlbl{fill:var(--orange);font-size:9.5px;font-weight:800}
.dgm__coxcost{fill:var(--orange);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}
.dgm__legend{text-align:center;color:var(--muted);font-size:11.5px;margin-top:8px}
/* "Buckets" — switch-riggers-here marker between seats */
.dgm__bucket{fill:var(--amber);font-size:13px;font-weight:800}
.dgm__bucketline{stroke:var(--amber);stroke-width:2;stroke-dasharray:3 3}
.dgm__buckethit{fill:transparent;cursor:pointer}
.dgm__buckethit:hover{fill:rgba(255,193,7,.14)}
/* Orange "Bucket" button between two seats — taps to swap just those two riggers'
   sides (a bucket). Outlined orange normally; filled orange when the bucket is on. */
.bucketdiv{display:block;width:100%;text-align:center;margin:6px 0;padding:6px;border:1px solid #E8902A;border-radius:8px;background:rgba(247,169,59,.10);color:#F7A93B;font-size:12px;font-weight:700;cursor:pointer}
.bucketdiv:hover{background:rgba(247,169,59,.18);border-color:#F7A93B}
.bucketdiv.is-on{border-color:#D67E18;background:linear-gradient(180deg,#F7A93B,#E8902A);color:#2A1800}
.bucketdiv.is-ro{cursor:default;opacity:.85}
/* Per-asset field on/off chips */
.fieldtoggles-wrap{margin-top:10px}
.fieldtoggles{display:flex;flex-wrap:wrap;gap:8px}
.fieldtoggle{border:1px solid var(--line);background:var(--bg);color:var(--faint);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer}
.fieldtoggle.is-on{border-color:rgba(52,199,89,.5);background:rgba(52,199,89,.12);color:var(--green)}
/* Oar diagram: grip · oarlock · blade per oar (port left / starboard right). */
.dgm__spine{stroke:var(--line2);stroke-width:1.5;stroke-dasharray:3 4}
.oardgm__shaft{stroke:var(--muted);stroke-width:2.5;stroke-linecap:round}
.oardgm__grip{fill:var(--bg);stroke:var(--muted);stroke-width:2}
.oardgm__pin{fill:var(--bg);stroke:var(--line2);stroke-width:2}
.oardgm__blade{stroke-width:1}
.oardgm__blade--port{fill:rgba(255,82,82,.85);stroke:#FF5252}
.oardgm__blade--stb{fill:rgba(52,199,89,.85);stroke:#34C759}
.oardgm__num{fill:var(--muted);font-size:9.5px;font-weight:700}
/* Editable spread/height boxes drawn onto the diagram (via SVG foreignObject) */
.dgm__edit{display:flex;flex-direction:column;gap:3px;height:100%;justify-content:center}
.dgm__fld{display:flex;align-items:center;gap:3px;line-height:1}
.dgm__fld>i{font-style:normal;color:var(--blue);font-size:9px;font-weight:800;width:8px;flex:0 0 auto;text-align:center}
.dgm__fld input{width:34px;flex:0 0 auto;background:var(--bg2);border:1px solid var(--line2);border-radius:5px;
  color:var(--text);font-size:11px;font-weight:700;padding:2px 4px;text-align:right;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.dgm__fld input::-webkit-outer-spin-button,.dgm__fld input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.dgm__fld input:focus{outline:none;border-color:var(--blue)}
.dgm__fld>span{color:var(--faint);font-size:8.5px;font-weight:600}
/* Spread — the editable GREEN number on the boat's centreline. */
.dgm__span{display:flex;align-items:center;justify-content:center;gap:2px;height:100%}
.dgm__span input{width:48px;background:transparent;border:1px solid transparent;border-radius:5px;color:var(--green);font-size:13px;font-weight:800;font-variant-numeric:tabular-nums;text-align:center;padding:1px 2px;-moz-appearance:textfield}
.dgm__span input::-webkit-outer-spin-button,.dgm__span input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.dgm__span input::placeholder{color:var(--faint);font-weight:600;font-size:9.5px}
.dgm__span input:focus{outline:none;border-color:var(--green);background:var(--bg2)}
.dgm__span>span{color:var(--faint);font-size:8.5px;font-weight:600}
/* Auto Label Creator — on-screen preview of a printable QR label */
.label-preview{display:flex;justify-content:center;margin:6px 0 12px}
.label-preview .labelcard{display:flex;gap:12px;align-items:center;background:#fff;color:#000;border:1px solid var(--line2);border-radius:10px;padding:12px;max-width:330px}
.label-preview .labelcard__qr svg{width:104px;height:104px;display:block}
.label-preview .labelcard__team{font-weight:800;font-size:12px;letter-spacing:.5px}
.label-preview .labelcard__name{font-weight:700;font-size:13px;margin:1px 0}
.label-preview .labelcard__code{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:#333}
.label-preview .labelcard__contact{font-size:10px;color:#333;margin-top:5px;line-height:1.3}
.label-preview .labelcard--barcode,.label-preview .labelcard--both{max-width:400px}
.label-preview .labelcard__txt{flex:1;min-width:0}
.label-preview .labelcard__bar{margin:3px 0 1px}
.label-preview .labelcard__bar svg{width:100%;height:auto;max-height:44px;display:block}
/* Segmented QR / Barcode / Both picker */
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:9px;overflow:hidden}
.seg__btn{appearance:none;border:0;background:transparent;color:var(--text);font:inherit;font-size:13px;font-weight:600;padding:7px 14px;cursor:pointer;border-left:1px solid var(--line2)}
.seg__btn:first-child{border-left:0}
.seg__btn.seg__on{background:var(--green);color:#04120a}

/* Rowing setup block (on the Add-asset modal) */
.rig-setup{margin-top:6px;padding-top:12px;border-top:1px dashed var(--line2);display:flex;flex-direction:column;gap:12px}
.rig-setup .seg{align-self:flex-start}

/* Fixed-at-creation static fields (class / rig side on rowing boats) */
.field--locked .field__set{color:var(--faint);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.field__fixed{background:var(--bg);border:1px dashed var(--line2);border-radius:9px;color:var(--text);font-size:14px;font-weight:600;padding:8px 10px}

/* Sold / retired (archived, not deleted) */
.sold-badge{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:rgba(239,83,80,.16);color:var(--red);font-size:10.5px;font-weight:800;letter-spacing:.4px;vertical-align:middle}
.card-chip{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:rgba(52,199,89,.14);color:var(--green);font-size:10.5px;font-weight:700;vertical-align:middle;white-space:nowrap}
/* "What's new" update summary (gear → Updates) — visible to all users */
.whatsnew{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm,10px);padding:12px 14px}
.wn-toggle{margin-top:10px}
.wn-history{margin-top:4px}
.wn-title{font-weight:800;font-size:15px;margin-bottom:4px}
.wn-sub{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:12px 0 6px;font-weight:700}
.wn-entry{border-left:2px solid var(--line2);padding:1px 0 1px 11px;margin:0 0 10px}
.wn-entry--lead{border-left-color:var(--green)}
.wn-head{display:flex;align-items:baseline;gap:10px;margin-bottom:3px;flex-wrap:wrap}
.wn-ver{font-weight:800;color:var(--blue);font-size:13.5px}
.wn-entry--lead .wn-ver{color:var(--green)}
.wn-date{color:var(--muted);font-size:12px}
.wn-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.wn-list li{font-size:12.5px;line-height:1.45;color:var(--muted)}
.wn-entry--lead .wn-list li{color:var(--text)}
.wn-more{font-size:12px;color:var(--faint);margin-top:2px;font-style:italic}
/* Finances — Home section + the Finances view (pie chart + breakdown) */
.view-title--sub{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.finrow{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:linear-gradient(180deg,var(--bg2),var(--panel));border:1px solid var(--line);border-radius:var(--radius-sm,12px);padding:14px 16px;cursor:pointer}
.finrow:hover{border-color:rgba(52,199,89,.5)}
.finrow--locked{opacity:.7}
.finrow__emo{font-size:26px;flex:0 0 auto}
.finrow__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.finrow__name{font-weight:800;font-size:16px}
.finrow__sub{color:var(--muted);font-size:12.5px}
.finrow__amt{flex:0 0 auto;text-align:right;font-weight:800;font-size:18px;color:var(--green);font-variant-numeric:tabular-nums;display:flex;flex-direction:column;line-height:1.15}
.finrow__amt small{color:var(--muted);font-size:11px;font-weight:600}
.fin-top{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin:10px 0}
.fin-pie{flex:0 0 auto}
.fin-pie svg{display:block}
.fin-legend{flex:1 1 200px;min-width:180px;display:flex;flex-direction:column;gap:7px}
.fin-lg{display:flex;align-items:center;gap:9px;font-size:13.5px}
.fin-sw{width:14px;height:14px;border-radius:3px;flex:0 0 auto}
.fin-nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fin-lg .fin-amt{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:600}
.fin-total{margin:10px 0 4px;font-size:15px;font-weight:700}
.fin-total b{color:var(--green)}
.fin-actions{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.assetCard--sold{opacity:.62}
.assetCard--sold .assetCard__icon{filter:grayscale(.7)}
.asset-list--sold{opacity:.95}
.soldlink{display:block;width:100%;text-align:left;margin-top:14px;padding:11px 14px;background:var(--panel);border:1px dashed var(--line2);border-radius:var(--radius-sm);color:var(--muted);font-weight:600;font-size:13.5px;cursor:pointer}
.soldlink:hover{border-color:var(--faint);color:var(--text)}
.view-head--sub{margin-top:18px;margin-bottom:2px}
.view-title--sold{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.sold-banner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:10px 13px;
  background:linear-gradient(180deg,rgba(239,83,80,.10),rgba(239,83,80,.04));border:1px solid var(--red);border-radius:var(--radius-sm)}
.sold-banner__tag{flex:0 0 auto;padding:2px 9px;border-radius:999px;background:var(--red);color:#fff;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.sold-banner__txt{color:var(--text);font-size:13px;line-height:1.4}
.sold-banner__txt b{color:var(--text)}

/* ===== Scannable rigger tag (per seat) ===== */
.rig__tag{margin-top:10px;border-top:1px dashed var(--line2);padding-top:9px}
.rig__taglbl{display:block;color:var(--muted);font-size:11.5px;font-weight:600;margin-bottom:5px}
.rig__taglbl i{color:var(--faint);font-style:normal;font-weight:500}
.rig__tagrow{display:flex;gap:8px;align-items:center}
.rig__tagcode{flex:1;min-width:0;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);font-size:14px;padding:7px 9px;font-variant-numeric:tabular-nums}
.rig__tagcode:focus{outline:none;border-color:var(--blue-d)}
/* Unify the asset-detail control inputs onto the grey surface + green focus that
   matches the dropdowns (and fixes the oar sticker inputs that were rendering white). */
.rig__f input, .seat__name, .rig__tagcode, .oar__name, .oar__code {
  background:#3a3f45; border:1px solid rgba(52,199,89,.30); border-radius:8px; color:var(--text);
  font-size:14px; padding:8px 10px;
}
.rig__f input:focus, .seat__name:focus, .rig__tagcode:focus, .oar__name:focus, .oar__code:focus {
  outline:none; border-color:#34C759;
}
.oar__name::placeholder, .oar__code::placeholder, .rig__f input::placeholder { color:var(--faint) }
/* Flash a rigger/seat when opened by scanning its tag */
.seat--flash{animation:seatflash 2.2s ease}
@keyframes seatflash{
  0%{box-shadow:0 0 0 0 rgba(79,195,247,0);border-color:var(--line)}
  12%{box-shadow:0 0 0 4px rgba(79,195,247,.5);border-color:var(--blue)}
  100%{box-shadow:0 0 0 0 rgba(79,195,247,0);border-color:var(--line)}
}

/* ===== Bottom Save bar (asset detail) ===== */
.savebar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px;padding:13px 15px;
  background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm)}
.savebar--setup{background:linear-gradient(180deg,rgba(79,195,247,.10),rgba(79,195,247,.03));border-color:var(--blue-d)}
.savebar--top{margin:14px 0 16px;padding:10px 14px;justify-content:flex-end}
.savebar__txt{flex:1;min-width:200px;display:flex;flex-direction:column;gap:2px}
.savebar__txt b{font-size:14px}
.savebar__txt span{color:var(--muted);font-size:12.5px;line-height:1.4}
.savebar__btn{flex:0 0 auto}
.savebar--setup .savebar__btn{padding:11px 18px;font-size:14px}

/* ===== Read-only note (view-only roles) ===== */
.note-ro{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 13px;line-height:1.5;white-space:pre-wrap}
.note-ro__by{display:block;margin-top:7px;color:var(--faint);font-size:12px;font-style:italic}

/* ===== Unknown sticker → create / attach ===== */
.assign-code{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 12px;font-size:13px;color:var(--muted)}
.assign-code b{color:var(--blue)}
.assign-or__sep{display:flex;align-items:center;text-align:center;color:var(--faint);font-size:12px;margin:14px 0 10px}
.assign-or__sep::before,.assign-or__sep::after{content:"";flex:1;height:1px;background:var(--line)}
.assign-or__sep span{padding:0 12px}

/* ===== No-typing sign-in (tap your job) ===== */
.who-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.who{display:flex;flex-direction:column;gap:3px;text-align:left;border:1px solid var(--line);background:var(--bg2);border-radius:var(--radius-sm);padding:12px 13px}
.who:hover{border-color:var(--blue-d);background:rgba(79,195,247,.07)}
.who:active{transform:translateY(1px)}
.who--admin{border-color:rgba(255,183,77,.4);background:linear-gradient(180deg,rgba(255,183,77,.08),var(--bg2))}
.who--admin:hover{border-color:var(--orange-d)}
.who__name{font-weight:700;font-size:15px}
.who__role{color:var(--muted);font-size:12px}
.whoami{display:flex;flex-direction:column;gap:2px;margin:0 0 12px}
.whoami__name{font-weight:700;font-size:16px}
.whoami__role{color:var(--muted);font-size:12.5px}
.whoami__user{color:var(--muted);font-size:12.5px;margin:-8px 0 12px}
.whoami__user b{color:var(--text)}

/* ===== People manager (per-database) ===== */
.prow{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.prow__name{flex:1;min-width:0;font-weight:600;display:flex;align-items:center;gap:8px}
.prow__tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--orange);background:rgba(255,183,77,.14);border-radius:5px;padding:2px 6px}
.prow__tag--lock{color:var(--faint);background:rgba(154,162,171,.14)}
.prow--locked{opacity:.7}
.prow--locked select{opacity:.6;cursor:not-allowed}
.prow select{background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);padding:6px 8px;font-size:13px}
.prow-add{margin-top:8px;border-top:1px solid var(--line);padding-top:6px}

/* ===== Asset-type (class) manager ===== */
.crow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 0;border-bottom:1px solid var(--line)}
.crow__emo{font-size:22px;flex:0 0 auto;width:30px;text-align:center}
.crow__main{flex:1 1 140px;min-width:0}
.crow__actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crow__name{font-weight:700}
.crow__meta{color:var(--faint);font-size:11.5px}
.crow-add{margin-top:8px;border-top:1px solid var(--line);padding-top:6px}
.crow--muted{opacity:.62}
.pa-job{margin-bottom:14px}
.pa-job__head{font-weight:700;margin:12px 0 4px;color:var(--text)}
.pa-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}
.pa-row__name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pa-row--def{background:rgba(255,255,255,.03);border-radius:8px;padding-left:8px;padding-right:8px}
.pa-row--def .pa-row__name{color:var(--muted);font-style:italic}
.signin-gate{max-width:420px;margin:12vh auto 0;text-align:center;padding:28px 20px;
  background:linear-gradient(180deg,var(--bg2),var(--panel));border:1px solid var(--line);border-radius:var(--radius)}
.signin-gate__icon{font-size:40px;line-height:1}
.signin-gate__title{font-size:20px;font-weight:800;margin:10px 0 6px}
.signin-gate__sub{color:var(--muted);font-size:13.5px;line-height:1.5;margin-bottom:16px}
.pa-row select{flex:0 0 auto}
.pa-fixed{flex:0 0 auto;color:var(--green);font-size:12.5px;font-weight:600}
/* People & access hub — person-centric cross-database manager (Server Admin) */
.hub__search{width:100%;margin:0 0 12px;padding:10px 12px;background:#3a3f45;color:var(--text);
  border:1px solid var(--line);border-radius:10px;font-size:14px}
.hub__list{display:flex;flex-direction:column;gap:12px}
.hubcard{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:12px 12px 10px}
.hubcard__head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.hubcard__name{font-weight:800;font-size:15px}
.hubcard__count{color:var(--muted);font-size:12px}
.hubcard__lock{margin-left:auto;color:var(--green);font-size:11.5px;font-weight:700;
  border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap}
.hubrow{display:flex;align-items:center;gap:10px;padding:5px 0}
.hubrow__db{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
.hubrow--add{border-top:1px dashed var(--line);margin-top:6px;padding-top:9px;flex-wrap:wrap}
.hubcard__foot{margin-top:8px;text-align:right}
.hub__role{flex:0 0 auto;max-width:62%;background:#3a3f45;color:var(--text);
  border:1px solid var(--line);border-radius:8px;padding:7px 9px;font-size:13px}
.hub__newname{flex:1 1 140px;min-width:120px;padding:9px 11px;background:#3a3f45;color:var(--text);
  border:1px solid var(--line);border-radius:9px;font-size:14px}
/* Access-level dropdowns: grey background, colour-coded text so the level is
   readable at a glance — green = Read & write, orange = Read + notes,
   amber = Visible only, red = Not visible. */
.pa-access{flex:0 0 auto;background:#3a3f45;border:1px solid var(--line);border-radius:8px;
  padding:6px 10px;font-size:13px;font-weight:700;min-width:140px;
  -webkit-appearance:none;appearance:none;cursor:pointer}
.pa-access--write{color:#34C759;border-color:rgba(52,199,89,.5)}
.pa-access--read{color:#FFB74D;border-color:rgba(255,183,77,.5)}
.pa-access--visible{color:#FFD24D;border-color:rgba(255,210,77,.45)}
.pa-access--none{color:#FF5252;border-color:rgba(255,82,82,.5)}
/* Colour the menu items too (honoured by most desktop browsers). */
.pa-opt{background:#3a3f45;font-weight:700}
.pa-opt--write{color:#34C759}
.pa-opt--read{color:#FFB74D}
.pa-opt--visible{color:#FFD24D}
.pa-opt--none{color:#FF5252}
/* ===== Consistent grey + green dropdowns (match the rigger-build / access ones) ===== */
.form-row select, .prow select, .oarspecs select, .cox__loc {
  background:#3a3f45; color:#34C759; border:1px solid rgba(52,199,89,.5); border-radius:8px;
  padding:9px 11px; font-weight:600; -webkit-appearance:none; appearance:none; cursor:pointer;
}
.form-row select:focus, .prow select:focus, .oarspecs select:focus, .cox__loc:focus { border-color:#34C759; outline:none }
.form-row select option, .prow select option, .oarspecs select option, .cox__loc option { background:#3a3f45; color:#34C759 }
.store-path{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;background:#3a3f45;border:1px solid var(--line);border-radius:8px;padding:8px 10px;color:var(--text);word-break:break-all;margin-bottom:6px}
.store-path--full{background:transparent;border:none;padding:2px 0;color:var(--muted);font-size:11.5px}
.global-apply{margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.backup-list{display:flex;flex-direction:column;gap:8px}
.backup-row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:9px 11px}
.backup-row__main{flex:1;min-width:0}
.backup-row__when{font-weight:600;font-size:13.5px}
.backup-row__meta{font-size:11.5px;color:var(--muted);margin-top:1px}
.backup-row--current{border-color:var(--green);background:rgba(52,199,89,.07)}
/* Service & repair intervals editor */
.ivrow{display:flex;flex-direction:column;gap:6px;padding:9px 0;border-bottom:1px solid var(--line)}
.ivrow__line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ivrow__lbl{color:var(--muted);font-size:12.5px;flex:0 0 auto}
.ivadd{margin-top:6px}
.form-row--emo{display:grid;grid-template-columns:auto 56px auto 1fr;align-items:center;gap:8px;margin-bottom:14px}
.form-row--emo label{margin:0}
.form-row--emo input{width:100%}

/* ===== Asset-type field sections (3 buckets) ===== */
.fsec{border:1px solid var(--line);background:var(--bg2);border-radius:var(--radius-sm);padding:12px 13px;margin-top:12px}
.fsec__head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.fsec__name{font-weight:700;font-size:13px;border-radius:6px;padding:3px 9px}
.fsec__name--setup{color:var(--orange);background:rgba(255,183,77,.14)}
.fsec__name--static{color:var(--blue);background:rgba(79,195,247,.12)}
.fsec__name--dynamic{color:var(--green);background:rgba(52,199,89,.14)}
.fsec__blurb{color:var(--muted);font-size:12px;line-height:1.4;margin-bottom:8px}
.fsec__empty{color:var(--faint);font-size:12.5px;padding:4px 0 8px}
.fsec .frow{padding:8px 0}
.fadd{margin-top:10px;border-top:1px dashed var(--line2);padding-top:10px;display:flex;flex-direction:column;gap:8px}
.fadd .form-row{margin:0}
.fadd__extra{display:flex;flex-direction:column;gap:8px}
.fadd .btn--sm{align-self:flex-start}

/* Very narrow phones (~320px): trim the header controls and header button rows so
   everything fits without a horizontal scroll. Rows still wrap as a safety net. */
@media (max-width:380px){
  .topbar__right{gap:6px}
  .scanBtn{padding:7px 10px;font-size:12.5px}
  .version-pill{padding:2px 7px;font-size:11px}
  .userChip{max-width:48%;font-size:11.5px;padding:4px 8px}
  .view-head .btn{padding:7px 10px;font-size:12.5px}
}

/* ===== Mobile ===== */
@media (max-width:680px){
  .search{display:none}
  .scanBtn span,.scanBtn{font-size:13px}
  .syncBtn{display:none}
  /* Two-row header on phones: brand fills row 1, controls + who-am-I chip
     wrap to row 2 so nothing overlaps the "Asset Tracker" title. */
  .topbar{gap:6px 8px}
  .brand{flex:1 1 100%}
  .userChip{order:2;max-width:62%;font-size:12px;padding:4px 10px}
  .topbar__right{margin-left:auto}
  .home-grid{grid-template-columns:1fr 1fr;gap:10px}
  /* On phones the title keeps the top row with its icon; the sell/delete
     actions (or the admin hint) drop to their own full-width row so the
     boat name can't get squeezed to one letter per line. */
  .dhead{flex-wrap:wrap}
  .dhead__actions{flex-basis:100%;margin-top:2px}
  .statics{grid-template-columns:1fr 1fr}
  .mrow{grid-template-columns:1fr;gap:10px}
  .mrow__right{text-align:left}
  /* Service / repair entry stacks VERTICALLY on phones so every box (value, hrs,
     cost, date, Save) is full-width and clearly visible instead of overflowing. */
  .mrow__entry{flex-direction:column;align-items:stretch}
  .mrow__ent,.mrow__entry input,.mrow__entry .btn{width:100%;flex:1 1 auto}
  .mrow__entry .btn{justify-content:center}
  .form-grid,.catgrid{grid-template-columns:1fr}
  .cost-summary{flex-direction:column;gap:12px}
  .cost-now{flex:0 0 auto;align-self:stretch}
  .repair-summary{gap:8px}
  .rstat{padding:9px 7px}
  .rstat__val{font-size:17px}
  .seat__grid{grid-template-columns:1fr 1fr}
  .who-grid{grid-template-columns:1fr}
  .savebar{flex-direction:column;align-items:stretch}
  .savebar__btn{width:100%;justify-content:center}
  .form-row--emo{grid-template-columns:56px 1fr;gap:8px}
  .form-row--emo label{display:none}
}
/* Keep the "set at creation" panel as a 2-up grid even on the smallest
   phones — these read better side-by-side than stacked in one column. */
@media (max-width:380px){.home-grid{grid-template-columns:1fr}}

/* ---- Unavailable (out of service / shared away): red name + small reason ---- */
.assetCard__why{color:var(--red);font-size:11px;font-weight:600;line-height:1.25;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.dhead__why{color:var(--red);font-size:12px;font-weight:600;margin:2px 0 1px}

/* ---- "Set all riggers the same" — populate box on the rigging card ---- */
.pop{border:1px solid rgba(52,199,89,.35);background:rgba(52,199,89,.06);border-radius:12px;padding:11px 12px;margin:2px 0 14px}
.pop__head{font-weight:700;font-size:13.5px;margin-bottom:2px}
summary.pop__head{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0}
summary.pop__head::-webkit-details-marker{display:none}
summary.pop__head::after{content:"▸";color:var(--green);font-size:12px;transition:transform .15s ease}
.pop[open] summary.pop__head::after{transform:rotate(90deg)}
.pop__body{margin-top:10px}
.pop__hint{color:var(--muted);font-size:11.5px;line-height:1.35;margin-bottom:9px}
.pop__row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 10px;margin-bottom:8px}
.pop__side{min-width:74px;font-weight:700;font-size:12px;color:var(--muted);padding-bottom:8px}
.pop__side--p{color:#FF5252}.pop__side--s{color:#34C759}
.pop__f{display:flex;flex-direction:column;gap:3px;min-width:88px;flex:1 1 88px}
.pop__flbl{font-size:11px;color:var(--muted)}.pop__flbl i{font-style:normal;opacity:.8}
.pop__f input{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:7px 9px;color:var(--text)}

/* ---- Sharing a boat with other teams ---- */
.card--share{border:1px solid rgba(79,195,247,.35);background:rgba(79,195,247,.06)}
.card--share .card__title{color:#4FC3F7}
.share-note{font-size:13px;color:var(--muted);line-height:1.45}
.share-note b{color:var(--text)}
.card-chip--shared{background:rgba(79,195,247,.16);color:#4FC3F7}
.share-row{cursor:pointer}
.share-row input{width:18px;height:18px}