/* The portal shell (Phase 10.4): one frame for every portal in Samana, B "the field frame" (picked Oct 18, 15:49; claude/portal-look.md and
   the design system "Samana portals"). Team (crew and subs), Partner and the Lean floor use it now; Farmmetric (10.6) and Customer next.
   Phone first; on a computer the same parts spread across the width. Each level's colour goes in five places only (--lvl). */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Condensed:wght@600&family=IBM+Plex+Sans:wght@400;500;600&display=swap');
:root{--page:#f4f4f0;--panel:#fff;--ink:#1b211d;--grey:#5c645f;--grey2:#6b726d;--line:#e2e3dd;--line2:#efefea;--today:#c77700;--today-ink:#a35f00;--flag:#b42318;
  --ob-bg:#fff4e0;--ob-line:#f1d39b;--ob-ink:#7a4b00;--done:#3f7d55;--pill:#eef0ea;--lvl:#1d4f91;--lvl-ink:#fff;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--cond:"IBM Plex Sans Condensed","Arial Narrow",system-ui,sans-serif;
  --gut:16px;--gap:12px;color-scheme:light}
body.pt-team{--lvl:#1d4f91}body.pt-partner{--lvl:#e0a106;--lvl-ink:#1b211d}body.pt-lean{--lvl:#c8321f}body.pt-customer{--lvl:#4b5d70}body.pt-fm{--lvl:#1d4a31}
*{box-sizing:border-box}
html,body{margin:0;background:var(--page);color:var(--ink);font:400 15px/1.45 var(--sans);-webkit-text-size-adjust:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--lvl)}body.pt-partner a{color:#7a5600}
.num,.tab{font-variant-numeric:tabular-nums}
/* the top bar (10.9e, the one frame: claude/screens-109.md "FM"): the level's colour fills the bar, the same eight slots on every portal in
   the same places (the mark or word, the one tab, the job or farm picker, search, the Saved slot, the gear, the initials). It never changes
   when the page scrolls: every slot keeps its width whether it has something to say or not. Sign out is in the initials menu. */
.pt-head{position:sticky;top:0;z-index:20;height:56px;background:var(--lvl);color:var(--lvl-ink);display:flex;align-items:center;gap:10px;padding:0 var(--gut);box-shadow:0 1px 0 rgba(0,0,0,.12)}
.pt-mark{flex:none;width:34px;height:34px;border-radius:7px;background:rgba(255,255,255,.16);color:var(--lvl-ink);display:grid;place-items:center;font:600 18px/1 var(--cond)}
body.pt-partner .pt-mark{background:rgba(0,0,0,.1)}
.pt-tab{flex:none;display:flex;align-items:center;height:56px;padding:0 4px;font:600 14px/1 var(--sans);color:var(--lvl-ink);white-space:nowrap;box-shadow:inset 0 -3px 0 var(--lvl-ink)}
.pt-pick{flex:1 1 auto;min-width:0;max-width:420px;display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-height:44px;justify-content:center;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.1);color:var(--lvl-ink);padding:0 10px;text-align:left;cursor:pointer;border-radius:8px}
body.pt-partner .pt-pick{border-color:rgba(0,0,0,.2);background:rgba(255,255,255,.35)}
.pt-pick b{font:600 15px/1.15 var(--cond);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-pick small{font-size:11.5px;opacity:.82;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-gap{flex:1 1 0;min-width:0}
.pt-search{flex:none;display:flex;align-items:center;gap:8px;width:200px;height:38px;padding:0 10px;border:1px solid rgba(255,255,255,.28);border-radius:8px;background:rgba(255,255,255,.1);color:var(--lvl-ink);font:400 13.5px/1 var(--sans);cursor:pointer;text-align:left}
body.pt-partner .pt-search{border-color:rgba(0,0,0,.2);background:rgba(255,255,255,.35)}
.pt-search svg,.pt-gear svg{width:18px;height:18px;flex:none}.pt-search.off{visibility:hidden}
.pt-saved{flex:none;width:118px;font:500 12.5px/1.2 var(--sans);color:var(--lvl-ink);opacity:.92;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-saved.bad{color:#ffd9a8;opacity:1;font-weight:600}body.pt-partner .pt-saved.bad{color:#7a2a00}
.pt-gear{flex:none;width:40px;height:40px;border:0;border-radius:8px;background:none;color:var(--lvl-ink);display:grid;place-items:center;cursor:pointer}
.pt-gear:hover,.pt-search:hover{background:rgba(255,255,255,.18)}
.pt-me{flex:none;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;border:2px solid rgba(255,255,255,.7);font:600 14px/1 var(--sans);cursor:pointer}
.pt-wide-only{display:none}
.pt-menu{position:fixed;right:var(--gut);top:60px;z-index:30;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px -12px rgba(0,0,0,.35);min-width:240px;padding:8px}
.pt-menu p{margin:4px 8px 8px;font-size:13px;color:var(--grey)}.pt-menu p b{display:block;color:var(--ink);font-size:15px}
.pt-menu a,.pt-menu button{display:flex;align-items:center;width:100%;min-height:44px;padding:0 10px;border:0;background:none;border-radius:8px;text-align:left;text-decoration:none;color:var(--ink);cursor:pointer}
.pt-menu a:hover,.pt-menu button:hover{background:var(--page)}.pt-menu select{width:100%;min-height:44px;margin:4px 0;border:1px solid var(--line);border-radius:10px;padding:0 8px;background:var(--panel)}
.pt-jobs{position:fixed;left:var(--gut);right:var(--gut);top:60px;max-width:520px;z-index:30;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px -12px rgba(0,0,0,.35);padding:6px;max-height:70vh;overflow:auto}
.pt-jobs button{display:flex;flex-direction:column;width:100%;min-height:52px;padding:6px 10px;border:0;background:none;border-radius:8px;text-align:left;cursor:pointer}
.pt-jobs button b{font:600 16px/1.15 var(--cond)}.pt-jobs button small{font-size:12px;color:var(--grey)}.pt-jobs button[aria-current="true"]{background:var(--page)}
.pt-jobs button.dash{border:1px dashed var(--line);opacity:.65;margin-top:4px}
/* layout */
.pt-main{padding:14px var(--gut) 110px;display:flex;flex-wrap:wrap;gap:var(--gap);align-items:flex-start}
.pt-work{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:var(--gap)}
.pt-side{flex:1 1 300px;max-width:100%;display:flex;flex-direction:column;gap:var(--gap)}
.pt-rail{display:none}
.pt-cols{display:flex;flex-direction:column;gap:var(--gap)}
/* greeting and banner */
.pt-hi h1{margin:0;font:600 26px/1.1 var(--cond)}.pt-hi p{margin:4px 0 0;color:var(--grey);font-size:13px}
.pt-out{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--ob-line);background:var(--ob-bg);color:var(--ob-ink);border-radius:10px;font-size:14px}
.pt-out button{margin-left:auto}
.pt-out.held{border-color:var(--bad,#b3261e);background:transparent;color:inherit}
.pt-off{padding:8px 12px;border-radius:10px;background:var(--pill);color:var(--grey);font-size:13px}
/* cards */
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}
.card h2{margin:0 0 6px;font:600 20px/1.15 var(--cond)}.card h3{margin:12px 0 6px;font:600 16px/1.2 var(--cond)}
.lbl{font:600 11.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.muted{color:var(--grey);font-size:13px}
.pill{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:999px;background:var(--pill);color:var(--ink);font:600 12.5px/1 var(--sans)}
.pill.go{background:var(--today);color:var(--ink)}.pill.done{background:var(--done);color:#fff}.pill.wait{background:transparent;border:1px dashed var(--line);color:var(--grey)}.pill.flag{background:var(--flag);color:#fff}
.wc-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.wc-top .k{font-size:12.5px;color:var(--grey)}
.wc h2{margin:8px 0 4px}
.wc .facts{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--grey)}
.wc .cnt{margin-top:8px;color:var(--today-ink);font-size:13.5px;font-weight:600}
.ck{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line2);cursor:pointer;min-height:44px}
.ck input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:0;border:2px solid var(--grey);border-radius:6px;background:var(--panel);display:grid;place-items:center;cursor:pointer}
.ck input:checked{background:var(--done);border-color:var(--done)}.ck input:checked::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg) translate(-1px,-1px)}
.ck.is-done span>b{text-decoration:line-through;color:var(--grey2)}.ck small{display:block;color:var(--grey);font-size:12.5px}
.note{background:var(--page);border-radius:8px;padding:8px 10px;font-size:14px;margin-top:8px;white-space:pre-wrap}.note small{display:block;color:var(--grey);font-size:12px}
.wc textarea,.card textarea{width:100%;min-height:64px;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--panel);resize:vertical}
.ph{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.ph img{width:96px;height:72px;object-fit:cover;border-radius:8px;border:1px solid var(--line);cursor:pointer;background:var(--page)}
.ph .unsent{outline:2px dashed var(--ob-line);outline-offset:2px}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);font:600 14.5px/1 var(--sans);cursor:pointer;text-decoration:none}
.btn.main{background:var(--ink);border-color:var(--ink);color:#fff}.btn.big{min-height:48px}.btn:disabled{opacity:.5;cursor:default}
.ask{border-top:3px solid var(--today)}.ask .who{font-size:13px;color:var(--grey);margin:2px 0 8px}
.wbs{display:inline-block;margin-right:6px;padding:0 5px;border:1px solid var(--line);border-radius:4px;background:var(--page);color:var(--grey);font:600 11.5px/1.6 var(--cond);font-variant-numeric:tabular-nums}
body.wbs-off .wbs{display:none}body.wbs-hover .wbs{visibility:hidden}body.wbs-hover *:hover>.wbs,body.wbs-hover *:focus-within>.wbs{visibility:visible}
.tbl{width:100%;border-collapse:collapse;font-size:14px}.tbl th{font:600 11.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--grey);text-align:left;padding:8px 6px;border-bottom:1px solid var(--line)}
.tbl td{padding:8px 6px;border-bottom:1px solid var(--line2);vertical-align:top}.tbl .r{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.tbl-wrap{overflow-x:auto}
.grp-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:14px 0 4px;font:600 16px/1.2 var(--cond)}.grp-h small{font:400 13px var(--sans);color:var(--grey)}
.tot{display:flex;flex-wrap:wrap;gap:10px}.tot div{flex:1 1 130px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.tot span{display:block;font:600 11.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}.tot b{display:block;margin-top:6px;font:600 28px/1 var(--cond);font-variant-numeric:tabular-nums}
.empty{border:1px dashed var(--line);border-radius:12px;padding:18px 14px;color:var(--grey);background:transparent}
.msg{min-height:0;font-size:14px}
.pt-toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);z-index:40;max-width:min(92vw,520px);padding:10px 14px;border-radius:10px;background:var(--ink);color:#fff!important;box-shadow:0 8px 24px -8px rgba(0,0,0,.5)}
.pt-toast.bad{background:var(--flag)}@media (min-width:900px){.pt-toast{bottom:24px}}.msg.ok{color:var(--done)}.msg.bad{color:var(--flag)}
/* the phone's bottom bar, with the level's round photo button raised in the middle */
.pt-bar{position:fixed;left:0;right:0;bottom:0;z-index:25;height:78px;background:var(--panel);border-top:1px solid var(--line);display:flex;align-items:flex-start;justify-content:space-around;padding:6px 4px env(safe-area-inset-bottom)}
.pt-bar button{flex:1 1 0;min-width:44px;min-height:52px;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;font:500 11.5px/1 var(--sans);color:var(--grey);cursor:pointer;position:relative}
.pt-bar button[aria-current="page"]{color:var(--ink);font-weight:600}.pt-bar svg{width:24px;height:24px}
.pt-bar .pt-photo{flex:none;width:60px;height:60px;min-height:60px;margin-top:-22px;border-radius:999px;background:var(--lvl);color:var(--lvl-ink);box-shadow:0 6px 16px -6px rgba(0,0,0,.45)}
.pt-bar .pt-photo svg{width:28px;height:28px}
.pt-bar .pt-plbl{position:absolute;top:63px;left:50%;transform:translateX(-50%);font:500 11.5px/1 var(--sans);color:var(--grey);white-space:nowrap}
.pt-bar .pt-photo[aria-current="page"]{color:var(--lvl-ink)}.pt-bar .pt-photo[aria-current="page"] .pt-plbl{color:var(--ink);font-weight:600}
.pt-bar i{position:absolute;top:2px;right:calc(50% - 20px);min-width:16px;height:16px;border-radius:999px;background:var(--today);color:var(--ink);font:600 10.5px/16px var(--sans);font-style:normal}
#pt-big{position:fixed;inset:0;background:#000;display:none;align-items:center;justify-content:center;z-index:50}#pt-big.on{display:flex}#pt-big img{max-width:100%;max-height:100%}
@media (min-width:900px){
  :root{--gut:20px;--gap:14px}
  .pt-wide-only{display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--grey)}
  .pt-bar{display:none}
  .pt-shell{display:flex;align-items:flex-start;gap:var(--gap);padding:14px var(--gut) 40px}
  .pt-rail{display:flex;flex-direction:column;gap:2px;flex:none;width:224px;position:sticky;top:calc(70px + var(--pin-h,0px));background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:8px}
  .pt-rail button{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border:0;background:none;border-radius:8px;text-align:left;font:500 14px/1 var(--sans);color:var(--ink);cursor:pointer}
  .pt-rail button svg{width:20px;height:20px;color:var(--grey)}
  .pt-rail button[aria-current="page"]{background:var(--lvl);color:var(--lvl-ink)}.pt-rail button[aria-current="page"] svg{color:inherit}
  .pt-rail .pt-railphoto{margin-top:10px;border:1px solid var(--line)}
  .pt-main{flex:1 1 auto;padding:0;min-width:0}
  .pt-cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:var(--gap)}
  .pt-hi h1{font-size:28px}
  .pt-side{flex:0 1 340px}
}
@media print{.pt-head,.pt-bar,.pt-rail,.pt-side,.pt-out,.no-print,.acts,.ph button{display:none!important}body{background:#fff}.pt-main,.pt-shell{padding:0}.card{break-inside:avoid;border-color:#999}
  .ck input:checked{background:none;border-color:#000}.ck input:checked::after{display:none}}
/* ---------------------------------------------------------------- 10.9e: the one frame's parts, shared by every portal */
/* the pinned bar under the top bar: the job line, one row of tiles, the strip, the legend with the cog. Slims to one line on scroll. */
.pt-pin{position:sticky;top:56px;z-index:15;background:var(--panel);border-bottom:1px solid var(--line);padding:10px var(--gut) 8px}
.pt-pin:empty{display:none}
.pp-line{display:flex;align-items:center;gap:10px;min-width:0}
.pp-line h1{margin:0;font:600 20px/1.15 var(--cond);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pp-sub{color:var(--grey);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pp-pill{flex:none;display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:999px;background:var(--pill);font:600 12px/1 var(--sans);white-space:nowrap}
.pp-right{margin-left:auto;flex:none;font-size:12.5px;color:var(--grey);white-space:nowrap;text-align:right}
.pp-tiles{display:flex;gap:0;margin-top:8px;border:1px solid var(--line);border-radius:10px;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.pp-tile{flex:1 0 118px;min-width:118px;padding:8px 10px;border-left:1px solid var(--line);position:relative;text-align:left;background:none;border-top:0;border-right:0;border-bottom:0;font:inherit;color:inherit}
.pp-tile:first-child{border-left:0}
.pp-tile[data-tile]{cursor:pointer}.pp-tile[data-tile]:hover{background:var(--page)}
.pp-tile::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tc,transparent)}
.pp-tile span{display:block;font:600 11px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--grey);white-space:nowrap}
.pp-tile b{display:block;margin-top:5px;font:600 21px/1 var(--cond);font-variant-numeric:tabular-nums;white-space:nowrap}
.pp-tile small{display:block;margin-top:3px;font-size:12px;color:var(--grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-tile.red b{color:var(--flag)}.pp-tile.amber b{color:var(--today-ink)}
.pp-strip{position:relative;height:14px;margin-top:8px;border-radius:4px;background:var(--pill);overflow:hidden}
.pp-strip i{position:absolute;top:0;bottom:0;cursor:pointer}.pp-strip i.done{opacity:.4}
.pp-strip b{position:absolute;top:-2px;bottom:-2px;width:0;border-left:2px dashed var(--ink)}
.pp-axis{display:flex;justify-content:space-between;font-size:11px;color:var(--grey);margin-top:2px}
.pp-legend{display:flex;align-items:center;gap:10px;margin-top:6px;font-size:12px;color:var(--grey);min-width:0}
.pp-key{display:flex;flex-wrap:wrap;gap:4px 12px;min-width:0}.pp-key span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.pp-key i{width:10px;height:10px;border-radius:2px;display:inline-block}.pp-key i.today{width:0;height:12px;border-left:2px dashed var(--ink);border-radius:0}
.pp-cog{margin-left:auto;flex:none;display:flex;align-items:center;gap:8px;white-space:nowrap}
.pp-cog button{width:34px;height:34px;border:1px solid var(--line);border-radius:8px;background:var(--panel);cursor:pointer;display:grid;place-items:center;color:var(--ink)}
.pp-cog svg{width:18px;height:18px}
.pp-pick{position:absolute;right:var(--gut);z-index:30;margin-top:4px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px -12px rgba(0,0,0,.35);padding:10px 12px;min-width:240px}
.pp-pick label{display:flex;align-items:center;gap:8px;min-height:36px;font-size:14px;cursor:pointer}
.pp-pick .chip{font-size:12px;color:var(--grey);margin:6px 0 0}
.pt-pin.slim{padding-top:6px;padding-bottom:6px}
.pt-pin.slim .pp-tiles,.pt-pin.slim .pp-legend,.pt-pin.slim .pp-axis,.pt-pin.slim .pp-sub,.pt-pin.slim .pp-right{display:none}
.pp-fold{display:none}
.pt-pin.slim .pp-line h1{font-size:16px}.pt-pin.slim .pp-strip{height:8px;margin-top:5px}
/* sections as drop-downs, the same header everywhere: an 8 px stripe, ▸ that turns, the title, the roll-up, a tag on the right */
.dd{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;width:100%}
.dd-h{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:8px 14px 8px 0;border:0;background:none;text-align:left;cursor:pointer;font:inherit;color:inherit}
.dd-h::before{content:"";align-self:stretch;flex:none;width:8px;background:var(--stripe,var(--line))}
.dd-h .ar{flex:none;width:14px;color:var(--grey);transition:transform .15s}.dd.open .dd-h .ar{transform:rotate(90deg)}
.dd-t{flex:none;font:600 19px/1.15 var(--cond);white-space:nowrap}
.dd-r{flex:1 1 auto;min-width:0;color:var(--grey);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dd-tag{flex:none;display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:999px;background:var(--pill);font:600 12.5px/1 var(--sans)}
.dd-tag.red{background:var(--flag);color:#fff}.dd-tag.amber{background:var(--today);color:var(--ink)}.dd-tag.green{background:var(--done);color:#fff}
.dd-b{display:none;padding:2px 14px 14px 22px;border-top:1px solid var(--line2)}.dd.open .dd-b{display:block}
.dd-b>.pt-cols{margin-top:10px}
.pt-dds{display:flex;flex-direction:column;gap:10px;width:100%}
/* the left list's two tools (the pin, «) and its three states: pinned, auto-hide (an 18 px strip), hidden (a 22 px » tab) */
.pt-railtools{display:flex;justify-content:flex-end;gap:2px;margin:-2px -2px 4px}
.pt-railtools button{width:30px;height:30px;min-height:30px!important;padding:0!important;justify-content:center;border-radius:6px!important;color:var(--grey)!important}
.pt-railtools button[aria-pressed="true"]{color:var(--ink)!important}
.pt-railtools svg{width:16px!important;height:16px!important}
.pt-rail button span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-rail .pt-cnt{margin-left:auto;flex:none;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:var(--pill);color:var(--ink);font:600 11.5px/20px var(--sans);text-align:center;font-style:normal}
.pt-rail .pt-cnt.red{background:var(--flag);color:#fff}.pt-rail .pt-cnt.amber{background:var(--today)}.pt-rail .pt-cnt.dot{min-width:10px;width:10px;height:10px;padding:0;background:var(--flag)}
.pt-rail button[aria-current="page"] .pt-cnt{background:rgba(255,255,255,.25);color:inherit}
.pt-rail .lbl{display:block;margin:12px 10px 4px}
.pt-railtab{display:none}
.pt-rail .pt-railphoto{border-radius:999px!important;background:var(--lvl)!important;color:var(--lvl-ink)!important;justify-content:center;min-height:48px!important}
.pt-rail .pt-railphoto svg{color:inherit!important}
/* Settings, the 3B side panel: slides in from the right over the page, which stays behind a light veil */
.pt-veil{position:fixed;inset:0;z-index:60;background:rgba(27,33,29,.28)}
.pt-set{position:fixed;top:0;right:0;bottom:0;z-index:61;width:min(680px,100%);background:var(--panel);box-shadow:-12px 0 40px -16px rgba(0,0,0,.4);display:flex;flex-direction:column}
.pt-set header{display:flex;align-items:center;gap:10px;min-height:56px;padding:0 12px 0 18px;border-bottom:1px solid var(--line);background:var(--lvl);color:var(--lvl-ink)}
.pt-set header h2{margin:0;font:600 20px/1 var(--cond);flex:1}
.pt-set header button{width:40px;height:40px;border:0;background:none;color:inherit;font-size:22px;cursor:pointer;border-radius:8px}
.pt-set .sb{display:flex;flex:1;min-height:0}
.pt-set nav{flex:none;width:200px;border-right:1px solid var(--line);padding:10px 8px;overflow:auto;background:var(--page)}
.pt-set nav .lbl{display:block;margin:10px 8px 4px}
.pt-set nav button{display:flex;align-items:center;width:100%;min-height:40px;padding:0 10px;border:0;border-radius:8px;background:none;text-align:left;cursor:pointer;font:500 14px/1.2 var(--sans);color:var(--ink)}
.pt-set nav button[aria-current="true"]{background:var(--panel);box-shadow:inset 3px 0 0 var(--lvl);font-weight:600}
.pt-set .sc{flex:1;min-width:0;overflow:auto;padding:16px 18px 30px}
.pt-set .sc h3{margin:0 0 4px;font:600 20px/1.15 var(--cond)}
.pt-set .row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 0;border-top:1px solid var(--line2)}
.pt-set .row>div:first-child{flex:1 1 220px;min-width:0}.pt-set .row b{display:block}.pt-set .row small{display:block;color:var(--grey);font-size:12.5px}
.pt-set .chip{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;background:var(--pill);color:var(--grey);font:600 11.5px/1 var(--sans);margin-left:6px;vertical-align:middle}
.pt-set .chip.ok{background:#e3efe6;color:var(--done)}.pt-set .chip.bad{background:#fbe4e1;color:var(--flag)}
.pt-set .why{font-size:12.5px;color:var(--grey);margin-top:4px}
.pt-set .danger{border:1px solid #f2c9c3;border-radius:12px;padding:12px 14px;margin-top:14px;background:#fffafa}
.pt-set .danger .btn{border-color:var(--flag);color:var(--flag)}
.pt-set .foot{border-top:1px solid var(--line);padding:10px 18px;font-size:12.5px;color:var(--grey)}
.pt-set .seg{display:flex;gap:6px;flex-wrap:wrap}.pt-set .seg button{min-height:40px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font:600 13.5px var(--sans);cursor:pointer}
.pt-set .seg button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.pt-set .back{display:none}
/* search: a sheet under the top bar */
.pt-find{position:fixed;top:60px;left:50%;transform:translateX(-50%);z-index:30;width:min(560px,calc(100% - 24px));max-height:70vh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px -12px rgba(0,0,0,.35);padding:10px}
.pt-find input{width:100%;min-height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font-size:15px}
.pt-find .hit{display:flex;flex-direction:column;align-items:flex-start;width:100%;min-height:48px;padding:6px 10px;border:0;border-top:1px solid var(--line2);background:none;text-align:left;cursor:pointer;font:inherit;color:inherit}
.pt-find .hit small{color:var(--grey);font-size:12.5px}.pt-find .none{color:var(--grey);font-size:13.5px;padding:10px}
/* worked-out numbers are shaded and bold, with no border (screens-109: on every screen) */
.wo{background:#e6ecf5;font-weight:600;border-radius:6px;padding:2px 8px;font-variant-numeric:tabular-nums}
@media (min-width:900px){
  .pt-shell{padding-top:14px}
  body.rail-auto .pt-rail{position:fixed;left:0;top:calc(56px + var(--pin-h,0px));bottom:0;z-index:12;border-radius:0 12px 12px 0;transform:translateX(calc(-100% + 18px));transition:transform .15s;overflow:auto}
  body.rail-auto .pt-rail:hover,body.rail-auto .pt-rail:focus-within{transform:none}
  body.rail-auto .pt-rail::after{content:"»";position:absolute;right:3px;top:12px;color:var(--grey);font-size:14px}
  body.rail-auto .pt-rail:hover::after,body.rail-auto .pt-rail:focus-within::after{display:none}
  body.rail-auto .pt-shell{padding-left:calc(var(--gut) + 18px)}
  body.rail-hide .pt-rail{display:none}
  body.rail-hide .pt-railtab{display:grid;place-items:center;position:fixed;left:0;top:calc(70px + var(--pin-h,0px));z-index:12;width:22px;height:44px;border:1px solid var(--line);border-left:0;border-radius:0 8px 8px 0;background:var(--panel);cursor:pointer;color:var(--grey)}
}
/* on a phone (under about 700 px): the top bar keeps the word, the picker and the initials; search, Saved and the gear go into the
   initials menu (screens-109 "On a phone", rule 1). The pinned bar is full width, its tiles one line that scrolls sideways. */
@media (max-width:700px){
  .pt-head{height:52px;gap:8px}.pt-pin{top:52px}
  .pt-tab,.pt-search,.pt-saved,.pt-gear{display:none}
  .pt-pick{max-width:none}
  .pp-line h1,.pp-sub,.pp-right{display:none}.pp-pill{margin-right:auto}
  .pp-tile{flex:1 0 76px;min-width:76px}.pp-tile small{display:none}.pp-tile b{font-size:18px;overflow:hidden;text-overflow:ellipsis}.pp-tile[data-tile="next"] b{font-size:15px;line-height:21px}
  .pp-tile span{font-size:0;letter-spacing:0}.pp-tile span::after{content:attr(data-s);font:600 10.5px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase}
  .pp-tile[data-tile="plants"],.pp-tile[data-tile="week"],.pp-tile[data-tile="records"]{display:none}
  .pp-tile[data-tile="look"]{order:2}.pp-tile[data-tile="crew"]{order:3}.pp-tile[data-tile="next"]{order:4}.pp-tile[data-tile="unsent"]{order:5}
  .pp-key,.pp-cog>span{display:none}.pp-axis{display:none}
  .pp-fold{display:block;flex:1 1 auto;min-width:0;border:0;background:none;padding:0;text-align:left;font:400 12px/1.3 var(--sans);color:var(--grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
  .pt-set nav{width:100%;border-right:0}.pt-set .sb.in nav{display:none}.pt-set .sb:not(.in) .sc{display:none}
  .pt-set .back{display:inline-flex}
  .dd-b{padding-left:14px}
}
/* no left list (Farmmetric): the bottom bar on a computer too, centred; its badges small numbers on the icons */
.pt-bar i.dot{min-width:10px;width:10px;height:10px;top:4px;background:var(--flag)}.pt-bar i.red{background:var(--flag);color:#fff}
@media (min-width:900px){
  body.no-rail .pt-bar{display:flex;left:50%;right:auto;width:min(620px,100%);transform:translateX(-50%);border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;box-shadow:0 -6px 20px -14px rgba(0,0,0,.35)}
  body.no-rail .pt-shell{padding-bottom:110px}body.no-rail .pt-main{padding-bottom:0}
  body.no-rail .pt-toast{bottom:96px}
}
/* the weather: a link out to a forecast elsewhere (Farmmetric keeps no weather of its own) */
.pp-wx{flex:none;display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 10px;border:1px solid var(--line);border-radius:999px;font:600 12.5px/1 var(--sans);color:var(--ink);text-decoration:none;white-space:nowrap}
.pp-wx:hover{background:var(--page)}
@media print{.pt-pin,.pt-railtab,.pt-veil,.pt-set,.pt-find{display:none!important}.dd .dd-b{display:block!important}.dd-h .ar{display:none}}
