/* Generated by scripts/build-web.mjs from the Oh! Thyme prototype. Console additions live in console.css. */
:root{--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--mono:'SF Mono',ui-monospace,Menlo,Consolas,monospace;--r:8px;--r-lg:14px;--pill:999px;--ease:cubic-bezier(.22,1,.36,1)}
:root[data-theme="dark"]{--page:#0C0F0D;--side:#101411;--surface:#151A17;--surface2:#1B211D;--surface3:#242C27;--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--ink:#EEF2EE;--ink2:#AEB8B0;--ink3:#7F8A82;--brand:#7CC99A;--brand-ink:#08140D;--fill:#3E7B57;--fill-hi:#468A62;--on-fill:#FFFFFF;--brand-weak:rgba(124,201,154,.12);--glow:rgba(62,123,87,.22);--glow2:rgba(60,90,140,.14);--green:#6FD39A;--green-weak:rgba(111,211,154,.13);--amber:#F2B04A;--amber-weak:rgba(242,176,74,.14);--red:#FF7B72;--red-weak:rgba(255,123,114,.13);--blue:#7DB8F2;--blue-weak:rgba(125,184,242,.13);--violet:#B9A2FF;--violet-weak:rgba(185,162,255,.14);--shadow:0 1px 0 rgba(255,255,255,.04) inset,0 10px 30px rgba(0,0,0,.4);--scrim:rgba(3,5,4,.6);--glass:rgba(24,30,26,.55);--glass-strong:rgba(18,23,20,.92);--glass-edge:rgba(255,255,255,.09);--glass-hi:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(255,255,255,.03);--sh-float:var(--glass-hi),0 1px 1px rgba(0,0,0,.30),0 14px 40px rgba(0,0,0,.45);--preview:#FFFFFF;--preview-ink:#14181F}
:root[data-theme="light"]{--page:#F3F5F2;--side:#FAFBF9;--surface:#FFFFFF;--surface2:#F6F8F5;--surface3:#ECF0EB;--line:rgba(20,40,28,.10);--line2:rgba(20,40,28,.18);--ink:#121813;--ink2:#47524A;--ink3:#6D786F;--brand:#2F6B48;--brand-ink:#FFFFFF;--fill:#3E7B57;--fill-hi:#346A4A;--on-fill:#FFFFFF;--brand-weak:#E5F1E9;--glow:rgba(62,123,87,.14);--glow2:rgba(60,90,140,.07);--green:#177A4B;--green-weak:#E3F3EA;--amber:#9A5A08;--amber-weak:#FCEFD9;--red:#C2362B;--red-weak:#FBE8E5;--blue:#1E6A93;--blue-weak:#E4F1F8;--violet:#6B47B5;--violet-weak:#EFE9FA;--shadow:0 1px 2px rgba(20,40,28,.05),0 6px 20px rgba(20,40,28,.07);--scrim:rgba(12,20,15,.3);--glass:rgba(255,255,255,.6);--glass-strong:rgba(255,255,255,.92);--glass-edge:rgba(20,40,28,.12);--glass-hi:inset 0 1px 0 rgba(255,255,255,.9),inset 0 0 0 1px rgba(255,255,255,.3);--sh-float:var(--glass-hi),0 1px 1px rgba(20,40,28,.04),0 12px 36px rgba(20,40,28,.10);--preview:#FFFFFF;--preview-ink:#14181F}
*{box-sizing:border-box}html,body{margin:0}
body{font:15px/1.5 var(--font);color:var(--ink);background:radial-gradient(70vmax 55vmax at 0% 0%,var(--glow),transparent 70%) fixed,radial-gradient(60vmax 50vmax at 100% 100%,var(--glow2),transparent 70%) fixed,var(--page);-webkit-font-smoothing:antialiased;min-height:100vh}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}
h1,h2,h3,h4{margin:0;text-wrap:wrap}p{margin:0;text-wrap:wrap}
a{color:var(--brand)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
[hidden]{display:none!important}
svg.i{width:16px;height:16px;flex:none}

/* shell */
.app{display:grid;grid-template-columns:264px minmax(0,1fr);min-height:100vh;align-items:start}
.side{position:sticky;top:12px;margin:12px 0 12px 12px;max-height:calc(100vh - 24px);padding:12px 8px 8px;display:flex;flex-direction:column;gap:2px;background:var(--glass);border:1px solid var(--glass-edge);border-radius:22px;box-shadow:var(--sh-float);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);overflow:auto;z-index:30}
.switcher{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;border:1px solid transparent;background:none;text-align:left;width:100%;margin-bottom:10px}
.switcher:hover{background:var(--surface2);border-color:var(--line)}
.tlogo{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:750;font-size:15px;background:linear-gradient(135deg,#2E9E66,#166039);color:#fff;flex:none}
.switcher b{display:block;font-size:14.5px;line-height:1.2}.switcher .tx span{font-size:12px;color:var(--ink3)}
.switcher .chev{margin-left:auto;color:var(--ink3)}
.grp{font-size:11.5px;color:var(--ink3);padding:14px 10px 4px;letter-spacing:.02em}
.nav{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:8px;color:var(--ink2);font-size:14px;border:0;background:none;text-align:left;width:100%;text-decoration:none}
.nav:hover{background:var(--surface2);color:var(--ink)}
.nav.on{background:var(--brand-weak);color:var(--ink)}.nav.on svg{color:var(--brand)}
.nav .badge{margin-left:auto;font-size:11.5px;font-weight:650;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--fill);color:var(--on-fill);display:grid;place-items:center}
.nav .own{margin-left:auto;font-size:11px;color:var(--ink3)}
.me{margin-top:12px;display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--surface);width:100%;text-align:left}
.me:hover{border-color:var(--line2)}
.me b{display:block;font-size:13.5px}.me .tx span{font-size:12px;color:var(--ink3)}
.av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:700;background:var(--surface3);color:var(--ink);flex:none}
.av.sm{width:26px;height:26px;font-size:10px;box-shadow:0 0 0 2px var(--page)}
.avs{display:inline-flex;vertical-align:middle}.avs .av{margin-left:-6px}.avs .av:first-child{margin-left:0}
.main{min-width:0;padding:0 24px 120px 20px}
.top{position:sticky;top:12px;z-index:20;display:flex;align-items:center;gap:12px;margin:12px 0 0;padding:8px 8px 8px 18px;background:var(--glass);border:1px solid var(--glass-edge);border-radius:22px;box-shadow:var(--sh-float);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%)}
.crumbs{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink3);min-width:0;flex-wrap:wrap}
.crumbs a{color:var(--ink3);text-decoration:none}.crumbs a:hover{color:var(--ink)}
.crumbs b{color:var(--ink);font-weight:550}
.search{margin-left:auto;display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink3);border-radius:var(--pill);padding:6px 8px 6px 12px;font-size:13px;min-width:240px}
.search:hover{border-color:var(--line2);color:var(--ink2)}
.search kbd{margin-left:auto;font-family:var(--font);font-size:11px;border:1px solid var(--line2);border-radius:5px;padding:0 5px}
.btn.menubtn{display:none}
.sample{display:flex;align-items:center;gap:10px;margin-top:16px;padding:6px 6px 6px 14px;border-radius:10px;background:var(--brand-weak);color:var(--ink2);font-size:13px}
.sample b{color:var(--brand)}.sample .sr{margin-left:auto;display:flex;align-items:center;gap:4px}.sample .sr .btn.sm{border-color:color-mix(in srgb,var(--brand) 45%,transparent);background:transparent}.sample .t3{display:none}.sample .btn{margin-left:auto}

/* page head */
.ph{display:flex;align-items:flex-end;gap:16px;margin:24px 0 18px;flex-wrap:wrap}
.ph h1{font-size:26px;font-weight:680;letter-spacing:-.015em}
.ph .sub{color:var(--ink2);font-size:14.5px;margin-top:4px}
.ph .acts{margin-left:auto;display:flex;gap:8px;align-items:center}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin:-4px 0 20px;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.tab{border:0;background:none;padding:10px 12px;font-size:14px;color:var(--ink3);border-bottom:2px solid transparent;white-space:nowrap;text-decoration:none}
.tab:hover{color:var(--ink)}.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--brand)}
.tab .n{font-size:11.5px;background:var(--surface3);color:var(--ink2);border-radius:var(--pill);padding:1px 7px;margin-left:6px}

/* controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 16px;border-radius:var(--pill);border:1px solid var(--line2);background:var(--surface2);font-size:14px;font-weight:560;white-space:nowrap;text-decoration:none;color:var(--ink);transition:background .15s,border-color .15s,transform .1s}
.btn:hover{border-color:var(--ink3)}.btn:active{transform:scale(.98)}
.btn.primary{background:var(--fill);border-color:var(--fill);color:var(--on-fill);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}.btn.primary:hover{background:var(--fill-hi);border-color:var(--fill-hi)}
.btn.danger{color:var(--red);border-color:color-mix(in srgb,var(--red) 40%,transparent);background:var(--red-weak)}
.btn.dangerfill{background:var(--red);border-color:var(--red);color:#fff}
.btn.ghost{background:none;border-color:transparent;color:var(--ink2)}.btn.ghost:hover{background:var(--surface2);color:var(--ink)}
.btn.sm{height:32px;padding:0 13px;font-size:13px}
.btn.icon{width:32px;height:32px;padding:0}
.btn[disabled]{opacity:.5;pointer-events:none}
.rb{width:108px}
.link{background:none;border:0;padding:0;color:var(--brand);font-weight:560}.link:hover{text-decoration:underline}
.more-sum{cursor:pointer;color:var(--ink2);font-size:14px}.more-sum:hover{color:var(--ink)}
input.tm{width:140px}
.pbtn{position:relative;display:inline-grid;place-items:center;height:32px;border-radius:var(--pill);background:var(--brand-weak);border:1px solid color-mix(in srgb,var(--brand) 45%,transparent);overflow:hidden;font-size:13px;font-weight:600}
.pbtn.lg{height:36px;font-size:14px}
.pbtn>span{position:relative}
.pbtn i{position:absolute;inset:0 auto 0 0;width:0;background:var(--fill);overflow:hidden;animation:fill var(--d,1.3s) cubic-bezier(.45,.05,.55,.95) forwards}
.pbtn i b{position:absolute;inset:0 auto 0 0;display:grid;place-items:center;color:var(--on-fill);font-style:normal}
@keyframes fill{to{width:100%}}
.field{width:100%;height:38px;border-radius:10px;border:1px solid var(--line2);background:var(--surface2);padding:0 12px;font-size:14px;color:var(--ink);outline:none}
textarea.field{height:auto;padding:10px 12px;line-height:1.5;resize:vertical}
.field:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
.lbl{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:560;color:var(--ink2)}
.hint{font-size:12.5px;color:var(--ink3);font-weight:400}
.sel{color:var(--ink);display:inline-flex;align-items:center;justify-content:space-between;gap:10px;height:38px;min-width:180px;padding:0 12px;border-radius:10px;border:1px solid var(--line2);background:var(--surface2);font-size:14px;text-align:left;width:100%}
.sel:hover{border-color:var(--ink3)}.sel span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sel.inline{width:auto;min-width:0;height:32px;font-size:13px;border-radius:var(--pill)}
.sw{position:relative;width:42px;height:24px;border-radius:12px;background:var(--surface3);border:1px solid var(--line2);flex:none;transition:background .2s}
.sw::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s var(--ease);box-shadow:0 1px 3px rgba(0,0,0,.3)}
.sw[aria-checked="true"]{background:var(--fill);border-color:var(--fill)}.sw[aria-checked="true"]::after{transform:translateX(18px)}
.seg{display:inline-flex;padding:2px;border-radius:var(--pill);background:var(--surface2);border:1px solid var(--line)}
.seg button{border:0;background:none;padding:5px 12px;border-radius:var(--pill);font-size:13px;color:var(--ink2)}
.seg button[aria-pressed="true"]{background:var(--surface3);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.radio{display:flex;gap:10px;align-items:flex-start;text-align:left;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:var(--surface2)}
.radio:hover{border-color:var(--line2)}.radio.on{border-color:var(--brand);background:var(--brand-weak)}
.radio .dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--ink3);flex:none;margin-top:1px;display:grid;place-items:center}
.radio.on .dot{border-color:var(--brand)}.radio.on .dot::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand)}
.radio b{display:block;font-size:14px;font-weight:600}.radio span{font-size:13px;color:var(--ink2)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;cursor:pointer}
.check .box{width:18px;height:18px;border-radius:5px;border:2px solid var(--ink3);flex:none;margin-top:2px;display:grid;place-items:center}
.check.on .box{background:var(--fill);border-color:var(--fill);color:var(--on-fill)}
.pill{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:var(--pill);font-size:12px;font-weight:580;white-space:nowrap;background:var(--surface3);color:var(--ink2)}
.pill.brand{background:var(--brand-weak);color:var(--brand)}.pill.green{background:var(--green-weak);color:var(--green)}.pill.red{background:var(--red-weak);color:var(--red)}.pill.blue{background:var(--blue-weak);color:var(--blue)}.pill.violet{background:var(--violet-weak);color:var(--violet)}
.dot8{width:8px;height:8px;border-radius:50%;flex:none;display:inline-block}
.p2{background:var(--red)}.p1{background:var(--amber)}.p0{background:var(--blue)}.pm1,.pm2{background:var(--ink3)}
.code{font-family:var(--mono);font-size:12.5px;background:var(--surface3);border-radius:10px;padding:12px 14px;white-space:pre;overflow-x:auto;line-height:1.55;color:var(--ink);max-width:100%}
code{font-family:var(--mono);font-size:12.5px;background:var(--surface3);border-radius:5px;padding:1px 6px}
.muted{color:var(--ink2)}.small{font-size:13px}.faint{color:var(--ink3)}

/* cards and lists */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow)}
.pad{padding:18px 20px}
.card h2{font-size:16px;font-weight:640}
.cardhd{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line)}
.cardhd .sub{font-size:13px;color:var(--ink3)}
.cardhd .r{margin-left:auto;display:flex;gap:8px;align-items:center}
.stack{display:flex;flex-direction:column;gap:16px}#inst>*{min-width:0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;align-items:start}
.rows{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
.rows.flat{box-shadow:none}
.row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px 16px;border-top:1px solid var(--line);position:relative;transition:background .12s}
.row:first-child{border-top:0}
.row.click{cursor:pointer}
.row.click:hover{background:color-mix(in srgb,var(--brand) 5%,var(--surface));box-shadow:inset 0 0 0 1.5px var(--brand)}
.rows .row:first-child{border-radius:var(--r-lg) var(--r-lg) 0 0}.rows .row:last-child{border-radius:0 0 var(--r-lg) var(--r-lg)}.rows .row:only-child{border-radius:var(--r-lg)}
.row h4{font-size:14.5px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.row .s{font-size:13.5px;color:var(--ink2);margin-top:2px}
.row .meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:6px;font-size:12.5px;color:var(--ink3)}
.row .end{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.sep{width:3px;height:3px;border-radius:50%;background:var(--ink3);opacity:.6;display:inline-block}
.empty{padding:36px 20px;text-align:center;color:var(--ink2)}
.empty b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kpi{padding:16px 18px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-lg);text-align:left;display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow);min-height:108px}
button.kpi:hover{box-shadow:inset 0 0 0 1.5px var(--brand),var(--shadow)}
.kpi .l{font-size:12.5px;color:var(--ink3)}.kpi .v{font-size:28px;font-weight:680;letter-spacing:-.01em;line-height:1.1}
.kpi .v small{font-size:14px;color:var(--ink3);font-weight:500}.kpi .f{font-size:12.5px;color:var(--ink2);margin-top:auto}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.toolbar .r{margin-left:auto;display:flex;gap:8px}
.sfield{display:flex;align-items:center;gap:8px;height:32px;padding:0 12px;border:1px solid var(--line);border-radius:var(--pill);background:var(--surface);min-width:200px}
.sfield input{border:0;background:none;outline:none;font-size:13.5px;width:100%;color:var(--ink)}
table.t{width:100%;border-collapse:collapse;font-size:14px}
table.t th{text-align:left;font-size:12.5px;font-weight:550;color:var(--ink3);padding:10px 16px;border-bottom:1px solid var(--line)}
table.t td{padding:12px 16px;border-top:1px solid var(--line)}table.t tr:first-child td{border-top:0}
table.t .num{text-align:right;font-variant-numeric:tabular-nums}
.meter{height:8px;border-radius:4px;background:var(--surface3);overflow:hidden}
.meter i{display:block;height:100%;border-radius:4px;background:var(--brand)}
.meter.full i{background:var(--red)}
.notice{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:12px;border:1px solid color-mix(in srgb,var(--brand) 35%,transparent);background:var(--brand-weak)}
.notice b{font-size:14.5px}.notice p{font-size:13.5px;color:var(--ink2)}.notice .btn{margin-left:auto}
.danger-zone{border-color:color-mix(in srgb,var(--red) 35%,transparent)}
.savebar{position:fixed;left:50%;bottom:20px;transform:translate(-50%,120%);opacity:0;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 16px;border-radius:var(--pill);background:var(--ink);color:var(--page);z-index:45;transition:transform .25s var(--ease),opacity .25s;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.savebar.on{transform:translate(-50%,0);opacity:1}
.savebar .btn.ghost{color:var(--page)}.savebar .btn.ghost:hover{background:rgba(127,127,127,.2)}

/* ladder / stepper */
.ladder{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ladder li{display:grid;grid-template-columns:32px 1fr auto;gap:14px;padding:12px 0;position:relative;align-items:start}
.ladder li::before{content:"";position:absolute;left:15px;top:44px;bottom:-12px;width:2px;background:var(--line2)}
.ladder li:last-child::before{display:none}
.ladder .n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--surface3);font-size:13px;font-weight:650}
.ladder .n.b{background:var(--fill);color:var(--on-fill)}
.ladder .wait{font-size:12.5px;color:var(--ink3);margin-bottom:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ladder b{font-size:14.5px}
.steps{list-style:none;margin:0;padding:0;counter-reset:s;display:flex;flex-direction:column;gap:8px}
.steps li{counter-increment:s;display:grid;grid-template-columns:24px 1fr;gap:10px;font-size:14px}
.steps li::before{content:counter(s);width:22px;height:22px;border-radius:50%;background:var(--surface3);display:grid;place-items:center;font-size:12px;font-weight:650}
.wiz{display:flex;flex-direction:column;gap:10px}
.wstep{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);overflow:hidden}
.wstep>button{display:flex;align-items:center;gap:12px;width:100%;padding:14px 18px;border:0;background:none;text-align:left}
.wstep>button:hover{background:var(--surface2)}
.wstep .wn{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:650;background:var(--surface3);flex:none}
.wstep.done .wn{background:var(--green);color:#06150D}.wstep.cur{border-color:var(--brand)}.wstep.cur .wn{background:var(--fill);color:var(--on-fill)}
.wstep b{font-size:14.5px}.wstep .ws{font-size:13px;color:var(--ink3)}
.wstep .wbody{padding:0 18px 18px 58px;display:flex;flex-direction:column;gap:14px}

/* popovers */
.menu{position:fixed;z-index:70;min-width:220px;max-width:320px;max-height:min(60vh,420px);overflow-y:auto;overscroll-behavior:contain;padding:6px;border-radius:14px;background:var(--glass-strong);-webkit-backdrop-filter:blur(34px) saturate(170%);backdrop-filter:blur(34px) saturate(170%);border:1px solid var(--line2);box-shadow:0 16px 40px rgba(0,0,0,.4);animation:pop .14s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.menu .mi{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;background:none;border-radius:8px;font-size:14px;text-align:left;color:var(--ink)}
.menu .mi:hover,.menu .mi.act{background:var(--surface2)}
.menu .mi .ck{margin-left:auto;color:var(--brand)}
.menu .mi.danger{color:var(--red)}
.menu .mi small{display:block;font-size:12px;color:var(--ink3)}
.menu .mh{padding:8px 10px 4px;font-size:12px;color:var(--ink3)}
.menu hr{border:0;border-top:1px solid var(--line);margin:6px 0}
.menu .mseg{padding:6px 10px}
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:60;opacity:0;pointer-events:none;transition:opacity .2s}
.scrim.on{opacity:1;pointer-events:auto}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-48%) scale(.98);opacity:0;pointer-events:none;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 48px);display:flex;flex-direction:column;z-index:61;background:var(--surface);border:1px solid var(--line2);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.45);transition:all .22s var(--ease)}
.modal.wide{width:min(860px,calc(100vw - 32px))}
.modal.on{transform:translate(-50%,-50%);opacity:1;pointer-events:auto}
.mhd{display:flex;align-items:flex-start;gap:12px;padding:18px 22px 12px}
.mhd h2{font-size:18px;font-weight:660}.mhd p{font-size:13.5px;color:var(--ink2);margin-top:3px}
.mbd{padding:6px 22px 18px;overflow:auto;display:flex;flex-direction:column;gap:14px}
.mft{display:flex;gap:8px;justify-content:flex-end;padding:14px 22px;border-top:1px solid var(--line)}
.mft .l{margin-right:auto;font-size:13px;color:var(--ink3);align-self:center}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100vw);z-index:61;background:var(--surface);border-left:1px solid var(--line2);transform:translateX(100%);transition:transform .3s var(--ease);display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.3)}
.drawer.on{transform:none}
.dbd{padding:18px 22px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:20px}
.dsec h3{font-size:12.5px;color:var(--ink3);font-weight:560;margin-bottom:8px}
.tl{list-style:none;margin:0;padding:0}
.tl li{display:grid;grid-template-columns:14px 1fr auto;gap:12px;padding:8px 0;position:relative;font-size:14px}
.tl li::before{content:"";position:absolute;left:6px;top:24px;bottom:-8px;width:2px;background:var(--line2)}
.tl li:last-child::before{display:none}
.tl .d{width:14px;height:14px;border-radius:50%;border:3px solid var(--surface);background:var(--ink3);margin-top:3px;box-shadow:0 0 0 1px var(--line2)}
.tl .d.b{background:var(--brand)}.tl .d.g{background:var(--green)}
.tl time{font-size:12.5px;color:var(--ink3)}
.kv{display:grid;grid-template-columns:140px 1fr;gap:8px 14px;font-size:14px}.kv dt{color:var(--ink3)}.kv dd{margin:0}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:90;display:flex;gap:14px;align-items:center;background:var(--ink);color:var(--page);padding:10px 12px 10px 16px;border-radius:12px;font-size:14px;transition:all .25s var(--ease);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.toast button{border:0;background:none;color:var(--page);font-weight:700;text-decoration:underline;padding:4px}
.palette{position:fixed;left:50%;top:12vh;transform:translateX(-50%);width:min(620px,calc(100vw - 32px));z-index:62;background:var(--surface);border:1px solid var(--line2);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.5);overflow:hidden;display:none}
.palette.on{display:block;animation:pop .15s var(--ease)}
.palette input{width:100%;border:0;border-bottom:1px solid var(--line);background:none;padding:16px 18px;font-size:16px;outline:none;color:var(--ink)}
.palette .pl{max-height:50vh;overflow:auto;padding:6px}
.palette .mi{display:flex;gap:10px;align-items:center;width:100%;padding:9px 12px;border:0;background:none;border-radius:9px;text-align:left;font-size:14px;color:var(--ink)}
.palette .mi.act{background:var(--surface2)}.palette .mi span{margin-left:auto;font-size:12px;color:var(--ink3)}

/* signed out */
.out{min-height:100vh;display:grid;place-items:center;padding:24px}
.outcard{width:min(420px,100%);padding:28px;display:flex;flex-direction:column;gap:14px}
.outcard .brand{display:flex;align-items:center;gap:10px;font-weight:650;font-size:16px}
.outcard h1{font-size:24px}
.or{display:flex;align-items:center;gap:10px;color:var(--ink3);font-size:12.5px}.or::before,.or::after{content:"";flex:1;border-top:1px solid var(--line)}
.err{padding:12px 14px;border-radius:10px;background:var(--red-weak);color:var(--red);font-size:14px}

/* form builder preview */
.pv{background:var(--preview);color:var(--preview-ink);border-radius:12px;padding:22px;border:1px solid var(--line);font-size:14px}
.pv h5{font-size:18px;margin:0 0 4px}.pv p{color:#5A6371;font-size:13px;margin-bottom:14px}
.pv label{display:block;font-size:12.5px;font-weight:600;margin:10px 0 4px}
.pv .in{height:34px;border:1px solid #D9DEE5;border-radius:8px;background:#fff}
.pv .ta{height:72px;border:1px solid #D9DEE5;border-radius:8px}
.pv .in.ch{display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#8A919C;font-size:13px}.pv .in.ch::after{content:"";width:8px;height:8px;border-right:2px solid #8A919C;border-bottom:2px solid #8A919C;transform:rotate(45deg) translateY(-3px)}
.pv .go{margin-top:14px;height:38px;border-radius:9px;background:var(--pvc,#FF9F0A);color:#fff;display:grid;place-items:center;font-weight:650}
.palchips{display:flex;flex-wrap:wrap;gap:6px}
.chip{height:30px;padding:0 12px;border-radius:var(--pill);border:1px solid var(--line2);background:var(--surface2);font-size:13px}
.chip:hover{border-color:var(--brand)}
.drag{color:var(--ink3);cursor:grab;font-size:16px;letter-spacing:-2px}
.themes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.theme{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--surface2);text-align:left}
.theme.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.theme i{display:block;height:34px;border-radius:7px;margin-bottom:8px}
.theme span{font-size:13px}
.tpls{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tpl{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--surface2);text-align:left;display:flex;flex-direction:column;gap:4px}
.tpl:hover{border-color:var(--line2)}.tpl.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.tpl b{font-size:14px;text-wrap:wrap}.tpl span{font-size:12.5px;color:var(--ink2);text-wrap:wrap}.tpl small{font-size:12px;color:var(--ink3)}
.ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.way,.ways>*{min-width:0}
.way{padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.way h3{font-size:15px}
.funnel{display:flex;flex-direction:column;gap:10px}
.fstep{display:grid;grid-template-columns:132px 1fr 80px;gap:12px;align-items:center;font-size:14px}
.fstep .bar{height:26px;border-radius:7px;background:var(--surface3);overflow:hidden}
.fstep .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),color-mix(in srgb,var(--brand) 60%,#fff));border-radius:7px}
.fstep b{text-align:right;font-variant-numeric:tabular-nums}
.chart{display:flex;align-items:flex-end;gap:3px;height:140px;padding-top:8px}
.chart div{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:2px;height:100%}
.chart i{display:block;border-radius:3px 3px 0 0;background:var(--surface3)}
.chart i.s{background:var(--brand);border-radius:3px}
.legend{display:flex;gap:14px;font-size:12.5px;color:var(--ink3)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.plans{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.plan{padding:20px;display:flex;flex-direction:column;gap:10px;position:relative}
.plan.rec{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand),var(--shadow)}
.plan .price{font-size:32px;font-weight:700}.plan .price small{font-size:14px;color:var(--ink3);font-weight:500}
.plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--ink2)}
.plan li::before{content:"✓";color:var(--green);margin-right:8px;font-weight:700}
.guide{position:fixed;right:20px;bottom:20px;z-index:40}
.guidep{position:fixed;right:20px;bottom:70px;width:min(400px,calc(100vw - 32px));max-height:72vh;overflow:auto;z-index:41;padding:16px 18px;display:none}
.guidep.on{display:block;animation:pop .15s var(--ease)}
.guidep h3{font-size:14px;margin:12px 0 6px}.guidep h3:first-of-type{margin-top:4px}
.guidep a{display:block;font-size:13.5px;padding:4px 8px;border-radius:7px;color:var(--ink2);text-decoration:none}
.guidep a:hover{background:var(--surface2);color:var(--ink)}
.guidep ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:7px;font-size:13.5px;color:var(--ink2)}.guidep ol b{color:var(--ink)}

.condrow{grid-template-columns:1fr 1fr 1fr auto!important}.condrow .sel{min-width:0}
#ruledel{max-width:calc(100% - 380px)}
@media (max-width:1100px){#ruledel{max-width:none}.cols{grid-template-columns:minmax(0,1fr)}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.ways{grid-template-columns:minmax(0,1fr)}.tpls{grid-template-columns:1fr 1fr}.themes{grid-template-columns:repeat(3,1fr)}}
@media (max-width:860px){
 .app{grid-template-columns:1fr}
 .side{position:fixed;left:0;top:0;bottom:0;width:272px;margin:0;max-height:none;border-radius:0 22px 22px 0;transform:translateX(-105%);transition:transform .25s var(--ease);background:var(--glass-strong)}
 .side.on{transform:none;box-shadow:20px 0 60px rgba(0,0,0,.4)}
 .btn.menubtn{display:inline-flex}
 .main{padding:0 12px 120px}.top{top:8px;margin-top:8px;padding:6px 6px 6px 8px}
 .search{min-width:0}.search .t,.search kbd{display:none}
 .grid2,.plans{grid-template-columns:1fr}
 .ph .acts{margin-left:0}
}
@media (max-width:560px){
 .row .meta .sep{opacity:0;width:0;margin:0 -2px}.row .meta{gap:2px 10px}
 .row:has(.end>.btn.icon:only-child) .end{grid-column:3;grid-row:1}.row:has(.end>.btn.icon:only-child){grid-template-columns:auto minmax(0,1fr) auto}
 .ph:has(.acts>.btn.icon:only-child){flex-wrap:nowrap;align-items:flex-start}.ph:has(.acts>.btn.icon:only-child) .acts{margin-left:auto}
 .split{flex-direction:column;align-items:flex-start!important}
 .notice{flex-wrap:wrap}.notice .btn{margin-left:0}
 .seg{max-width:100%;overflow-x:auto;scrollbar-width:none}.seg button{white-space:nowrap}
 .cardhd{flex-wrap:wrap}
 .toolbar .r{width:100%}.toolbar .r .sfield{flex:1}
 .guide{display:none}
 .sample .t2{display:none}.sample .t3{display:inline}
 .guide{width:44px;height:44px;padding:0}.guide .gt{display:none}
 .condrow{grid-template-columns:1fr auto!important}.condrow>div:not(:last-child){grid-column:1}
 .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi .v{font-size:24px}
 .row{grid-template-columns:auto minmax(0,1fr)}.row .end{grid-column:2;justify-content:flex-start}
 .tpls,.themes{grid-template-columns:1fr 1fr}
 .kv{grid-template-columns:1fr}
 .fstep{grid-template-columns:112px 1fr 58px;font-size:13px}
 .wstep .wbody{padding-left:18px}
 table.t th:nth-child(n+3),table.t td:nth-child(n+3){display:none}
 table.t.keep th,table.t.keep td{display:table-cell}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- PageSoar additions on the shared console system ---- */
.kids{display:flex;flex-direction:column;gap:1px;margin:2px 0 8px 18px;padding-left:12px;border-left:1px solid var(--line2)}
.nav.open{color:var(--ink);font-weight:600}.nav.open svg{color:var(--brand)}
.nav.open:hover{background:var(--surface2)}
.nav.sub{padding:6px 10px;font-size:13.5px;color:var(--ink2);position:relative}
.nav.sub.on{background:var(--brand-weak);color:var(--ink);font-weight:550}
.nav.sub.on::before{content:"";position:absolute;left:-13px;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--brand)}
.nav .dotnew{margin-left:auto;width:7px;height:7px;border-radius:50%;background:var(--brand)}
.navpin{margin-top:10px;padding-top:8px;border-top:1px solid var(--line)}
.ws-env{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink3)}
.ws-env i{width:6px;height:6px;border-radius:50%;background:var(--amber)}
.ws-env.live i{background:var(--green)}
.storycard{margin-top:10px;display:flex;gap:10px;align-items:center;padding:10px;border-radius:12px;border:1px solid var(--line);background:var(--surface);width:100%;text-align:left}
.storycard:hover{border-color:var(--line2)}
.storycard b{display:block;font-size:13px}.storycard span{font-size:12px;color:var(--ink3)}
.topacts{display:flex;align-items:center;gap:6px}
.topacts .btn.icon{position:relative}
.topacts .cnt{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;border-radius:8px;background:var(--fill);color:var(--on-fill);font-size:10px;font-weight:700;display:grid;place-items:center;padding:0 4px}
.subtabs{display:flex;gap:6px;flex-wrap:wrap;margin:-6px 0 18px}
.subtabs a{height:30px;display:inline-flex;align-items:center;padding:0 12px;border-radius:var(--pill);font-size:13px;color:var(--ink2);text-decoration:none;border:1px solid var(--line)}
.subtabs a:hover{color:var(--ink);border-color:var(--line2)}
.subtabs a[aria-current="page"]{background:var(--ink);color:var(--page);border-color:var(--ink)}
.journey{display:flex;align-items:center;gap:10px;margin:0 0 18px;flex-wrap:wrap}
.journey .st{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2)}
.journey .st .c{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--green);color:var(--green)}
.journey .st.cur .c{background:var(--fill);border-color:var(--fill);color:var(--on-fill);font-size:12px;font-weight:700}
.journey .st.cur{color:var(--ink);font-weight:600}
.journey .ln{flex:1;min-width:24px;height:2px;background:var(--green);opacity:.6}
.health{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink2);white-space:nowrap}
.health .meter{width:64px;height:6px}
.health .meter i{background:var(--green)}
.health.mid .meter i{background:var(--amber)}.health.low .meter i{background:var(--red)}
.leads{font-variant-numeric:tabular-nums;font-weight:650;white-space:nowrap}
.leads small{font-weight:400;color:var(--ink3)}
.settingswrap{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:start}
.setnav{position:sticky;top:84px;padding-top:8px;display:flex;flex-direction:column;gap:1px}
.setnav .h{font-size:11.5px;color:var(--ink3);padding:12px 10px 4px}
.setnav .h:first-child{padding-top:0}
.setnav a{padding:6px 10px;border-radius:8px;font-size:13.5px;color:var(--ink2);text-decoration:none}
.setnav a:hover{background:var(--surface2);color:var(--ink)}
.setnav a[aria-current="page"]{background:var(--brand-weak);color:var(--ink)}
.counter{font-size:12px;color:var(--ink3);text-align:right}
.ba{display:grid;grid-template-columns:1fr;gap:8px}
.ba .side2{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--surface2)}
.ba .side2 .k{font-size:11.5px;color:var(--ink3);margin-bottom:4px;display:flex;align-items:center;gap:6px}
.ba .side2.after{border-color:color-mix(in srgb,var(--brand) 40%,transparent);background:color-mix(in srgb,var(--brand) 6%,var(--surface2))}
.serp{background:#fff;color:#202124;border-radius:10px;padding:14px 16px;font-family:Arial,sans-serif;border:1px solid var(--line)}
.serp .site{display:flex;align-items:center;gap:8px;font-size:12px;color:#4d5156}
.serp .site i{width:22px;height:22px;border-radius:50%;background:#E8F0FE;display:grid;place-items:center;font-style:normal;font-size:10px;color:#1F7A4C;font-weight:700}
.serp .site b{display:block;color:#202124;font-weight:400;font-size:13px}
.serp .t{color:#1a0dab;font-size:18px;line-height:1.3;margin-top:6px}
.serp .d{font-size:13.5px;color:#4d5156;margin-top:3px;line-height:1.5}
.imp{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink2)}
.imp .bars{display:inline-flex;gap:2px;align-items:flex-end}
.imp .bars i{width:3px;border-radius:1px;background:var(--surface3)}
.imp .bars i:nth-child(1){height:6px}.imp .bars i:nth-child(2){height:9px}.imp .bars i:nth-child(3){height:12px}
.imp[data-l="3"] .bars i,.imp[data-l="2"] .bars i:nth-child(-n+2),.imp[data-l="1"] .bars i:nth-child(1){background:var(--green)}
.start{font-size:11px;font-weight:650;color:var(--on-fill);background:var(--fill);border-radius:var(--pill);padding:1px 8px}
.row .num{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:650;background:var(--surface3);color:var(--ink2);flex:none}
.row .num.onpage{background:var(--ink);color:var(--page)}
.row .num.ok{background:var(--green);color:#06150D}
.row.done h4,.row.done .s{opacity:.55}.row.done h4{text-decoration:line-through}
.status{font-size:12.5px;color:var(--green);margin-top:6px;display:flex;align-items:center;gap:6px;height:20px}
/* the customer's page, drawn (audit) */
.mock{position:relative;background:#F6F7F9;color:#11161D;border-radius:10px;overflow:hidden;border:1px solid var(--line);font-family:var(--font)}
.mock .z{position:relative}
.mk-nav{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid #E3E7ED;font-size:9px;color:#5A6371}
.mk-nav b{color:#11161D;font-size:10.5px;margin-right:auto}
.mk-nav .mbtn{background:#11161D;color:#fff;border-radius:99px;padding:3px 8px}
.mk-hero{padding:22px 16px 18px;text-align:center}
.mk-hero h5{font-size:17px;margin:0;letter-spacing:-.02em;line-height:1.15}
.mk-hero p{font-size:9.5px;color:#5A6371;margin:6px auto 0;max-width:80%}
.mk-cta{display:inline-block;margin-top:10px;background:#3B5BDB;color:#fff;font-size:9.5px;padding:5px 12px;border-radius:99px}
.mk-shot{margin:14px auto 0;width:86%;height:60px;border-radius:6px;background:linear-gradient(135deg,#E7ECF7,#D7DFF0);border:1px solid #E3E7ED}
.mk-logos{display:flex;justify-content:center;gap:12px;padding:10px 0 14px}
.mk-logos i{width:34px;height:10px;border-radius:3px;background:#DADFE7}
.mk-feat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px 14px;background:#F0F2F6}
.mk-feat div{background:#fff;border-radius:5px;padding:7px;border:1px solid #E3E7ED}
.mk-feat b{display:block;font-size:8.5px}
.mk-feat i{display:block;height:4px;background:#E3E7ED;border-radius:2px;margin-top:4px}
.mk-form{padding:14px 16px;display:grid;grid-template-columns:1fr 1fr;gap:5px}
.mk-form .fh{grid-column:1/-1;font-size:10px;font-weight:650;margin-bottom:2px}
.mk-form i{height:12px;border:1px solid #E3E7ED;border-radius:3px;background:#fff;display:block}
.mk-form .sub{grid-column:1/-1;height:15px;background:#3B5BDB;border:0}
.mk-foot{height:30px;background:#11161D}
.mock span.pin{position:absolute;width:22px;height:22px;border-radius:50%;background:#11161D;color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35);cursor:pointer;z-index:3;transition:transform .2s var(--ease)}
.mock span.pin:hover,.mock span.pin.hl{transform:scale(1.2);background:var(--fill)}
.mock span.pin.done{opacity:0;pointer-events:none}
.zone-hl{position:absolute;inset:0;border:2px solid transparent;border-radius:4px;pointer-events:none;transition:border-color .2s,background .2s}
.z.hl>.zone-hl{border-color:#2E9E66;background:rgba(46,158,102,.10)}
.behind{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;padding:10px;border:1px dashed var(--line2);border-radius:10px}
.behind .t{width:100%;font-size:12px;color:var(--ink3)}
.bchip{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:3px 9px 3px 3px;border-radius:var(--pill);background:var(--surface2);border:1px solid var(--line);color:var(--ink2);cursor:pointer}
.bchip:hover,.bchip.hl{border-color:var(--brand);color:var(--ink)}
.bchip .pn{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:10.5px;font-weight:700;background:var(--surface3);color:var(--ink)}
.bchip.done{opacity:.45;text-decoration:line-through}
.statgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.stat{padding:12px;border-radius:10px;background:var(--surface2)}
.stat b{display:block;font-size:22px;font-weight:680;line-height:1.1}.stat span{font-size:12.5px;color:var(--ink2)}
.stat.g b{color:var(--green)}.stat.r b{color:var(--red)}
.finding{padding:16px 18px}
.finding h4{font-size:15px}
.bar2{display:flex;align-items:center;gap:10px;font-size:13.5px}
.bar2 .t{width:150px;flex:none;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar2 .m{flex:1;height:10px;border-radius:5px;background:var(--surface3);overflow:hidden}
.bar2 .m i{display:block;height:100%;background:var(--green);border-radius:5px}
.bar2 .m i.r{background:var(--red)}.bar2 .m i.b{background:var(--blue)}
.bar2 b{width:72px;text-align:right;font-variant-numeric:tabular-nums}
.widgets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.spark{display:flex;align-items:flex-end;gap:2px;height:44px}
.spark i{flex:1;background:var(--green);opacity:.75;border-radius:2px 2px 0 0}
.flow{display:grid;grid-template-columns:1fr 40px 1fr 40px 1fr;align-items:center;gap:0}
.flow .node{padding:10px 12px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);font-size:13px}
.flow .node b{display:block;font-size:14px}
.flow .arr{height:2px;background:var(--line2);position:relative}
.flow .arr::after{content:"";position:absolute;right:0;top:-4px;border:5px solid transparent;border-left-color:var(--line2)}
.welcome{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.chk{display:flex;align-items:center;gap:10px;font-size:14px;padding:4px 0;color:var(--ink3)}
.chk i{width:18px;height:18px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center;flex:none}
.chk.on{color:var(--ink)}.chk.on i{background:var(--green);border-color:var(--green);color:#06150D}
.stepper{display:flex;gap:6px;margin-bottom:6px}
.stepper span{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:var(--pill);font-size:12.5px;background:var(--surface2);color:var(--ink3)}
.stepper span.on{background:var(--brand-weak);color:var(--ink)}
.stepper b{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;background:var(--surface3)}
.stepper span.on b{background:var(--fill);color:var(--on-fill)}
.answer{padding:16px 18px;background:var(--violet-weak);border-radius:12px}
.qchips{display:flex;flex-wrap:wrap;gap:6px}
textarea.field.tall{min-height:180px;font-family:var(--mono);font-size:13px}
@media (max-width:1100px){.settingswrap{grid-template-columns:minmax(0,1fr)}.setnav{position:static;flex-direction:row;flex-wrap:wrap;gap:4px}.setnav .h{width:100%;padding:8px 2px 0}.widgets{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.statgrid{grid-template-columns:1fr 1fr}.welcome{grid-template-columns:1fr}.widgets{grid-template-columns:1fr}.bar2 .t{width:96px}.flow{grid-template-columns:1fr}.flow .arr{height:16px;width:2px;margin:0 auto}.flow .arr::after{display:none}.journey .ln{display:none}.journey{gap:6px 14px}}

.side{overflow:hidden}.side>nav{flex:1 1 auto;min-height:0;overflow-y:auto;margin:0 -4px;padding:0 4px;scrollbar-width:thin}
.side>.storycard,.side>.me,.side>.switcher{flex:none}

/* a row's title is one line of text: its labels follow the last word instead of wrapping under it as flex items */
.row h4{display:block}
.row h4 .pill,.row h4 .start{margin-left:8px;vertical-align:1px}

.row .s{overflow-wrap:break-word}

/* a lone search field stands on the page, never in a card of its own */
.findbar{display:flex;gap:10px;margin:0 0 24px;flex-wrap:wrap}
.findbar .sfield{flex:1;min-width:240px;height:46px;padding:0 16px;font-size:15px;background:var(--surface2);border-color:var(--line2)}
.findbar .sfield:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
.findbar .sfield input{font-size:15px}
.findbar .btn{height:46px;padding:0 20px}
@media (max-width:560px){.findbar .btn{width:100%}}

.assignee{display:inline-flex;align-items:center;gap:8px;width:150px;height:34px;padding:0 10px 0 4px;border-radius:var(--pill);border:1px solid transparent;background:none;color:var(--ink);font-size:13.5px;text-align:left}
.assignee span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.assignee .av.sm{width:26px;height:26px;font-size:10px;box-shadow:none;background:var(--surface3)}
.assignee:hover,.assignee:focus-visible{border-color:var(--line2);background:var(--surface2)}
.assignee.none{color:var(--ink3)}
.assignee.none .av.sm{background:none;border:1.5px dashed var(--ink3);color:var(--ink3)}
.assignee.none:hover{color:var(--ink)}

/* a form's actions come after its choices: a footer row, summary at the start, buttons at the end */
.formfoot{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:16px;padding:14px 0 0;border-top:1px solid var(--line);flex-wrap:wrap}
.formfoot>span{margin-right:auto;font-size:14px}
@media (max-width:560px){.formfoot>span{width:100%}.formfoot .btn{flex:1}}

/* the date range picker */
.datebtn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--line2);background:var(--surface2);color:var(--ink);font-size:14px;white-space:nowrap}
.datebtn:hover{border-color:var(--ink3)}.datebtn svg:first-child{color:var(--ink3)}
.lbl .datebtn{align-self:flex-start}
.datepop{max-width:none;max-height:none;overflow:visible;padding:0}
.dpwrap{display:flex}
.dppre{display:flex;flex-direction:column;gap:1px;padding:8px;border-right:1px solid var(--line);min-width:150px}
.dppre .mi{font-size:13.5px}
.dpcal{padding:10px 14px 12px}
.dpnav{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.dpmonths{display:flex;gap:22px}
.cal{width:238px}
.calhd{font-weight:650;font-size:14px;text-align:center;margin-bottom:8px}
.calwk,.calgrid{display:grid;grid-template-columns:repeat(7,34px);row-gap:2px}
.calwk span{font-size:11.5px;color:var(--ink3);text-align:center;padding-bottom:4px}
.day{height:32px;border:0;background:none;color:var(--ink);font-size:13px;border-radius:8px;font-variant-numeric:tabular-nums;position:relative}
.day:hover:not(.start):not(.end){background:var(--surface3)}
.day.mid{background:var(--brand-weak);border-radius:0}
.day.start,.day.end{background:var(--fill);color:var(--on-fill);font-weight:650}
.day.start:not(.end){border-radius:8px 0 0 8px}.day.end:not(.start){border-radius:0 8px 8px 0}
.day.today:not(.start):not(.end)::after{content:"";position:absolute;left:50%;bottom:4px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--brand)}
.day.off{color:var(--ink3);opacity:.45;cursor:default}
.dpfoot{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.dpfoot span{margin-right:auto}
@media (max-width:640px){.dpwrap{flex-direction:column}.dppre{flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--line);min-width:0}.dppre .mi{width:auto;padding:6px 8px}.dpmonths .cal:first-child{display:none}.dpmonths,.cal{width:100%}.calwk,.calgrid{grid-template-columns:repeat(7,1fr)}.datepop{left:8px!important;right:8px;width:auto}}

/* integrations: a tile, the name and its category, what PageSoar does with it, then its state */
.itile{width:40px;height:40px;border-radius:11px;flex:none;display:grid;place-items:center;font-weight:700;font-size:14px;color:var(--t);background:color-mix(in srgb,var(--t) 14%,var(--surface2));border:1px solid color-mix(in srgb,var(--t) 28%,transparent)}
.icards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.icard{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;row-gap:12px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface2)}
.icard:hover{border-color:var(--line2)}
.icard .it{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.icard .it b{font-size:15px}
.icard p{font-size:13px;color:var(--ink2);margin-top:4px;line-height:1.45}
.icard .ia{grid-column:2;display:flex;align-items:center}
@media (max-width:640px){.icards{grid-template-columns:minmax(0,1fr)}}

/* switchers: never stretch into a half-empty bar; inside a side panel they fill it with equal parts, and the chosen part reads clearly */
.seg{align-self:flex-start}
.seg button[aria-pressed="true"]{background:var(--surface3);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2),0 1px 2px rgba(0,0,0,.25);font-weight:600}
.seg button:not([aria-pressed="true"]):hover{color:var(--ink)}
.drawer .seg{display:flex;width:100%;align-self:stretch;padding:3px}
.drawer .seg button{flex:1;padding:7px 10px;text-align:center}
.icards.three{grid-template-columns:repeat(3,minmax(0,1fr))}@media (max-width:900px){.icards.three{grid-template-columns:minmax(0,1fr)}}
.itile.sm{font-size:11.5px;letter-spacing:-.02em}
.seg{flex-shrink:0}
.itile.brand{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 1px 2px rgba(0,0,0,.25)}
/* a multi-step dialog keeps one size from step to step */
.modal .mbd{flex:1 1 auto}
/* sidebar fits a laptop screen: tighter rows, a one-line tour card, and a fade when the menu scrolls */
.grp{padding:10px 10px 3px}
.nav{padding:6px 10px}.nav.sub{padding:4px 10px}.kids{margin:1px 0 4px 18px}
.nav.sub.on::before{top:5px;bottom:5px}
.storycard{margin-top:8px;padding:7px 10px}.storycard svg{width:22px;height:22px}.storycard span>span{display:none}
.me{margin-top:8px;padding:6px 8px}
.side>nav{-webkit-mask-image:linear-gradient(#000 calc(100% - 18px),transparent);mask-image:linear-gradient(#000 calc(100% - 18px),transparent);padding-bottom:12px}
/* the prototype's screen list stays out of the way of content */
.guide{width:44px;height:44px;padding:0;border-radius:50%;justify-content:center}.guide .gt{display:none}
main{padding-bottom:88px}
.storycard b{color:var(--ink2)}
.pill.amber{background:var(--amber-weak);color:var(--amber)}
/* the score a fix adds sits under its button, so every row's details stay on one line */
.end.act2{flex-direction:column;align-items:center;gap:5px}.gain{font-size:11.5px;color:var(--green);white-space:nowrap}
.axisx{display:flex;justify-content:space-between;margin-top:8px;font-size:11.5px;color:var(--ink3)}
.kpi{container-type:inline-size}.kpi .v{white-space:nowrap;font-size:clamp(18px,13.5cqi,28px)}
.bar2.kv{justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--line)}.bar2.kv:last-child{border-bottom:0}.bar2.kv .t{width:auto;flex:1}
.flow .arr{background:var(--ink3)}.flow .arr::after{border-left-color:var(--ink3)}
/* page header: the title block takes the room, the actions stay beside it on wide screens however long the line under the title is */
.ph>div:first-child{flex:1 1 auto;min-width:0}
@media (min-width:861px){.ph{flex-wrap:nowrap}.ph .acts{flex:none}}
.sel[disabled]{opacity:.55;cursor:not-allowed}
.t.checks th:nth-child(1){width:130px}.t.checks th:nth-child(2){width:40%}
/* page figures sit in fixed columns so numbers and bars line up from row to row */
.row .end .leads{width:120px;text-align:right}
.row .end .health{width:104px;justify-content:flex-start}.health>:last-child{min-width:34px;text-align:right}.health .meter{flex:none}
.row .end .health+.btn,.row .end span.faint.small{flex:none}
.row .end>span.faint.small{width:104px;text-align:left}
/* the menu fades at its foot only when it really scrolls */
.side>nav:not(.scrolls){-webkit-mask-image:none;mask-image:none;padding-bottom:0}
.ph{align-items:flex-start}.ph .acts{margin-top:2px}

/* account sits top right, like every major console: an avatar that opens who you are, your preferences and sign out */
.avbtn{width:34px;height:34px;border-radius:50%;border:1px solid var(--line2);background:var(--surface3);color:var(--ink);font-size:12px;font-weight:700;display:grid;place-items:center;flex:none;cursor:pointer;margin-left:4px}
.avbtn:hover{border-color:var(--ink3)}.avbtn.on,.avbtn[aria-expanded="true"]{box-shadow:0 0 0 2px var(--brand)}
.acct{display:flex;gap:12px;align-items:center;padding:10px 10px 12px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.acct .av{width:38px;height:38px;font-size:13px;flex:none}.acct b{display:block;font-size:14px}.acct span{display:block;font-size:12.5px;color:var(--ink3);line-height:1.4}
.menu.acctmenu{min-width:270px}
.acct>.av{display:grid;place-items:center;border-radius:50%}

/* ================= Offerline on the shared console system ================= */
.brandrow{display:flex;align-items:center;gap:10px;padding:6px 8px 10px;text-decoration:none;color:var(--ink)}
.brandrow .tlogo{width:32px;height:32px;border-radius:10px;background:var(--fill);display:grid;place-items:center}
.brandrow b{font-size:16px;letter-spacing:-.01em}
.addjob{width:100%;justify-content:center;margin:0 0 10px;height:38px}
.btn.primary,.btn.primary:hover{color:var(--on-fill)}
/* the four steps */
.ribbon{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 0 18px;padding:4px;border-radius:14px;background:var(--surface2);border:1px solid var(--line)}
.ribbon a{display:flex;align-items:center;gap:8px;justify-content:center;padding:9px 10px;border-radius:10px;color:var(--ink2);text-decoration:none;font-weight:560;font-size:14px;position:relative;white-space:nowrap}
.ribbon a:hover{background:var(--surface3);color:var(--ink)}
.ribbon a b{font-size:12px;min-width:22px;height:20px;padding:0 6px;border-radius:10px;background:var(--surface3);display:grid;place-items:center;font-variant-numeric:tabular-nums}
.ribbon a.on{background:var(--fill);color:var(--on-fill)}.ribbon a.on b{background:rgba(0,0,0,.14)}
.ribbon a.dim{opacity:.45}
.ribbon a:not(:last-child)::after{display:none;content:"";position:absolute;right:-5px;top:50%;width:6px;height:6px;border-top:1.5px solid var(--ink3);border-right:1.5px solid var(--ink3);transform:translateY(-50%) rotate(45deg);opacity:.6}
.ribacts{display:flex;gap:8px;justify-content:flex-end;margin:-6px 0 16px;flex-wrap:wrap}
/* company filter */
.cfbox{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:36px;padding:3px 4px 3px 6px;border-radius:12px;border:1px solid var(--line2);background:var(--surface);min-width:220px}
.cchip{display:inline-flex;align-items:center;gap:4px;padding:2px 4px 2px 9px;border-radius:999px;background:var(--brand-weak);font-size:12.5px;font-weight:560}
.cchip button{border:0;background:none;color:var(--ink2);display:grid;place-items:center;padding:2px;border-radius:50%}
.cfpick{flex:1;justify-content:space-between;border:0;background:none;color:var(--ink2);display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:8px;font-size:13.5px}
.cfpick:hover{background:var(--surface2)}
.notice.info{border-color:color-mix(in srgb,var(--blue) 35%,transparent);background:var(--blue-weak)}.notice.info>.i{color:var(--blue)}
/* Apply board */
.lane{margin-bottom:28px}
.lanehd{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.lanehd h2{font-size:18px;margin:0}.lanehd p{flex-basis:100%;margin:0}
.agrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.acard{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:16px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);cursor:pointer;min-width:0}
.acard:hover,.acard:focus-visible{box-shadow:inset 0 0 0 1.5px var(--brand),var(--shadow);outline:0}
.acard .ah{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}
.acard h4{margin:0;font-size:15px;line-height:1.35}.acard .s{margin:3px 0 0;font-size:13px;color:var(--ink2)}
.ring{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;border:2.5px solid var(--ink3);color:var(--ink2)}
.ring.g{border-color:var(--green);color:var(--green)}.ring.a{border-color:var(--amber);color:var(--amber)}
.stepbar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stepbar span{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink3);padding-top:8px;position:relative}
.stepbar span i{position:absolute;left:0;right:0;top:0;height:4px;border-radius:2px;background:var(--surface3)}
.stepbar .s2{color:var(--ink2)}.stepbar .s2 i{background:var(--brand)}.stepbar .s2 .i{color:var(--brand)}
.stepbar .s1{color:var(--ink);font-weight:560}.stepbar .s1 i{background:color-mix(in srgb,var(--brand) 50%,transparent)}
.stepbar em{font-style:normal;font-size:11px;font-weight:700}
.aline{margin:0;font-size:13px;color:var(--ink2)}.aline.bad{color:var(--red)}
.afoot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto}
.working{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--blue);font-weight:500}
.spin{width:12px;height:12px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;display:inline-block;animation:sp .8s linear infinite}@keyframes sp{to{transform:rotate(360deg)}}
.badtxt{display:inline-flex;align-items:center;gap:6px;color:var(--red);font-size:12.5px;font-weight:560}
/* posting lists */
.listbar{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--line);font-size:13.5px;flex-wrap:wrap}
.prow.picked{background:var(--brand-weak)}
.tlink{border:0;background:none;padding:0;color:var(--ink);font:inherit;font-weight:600;text-align:left;cursor:pointer}.tlink:hover{text-decoration:underline}
.mini{border:0;background:none;color:var(--ink3);display:inline-flex;align-items:center;gap:3px;font-size:12px;padding:2px 4px;border-radius:6px;margin-left:4px;vertical-align:1px}.mini:hover{background:var(--surface2);color:var(--ink)}.mini.amb{color:var(--amber)}
.meta .co{color:var(--ink);font-weight:560}
.meta .mail{display:inline-flex;align-items:center;gap:3px;color:var(--ink2);font-size:12px;text-decoration:none}.meta .mail:hover{color:var(--ink)}
.bulkbar{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:45;display:flex;align-items:center;gap:6px;padding:6px 6px 6px 10px;border-radius:999px;background:var(--glass-strong);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);border:1px solid var(--glass-edge);box-shadow:var(--sh-float)}
.dangertxt,.dangertxt:hover{color:var(--red)}
.btn.dangerbtn{color:var(--red);border-color:color-mix(in srgb,var(--red) 40%,transparent)}
/* Apply panel and drawers */
.drawer.wide{width:min(780px,100vw)}
.apstatus{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--ink2);margin-bottom:18px}
.dsec h3{display:flex;align-items:center;gap:8px;font-size:15px;margin:0 0 8px}
.okline{display:flex;align-items:center;gap:6px;color:var(--green);font-size:13.5px;margin:0 0 10px;flex-wrap:wrap}.okline a{margin-left:6px}
.pdf{background:#fff;color:#1c1c1c;border-radius:10px;padding:22px 26px;font:12px/1.5 Georgia,serif;max-height:300px;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.pdf b{font-size:18px;display:block}.pdf>span{display:block;color:#444;border-bottom:1.5px solid #222;padding-bottom:6px;margin-bottom:10px}.pdf u{display:block;font-weight:700;margin:10px 0 4px}.pdf p{margin:4px 0}.pdf em{float:right;font-style:normal;color:#555}.pdf ul{margin:4px 0;padding-left:18px}.pdf p b{font-size:12px;display:inline}
.fhd{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin:22px 0 6px}
.fsec{font-size:13px;color:var(--ink3);font-weight:600;margin:18px 0 8px;letter-spacing:.01em}
.frow{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:8px;background:var(--surface)}
.frow.needs{border-color:color-mix(in srgb,var(--amber) 45%,transparent)}.frow.draft{border-color:color-mix(in srgb,var(--blue) 35%,transparent)}
.fq{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;font-size:14px}.fq>span{flex:1;min-width:0}
.val{margin-top:6px;font-weight:560;display:flex;align-items:center;gap:6px}
.longans{margin-top:8px;padding:10px 12px;border-radius:10px;background:var(--surface2);font-size:14px}
.fsrc{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.wbox{display:flex;gap:8px;margin-top:8px}.wbox .field{flex:1}
.gates{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:4px;font-size:13.5px}.gates li{display:flex;gap:8px;align-items:center}.gates .i{color:var(--red)}
.apfoot{width:100%}.apbtn{display:flex;align-items:center;gap:14px;justify-content:space-between}.apbtn .btn{flex:none}
#drawer .mft{flex-wrap:wrap}
.cdhd{margin-bottom:16px}.cdhd .meta{margin-bottom:14px}
.rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.rail button{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12.5px;color:var(--ink3);padding:6px 2px;border-radius:10px;position:relative}
.rail button i{width:18px;height:18px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center;background:var(--surface)}
.rail .done{color:var(--ink2)}.rail .done i{background:var(--green);border-color:var(--green);color:#0f0e09}
.rail .cur{color:var(--ink);font-weight:600}.rail .cur i{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
.rail small{font-size:10.5px;color:var(--brand);font-weight:600}
.rail .sel{background:var(--surface2)}.rail button:disabled{opacity:.5}
.gaps{display:flex;flex-direction:column;gap:6px;font-size:13.5px}.gaps span{display:flex;gap:8px;align-items:center}.gaps em{font-style:normal;font-size:11.5px;color:var(--ink3)}
.gd{width:8px;height:8px;border-radius:50%;flex:none}.gd.hard{background:var(--red)}.gd.soft{background:var(--amber)}
.loop{display:flex;flex-direction:column;gap:0}
.lr{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;padding:6px 0;position:relative}
.lr>i{width:18px;height:18px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center;margin-top:2px;background:var(--surface)}
.lr.passed>i{background:var(--green);border-color:var(--green);color:#0f0e09}.lr.next>i{border-color:var(--amber);background:var(--amber-weak)}
.lr b{font-size:14px;margin-right:6px}
.ctxstrip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--ink2);margin-bottom:12px}
.composer{display:flex;gap:8px;align-items:flex-end}.composer textarea{flex:1;resize:none}
.chat{display:flex;flex-direction:column;gap:14px;padding:4px 0 16px}
.msg{display:flex;gap:10px;max-width:780px}.msg p{margin:0}
.msg.u{align-self:flex-end}.msg.u>div{background:var(--fill);color:var(--on-fill);padding:9px 14px;border-radius:16px 16px 4px 16px}
.msg.a>div{flex:1;min-width:0}.bot{width:28px;height:28px;border-radius:9px;background:var(--blue-weak);color:var(--blue);display:grid;place-items:center;flex:none}
.chat .note{text-align:center;font-size:12px;color:var(--ink3)}
.tool{display:flex;align-items:center;gap:8px;font-size:12.5px;margin-top:8px;color:var(--green)}.tool code{color:var(--ink)}.tool.run{color:var(--blue)}
.prep{max-width:880px}.prep .chat{min-height:300px}
/* Stories */
.story .storyhd{display:flex;gap:12px;align-items:center;justify-content:space-between;width:100%;border:0;background:none;padding:16px;text-align:left;color:var(--ink)}
.story h3{margin:0 0 6px;font-size:15.5px}
.tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:12px;background:var(--surface2);border:1px solid var(--line);color:var(--ink2)}
.tag.green{color:var(--green);border-color:color-mix(in srgb,var(--green) 30%,transparent)}.tag.red{color:var(--red);border-color:color-mix(in srgb,var(--red) 30%,transparent)}
.kv.star dt{color:var(--brand)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
/* Stats */
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.statgrid.six{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.stack-bar{display:flex;height:12px;border-radius:6px;overflow:hidden;gap:2px}
.legend2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 14px;font-size:13px}.legend2 span{display:flex;align-items:center;gap:6px}.legend2 i{width:8px;height:8px;border-radius:50%}.legend2 b{margin-left:auto;font-variant-numeric:tabular-nums}
svg.line{width:100%;height:90px;margin-top:8px}svg.line polyline{fill:none;stroke:var(--brand);stroke-width:2;stroke-linejoin:round}
.flowline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--ink2)}.flowline span b{font-size:20px;color:var(--ink);margin-right:5px}.flowline .i{color:var(--ink3)}
/* Agents */
.autow{display:flex;align-items:center;gap:10px}.autow>span{display:flex;flex-direction:column;line-height:1.25}.autow b{font-size:14px}
.grph{font-size:13px;color:var(--ink3);font-weight:600;margin:18px 0 10px}
.agent .aghd{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;cursor:pointer}
.agent h4{margin:0;font-size:15px;display:flex;align-items:center;gap:10px}.agent .s{margin:2px 0 0;font-size:13px;color:var(--ink2)}.agent .s.bad{color:var(--red)}
.agent .end{display:flex;align-items:center;gap:8px}
.autopill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid var(--line2);background:none;color:var(--ink2);font-size:12.5px;font-weight:560}
.autopill i{width:7px;height:7px;border-radius:50%;background:var(--ink3)}.autopill.on{border-color:color-mix(in srgb,var(--brand) 55%,transparent);color:var(--ink)}.autopill.on i{background:var(--brand)}
.agbody{border-top:1px solid var(--line);padding:14px 16px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px}
.agbody .chat{grid-column:1;padding:0}.agbody .composer{grid-column:1}.agbody .agq{grid-column:2;grid-row:1/span 2;display:flex;flex-direction:column;gap:8px}.agbody .ctxm{grid-column:1/-1}
.qrow{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface)}
.qrow>div{display:flex;flex-direction:column;gap:2px}.qrow b{font-size:13.5px;font-weight:560}
.ctxm{display:flex;align-items:center;gap:10px}.ctxm .meter{width:120px}
.qbtn{position:relative}.qbtn.working .i{animation:sp 3s linear infinite}
/* misc */
.prose h4{margin:14px 0 4px;font-size:14.5px}.prose p,.prose li{font-size:14px;color:var(--ink2)}
.postprev h3{font-size:15px;margin:14px 0 6px}.postprev p,.postprev li{color:var(--ink2);font-size:14px}
.cmts{width:320px;padding:8px 10px;display:flex;flex-direction:column;gap:8px}.cm{font-size:13.5px;display:flex;flex-direction:column;gap:2px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.lvl{width:340px;padding:8px 10px}.lvlg{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px}.lvlg>div{display:flex;flex-direction:column;gap:4px}.lvlg span{font-size:12.5px;padding:4px 8px;border-radius:8px;background:var(--surface2)}.lvlg .tgt{background:var(--fill);color:var(--on-fill);font-weight:600}.lvlg .hit{background:var(--brand-weak)}
.menu{max-width:360px}
.row.done{opacity:.7}
@media (max-width:900px){.cols2{grid-template-columns:minmax(0,1fr)}.agbody{grid-template-columns:minmax(0,1fr)}.agbody .agq{grid-column:1;grid-row:auto}.legend2{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.ribbon{grid-template-columns:repeat(4,max-content);overflow-x:auto}.ribbon a::after{display:none}.cfbox{min-width:0;width:100%}.apbtn{flex-direction:column;align-items:stretch}.rail small{display:none}.agent .aghd{grid-template-columns:auto minmax(0,1fr)}.agent .aghd .end{grid-column:1/-1;flex-wrap:wrap}.bulkbar{left:12px;right:12px;transform:none;justify-content:space-between}}
.cfpick>span{margin-right:auto;color:var(--ink)}.cfbox:hover{border-color:var(--ink3)}
.ph .acts{flex-wrap:wrap;max-width:100%}@media (max-width:640px){.ph .acts .btn{flex:1 1 auto}}
.fq>span{flex:initial}.fq>span:first-child{flex:1;min-width:0}
.rail button i{flex:none}
.bar2 .m i{background:var(--brand)}
.card .meta{gap:6px 8px}

/* a row with no leading icon puts its text in the wide column, so text never runs under the button */
.row:has(>div:first-child:nth-last-child(2)){grid-template-columns:minmax(0,1fr) auto}.row:has(>div:only-child){grid-template-columns:minmax(0,1fr)}
.seg{max-width:100%;overflow-x:auto}.seg button{white-space:nowrap}
.locpin{display:inline-flex;align-items:center;gap:4px;margin-right:6px}
.fhd{margin-bottom:12px}.dsec .fsec:first-of-type{margin-top:8px}
.cols2{align-items:start}
.prep{max-width:880px;display:flex;flex-direction:column;min-height:calc(100vh - 230px)}.prep .chat{flex:1}
.lbl>span{display:block}
.meta{display:flex;gap:6px 8px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--ink3)}


.stage{display:grid;grid-template-columns:220px auto;gap:40px;justify-content:center;align-items:start;padding:28px 20px 60px}
.flows{position:sticky;top:76px;display:flex;flex-direction:column;gap:1px;max-height:calc(100vh - 100px);overflow:auto}
.flows .fh{font-size:11.5px;color:var(--ink3);padding:12px 10px 4px;font-weight:600}
.flows a{padding:6px 10px;border-radius:8px;font-size:13.5px;color:var(--ink2);text-decoration:none}
.flows a:hover{background:var(--surface2);color:var(--ink)}.flows a[aria-current]{background:var(--brand-weak);color:var(--ink);font-weight:560}
.devwrap{display:flex;flex-direction:column;align-items:center;gap:14px}
.cap{max-width:380px;text-align:center;font-size:13.5px;color:var(--ink2);margin:0}
.phone{--ib:#F2F2F7;--icard:#fff;--iink:#000;--iink2:rgba(60,60,67,.6);--isep:rgba(60,60,67,.18);--tint:#3E7B57;
 position:relative;width:393px;height:852px;border-radius:56px;background:var(--ib);box-shadow:0 0 0 11px #0d0f0e,0 0 0 13px #3a3f3c,0 30px 80px rgba(0,0,0,.35);overflow:hidden;color:var(--iink);font:17px/1.3 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;letter-spacing:-.01em}
[data-theme="dark"] .phone{--ib:#000;--icard:#1C1C1E;--iink:#fff;--iink2:rgba(235,235,245,.6);--isep:rgba(84,84,88,.6);--tint:#5CB27E}
.phone.dk{--iink:#fff;--iink2:rgba(235,235,245,.65);--ib:#000;--icard:rgba(40,40,42,.8)}
.phone .island{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:124px;height:36px;border-radius:20px;background:#000;z-index:30}
.phone .sbar{position:absolute;top:0;left:0;right:0;height:54px;display:flex;align-items:center;justify-content:space-between;padding:6px 34px 0 46px;z-index:25;font-size:16px}
.phone .sbar.w{color:#fff}.phone .sbar span{display:flex;gap:6px;align-items:center}
.phone .batt{width:25px;height:12px;border:1.5px solid currentColor;border-radius:4px;opacity:.9;padding:1px;display:inline-block}.phone .batt i{display:block;height:100%;width:78%;background:currentColor;border-radius:2px}
.phone .homeind{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:140px;height:5px;border-radius:3px;background:var(--iink);opacity:.85;z-index:40}
.phone .scr{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;padding:54px 0 120px;scrollbar-width:none}.phone .scr::-webkit-scrollbar{display:none}
.phone .scr.grad{background:radial-gradient(120% 70% at 50% 0%,rgba(62,123,87,.22),transparent 60%),var(--ib)}
.phone .ipd{padding:0 18px}.phone .center{display:flex;flex-direction:column;align-items:center}
.phone a{color:var(--tint);text-decoration:none}

.phone .glass{background:color-mix(in srgb,var(--icard) 52%,transparent);-webkit-backdrop-filter:blur(18px) saturate(190%);backdrop-filter:blur(18px) saturate(190%);border:1px solid rgba(255,255,255,.55);box-shadow:inset 0 1px 1px rgba(255,255,255,.75),inset 0 -1px 1px rgba(255,255,255,.18),0 6px 22px rgba(0,0,0,.10),0 1px 3px rgba(0,0,0,.06)}
[data-theme="dark"] .glass{border-color:rgba(255,255,255,.16);box-shadow:inset 0 1px 1px rgba(255,255,255,.22),0 6px 22px rgba(0,0,0,.4)}
.phone .glass.tint{background:color-mix(in srgb,var(--tint) 86%,transparent);border-color:rgba(255,255,255,.45);color:#fff}
.phone .glass.danger{background:rgba(255,59,48,.12);color:#D93A30;border-color:rgba(255,59,48,.25)}
.phone .glass-d{background:rgba(120,120,128,.28);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 1px rgba(255,255,255,.25);color:#fff}
.phone .glass-card{background:var(--icard);border-radius:26px;padding:18px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.phone .glass-sheet{background:color-mix(in srgb,var(--icard) 82%,transparent);-webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%)}

.phone .gbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;border-radius:999px;font:600 17px/1 -apple-system,system-ui,sans-serif;color:var(--iink);cursor:pointer;padding:0 18px;margin:10px 0 0;text-decoration:none}
.phone a.gbtn{color:#fff}.phone .gbtn.big{min-height:54px}.phone .gbtn.sm{min-height:38px;font-size:15px;width:auto;padding:0 16px}
.phone .gbtn.plain{background:none;border:0;box-shadow:none;color:var(--tint);-webkit-backdrop-filter:none;backdrop-filter:none}
.phone .row2{display:flex;gap:8px}.phone .row2 .gbtn{flex:1}
.phone .bottomcta{position:absolute;left:0;right:0;bottom:0;padding:14px 18px 34px;background:linear-gradient(transparent,var(--ib) 30%);z-index:10}

.phone .lt{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:8px 0 14px}.phone .lt h1{font-size:34px;font-weight:700;margin:0;letter-spacing:-.02em;line-height:1.1}.phone .lt p{margin:4px 0 0;color:var(--iink2);font-size:15px}
.phone .nb{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;padding:4px 14px 6px;position:sticky;top:-54px;z-index:5}.phone .nb b{text-align:center;font-size:17px}
.phone .nbb{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--iink)!important;cursor:pointer;padding:0}
.phone .eyebrow{font-size:13px;color:var(--iink2);font-weight:500}
.phone .fine{font-size:13px;color:var(--iink2);margin:12px 4px 0;line-height:1.4}.phone .fine.c{text-align:center}
.phone .ihint{font-size:14px;color:var(--iink2);text-align:center;margin:12px 0}

.phone .ghd{font-size:13px;color:var(--iink2);text-transform:uppercase;letter-spacing:.02em;margin:22px 16px 7px}
.phone .gft{font-size:13px;color:var(--iink2);margin:7px 16px 0;line-height:1.35}
.phone .igrp{background:var(--icard);border-radius:22px;overflow:hidden}
.phone .cell{display:flex;align-items:center;gap:12px;min-height:50px;padding:10px 16px;position:relative;width:100%;border:0;background:none;color:var(--iink);font:inherit;text-align:left;cursor:default}
.phone button.cell,.phone a.cell{cursor:pointer}.phone a.cell{color:var(--iink)!important}
.phone .cell+.cell::before{content:"";position:absolute;top:0;left:16px;right:0;height:.5px;background:var(--isep)}
.phone .cell .cl{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:16px}.phone .cell .cl small{font-size:13.5px;color:var(--iink2)}
.phone .cell .cr{color:var(--iink2);font-size:16px;text-align:right}.phone .cell>.i{color:var(--iink2);opacity:.6}
.phone .cell .tintt{color:var(--tint);font-weight:600}
.phone .ci{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:#fff;flex:none;background:#8E8E93}.phone .ci.ilg{width:44px;height:44px;border-radius:12px}
.phone .dotc{width:12px;height:12px;border-radius:50%;flex:none}.phone .dotc.ilg{width:40px;height:40px;border-radius:12px}
.phone .cell.inp input{flex:1;border:0;background:none;font:inherit;color:var(--iink);outline:0;padding:4px 0}
.phone .cdate{display:flex;flex-direction:column;width:52px}.phone .cdate small{color:var(--iink2);font-size:12.5px}
.phone .ichk{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--isep);display:grid;place-items:center;flex:none}.phone .ichk.on{background:var(--tint);border-color:var(--tint);color:#fff}

.phone .onb{min-height:100%;display:flex;flex-direction:column;padding:30px 24px 40px;position:relative}
.phone .onbtop{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px}
.phone .onbtop svg{border-radius:22px;box-shadow:0 12px 30px rgba(0,0,0,.14)}
.phone .onb h1{font-size:34px;font-weight:700;margin:0;letter-spacing:-.02em}.phone .onb p{color:var(--iink2);margin:0;font-size:17px}
.phone .onbbtns{display:flex;flex-direction:column}
.phone .skip{position:absolute;top:8px;right:22px;font-weight:600}
.phone .okbig{width:96px;height:96px;border-radius:50%;background:var(--tint);color:#fff;display:grid;place-items:center}
.phone .codebox{display:flex;gap:8px;justify-content:center;margin:22px 0 8px}.phone .codebox span{width:46px;height:56px;border-radius:14px;background:var(--icard);display:grid;place-items:center;font-size:26px;font-weight:600}.phone .codebox span.cur{box-shadow:inset 0 0 0 2px var(--tint)}
.phone .orgcard{display:flex;gap:14px;align-items:center;margin-bottom:6px}.phone .orgcard b{display:block}.phone .orgcard span{font-size:14px;color:var(--iink2)}
.phone .orglogo{width:52px;height:52px;border-radius:14px;background:#1F3A5F;color:#fff;display:grid;place-items:center;font-weight:700}
.phone .perm{display:flex;gap:14px;align-items:center;background:var(--icard);border-radius:22px;padding:14px 16px;margin-bottom:10px}.phone .perm b{font-size:16px}.phone .perm p{margin:3px 0 0;font-size:14px;color:var(--iink2)}.phone .perm>.i{color:var(--tint);flex:none}
.phone .link-i{display:flex;gap:6px;align-items:center;justify-content:center;font-size:15px;margin-top:14px}
.phone .gvis{flex:1;display:grid;place-items:center}.phone .gtext{text-align:center;margin:10px 0}.phone .gtext h1{margin-bottom:8px}
.phone .dots{display:flex;gap:8px;justify-content:center;margin:12px 0}.phone .dots button{width:8px;height:8px;border-radius:50%;border:0;background:var(--isep);padding:0}.phone .dots button.on{background:var(--tint);width:22px;border-radius:4px}
.phone .gphone{width:180px;height:180px;border-radius:40px;background:#111;display:grid;place-items:center}
.phone .gswap{display:flex;align-items:center;gap:12px;color:var(--tint)}.phone .gchip{color:#fff;padding:10px 14px;border-radius:14px;font-weight:600;font-size:15px}
.phone .tipcard{margin-bottom:10px}.phone .tipcard b{display:flex;gap:6px;align-items:center;color:var(--tint)}.phone .tipcard p{font-size:15px;margin:6px 0 10px}

.phone.dk .scr{background:radial-gradient(90% 60% at 30% 10%,#3E7B57,transparent 70%),radial-gradient(80% 60% at 90% 90%,#1F3A5F,transparent 70%),#0b0f0c}
.phone .lock{display:flex;flex-direction:column;align-items:center;padding:16px 16px 0;color:#fff;min-height:100%}
.phone .ldate{font-size:20px;font-weight:600;opacity:.9}.phone .ltime{font-size:96px;font-weight:700;letter-spacing:-.03em;line-height:1;margin:2px 0 18px}
.phone .lwidgets{display:flex;gap:10px;margin-bottom:18px}.phone .lw{border-radius:22px;padding:10px 14px;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:13px;min-width:70px}.phone .lw.wide{min-width:150px;align-items:flex-start}.phone .lw b{font-size:20px}.phone .lwk{opacity:.75}
.phone .liveact{width:100%;border-radius:30px;padding:16px}.phone .laTop{display:flex;gap:12px;align-items:center}.phone .laTop svg{border-radius:7px}.phone .laTop div{flex:1;min-width:0}.phone .laTop b{display:block;font-size:16px}.phone .laTop span{font-size:13px;opacity:.75}
.phone .laT{font-size:24px;font-weight:600;font-variant-numeric:tabular-nums;opacity:1!important}
.phone .laBtns{display:flex;gap:8px;margin-top:12px}.phone .laBtns button{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:40px;border-radius:999px;border:0;background:rgba(255,255,255,.18);color:#fff;font:600 14px -apple-system,system-ui;cursor:pointer}
.phone .laBtns.demo{background:#111;padding:12px;border-radius:24px;width:300px}.phone .laBtns button.r{background:rgba(255,69,58,.85)}
.phone .lbottom{margin-top:auto;width:100%;display:flex;justify-content:space-between;padding:0 30px 50px}.phone .lbt{width:50px;height:50px;border-radius:50%;display:grid;place-items:center}

.phone .avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#3E7B57,#2F6FA8);color:#fff!important;display:grid;place-items:center;font-weight:600;font-size:15px;flex:none}.phone .avatar.ilg{width:56px;height:56px;font-size:20px}.phone .avatar.sm{width:32px;height:32px;font-size:12.5px}
.phone .spill{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--iink2);margin:0 0 12px}.phone .spill .i{color:var(--tint)}.phone .spill.off{color:#B4690E!important;background:rgba(255,159,10,.14);padding:5px 10px;border-radius:999px}
.phone .hero{padding:18px 18px 16px;background:linear-gradient(160deg,color-mix(in srgb,var(--tint) 16%,var(--icard)),var(--icard) 70%)}
.phone .hrow{display:flex;justify-content:space-between;align-items:center}
.phone .pillx{display:inline-flex;gap:4px;align-items:center;font-size:12.5px;font-weight:600;color:var(--tint);background:color-mix(in srgb,var(--tint) 14%,transparent);padding:4px 9px;border-radius:999px}
.phone .pname{display:block;font-size:24px;margin-top:6px;letter-spacing:-.01em}.phone .ptask{font-size:15px;color:var(--iink2)}
.phone .bigtime{font-size:58px;font-weight:300;font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin:10px 0 4px}
.phone .hbtns{display:flex;gap:10px}.phone .hbtns .gbtn{margin:0}
.phone .hero.idle .big{display:block;font-size:30px;margin:4px 0}.phone .hero.idle span{color:var(--iink2)}
.phone .shiftbar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 0}.phone .shiftbar>div{background:var(--icard);border-radius:18px;padding:12px}.phone .shiftbar b{display:block;font-size:17px;margin-top:2px;font-variant-numeric:tabular-nums}
.phone .tl2{padding:8px 16px}.phone .tseg{display:grid;grid-template-columns:44px 6px 1fr;gap:10px;align-items:stretch;padding:6px 0}.phone .tseg .tt{font-size:13px;color:var(--iink2);padding-top:2px}.phone .tseg i{border-radius:3px;min-height:38px}.phone .tseg b{font-size:15px;display:block}.phone .tseg small{font-size:13px;color:var(--iink2)}

.phone .tabbar{position:absolute;left:14px;right:14px;bottom:26px;display:flex;gap:10px;align-items:center;z-index:20}
.phone .tabs-g{flex:1;display:flex;border-radius:999px;padding:5px;height:64px}
.phone .tabs-g a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:999px;color:var(--iink)!important;font-size:10.5px;font-weight:500;position:relative}
.phone .tabs-g a.on{background:color-mix(in srgb,var(--iink) 9%,transparent);color:var(--tint)!important}
.phone .tabs-g em{position:absolute;top:4px;right:18px;background:#FF3B30;color:#fff;font-style:normal;font-size:10px;min-width:16px;height:16px;border-radius:8px;display:grid;place-items:center;padding:0 4px}
.phone .scanfab{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff!important}

.phone .cam{position:absolute;inset:0;background:#000}.phone .camimg{position:absolute;inset:0;background:radial-gradient(60% 40% at 50% 45%,#6b6f68,#2a2d2a 70%),#222;filter:contrast(1.05)}
.phone .cam.blur .camimg{filter:blur(8px) brightness(.6)}
.phone .camtop{position:absolute;top:60px;left:16px;right:16px;display:flex;justify-content:space-between;align-items:center;z-index:3}.phone .chipd{padding:9px 14px;border-radius:999px;font-size:14px;font-weight:600}
.phone .vf{position:absolute;top:240px;left:50%;transform:translateX(-50%);width:230px;height:230px;z-index:2;display:grid;place-items:center}
.phone .vf i{position:absolute;width:44px;height:44px;border:4px solid #fff;border-radius:6px}.phone .vf i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0;border-radius:18px 0 0 0}.phone .vf i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0;border-radius:0 18px 0 0}.phone .vf i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0;border-radius:0 0 0 18px}.phone .vf i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0;border-radius:0 0 18px 0}
.phone .vqr{padding:8px;background:#fff;border-radius:8px;transform:rotate(-4deg)}
.phone .vf.ism{position:relative;top:auto;left:auto;transform:none;width:130px;height:130px}.phone .vf.ism i{width:28px;height:28px;border-width:3px}
.phone .camhint{position:absolute;top:500px;left:0;right:0;text-align:center;color:#fff;font-weight:600;z-index:2}
.phone .cambot{position:absolute;bottom:50px;left:20px;right:20px;display:flex;flex-direction:column;gap:2px;z-index:3}.phone .cambot .gbtn{color:#fff}
.phone .sheet{position:absolute;left:8px;right:8px;bottom:8px;border-radius:38px;padding:10px 18px 30px;z-index:15;color:var(--iink)}
.phone.dk .sheet{--iink:#fff;--icard:rgba(58,58,60,.6);--isep:rgba(255,255,255,.15)}
.phone .grab{display:block;width:38px;height:5px;border-radius:3px;background:rgba(127,127,127,.5);margin:0 auto 12px}
.phone .sres{display:flex;gap:12px;align-items:center}.phone .sres b{font-size:19px;display:block}.phone .sres span{font-size:14px;color:var(--iink2)}
.phone .checks{display:flex;flex-direction:column;gap:8px;margin:14px 0 4px}.phone .checks>div{display:flex;gap:10px;align-items:flex-start}.phone .checks .i{color:#30D158;margin-top:2px}.phone .checks b{font-size:15px;display:block}.phone .checks small{font-size:13px;color:var(--iink2)}
.phone .minimap{position:relative;height:120px;border-radius:18px;margin:12px 0;background:linear-gradient(135deg,#2c3a30,#26302b);overflow:hidden}.phone .minimap .geo{position:absolute;left:30px;top:20px;width:110px;height:80px;border-radius:50%;border:2px solid #5CB27E;background:rgba(92,178,126,.2)}.phone .minimap .you{position:absolute;left:190px;top:46px;width:14px;height:14px;border-radius:50%;background:#0A84FF;box-shadow:0 0 0 12px rgba(10,132,255,.25)}

.phone .ring{position:relative;width:220px;height:220px;margin:30px 0 10px}.phone .ring svg{width:100%;height:100%;transform:rotate(-90deg)}.phone .ring circle{fill:none;stroke-width:10}.phone .ring .rt{stroke:var(--isep)}.phone .ring .rf{stroke:var(--tint);stroke-linecap:round}.phone .ring>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.phone .ring b{font-size:40px;font-weight:300;font-variant-numeric:tabular-nums}.phone .ring span{font-size:13px;color:var(--iink2)}

.phone .alloc{display:flex;height:14px;border-radius:7px;overflow:hidden;gap:2px;margin:4px 0 0}

.phone .wk{margin-bottom:6px}.phone .wktot b{font-size:34px;font-weight:700}.phone .wktot span{display:block;color:var(--iink2);font-size:14px}
.phone .bars{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;height:150px;margin-top:14px;align-items:end}
.phone .bar{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;color:var(--iink2)!important;font-size:12px}.phone .bar i{width:100%;border-radius:8px;background:var(--isep)}.phone .bar.approved i{background:var(--tint)}.phone .bar.submitted i{background:color-mix(in srgb,var(--tint) 55%,transparent)}.phone .bar.open i{background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--tint) 40%,transparent) 0 4px,transparent 4px 8px);border:1.5px solid var(--tint)}
.phone .bar small{font-size:11px;height:13px}

.phone .banner{display:flex;gap:10px;align-items:flex-start;background:var(--icard);border-radius:18px;padding:12px 14px;margin:0 0 12px;font-size:14px}.phone .banner b{display:block}.phone .banner span{color:var(--iink2)}.phone .banner.warn{background:rgba(255,159,10,.14)}.phone .banner.warn>.i{color:#C77C02}
.phone .ime{display:flex;gap:14px;align-items:center;margin-bottom:6px}.phone .ime b{display:block;font-size:18px}.phone .ime span{font-size:14px;color:var(--iink2)}
.phone .sd{width:10px;height:10px;border-radius:50%;display:inline-block;background:#8E8E93}.phone .sd.proj{background:#30D158}.phone .sd.break{background:#FF9F0A}.phone .sd.unalloc{background:#FF3B30}
.phone .apcard{margin-bottom:10px}.phone .aph{display:flex;justify-content:space-between;align-items:center}.phone .apcard p{margin:6px 0 4px;font-size:15px}.phone .apcard small{font-size:13px;color:var(--iink2);display:block;margin-bottom:6px}
.phone .itag{font-size:12px;font-weight:600;padding:3px 8px;border-radius:999px}.phone .itag.a{background:rgba(255,159,10,.16);color:#B4690E}.phone .itag.r{background:rgba(255,59,48,.14);color:#D93A30}
.phone .codebox.lettr span{font-size:22px}
@media (max-width:760px){.stage{grid-template-columns:1fr;padding:14px 0 40px}.flows{position:static;flex-direction:row;flex-wrap:wrap;max-height:none;padding:0 12px}.flows .fh{width:100%}.phone{transform:scale(.88);transform-origin:top center;margin-bottom:-100px}}
.phone .ring b span{font-size:inherit;color:var(--iink)}
.phone .ring b{color:var(--iink)}
.phone .ime .avatar{font-size:20px;color:#fff}
.phone .igrp+.igrp{margin-top:22px}
.phone .cell.inp input{font-size:16px}
.phone .minimap .geo{width:96px;height:96px;top:12px;left:40px}
.phone .gbtn[disabled]{opacity:.42;pointer-events:none}
/* self-service editing and office entry */
.phone .stp{display:inline-flex;align-items:center;gap:8px;flex:none}
.phone .stp button{width:34px;height:34px;border-radius:50%;font:500 20px/1 -apple-system,system-ui;color:var(--iink);display:grid;place-items:center;cursor:pointer;padding:0}
.phone .stp b{min-width:78px;text-align:center;font-size:15px;font-variant-numeric:tabular-nums;font-weight:600}
.phone .ichips{display:flex;flex-wrap:wrap;gap:8px}
.phone .ichip{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 14px;border-radius:16px;border:1px solid var(--isep);background:var(--icard);color:var(--iink);font:500 15px -apple-system,system-ui;cursor:pointer;text-align:left}
.phone .ichip small{font-size:12px;color:var(--iink2);font-weight:400}
.phone .ichip.on{background:color-mix(in srgb,var(--tint) 14%,var(--icard));border-color:var(--tint);color:var(--iink);box-shadow:inset 0 0 0 1px var(--tint)}
.phone .judge{display:flex;gap:10px;align-items:flex-start;border-radius:18px;padding:12px 14px;margin:16px 0 0;font-size:14px;background:color-mix(in srgb,#3E7B57 12%,var(--icard))}
.phone .judge.sup{background:color-mix(in srgb,#C2742A 14%,var(--icard))}
.phone .judge>.i{flex:none;margin-top:2px;color:#3E7B57}.phone .judge.sup>.i{color:#C2742A}
.phone .judge b{display:block;font-size:15px}.phone .judge span{display:block;color:var(--iink2);margin-top:2px}
.phone .tbar{width:5px;align-self:stretch;border-radius:3px;flex:none}
.phone .row2.wide{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}.phone .row2.wide .gbtn{margin-top:10px}
.phone .cr.small2{font-size:13px;max-width:96px;line-height:1.25}
.phone .perm.later{opacity:.85}
.phone .usual{display:flex;gap:3px;height:10px;margin:12px 0 10px;border-radius:5px;overflow:hidden}.phone .usual>div{display:contents}.phone .usual i{display:block;height:100%}
.phone .urow{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:15px}.phone .urow span{flex:1;display:flex;flex-direction:column}.phone .urow small{font-size:12.5px;color:var(--iink2)}
.phone .qfill{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:2px -18px 12px;padding:2px 18px}.phone .qfill .gbtn{margin:0;flex:none;font-size:14px}
.phone .wkgrid{padding:16px}.phone .wkh{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.phone .wkh b{font-size:28px;font-weight:700}.phone .wkh span{color:var(--iink2);font-size:13px;flex:1}
.phone .segc{display:inline-flex;background:var(--ib);border-radius:99px;padding:2px}.phone .segc button{border:0;background:none;padding:6px 12px;border-radius:99px;font:500 13px -apple-system,system-ui;color:var(--iink2);cursor:pointer}.phone .segc button[aria-pressed="true"]{background:var(--icard);color:var(--iink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.phone .gridt{display:grid;grid-template-columns:minmax(0,1fr) repeat(5,36px);gap:6px 4px;align-items:center}
.phone .gh{border:0;background:none;font:600 12px -apple-system,system-ui;color:var(--iink2);cursor:pointer;padding:0}
.phone .gp{display:grid;grid-template-columns:10px minmax(0,1fr);column-gap:6px;align-items:center;font-size:13px;min-width:0}.phone .gp b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phone .gp small{grid-column:2;font-size:11.5px;color:var(--iink2)}.phone .gp .dotc{width:8px;height:8px}
.phone .gp.tot{display:block;font-weight:600;color:var(--iink2);padding-top:6px;border-top:.5px solid var(--isep)}
.phone .gc{height:34px;border-radius:10px;border:0;background:color-mix(in srgb,var(--tint) 12%,var(--ib));font:600 14px -apple-system,system-ui;color:var(--iink);cursor:pointer;font-variant-numeric:tabular-nums}.phone .gc.z{background:var(--ib);color:var(--iink2)}
.phone .gt{text-align:center;font-size:14px;padding-top:6px;border-top:.5px solid var(--isep);font-variant-numeric:tabular-nums}.phone .gt.off8{color:#C2742A}
.phone .usualrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}.phone .usualrow .gbtn{flex:1}
.phone .notif{margin:40px 0 0;width:100%;border-radius:24px;padding:14px 16px;color:#fff}.phone .notif .nh{display:flex;align-items:center;gap:8px;font-size:12px;opacity:.8;margin-bottom:6px}.phone .notif .nh span:last-child{margin-left:auto}.phone .notif .nh svg{border-radius:5px}.phone .notif b{font-size:16px}.phone .notif p{margin:3px 0 0;font-size:14.5px;opacity:.9}
.phone .nacts{margin-top:8px;width:100%;border-radius:20px;display:flex;flex-direction:column;overflow:hidden}.phone .nacts button{display:flex;align-items:center;gap:10px;background:none;border:0;color:#fff;font:500 16px -apple-system,system-ui;padding:14px 18px;cursor:pointer;text-align:left}.phone .nacts button+button{border-top:.5px solid rgba(255,255,255,.2)}
.phone .gweek{display:flex;gap:8px;align-items:flex-end}.phone .gweek>div{display:flex;flex-direction:column;gap:2px;width:40px;height:120px;justify-content:flex-end}.phone .gweek span{order:9;font-size:12px;text-align:center;color:var(--iink2);margin-top:4px}.phone .gweek i{display:block;border-radius:4px;min-height:0}
.phone .gstep{display:flex;align-items:center;gap:10px;background:var(--icard);border-radius:20px;padding:14px 16px;box-shadow:0 8px 24px rgba(0,0,0,.08)}.phone .gstep b{font-size:15px}
.phone .gfix{display:flex;flex-direction:column;align-items:center;gap:10px}.phone .gfix small{font-size:13px;color:var(--iink2)}
.phone .ichip{height:auto;min-height:0;line-height:1.2}
.phone .urow>span:not(.dotc){flex:1}.phone .urow .dotc{flex:none}
.phone .stp{gap:6px}.phone .stp button{width:30px;height:30px;font-size:18px}.phone .stp b{min-width:64px}
.phone .ghd+.ichips{margin-bottom:4px}
/* time off */
.phone .baltiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:4px}
.phone .baltiles .glass-card{padding:12px;border-radius:20px;display:flex;flex-direction:column;gap:2px;min-width:0}
.phone .baltiles .eyebrow{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--iink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.phone .baltiles .eyebrow i{width:7px;height:7px;border-radius:50%;flex:none}
.phone .baltiles b{font-size:22px;font-weight:700}.phone .baltiles small{font-size:11.5px;color:var(--iink2);line-height:1.25}
.phone .itag.g{background:color-mix(in srgb,#3E7B57 16%,transparent);color:#2C6B47}.phone .itag.n{background:var(--ib);color:var(--iink2)}
.phone .ical{padding:12px 12px 10px}.phone .calh{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.phone .calh .nbb{width:34px;height:34px}.phone .calh .nbb[disabled]{opacity:.3}
.phone .cgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.phone .cgrid .dw{font-size:11px;color:var(--iink2);text-align:center;padding:2px 0 4px}
.phone .cd{height:38px;border:0;background:none;border-radius:10px;font:500 15px -apple-system,system-ui;color:var(--iink);cursor:pointer;font-variant-numeric:tabular-nums;position:relative}
.phone .cd.we{color:var(--iink2)}
.phone .cd.hol::after{content:"";position:absolute;left:50%;bottom:4px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#7A4FB0}
.phone .cd.in{background:color-mix(in srgb,var(--tint) 16%,transparent);border-radius:0}
.phone .cd.s{border-radius:10px 0 0 10px}.phone .cd.e{border-radius:0 10px 10px 0}.phone .cd.s.e{border-radius:10px}
.phone .cd.s,.phone .cd.e{background:var(--tint);color:#fff;font-weight:700}
.phone .calk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--iink2);margin:8px 2px 0}.phone .calk .hk{width:6px;height:6px;border-radius:50%;background:#7A4FB0}
.phone .tg{width:51px;height:31px;border-radius:99px;border:0;background:var(--isep);position:relative;cursor:pointer;flex:none;padding:0}
.phone .tg i{position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:left .2s}
.phone .tg.on{background:#34C759}.phone .tg.on i{left:22px}
.phone .warnline{display:block;color:#B4621E;margin-top:4px}
.phone .gc.to{display:grid;place-items:center;text-decoration:none;background:color-mix(in srgb,#C2742A 16%,var(--ib));color:var(--iink)}.phone .gc.to.z{background:var(--ib);color:var(--iink2)}
.phone a.banner{color:var(--iink);align-items:center}.phone a.banner>div{flex:1}.phone a.banner span{display:block;color:var(--iink2)}
.phone .glass-card.ical{width:100%;box-sizing:border-box}
/* supervisor */
.phone .nbb.txt{width:auto;padding:0 14px;border-radius:99px;font:600 15px -apple-system,system-ui;color:var(--tint)}
.phone .fixcard{display:flex;flex-direction:column;gap:10px;margin-bottom:10px;padding:14px 16px}.phone .fixcard b{display:block;font-size:15.5px}.phone .fixcard small{display:block;font-size:13.5px;color:var(--iink2);margin-top:2px}
.phone .fixbtns{display:flex;gap:8px;flex-wrap:wrap}.phone .fixbtns .gbtn{margin:0}
.phone .bulkbar{position:absolute;left:12px;right:12px;bottom:28px;z-index:30;display:flex;align-items:center;gap:6px;padding:8px 8px 8px 16px;border-radius:99px}
.phone .bulkbar span{flex:1;font-size:14px;font-weight:600}.phone .bulkbar button{border:0;background:none;color:var(--tint);font:600 14px -apple-system,system-ui;padding:8px 8px;cursor:pointer}.phone .bulkbar button[disabled]{opacity:.35}
.phone .whohd{display:flex;align-items:center;gap:14px;margin:6px 0 14px}.phone .whohd h1{margin:0;font-size:28px;font-weight:700}.phone .whohd p{margin:2px 0 0;color:var(--iink2);font-size:14px}
.phone .actgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.phone .actgrid button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 0;border-radius:18px;font:600 12.5px -apple-system,system-ui;color:var(--iink);cursor:pointer}
.phone .otchip{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--iink2);background:var(--icard);border-radius:16px;padding:10px 12px;margin:10px 0 0}.phone .otchip>.i{flex:none;margin-top:1px;color:#C2742A}
.phone .scanalt{justify-content:flex-start;gap:12px;margin:4px 0 12px;padding:0 18px;text-align:left}.phone .scanalt span{display:flex;flex-direction:column;gap:2px;font-size:16px}.phone .scanalt small{font-size:12.5px;font-weight:400;color:var(--iink2)}.phone .scanalt>.i{color:var(--tint)}
.phone .search-i{display:flex;align-items:center;gap:8px;background:color-mix(in srgb,var(--iink) 7%,transparent);border-radius:12px;padding:9px 12px;margin-bottom:6px;color:var(--iink2)}.phone .search-i input{flex:1;border:0;background:none;font:inherit;font-size:16px;color:var(--iink);outline:0}
.phone .tasks{display:flex;flex-wrap:wrap;gap:8px;padding:2px 16px 14px 38px}
.phone a.gbtn.scanalt,.phone a.gbtn.scanalt span{color:var(--iink)}
.phone .bring{position:relative;width:236px;height:236px;margin:34px 0 12px}
.phone .bring svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.phone .bring circle{fill:none;stroke-width:9}
.phone .bring .bt{stroke:color-mix(in srgb,var(--iink) 8%,transparent)}
.phone .bring .bf{stroke:var(--tint);stroke-linecap:round;transition:stroke-dashoffset .25s linear,stroke .3s}
.phone .bring.over .bf{stroke:#D98A2B}
.phone .bring>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.phone .bring .bk{font-size:13px;font-weight:600;color:var(--iink2);letter-spacing:.02em;text-transform:uppercase}
.phone .bring b{font-size:54px;font-weight:300;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--iink);line-height:1.05}
.phone .bring.over b{color:#C2742A}
.phone .bring .bs{font-size:14px;color:var(--iink2)}
/* sign-in */
.phone .ssodiv{display:flex;align-items:center;gap:10px;margin:16px 0 4px;color:var(--iink2);font-size:13px}.phone .ssodiv::before,.phone .ssodiv::after{content:"";flex:1;height:.5px;background:var(--isep)}
.phone .ssorow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.phone .ssob{flex-direction:column;gap:5px;min-height:68px;margin:0;padding:8px 4px;border-radius:20px;font-size:13px;font-weight:600}
.phone .ssob svg{width:22px;height:22px}
.phone .ssofound{display:flex;gap:12px;align-items:flex-start;margin-top:14px}.phone .ssofound>svg{width:26px;height:26px;flex:none;margin-top:2px}.phone .ssofound b{display:block;font-size:16px}.phone .ssofound span{display:block;font-size:14px;color:var(--iink2);margin-top:2px}
.phone .ssomain svg{width:20px;height:20px;background:#fff;border-radius:5px;padding:2px}
.phone .ssologo{width:30px;height:30px;border-radius:8px;background:#fff;display:grid;place-items:center;box-shadow:inset 0 0 0 .5px var(--isep);flex:none}.phone .ssologo svg{width:18px;height:18px}
.phone .sysalert{position:absolute;inset:0;background:rgba(0,0,0,.28);display:grid;place-items:center;z-index:50}
.phone .sa{width:270px;border-radius:16px;text-align:center;overflow:hidden;color:var(--iink)}.phone .sa b{display:block;padding:18px 16px 4px;font-size:16px;line-height:1.3}.phone .sa p{margin:0;padding:0 16px 16px;font-size:13px;color:var(--iink2)}
.phone .sab{display:grid;grid-template-columns:1fr 1fr;border-top:.5px solid var(--isep)}.phone .sab button{border:0;background:none;padding:12px;font:400 17px -apple-system,system-ui;color:#0A84FF;cursor:pointer}.phone .sab button+button{border-left:.5px solid var(--isep);font-weight:600}
.phone .bigclock{text-align:center;padding:22px 16px;margin-bottom:6px}.phone .bigclock b{display:block;font-size:44px;font-weight:300;margin:4px 0;font-variant-numeric:tabular-nums}.phone .bigclock small{color:var(--iink2);font-size:14px}
.phone .cmp{display:flex;align-items:center;justify-content:space-around;margin-bottom:12px}.phone .cmp>div{text-align:center}.phone .cmp b{display:block;font-size:20px;margin-top:2px}.phone .cmp small{color:var(--iink2)}.phone .cmp>.i{color:var(--iink2)}
.phone .cell.faq{align-items:flex-start}.phone .cell.faq .ans{margin-top:6px;line-height:1.4;font-size:14.5px}
.phone .ltime{font-variant-numeric:tabular-nums}
/* wrap fixes */
.phone .gbtn.sm{white-space:nowrap}
.phone .apcard .row2,.phone .fixbtns{display:flex;flex-wrap:wrap;gap:8px}.phone .apcard .row2 .gbtn{flex:1 1 auto}
.phone .tabs-g em{position:absolute}
.phone .baltiles .eyebrow{flex-wrap:nowrap}
/* my week editor */
.phone .wstrip{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:2px 0 12px}
.phone .wd{display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 0;border-radius:16px;border:0;background:none;color:var(--iink);cursor:pointer;font-family:inherit}
.phone .wd span{font-size:11px;color:var(--iink2);font-weight:600}.phone .wd b{font-size:17px;font-weight:600}.phone .wd small{font-size:11.5px;color:var(--iink2);font-variant-numeric:tabular-nums;height:14px}
.phone .wd.today b{color:var(--tint)}
.phone .wd.on{background:var(--tint);color:#fff}.phone .wd.on span,.phone .wd.on small,.phone .wd.on b{color:#fff}
.phone .wd.we{opacity:.4}
.phone .dayed{padding:14px}
.phone .dh{display:flex;align-items:center;gap:10px;margin-bottom:8px}.phone .dh>div{flex:1;text-align:center}.phone .dh b{display:block;font-size:17px}.phone .dh span{font-size:13px;color:var(--iink2)}.phone .dh .nbb{width:34px;height:34px}.phone .dh .nbb[disabled]{opacity:.3}
.phone .erows{display:flex;flex-direction:column}
.phone .erow{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:.5px solid var(--isep);color:var(--iink)}
.phone .erow:first-child{border-top:0}
.phone .erow .en{flex:1;min-width:0;display:flex;flex-direction:column}.phone .erow .en b{font-size:15px;line-height:1.25}.phone .erow .en small{font-size:12.5px;color:var(--iink2)}
.phone .erow.zero .en b{color:var(--iink2);font-weight:500}
.phone .hin{display:flex;align-items:center;gap:4px;flex:none}
.phone .hin button{width:30px;height:30px;border-radius:50%;font:500 18px/1 -apple-system,system-ui;color:var(--iink);display:grid;place-items:center;padding:0;cursor:pointer}
.phone .hin input{width:48px;height:36px;border-radius:10px;border:0;background:color-mix(in srgb,var(--iink) 7%,transparent);text-align:center;font:600 16px -apple-system,system-ui;color:var(--iink);font-variant-numeric:tabular-nums}
.phone .hin input:focus{outline:2px solid var(--tint);background:var(--icard)}
.phone .erow.to .toh{font-weight:600;font-size:15px;padding-right:38px}
.phone .addrow{display:flex;align-items:center;gap:8px;width:100%;border:1.5px dashed var(--isep);background:none;border-radius:14px;padding:11px 12px;margin:8px 0 10px;color:var(--tint);font:600 15px -apple-system,system-ui;cursor:pointer}
.phone .qacts{display:flex;gap:6px;flex-wrap:wrap}.phone .qacts .ichip{flex-direction:row;align-items:center;gap:5px;font-size:13.5px;padding:7px 11px}
.phone .wkbar{position:absolute;left:12px;right:12px;bottom:98px;z-index:20;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 16px;border-radius:22px}
.phone .wkp{flex:1;display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:baseline}.phone .wkp b{font-size:20px}.phone .wkp span{font-size:13px;color:var(--iink2)}
.phone .wkp i{grid-column:1/-1;height:4px;border-radius:2px;margin-top:6px;background:linear-gradient(90deg,var(--tint) calc(var(--p)*100%),color-mix(in srgb,var(--iink) 10%,transparent) 0)}
.phone .wkbar .gbtn{width:auto;margin:0;min-height:42px;padding:0 20px}
.phone .cell.col{flex-direction:column;align-items:stretch;gap:8px}
.phone .hold{position:relative;overflow:hidden;width:100%;min-height:56px;border-radius:999px;color:#fff;font:600 17px -apple-system,system-ui;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:none}
.phone .hold i{position:absolute;inset:0;width:0;background:rgba(255,255,255,.28);transition:width .1s}
.phone .hold.holding i{width:100%;transition:width .9s linear}
.phone .hold span{position:relative}


.phone:has(>.wkbar) .scr{padding-bottom:190px}
.phone .ichip:has(>svg){flex-direction:row;align-items:center;gap:5px}
.phone .plist{margin-bottom:6px}.phone .plist .cell{align-items:center}.phone .plist .cl b{line-height:1.25}
.phone .radio-i{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--isep);flex:none;position:relative}
.phone .radio-i.on{border-color:var(--tint)}.phone .radio-i.on::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--tint)}
.phone .wkq{margin:0 0 10px}
/* supervisor reports */
.phone .segc.full{display:flex;width:100%;margin:2px 0 12px}.phone .segc.full button{flex:1}
.phone .schart{padding:14px 16px;margin-top:12px}
.phone .sch{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.phone .sch b{font-size:16px}
.phone .lgd{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--iink2)}.phone .lgd i{width:8px;height:8px;border-radius:2px;margin-left:6px}
.phone .rbars{display:flex;gap:10px;height:150px;align-items:flex-end}
.phone .rbar{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;border:0;background:none;padding:0;cursor:pointer;color:var(--iink);font-family:inherit}
.phone .sv{font-size:12px;font-weight:600;height:16px;font-variant-numeric:tabular-nums}
.phone .scol{flex:1;width:100%;max-width:34px;display:flex;flex-direction:column;justify-content:flex-end;gap:2px}.phone .scol i{display:block;width:100%}.phone .scol i:first-child{border-radius:6px 6px 0 0}.phone .scol i:last-child{border-radius:0 0 3px 3px}
.phone .rbar:not(.on) .scol{opacity:.85}.phone .rbar.on .scol{filter:saturate(1.2)}.phone .rbar.on .sl{color:var(--iink);font-weight:700}
.phone .sl{font-size:12px;color:var(--iink2);margin-top:6px}
.phone .sdet{margin:10px 0 0;font-size:13.5px;color:var(--iink2)}
.phone .cr.otv{color:#C2742A;font-weight:600}
.phone .mbud{display:block;height:5px;border-radius:3px;background:color-mix(in srgb,var(--iink) 9%,transparent);margin-top:6px;overflow:hidden}.phone .mbud i{display:block;height:100%;background:var(--tint);border-radius:3px}.phone .mbud i.hot{background:#C2742A}
.phone .sbar:not(.w){background:linear-gradient(to bottom,var(--ib) 0,color-mix(in srgb,var(--ib) 88%,transparent) 62%,transparent 100%);height:60px}
.phone .banner.ann{position:relative;padding-right:40px;background:color-mix(in srgb,#2F6FA8 10%,var(--icard))}.phone .banner.ann>.i{color:#2F6FA8}
.phone .banner .nbb.x{position:absolute;top:8px;right:8px;width:26px;height:26px;border:0;background:none;box-shadow:none;color:var(--iink2);cursor:pointer;display:grid;place-items:center}
.phone .badge{display:inline-grid;place-items:center;min-width:22px;height:22px;border-radius:11px;background:#FF3B30;color:#fff;font-size:13px;font-weight:600;padding:0 6px}
.phone .lt .itag{align-self:flex-start;margin-top:8px}
.phone .qlist{padding:0 12px 12px 36px;display:flex;flex-direction:column;gap:6px}
.phone .qrow{display:flex;align-items:center;gap:10px;width:100%;border:0;background:color-mix(in srgb,var(--iink) 4%,transparent);border-radius:14px;padding:8px 10px;cursor:pointer;color:var(--iink);text-align:left;font-family:inherit}
.phone .qrow>span:nth-child(2){flex:1;display:flex;flex-direction:column}.phone .qrow b{font-size:15px}.phone .qrow small{font-size:12.5px;color:var(--iink2)}
.phone .qmini{border-radius:6px;overflow:hidden;flex:none;box-shadow:0 0 0 .5px var(--isep)}
.phone .qlabel{margin:6px auto 4px;width:260px;background:#fff;color:#111;border-radius:20px;padding:16px;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 12px 30px rgba(0,0,0,.12),0 0 0 .5px rgba(0,0,0,.08)}
.phone .qlt{display:flex;align-items:center;gap:6px;font-size:13px}.phone .qlt svg{border-radius:4px}
.phone .qln{font-size:15px;text-align:center}.phone .qls{font-size:12px;color:#555;text-align:center}.phone .qlc{font:500 11px ui-monospace,Menlo,monospace;color:#666}
.phone .bottomcta{position:sticky;left:auto;right:auto;bottom:0;margin-top:auto}.phone .scr:has(.bottomcta)>.bottomcta{margin-top:auto}.phone .scr:has(.bottomcta)>:nth-last-child(2){margin-bottom:18px}
.phone .scr:has(.bottomcta){padding-bottom:0;display:flex;flex-direction:column}
.phone .scr:has(.bottomcta)>*{flex-shrink:0}
.phone .okbig.wait{background:#C2742A;margin:8px auto 4px}.phone .onbtop .okbig.wait{margin:0 auto}.phone .orglogo.big{width:84px;height:84px;border-radius:22px;font-size:30px;margin:0 auto}
.phone .onbbtns .fine{text-align:center}

.phone .taskrow{display:inline-flex;align-items:center;gap:2px}.phone .savebtn{width:30px;height:30px;border-radius:50%;border:0;background:none;color:var(--iink2);display:grid;place-items:center}.phone .savebtn.on{color:#C2742A}.phone .savebtn.on svg{fill:currentColor}
.phone .savedmark{color:#C2742A;margin-right:6px;display:grid}.phone .savedmark svg{fill:currentColor}
.phone .allocbar{display:flex;flex-direction:column;gap:10px;padding:14px 16px;margin:4px 0 10px}.phone .allocbar>div{display:flex;justify-content:space-between;align-items:baseline}.phone .allocbar b{font-size:20px}.phone .allocbar span{font-size:13px;color:var(--iink2)}
.phone .allocbar i{display:block;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--tint) calc(var(--p)*100%),var(--isep) 0)}.phone .allocbar i.over{background:#D93A30}

/* long project names: never cut off, so two similar names can always be told apart */
.phone .cl b,.phone .en b{overflow-wrap:anywhere}
.phone .pname{overflow-wrap:anywhere;line-height:1.15}
.phone .parenthd{margin:22px 16px 8px;display:flex;flex-direction:column;gap:2px}
.phone .parenthd small{font-size:12px;color:var(--iink2);text-transform:uppercase;letter-spacing:.03em}
.phone .parenthd b{font-size:15px;font-weight:600;line-height:1.3;color:var(--iink)}
.phone .taskrows{display:flex;flex-direction:column;padding:0 0 6px 38px}
.phone .taskrow2{display:flex;align-items:center;border-top:1px solid var(--isep)}
.phone .taskrow2 .tgo{flex:1;display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:44px;border:0;background:none;font:inherit;font-size:16px;color:var(--iink);text-align:left;padding:0 8px 0 0}
.phone .taskrow2 .tgo em{font-style:normal;flex:1;min-width:0;overflow-wrap:anywhere;padding:10px 0;line-height:1.3}.phone .taskrow2 .tgo span{flex:none;font-size:14px;color:var(--tint);font-weight:600}
.phone .taskrow2 .tgo.on span{color:var(--iink2)}
.phone .ptaskp{display:block;font-size:13px;color:var(--iink2);margin-top:4px;overflow-wrap:anywhere}

.phone .laTop b{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}

.phone .laTop span{overflow-wrap:anywhere}

.phone .pfull{margin-top:6px}.phone .pfull summary{font-size:13px;color:var(--tint);font-weight:600;cursor:pointer;list-style:none}.phone .pfull summary::-webkit-details-marker{display:none}.phone .pfull[open] summary{margin-bottom:2px}

/* ================= presentation bar ================= */
.pres{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:14px;height:56px;padding:0 18px;background:var(--glass-strong);-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);border-bottom:1px solid var(--line)}
.pbrand{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none}.pbrand svg{border-radius:7px;box-shadow:0 1px 3px rgba(0,0,0,.15)}.pbrand b{font-size:16px}
.psurf{display:flex;gap:2px;padding:3px;border-radius:12px;background:var(--surface2);border:1px solid var(--line)}
.psurf a{padding:6px 14px;border-radius:9px;color:var(--ink2);text-decoration:none;font-size:14px;font-weight:560}.psurf a.on{background:var(--fill);color:var(--on-fill)}
body[data-surf="ios"]{background:radial-gradient(70vmax 50vmax at 70% 0%,var(--glow),transparent 70%) fixed,var(--page)}
/* console adjustments under the bar */
.app .side{top:68px;max-height:calc(100vh - 80px)}
.tlogo.wht{background:#fff;border-radius:9px;display:grid;place-items:center;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.btn.primary,.btn.primary:hover{color:var(--on-fill)}
.ribbon,.agrid{display:none}
.setupcard .cardhd{align-items:center}
.setupgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:14px 16px 16px}
.sstep{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;border:1px solid var(--line);text-decoration:none;color:var(--ink)}.sstep:hover{border-color:var(--brand)}.sstep b{display:block;font-size:14px}.sstep small{color:var(--ink3);font-size:12.5px}.sstep.done{opacity:.72}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.sitecards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.sitec{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;color:var(--ink);cursor:pointer;font:inherit}.sitec.on{box-shadow:inset 0 0 0 2px var(--brand),var(--shadow)}
.mini-map{width:100%;margin-top:8px;border-radius:10px;overflow:hidden;height:80px}
:root{--mapbg:#E8EDE6;--maproad:#fff;--mapbld:#D3DBD0}[data-theme="dark"]{--mapbg:#1C231E;--maproad:#2A332C;--mapbld:#252E27}
svg.map{width:100%;height:100%;display:block}
.bigmap{height:240px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sitelayout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:16px;align-items:start}
.row.picked{background:var(--brand-weak)}
.polgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.lg{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink3)}.sdot{width:8px;height:8px;border-radius:50%;background:var(--ink3)}.sdot.proj{background:var(--green)}.sdot.break{background:var(--amber)}.sdot.unalloc{background:var(--red)}
.verif{display:inline-flex;gap:4px;color:var(--green)}
.qthumb{border-radius:6px;overflow:hidden;border:1px solid var(--line);flex:none;line-height:0}
.labelprev{display:grid;place-items:center;padding:18px;border-radius:14px;background:var(--surface2)}
.qrlabel{background:#fff;color:#111;border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);width:240px;text-align:center}
.ql-top{display:flex;align-items:center;gap:8px;font-size:14px}.ql-top svg{border-radius:6px;box-shadow:0 0 0 1px #ddd}
.ql-name{font-size:15px}.ql-sub{font-size:12px;color:#555}.ql-code{font-size:11px;color:#777;font-family:var(--mono)}
.kiosk{display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}.kq{padding:14px;background:#fff;border-radius:16px}
.recon{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.recon>div{display:flex;flex-direction:column}.recon b{font-size:20px}
.planrow{display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:space-between}
.shiftchip{display:inline-block;font:inherit;font-size:12.5px;padding:4px 10px;border-radius:8px;border:0;background:color-mix(in srgb,var(--c) 14%,transparent);color:var(--ink);white-space:nowrap;cursor:pointer}.shiftchip:hover{background:color-mix(in srgb,var(--c) 24%,transparent)}.shiftadd{display:inline-flex;align-items:center;gap:4px;font:inherit;font-size:12.5px;padding:4px 10px;border-radius:8px;border:1px dashed var(--line2);background:none;color:var(--ink3);cursor:pointer}.shiftadd:hover{color:var(--ink);border-color:var(--ink3)}
.pdot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}
td .hot{color:var(--red);font-weight:700}
.bar2{display:flex;align-items:center;gap:10px;font-size:13.5px}.bar2 .t{width:170px;flex:none;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar2 .m{flex:1;height:10px;border-radius:5px;background:var(--surface3);overflow:hidden}.bar2 .m i{display:block;height:100%;border-radius:5px}.bar2 b{width:64px;text-align:right;font-variant-numeric:tabular-nums}
.drawer.wide{width:min(720px,100vw)}
.meta{display:flex;gap:6px 8px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--ink3)}
.row:has(>div:first-child:nth-last-child(2)){grid-template-columns:minmax(0,1fr) auto}.row:has(>div:only-child){grid-template-columns:minmax(0,1fr)}
/* view as */
.vaov{position:fixed;inset:0;z-index:80;background:var(--page);display:flex;flex-direction:column}
.vabar{display:flex;align-items:center;gap:10px;padding:12px 20px;background:#B4361F;color:#fff}.vabar span{opacity:.9;font-size:14px}.vabar .btn{background:#fff;color:#B4361F;border:0}
.vabody{flex:1;overflow:auto;display:grid;grid-template-columns:minmax(0,380px) auto;gap:40px;justify-content:center;align-items:start;padding:30px 20px}
.vaphone .phone{box-shadow:0 0 0 11px #0d0f0e,0 0 0 13px #B4361F,0 30px 80px rgba(0,0,0,.3)}
.readonly .gbtn,.readonly button.cell{opacity:.55}
/* ================= inside NetSuite ================= */
.ns{--nsnavy:#22324A;--nsblue:#2E5C8A;--nsbg:#EEF1F4;--nsline:#CDD5DE;background:var(--nsbg);min-height:calc(100vh - 56px);color:#1f2937;font:13px/1.45 Arial,Helvetica,sans-serif}
.nshead{display:flex;align-items:center;gap:16px;height:44px;padding:0 16px;background:var(--nsnavy);color:#fff}
.nslogo{font-weight:700;letter-spacing:.02em}.nsco{opacity:.8}.nssearch{margin-left:auto;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border-radius:4px;padding:4px 8px}.nssearch input{background:none;border:0;color:#fff;outline:0;width:180px}.nsrole{font-size:12px;opacity:.85}
.nsmenu{display:flex;gap:2px;background:#33475F;padding:0 10px;overflow-x:auto}.nsmenu span{color:#dfe6ee;padding:9px 12px;white-space:nowrap;display:flex;align-items:center;gap:6px;cursor:default}.nsmenu span.on{background:var(--nsbg);color:var(--nsnavy);font-weight:700;cursor:pointer;border-radius:4px 4px 0 0}
.nspage{padding:14px 18px 40px;max-width:1280px}
.nscrumb{font-size:12px;color:#5b6b7d;margin-bottom:6px}
.nstitle{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--nsline);margin-bottom:14px}.nstitle h1{font-size:22px;font-weight:400;color:#1f2937;margin:0 0 8px}
.nstabs{display:flex;gap:2px;flex-wrap:wrap}.nstabs a{padding:7px 12px;background:#dfe5ec;color:#33475F;text-decoration:none;border-radius:4px 4px 0 0;font-size:12.5px}.nstabs a.on{background:#fff;color:var(--nsnavy);font-weight:700;box-shadow:0 -2px 0 var(--nsblue) inset}
.nsgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.nsport{background:#fff;border:1px solid var(--nsline);border-radius:4px;margin-bottom:14px}.nsph{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:linear-gradient(#f6f8fa,#e9edf2);border-bottom:1px solid var(--nsline);color:var(--nsnavy);font-size:13.5px}.nspb{padding:12px}
.nsok{color:#1a7f37;font-weight:700;display:flex;gap:6px;align-items:center;margin-bottom:8px}
.nskv{border-collapse:collapse;margin-bottom:10px}.nskv td{padding:4px 14px 4px 0;vertical-align:top}.nskv td:first-child{color:#5b6b7d;text-transform:uppercase;font-size:11px;letter-spacing:.03em;padding-top:6px;white-space:nowrap}
.nstable{width:100%;border-collapse:collapse;background:#fff}.nstable th{background:#e9edf2;color:#33475F;text-align:left;font-weight:700;font-size:11.5px;text-transform:uppercase;padding:6px 8px;border-bottom:1px solid var(--nsline)}.nstable td{padding:6px 8px;border-bottom:1px solid #eef1f4}.nstable tr:nth-child(even) td{background:#f8fafc}.nstable .r{text-align:right}.nstable .ok{color:#1a7f37}.nstable .bad{color:#b42318;font-weight:700}.nstable a{color:var(--nsblue)}
.nstable.big{border:1px solid var(--nsline)}
.nsbtn{background:linear-gradient(#fff,#e9edf2);border:1px solid #9fb0c2;border-radius:3px;padding:5px 12px;font:700 12.5px Arial;color:#22324A;cursor:pointer;margin:6px 6px 0 0}.nsbtn.p{background:linear-gradient(#4b84bd,#2E5C8A);color:#fff;border-color:#244b72}
.nsbig{display:flex;gap:24px}.nsbig b{font-size:28px;display:block;color:var(--nsnavy)}.nsbig span{color:#5b6b7d}
.nsfine{color:#5b6b7d;font-size:12px;margin:10px 0 0}
.nssteps{background:#fff;border:1px solid var(--nsline);border-radius:4px}.nsstep{display:flex;gap:12px;align-items:center;padding:12px 14px;border-bottom:1px solid #eef1f4}.nsstep>span{width:24px;height:24px;border-radius:50%;background:#dfe5ec;display:grid;place-items:center;font-weight:700;flex:none}.nsstep.ok>span{background:#1a7f37;color:#fff}.nsstep.cur{background:#f2f7fc}.nsstep.cur>span{background:var(--nsblue);color:#fff}.nsstep div{flex:1}.nsstep p{margin:2px 0 0;color:#5b6b7d}
.nsfilters{display:flex;gap:16px;align-items:center;margin-bottom:10px;flex-wrap:wrap}.nsfilters span{background:#fff;border:1px solid var(--nsline);padding:5px 10px;border-radius:3px}
.nsrec{background:#fff;border:1px solid var(--nsline);border-radius:4px;padding:12px;margin-bottom:12px}
.nssub{display:flex;gap:2px;margin-bottom:-1px}.nssub span{padding:7px 14px;background:#dfe5ec;border-radius:4px 4px 0 0;color:#33475F}.nssub span.on{background:#fff;font-weight:700;border:1px solid var(--nsline);border-bottom-color:#fff}
.nsqr{display:flex;gap:14px;margin:10px 0}.nsqr div{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:#5b6b7d;padding:8px;border:1px solid var(--nsline);border-radius:4px}
@media (max-width:1100px){.setupgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.sitelayout{grid-template-columns:minmax(0,1fr)}.vabody{grid-template-columns:minmax(0,1fr);justify-items:center}}
@media (max-width:900px){.cols2,.nsgrid{grid-template-columns:minmax(0,1fr)}.sitecards{grid-template-columns:minmax(0,1fr)}.polgrid{grid-template-columns:minmax(0,1fr)}.pres .pbrand span{display:none}}
@media (max-width:640px){.pres{gap:8px;padding:0 10px;overflow-x:auto}.pres .pbrand b{display:none}.psurf a{padding:6px 9px;font-size:13px}.pres .seg{display:none}.setupgrid{grid-template-columns:minmax(0,1fr)}.nshead .nsco,.nshead .nsrole{display:none}}
.pres .seg{max-width:none;overflow:visible}
@media (max-width:760px){.devwrap{width:100%;overflow:hidden;align-items:center}}

.nsqr{flex-wrap:wrap}
@media (max-width:760px){.nsrec .nskv,.nsport .nskv{width:100%;table-layout:fixed}.nskv td{word-break:break-word}.nssub{overflow-x:auto;white-space:nowrap}.nstitle{flex-wrap:wrap}.nstabs{overflow-x:auto;max-width:100%}}
.psurf a{white-space:nowrap}
@media (max-width:760px){.stage{display:flex;flex-direction:column}.stage .flows{order:2;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding:10px 12px;scrollbar-width:none}.stage .flows .fh{display:none}.stage .flows a{flex:none;white-space:nowrap}.stage .devwrap{order:1}}
@media (max-width:640px){.pres .ohurl,.pres .pbrand span{display:none}.psurf a{padding:6px 8px}}
@media (max-width:760px){.stage{width:100%;max-width:100vw;min-width:0}.stage>*{min-width:0;max-width:100%}.stage .flows{width:100%;box-sizing:border-box}}
@media (max-width:640px){.psurf a{padding:6px 7px;font-size:12.5px}.pres{gap:6px}}
.nsscroll{overflow-x:auto}.nsscroll .nstable{width:100%;white-space:nowrap}
.nsfilters{align-items:center}.nsfilters .nsbtn{margin:0}
.exbars{display:flex;align-items:flex-end;gap:14px;height:170px;padding-top:8px}.exbars>div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:100%}.exbars b{font-size:13px}.exbars i{display:block;width:100%;max-width:64px;border-radius:6px 6px 2px 2px;background:var(--fill)}.exbars span{font-size:12px;color:var(--ink3)}
.vapanel .kv{grid-template-columns:110px minmax(0,1fr)}
.drawer .labelprev{margin-bottom:24px}
/* my time grid */
.tscroll{overflow-x:auto}
.tgrid{width:100%;border-collapse:collapse;font-size:14px;min-width:720px}
.tgrid th{font-size:12px;font-weight:600;color:var(--ink3);text-align:center;padding:10px 8px;border-bottom:1px solid var(--line)}
.tgrid th:first-child,.tgrid td:first-child{text-align:left;padding-left:20px;min-width:220px}
.tgrid td{padding:8px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle}
.tgrid .r{text-align:right;padding-right:20px}
.tgrid .today{background:color-mix(in srgb,var(--brand) 6%,transparent)}
.tgrid th.today{color:var(--brand)}
.tgrid .pdot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}
.hcell{width:64px;height:36px;border-radius:9px;border:1px solid var(--line2);background:var(--surface2);color:var(--ink);text-align:center;font:600 14px var(--font,inherit);font-variant-numeric:tabular-nums}
.hcell:focus{outline:2px solid var(--brand);outline-offset:1px;background:var(--surface)}
.tgrid tfoot td{border-bottom:0;font-weight:600;color:var(--ink2)}
.wasnow s{color:var(--ink3)}.wasnow b{color:var(--ink)}
/* time off calendar */
.mcal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--line)}
.mcal .mh{font-size:12px;font-weight:600;color:var(--ink3);padding:8px 10px;border-bottom:1px solid var(--line)}
.mcal .mc{min-height:92px;padding:6px 8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:3px;min-width:0}
.mcal .mc:nth-child(7n+7){border-right:0}
.mcal .mc.we{background:var(--surface2)}.mcal .mc.hol{background:var(--violet-weak)}
.mcal .d{font-size:12.5px;font-weight:600;color:var(--ink2)}
.mcal .hl{font-size:11.5px;color:var(--violet);font-weight:600;line-height:1.25}
.mcal .oc{font-size:11.5px;padding:2px 6px;border-radius:5px;background:color-mix(in srgb,var(--c) 18%,transparent);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mcal .oc.pend{background:none;box-shadow:inset 0 0 0 1px var(--c);border:1px dashed transparent}
@media (max-width:760px){.mcal .mc{min-height:64px;padding:4px}.mcal .oc,.mcal .hl{font-size:10px}}
.webframe{display:block;width:100%;height:calc(100vh - 56px);border:0;background:var(--page)}
body[data-surf="web"]{overflow:hidden}
.drawer:not(.on){box-shadow:none;visibility:hidden;transition:transform .3s var(--ease),visibility 0s linear .3s}
.psurf .ls{display:none}
@media (max-width:640px){.psurf .lf{display:none}.psurf .ls{display:inline}.pres{overflow:visible}}
.ptree{display:flex;align-items:center;gap:8px}.ptree.child{padding-left:22px;position:relative}.ptree .tl{position:absolute;left:6px;top:-14px;width:10px;height:26px;border-left:1.5px solid var(--line2);border-bottom:1.5px solid var(--line2);border-bottom-left-radius:6px}.ptree>.i{color:var(--ink3)}
.ssogrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.ssoc{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);min-width:0}.ssoc.on{border-color:var(--brand)}
.ssoc>div{flex:1;min-width:0}.ssoc b{display:block;font-size:14px}.ssoc span{display:block;font-size:12.5px;color:var(--ink3)}
.ssoc .ssologo{width:34px;height:34px;border-radius:9px;background:#fff;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--line);flex:none;color:#47524A}.ssoc .ssologo svg{width:20px;height:20px}
@media (max-width:760px){.ssogrid{grid-template-columns:minmax(0,1fr)}}
/* automations */
.aflow{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:13.5px;color:var(--ink2);margin-top:3px}
.ak{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand);background:var(--brand-weak);border-radius:5px;padding:1px 6px}
.tplgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.tpl{text-align:left;border:1px solid var(--line);background:var(--surface2);border-radius:12px;padding:12px;cursor:pointer;display:flex;flex-direction:column;gap:2px;color:var(--ink)}.tpl:hover{border-color:var(--brand)}.tpl b{font-size:14px}.tpl span{font-size:12.5px;color:var(--ink3)}
.abuild{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}
.arow{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:center}.arow:first-child{grid-template-columns:52px minmax(0,1fr)}
.arow .ak{text-align:center}.abuild>.btn{align-self:flex-start}
@media (max-width:760px){.tplgrid{grid-template-columns:minmax(0,1fr)}.arow{grid-template-columns:44px minmax(0,1fr)}.arow input{grid-column:2}}
.fixopts{display:flex;flex-wrap:wrap;gap:8px}
.bigmap{position:relative}
.maplegend{position:absolute;left:12px;bottom:10px;display:flex;gap:12px;flex-wrap:wrap;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(8px);padding:6px 10px;border-radius:10px;font-size:12px;color:var(--ink2);box-shadow:0 0 0 1px var(--line)}
.maplegend .lgk{display:inline-block;position:static;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}.maplegend .ok-k{background:#3E7B57}.maplegend .out-k{background:#C2742A}.maplegend .weak-k{background:#8A978F}
.lbl input[type=range]{width:100%;accent-color:var(--fill)}
.bigmap,.mini-map{overflow:hidden}
svg.map{pointer-events:none}
/* reports */
.replay{display:grid;grid-template-columns:240px minmax(0,1fr);gap:18px;align-items:start}
.replib{display:flex;flex-direction:column;gap:2px;position:sticky;top:80px}
.replib .rg{font-size:11.5px;font-weight:600;color:var(--ink3);padding:12px 10px 4px}
.replib .ri{display:flex;flex-direction:column;gap:1px;text-align:left;border:0;background:none;border-radius:10px;padding:8px 10px;cursor:pointer;color:var(--ink)}
.replib .ri b{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:5px}.replib .ri span{font-size:12px;color:var(--ink3)}
.replib .ri:hover{background:var(--surface2)}.replib .ri.on{background:var(--brand-weak)}
.rtitle h2{margin:0;font-size:20px}.rtitle p{margin:2px 0 12px;color:var(--ink2);font-size:14px}
.repfilt{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.bhead{display:grid;grid-template-columns:minmax(150px,1.2fr) minmax(120px,1.5fr) 120px 56px 96px;gap:12px;font-size:12px;color:var(--ink3);padding-bottom:6px}
.brow{display:grid;grid-template-columns:minmax(150px,1.2fr) minmax(120px,1.5fr) 120px 56px 96px;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--line);font-size:14px;font-variant-numeric:tabular-nums}
.brow .t{display:flex;flex-direction:column;min-width:0}.brow .t small{color:var(--ink3);font-size:12px}
.brow.child .t{padding-left:18px}.brow.grp{background:var(--surface2);margin:0 -20px;padding:9px 20px}
.brow .bud{height:8px;border-radius:4px;background:var(--surface3);overflow:hidden}.brow .bud i{display:block;height:100%;border-radius:4px;background:var(--fill)}.brow .bud i.hot{background:var(--amber)}
.brow .v small{color:var(--ink3)}.brow .pc{display:flex;align-items:center;gap:4px;font-weight:600}.brow .pc.warn{color:var(--amber)}.brow .c{text-align:right}
.legend2{display:flex;flex-wrap:wrap;gap:12px;font-size:12.5px;color:var(--ink2)}.legend2 i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px;vertical-align:middle}
.srow{display:grid;grid-template-columns:200px minmax(0,1fr) 72px;gap:12px;align-items:center;padding:7px 0;font-size:14px;font-variant-numeric:tabular-nums}
.stk{display:flex;gap:2px;height:12px;border-radius:4px;overflow:hidden}.stk i{display:block;height:100%}.stk i:last-child{border-radius:0 4px 4px 0}.stk.big{height:20px}
.srow .v{text-align:right;color:var(--ink)}
.vbars{display:flex;gap:28px;align-items:flex-end;height:240px;padding:10px 6px 0;border-bottom:1px solid var(--line)}
.vb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px;max-width:120px}
.vs{width:56px;flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:2px}.vs i{display:block;width:100%}.vs i:first-child{border-radius:4px 4px 0 0}
.vt{font-size:13px;font-weight:600}.vl{font-size:12px;color:var(--ink3);text-align:center;padding:6px 0 8px;display:flex;flex-direction:column}.vl small{font-size:11px}
@media (max-width:1000px){.replay{grid-template-columns:minmax(0,1fr)}.replib{position:static;flex-direction:row;flex-wrap:wrap}.replib .rg{display:none}.bhead{display:none}.brow{grid-template-columns:minmax(0,1fr) 90px;row-gap:4px}.brow .bud{grid-column:1/-1}.brow .pc,.brow .c{display:none}.srow{grid-template-columns:110px minmax(0,1fr) 56px}}
.menu.datepop{max-width:calc(100vw - 16px);max-height:none;overflow:visible}
.side>nav{-webkit-mask-image:none;mask-image:none;padding-bottom:12px}
.side>nav.more-down{-webkit-mask-image:linear-gradient(#000 calc(100% - 28px),transparent);mask-image:linear-gradient(#000 calc(100% - 28px),transparent)}
.side>nav.more-up{-webkit-mask-image:linear-gradient(transparent,#000 28px);mask-image:linear-gradient(transparent,#000 28px)}
.side>nav.more-up.more-down{-webkit-mask-image:linear-gradient(transparent,#000 28px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(transparent,#000 28px,#000 calc(100% - 28px),transparent)}

.t th{white-space:nowrap}.t td.num{white-space:nowrap}
.ptree.child .tl{top:calc(50% - 16px)!important;height:16px!important}
.ptree{min-width:240px;max-width:360px}.tasks{display:block;min-width:150px}.ptree b{display:block;overflow-wrap:anywhere}.ptree .faint{white-space:nowrap}

/* top bar: a pill that ends at the search, anchored right; search grows to the left */
.main>.top{width:max-content;max-width:100%;margin-left:auto;padding:6px 6px 6px 6px}
.main>.top .search{margin-left:0;min-width:0;width:40px;height:40px;padding:0;justify-content:center;border-radius:50%;transition:width .22s var(--ease)}
.main>.top .search .t,.main>.top .search kbd{display:none}
.main>.top.srch .search{width:min(560px,calc(100vw - 32px));justify-content:flex-start;padding:0 12px;border-radius:var(--pill)}
.palette.anch{left:auto;transform:none;top:0;border-radius:18px;animation:none}
.palette.anch input{padding:11px 16px;font-size:14px}
@media (max-width:860px){.main>.top{width:auto;margin-left:0}.main>.top .search{min-width:0;margin-left:auto}}

svg.map .rh{pointer-events:auto;cursor:ew-resize}svg.map .rh:hover{stroke-width:3}

.row.picked .pill{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}

.runs{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.runrow{padding:12px 16px;border-top:1px solid var(--line)}.runrow:first-child{border-top:0}
.runrow .rr-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.runrow p{margin:4px 0 8px;font-size:13.5px;color:var(--ink2)}
.rr-ch{display:flex;gap:6px;flex-wrap:wrap}.chan{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:2px 8px;border-radius:999px;background:var(--surface2);color:var(--ink2)}
.arnote{display:flex;align-items:center;gap:6px;margin:-2px 0 6px 58px}
.notice .btn.ghost{background:var(--surface);border:1px solid var(--line2);color:var(--ink)}

.arow:has(>[data-act=autodel]){grid-template-columns:52px minmax(0,1fr) minmax(0,1fr) 32px}
.arnote{margin:-2px 40px 6px 60px}
.card .rows{border:0;border-radius:0;box-shadow:none;background:none}.card .rows .row{border-radius:0!important}.card>.cardhd+.rows{border-top:1px solid var(--line)}

.steps2{margin:0;padding-left:20px;display:grid;gap:16px}.steps2 li>b{display:block;margin-bottom:4px}.steps2 li>span{color:var(--ink2);font-size:13.5px}
.ph .acts .sel{height:36px;font-size:14px;padding:0 14px 0 16px;border-radius:var(--pill)}
.ph .acts .datebtn{height:36px;border-radius:var(--pill)}

.replib{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:6px;box-shadow:var(--shadow)}
.replib .rg{font-size:11px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);padding:12px 10px 6px;border-top:1px solid var(--line);margin-top:4px}
.replib .rg:first-child{border-top:0;margin-top:0;padding-top:8px}
.row .num.ok{background:var(--fill);color:var(--on-fill)}

.tsum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px}.tsum>div{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface)}.tsum span{display:block;font-size:12px;color:var(--ink3)}.tsum b{font-size:18px;white-space:nowrap}
.tgrid.tsg{min-width:0}.tsg th,.tsg td{padding:8px 4px}.tsg th:first-child,.tsg td:first-child{padding-left:12px;min-width:190px}.tsg .r{padding-right:12px}
.tsg .hcell{width:54px;height:34px}.tsg .hcell:disabled{background:none;border-color:transparent;color:var(--ink3)}
.tsp{display:flex;align-items:flex-start;gap:8px}.tsp .pdot{margin:6px 0 0}.tsp b{display:block;font-size:13.5px}.tsp small{display:block;font-size:12px;color:var(--ink3)}
.tsg tfoot td{padding-top:10px}.tsg tfoot small{display:block;font-size:11px;font-weight:600}
.tsdh{font:inherit;font-size:12px;font-weight:600;color:var(--ink3);background:none;border:0;padding:4px 8px;border-radius:999px;cursor:pointer}.tsdh:hover{color:var(--ink);background:var(--surface2)}.tsdh.on{color:var(--ink);background:var(--brand-weak)}
.tspunch{border:1px solid var(--line);border-radius:12px;overflow:hidden}.tspunch>div{display:grid;grid-template-columns:150px 4px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 14px;border-top:1px solid var(--line);font-size:13.5px}.tspunch>div:first-child{border-top:0}.tspunch .tt{font-variant-numeric:tabular-nums;color:var(--ink2)}.tspunch .bar{height:20px;border-radius:3px}

.invprev{display:grid;gap:8px;margin-top:4px}.invprev .ip{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface2)}.invprev .ip p{margin:4px 0 0;font-size:13.5px}

.linkbtn{border:0;background:none;padding:2px 0;font:inherit;font-size:12px;color:var(--brand);cursor:pointer;text-align:left}.linkbtn:hover{text-decoration:underline}
.ptree .pdot{flex:none}

.sel.pre{gap:6px}.sel.pre small{font-size:12.5px;color:var(--ink3);font-weight:500}.sel.pre small::after{content:':'}

.ctile{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font-weight:700;font-size:17px;flex:none;background:var(--surface2);border:1px solid var(--line)}.ctile svg{width:22px;height:22px}
.sech{font-size:16px;margin:26px 0 10px}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.ccard{display:flex;flex-direction:column;gap:12px;padding:18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow)}
.ccard .cb{display:flex;flex-direction:column;gap:2px}.ccard .cb p{margin:6px 0 0;font-size:13.5px;color:var(--ink2)}.ccard .ca{margin-top:auto;display:flex;gap:8px;align-items:center;justify-content:space-between}
.chiprow{display:flex;gap:6px;flex-wrap:wrap}.chipf{border:1px solid var(--line2);background:var(--surface);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;cursor:pointer;color:var(--ink2)}.chipf.on{background:var(--brand-weak);color:var(--ink);border-color:transparent}
.cannot{display:grid;grid-template-columns:1fr 1fr;gap:14px}.cannot ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}.cannot li{display:grid;grid-template-columns:18px 1fr;gap:6px;font-size:13.5px;color:var(--ink2)}.cannot div:first-child svg{color:var(--brand)}.cannot div:last-child svg{color:var(--red,#D93A30)}
.backlink{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--ink3);text-decoration:none;margin-top:18px}.backlink:hover{color:var(--ink)}
@media (max-width:760px){.cannot{grid-template-columns:1fr}}

.tasklist{list-style:none;margin:0;padding:0;display:grid;gap:4px;min-width:180px;max-width:320px}.tasklist li{line-height:1.35}.tasklist li+li{border-top:1px dashed var(--line);padding-top:4px}