/* KodoDesk: fresh and light, the Harbour palette (navy #0b2f4a, harbour blue #1d8bc9, turquoise accents). */
:root{--navy:#0b2f4a;--navy2:#123f63;--blue:#1d8bc9;--teal:#14b8a6;--aqua:#e6f6f8;--ink:#0f172a;--ink2:#475569;--ink3:#94a3b8;--line:#e7ecf1;--line2:#d5dde6;--bg:#f6f8fa;--card:#fff;
  --amber:#f59e0b;--amberbg:#fef3c7;--amberink:#92400e;--red:#e5484d;--redbg:#fee2e2;--green:#12a150;--greenbg:#dcfce7;--greenink:#166534;--bluebg:#e0f2fe;--blueink:#075985;--tint:#f0f9ff;--tintline:#bae6fd;--onnavy:#fff;--onblue:#fff;--r:14px;
  --shadow:0 10px 30px rgba(11,47,74,.12)}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-size:14px;-webkit-font-smoothing:antialiased;line-height:1.4}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}
a.link{color:var(--blue);font-weight:600;cursor:pointer}a.link:hover{text-decoration:underline}
h1{font-size:22px;letter-spacing:-.02em;margin:0;line-height:1.2}h2{font-size:15px;margin:0 0 12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
h3{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);margin:20px 4px 8px;font-weight:700}
.sub{color:var(--ink2);margin-top:4px}.small{font-size:12px}.muted{color:var(--ink3)}.grow{flex:1}.right{margin-left:auto}.nowrap{white-space:nowrap}
.row-flex{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hide{display:none!important}

/* Shell */
.app{display:grid;grid-template-columns:232px 1fr;height:100vh;height:100dvh}
.side{background:var(--side,#fff);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:18px 12px;overflow:auto}
.side .logo{display:block;box-sizing:border-box;width:calc(100% - 16px);height:auto;max-height:84px;object-fit:contain;object-position:center;margin:6px 8px 16px;cursor:pointer}
.side .office{display:block;font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--navy);line-height:1.2;margin:4px 8px 22px;cursor:pointer}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:10px;color:var(--ink2);font-weight:500;margin-bottom:2px;cursor:pointer}
.nav a:hover{background:var(--bg)}.nav a.on{background:var(--aqua);color:var(--navy);font-weight:600}
.ico{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.nav .badge{margin-left:auto;background:var(--blue);color:var(--onblue);font-size:11px;font-weight:600;border-radius:99px;padding:1px 7px}
.nav .sep{height:1px;background:var(--line);margin:12px 8px}
.side .foot{margin-top:auto;padding:12px;border:1px solid var(--line);border-radius:12px;font-size:12px;color:var(--ink2)}
.side .me{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12.5px;color:var(--ink2)}
.meter{height:6px;background:var(--line);border-radius:9px;margin:7px 0 4px;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--blue))}
.main{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.paybar{background:#fff4e5;color:#7a3e00;border-bottom:1px solid #f5c98a;padding:10px 24px;font-size:14px;line-height:1.45;flex:none}.paybar.ro{background:#fdecec;color:#8a1c1c;border-color:#f3b4b4}.paybar .link{color:inherit;text-decoration:underline;font-weight:600}
.top{height:64px;display:flex;align-items:center;gap:12px;padding:0 24px;border-bottom:1px solid var(--line);background:#fff;flex:none}
.search{flex:1;max-width:520px;display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--ink3);cursor:text}
.search kbd{margin-left:auto;font-family:inherit;font-size:11px;border:1px solid var(--line);background:#fff;border-radius:6px;padding:1px 6px}
.btn.menu-btn{display:none}
.view-root{flex:1;overflow:auto;display:flex;min-height:0}
.pad{padding:24px 28px;flex:1;min-width:0}
.pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}

/* Buttons and fields */
.btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 13px;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:7px;white-space:nowrap;text-decoration:none}
.btn:hover{border-color:#cbd5e1}.btn:disabled{opacity:.5;cursor:default}
.btn.pri{background:var(--navy);border-color:var(--navy);color:var(--onnavy)}.btn.pri:hover{background:var(--navy2)}
.btn.sm{padding:5px 10px;font-size:12px;border-radius:8px}.btn.xs{padding:3px 8px;font-size:11.5px;border-radius:7px}
.btn.ai{background:linear-gradient(135deg,var(--tint),var(--bluebg));border-color:var(--tintline);color:var(--navy)}
.btn.ghost{border-color:transparent;background:transparent}.btn.ghost:hover{background:var(--bg)}
.btn.danger{color:#b42318}.btn .ico{width:15px;height:15px;stroke-width:2}
.cr{font-size:11px;font-weight:600;color:var(--blue);background:var(--bluebg);border-radius:6px;padding:1px 6px}
input.f,select.f,textarea.f{width:100%;border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 10px;font-size:13.5px;outline:none}
input.f:focus,select.f:focus,textarea.f:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,139,201,.12)}
textarea.f{resize:vertical;min-height:70px;line-height:1.45}
label.fl{display:grid;gap:5px;font-size:12px;color:var(--ink2);font-weight:600}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.mb [hidden]{display:none!important}
.seg{display:inline-flex;background:#eef2f6;border-radius:11px;padding:3px;flex-wrap:wrap}.seg button{border:0;background:none;padding:7px 14px;border-radius:9px;font-weight:600;color:var(--ink2)}
.seg button.on{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
.box{padding:16px;margin-bottom:14px}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;border-radius:10px;padding:2px 8px;background:var(--bg);color:var(--ink2);white-space:nowrap}
.chip.need{background:var(--amberbg);color:var(--amberink)}.chip.ch{background:var(--bluebg);color:var(--blueink);cursor:pointer}.chip.ok{background:var(--greenbg);color:var(--greenink)}
.chip.bad{background:var(--redbg);color:#991b1b}.chip.teal{background:#ccfbf1;color:#115e59}
.tag{display:inline-flex;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:3px 10px;font-size:12px;margin:0 6px 6px 0}
.tag button{border:0;background:none;padding:0;color:var(--ink3);font-size:13px;line-height:1}
.dot{width:8px;height:8px;border-radius:9px;background:var(--teal);display:inline-block}.dot.am{background:var(--amber)}.dot.rd{background:var(--red)}.dot.gr{background:var(--ink3)}
.kv{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}.kv:last-child{border:0}.kv>span:first-child{color:var(--ink2)}
.kv>span:last-child{text-align:right}
.empty{padding:28px;text-align:center;color:var(--ink3)}
.sum{background:linear-gradient(135deg,#f0fdfa,var(--tint));border:1px solid var(--tintline);border-radius:var(--r);padding:16px 18px;margin-bottom:14px}
.sum .sh{display:flex;justify-content:space-between;align-items:center;font-weight:700;color:var(--navy);margin-bottom:8px;gap:8px;flex-wrap:wrap}.sum .sh small{font-weight:500;color:var(--ink2)}
.sum p{margin:4px 0;color:var(--ink2)}.sum ul{margin:6px 0 0;padding-left:18px;line-height:1.6}
.warn{background:#fffbeb;border-color:#fde68a}
.ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;font-size:14px}.ic.b{background:var(--bluebg)}.ic.t{background:#ccfbf1}.ic.a{background:var(--amberbg)}.ic.r{background:var(--redbg)}.ic.g{background:var(--greenbg)}.ic.p{background:var(--aqua)}
.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;color:var(--onblue);background:var(--blue);flex:none}
.av.sm{width:28px;height:28px;font-size:11px}

/* Home */
.home{display:grid;grid-template-columns:1fr 360px;width:100%;min-height:0}
.stage{padding:20px 24px;overflow:auto}
.stagehead{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.pic{position:relative;border-radius:18px;box-shadow:var(--shadow);background:#dbe6ee;container-type:inline-size}.pic>img{display:block;width:100%;border-radius:inherit}
.hot{position:absolute;transform:translate(-50%,-50%);background:rgba(255,255,255,.95);backdrop-filter:blur(6px);border-radius:12px;padding:7px 11px 7px 8px;display:flex;align-items:center;gap:8px;box-shadow:0 6px 18px rgba(11,47,74,.2);font-weight:600;font-size:12.5px;border:0;color:var(--ink);transition:transform .15s;text-align:left;max-width:240px}
.hot:hover{transform:translate(-50%,-50%) scale(1.05)}.hot img{width:28px;height:28px;border-radius:8px;object-fit:cover;flex:none}.hot small{display:block;font-weight:500;color:var(--ink2);font-size:11px}
.hot .n{background:var(--blue);color:var(--onblue);border-radius:10px;font-size:11px;padding:1px 7px;margin-left:2px}
.today{border-left:1px solid var(--line);background:#fff;overflow:auto;padding:20px 18px}
.item{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:#fff}
.item:hover{border-color:#cbd5e1}.item .t{font-weight:600;font-size:13px}.item .d{color:var(--ink2);font-size:12px;margin-top:2px;overflow-wrap:anywhere}.item .btn{margin-left:auto;flex:none}
.item .tx{min-width:0;cursor:pointer}
.agents{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.agent{padding:16px;display:flex;flex-direction:column;gap:10px}.agent .hd{display:flex;gap:12px;align-items:center}.agent .hd img{width:46px;height:46px;border-radius:12px;object-fit:cover}
.agent .nm{font-weight:700}.agent .rl{font-size:12px;color:var(--ink2)}.agent p{margin:0;color:var(--ink2);font-size:13px;line-height:1.45}
.agent .last{font-size:12px;background:var(--bg);border-radius:9px;padding:8px 10px;color:var(--ink2)}.agent .ft{display:flex;justify-content:space-between;align-items:center;margin-top:auto;gap:8px}

/* Inbox */
.inbox{display:grid;grid-template-columns:420px 1fr;width:100%;min-height:0}
.list{border-right:1px solid var(--line);overflow:auto;background:#fff}
.list .lh{padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}
.tabs{display:flex;gap:4px;margin-top:12px;flex-wrap:wrap}.tabs button{border:0;background:none;padding:5px 11px;border-radius:8px;font-weight:600;font-size:12.5px;color:var(--ink2)}.tabs button.on{background:var(--aqua);color:var(--navy)}
.row{padding:13px 18px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:36px 1fr;gap:11px;cursor:pointer}.row:hover{background:#fafbfc}.row.sel{background:var(--tint);box-shadow:inset 3px 0 0 var(--blue)}
.row .l1{display:flex;justify-content:space-between;gap:8px}.row .who{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row .tm{color:var(--ink3);font-size:12px;flex:none}
.row .sj{font-weight:600;font-size:13px;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .gist{color:var(--ink2);font-size:12.5px;margin-top:3px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.row .chips{display:flex;gap:5px;margin-top:7px;flex-wrap:wrap}
.read{overflow:auto;padding:24px 30px;min-width:0}
.read .meta{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 18px}
.msg{padding:18px 20px;line-height:1.6;font-size:14px;margin-bottom:10px}.msg .from{display:flex;justify-content:space-between;gap:8px;color:var(--ink2);font-size:12.5px;margin-bottom:10px}
.msg .body{white-space:pre-wrap;overflow-wrap:anywhere}.msg.mine{background:#fbfdff}
.fold{margin-bottom:10px;padding:11px 16px;color:var(--ink2);font-size:13px;display:flex;justify-content:space-between;cursor:pointer}
.files{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.files a{font-size:12px;border:1px solid var(--line);border-radius:8px;padding:4px 9px;color:var(--ink2)}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.more{padding:14px;text-align:center}

/* Board */
.board{display:grid;gap:12px;overflow:auto;padding-bottom:10px;align-items:start}
.col{background:#eef2f6;border-radius:14px;padding:10px;min-height:120px}.col.drop{outline:2px dashed var(--blue)}
.col h4{margin:2px 4px 10px;font-size:12px;color:var(--ink2);display:flex;justify-content:space-between}.col h4 span{background:#fff;border-radius:10px;padding:0 8px}
.deal{padding:12px;margin-bottom:8px;cursor:pointer}.deal:hover{border-color:#94a3b8}.deal .c{font-weight:700;font-size:13px}.deal .y{color:var(--ink2);font-size:12px;margin-top:2px}
.deal .f{display:flex;justify-content:space-between;margin-top:9px;font-size:12px}.deal .f b{color:var(--navy)}
.nx{font-size:11.5px;margin-top:8px;padding:5px 8px;border-radius:7px;background:var(--amberbg);color:var(--amberink);font-weight:600}.nx.ok{background:var(--greenbg);color:var(--greenink)}.nx.bl{background:var(--bluebg);color:var(--blueink)}.nx.gr{background:var(--bg);color:var(--ink2)}
.turn{display:inline-flex;align-items:center;font-size:10.5px;font-weight:700;border-radius:10px;padding:1px 7px;white-space:nowrap;background:var(--bg);color:var(--ink2)}.turn.me{background:var(--amberbg);color:var(--amberink)}.turn.agent{background:var(--bluebg);color:var(--blueink)}
.deal .c{display:flex;justify-content:space-between;align-items:flex-start;gap:6px}.deal .turn{flex:none;margin-top:1px}.turnline{display:flex;gap:8px;align-items:center;margin-top:6px}.pnow .turn{margin-left:auto}
.opt{padding:8px 0;border-bottom:1px solid var(--line)}.opt:last-of-type{border-bottom:0}
.cdown{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--line);flex-wrap:wrap}.cdown>i{flex:none;width:9px;height:9px;border-radius:50%;background:var(--line)}.cdown.done>i{background:var(--teal)}.cdown.late>i{background:#dc2626}.cdown.due>i{background:#d97706}.cdown.done b{font-weight:500;color:var(--ink2)}
.offerform{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}.offerform .f{padding:5px 8px;font-size:12.5px}
.viewtabs{display:flex;gap:8px;align-items:center;margin:16px 0;flex-wrap:wrap}

/* Charter file */
.steps{display:flex;margin:16px 0 20px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.steps button{flex:1;padding:10px 4px;text-align:center;font-size:12px;font-weight:600;color:var(--ink3);border:0;border-right:1px solid var(--line);background:none}
.steps button:last-child{border:0}.steps .done{color:var(--teal);background:#f0fdfa}.steps .now{color:var(--onnavy);background:var(--navy)}.steps button:hover:not(.now){background:var(--bg)}
.file{display:grid;grid-template-columns:300px minmax(0,1fr) 300px;gap:16px;align-items:start}
.facts{padding:16px}
.fact{display:grid;grid-template-columns:110px 1fr;gap:8px;align-items:center;padding:5px 0;font-size:13px}.fact>span{color:var(--ink3)}
.fact input,.fact select{border:1px solid transparent;background:transparent;border-radius:7px;padding:4px 6px;width:100%;font-weight:600;text-align:right;outline:none}
.fact input:hover,.fact select:hover{border-color:var(--line)}.fact input:focus,.fact select:focus{border-color:var(--blue);background:#fff;text-align:left}
.fact .calc-out{font-weight:700;text-align:right;color:var(--navy);padding:4px 6px}
.src{font-size:10.5px;color:var(--ink3);font-weight:500;display:block}
.tl{padding:4px 18px}.ev{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.ev:last-child{border:0}.ev .ic{width:28px;height:28px}
.ev .t{font-weight:600;font-size:13px}.ev .d{color:var(--ink2);font-size:12.5px;margin-top:2px;white-space:pre-wrap;overflow-wrap:anywhere}.ev .w{margin-left:auto;color:var(--ink3);font-size:12px;flex:none}
.pay{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:13px}.pay:last-child{border:0}
.ok{color:var(--green);font-weight:600}.due{color:#b45309;font-weight:600}.late{color:#b42318;font-weight:600}
.agbtn{display:flex;align-items:center;gap:10px;width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 10px;margin-bottom:7px;text-align:left}
.agbtn:hover{border-color:var(--blue)}.agbtn img{width:28px;height:28px;border-radius:8px}.agbtn b{font-size:13px;display:block}.agbtn small{color:var(--ink2);font-size:11.5px}
.sl{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}.sl:last-child{border:0}
.thumb{width:44px;height:34px;border-radius:7px;object-fit:cover;background:linear-gradient(135deg,var(--bluebg),#ccfbf1);display:grid;place-items:center;color:var(--blue)}
.diff{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:7px 0;border-bottom:1px solid #fde68a;font-size:13px}.diff:last-child{border:0}

/* Clients */
.cl{display:grid;grid-template-columns:340px 1fr;width:100%;min-height:0}
.rel{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* Yachts */
.yg{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.yc{overflow:hidden;cursor:pointer;position:relative}.yc:hover{border-color:#94a3b8}.yc.pick{outline:2px solid var(--blue)}
.yc .ph{height:140px;background:linear-gradient(135deg,var(--bluebg),#ccfbf1);display:grid;place-items:center;color:#7cb6d6}.yc .ph img{width:100%;height:140px;object-fit:cover;display:block}
.yc .b{padding:12px 14px}.yc .n{font-weight:700}.yc .s{color:var(--ink2);font-size:12.5px;margin-top:3px}.yc .p{display:flex;justify-content:space-between;gap:8px;margin-top:10px;font-size:12.5px}
.yc .chk{position:absolute;top:10px;right:10px;background:#fff;border-radius:8px;padding:3px 7px;font-size:12px;font-weight:600;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0;align-items:center}.filters .f{width:auto;min-width:130px}

/* Calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cal>div{background:#fff;min-height:104px;padding:6px 8px;font-size:12px;color:var(--ink3);min-width:0}.cal .hd{min-height:auto;font-weight:600;background:var(--bg)}.cal .out{background:#fafbfc}.cal .tdy b{background:var(--navy);color:var(--onnavy);border-radius:10px;padding:1px 6px}
.bar{display:block;margin-top:4px;border-radius:6px;padding:3px 6px;font-size:11px;font-weight:600;color:var(--blueink);background:var(--bluebg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.bar.t{background:#ccfbf1;color:#115e59}.bar.a{background:var(--amberbg);color:var(--amberink)}.bar.p{background:var(--bluebg);color:var(--blueink)}.bar.g{background:var(--greenbg);color:var(--greenink)}

/* Numbers */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.kpi{padding:16px}.kpi .l{color:var(--ink2);font-size:12px}
.kpi .v{font-size:26px;font-weight:700;letter-spacing:-.02em;margin-top:6px;color:var(--navy)}.kpi .s{font-size:11.5px;color:var(--ink3);margin-top:4px}
table.t{width:100%;border-collapse:collapse;font-size:13px}table.t th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);padding:10px 14px;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0}
table.t td{padding:10px 14px;border-bottom:1px solid var(--line)}table.t tr:last-child td{border:0}table.t td.n,table.t th.n{text-align:right;font-variant-numeric:tabular-nums}
table.t tr.click{cursor:pointer}table.t tr.click:hover td{background:#fafbfc}

/* Requests */

/* Settings: the office at a glance, tiles, and the sheet each tile opens */
.sx{max-width:1180px}
.sx-hero{position:relative;overflow:hidden;border-radius:22px;color:var(--onnavy,#fff);padding:32px 34px;background:radial-gradient(110% 120% at 100% 0%,rgba(29,139,201,.5) 0%,rgba(29,139,201,0) 55%),linear-gradient(135deg,var(--navy) 0%,color-mix(in srgb,var(--navy) 80%,#000) 100%);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:28px;align-items:end}
.sx-waves{position:absolute;left:0;right:0;bottom:0;width:100%;height:100px;pointer-events:none}
.sx-hero>:not(.sx-waves){position:relative;min-width:0}
.sx-mark{width:60px;height:60px;border-radius:17px;background:#fff;color:var(--navy);display:grid;place-items:center;font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-size:31px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.sx-mark.img{object-fit:contain;padding:7px}
.sx-hero h1{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;font-size:42px;line-height:1.05;margin:16px 0 8px;letter-spacing:-.015em;color:inherit}
.sx-facts{opacity:.8;font-size:14px}.sx-facts span+span:before{content:"·";margin:0 8px;opacity:.6}
.sx-edit{margin-top:16px;background:rgba(255,255,255,.12);color:inherit;border-color:currentColor}.sx-edit:hover{background:rgba(255,255,255,.2)}
.sx-says{display:flex;flex-direction:column;gap:9px}
.sx-says div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:11px 14px}
.sx-says b{display:block;font-size:14.5px}.sx-says small{opacity:.75;font-size:12.5px}
.sx-needs{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;margin-top:16px}
.sx-needs div{background:#fff;border:1px solid #f4d9a3;border-left:4px solid var(--amber);border-radius:12px;padding:12px 14px;display:flex;gap:12px;align-items:center;justify-content:space-between}
.sx-needs b{display:block}.sx-needs small{color:var(--ink2);font-size:12.5px}
.sx-tt{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;font-size:25px;color:var(--navy);margin:28px 0 2px;letter-spacing:-.01em}
.sx-tl{margin:0 0 14px;color:var(--ink2)}
.sx-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sx-tile{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 14px 16px;cursor:pointer;display:flex;flex-direction:column;gap:5px;text-align:left;font:inherit;color:inherit;min-width:0;transition:transform .15s,box-shadow .15s}
.sx-tile:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(11,47,74,.1)}
.sx-tile:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.sx-tile.wide{grid-column:span 2}
.sx-pic{height:78px;border-radius:12px;background:var(--aqua);margin-bottom:6px;display:flex;align-items:center;justify-content:center;color:var(--navy);overflow:hidden}
.sx-big{width:36px;height:36px}
.sx-name{font-size:15px}
.sx-st{font-weight:600;font-size:13px;display:flex;gap:7px;align-items:baseline}
.sx-st i{width:8px;height:8px;border-radius:50%;background:var(--ink3);flex:none;transform:translateY(-1px)}
.sx-st.ok{color:#0f7a4a}.sx-st.ok i{background:#16a34a}.sx-st.need{color:#a15c07}.sx-st.need i{background:var(--amber)}
.sx-st.bad{color:#b42318}.sx-st.bad i{background:#dc2626}.sx-st.off{color:var(--ink2)}.sx-st.teal{color:#0f766e}.sx-st.teal i{background:var(--teal)}
.sx-dt{color:var(--ink2);font-size:12.5px;line-height:1.4;overflow-wrap:anywhere}
.sx-tile.kodo{background:linear-gradient(150deg,var(--navy),#0f5560 70%,#0f766e);color:#fff;border:0}
.sx-tile.kodo .sx-pic{background:rgba(255,255,255,.1);color:#7ee7da}.sx-tile.kodo .sx-dt{color:rgba(255,255,255,.75)}.sx-tile.kodo .sx-st{color:#7ee7da}
.sx-free{display:inline-block;background:#ccfbf1;color:#0f766e;border-radius:10px;padding:1px 8px;font-size:11px;font-weight:700;vertical-align:2px;font-family:Inter,system-ui,sans-serif;letter-spacing:0}
.sx-tile.kodo .sx-free{background:rgba(20,184,166,.28);color:#7ee7da}
.sx-avs{display:flex}.sx-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:12.5px;border:3px solid var(--aqua);margin-left:-10px}.sx-av:first-child{margin-left:0}
.sx-card{width:138px;height:62px;border-radius:10px;background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;padding:8px 10px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 8px 18px rgba(11,47,74,.25)}
.sx-card small{font-size:9px;letter-spacing:.06em;text-transform:uppercase;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sx-card b{font-family:"Iowan Old Style",Palatino,Georgia,serif;font-weight:500;font-size:15px}
.sx-num{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;font-size:28px;color:var(--navy)}
.sx-line{display:flex;align-items:center;width:84%;position:relative;height:30px}.sx-line:before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:#b5d9e4}
.sx-line i{position:relative;width:12px;height:12px;border-radius:50%;background:var(--navy);margin-right:auto;border:2px solid #fff}.sx-line i:last-child{margin-right:0;background:var(--teal)}
.sx-meter{width:78%;height:10px;border-radius:999px;background:#fff;overflow:hidden}.sx-meter i{display:block;height:100%;min-width:4px;background:var(--teal)}
.sx-sw{display:flex;gap:6px}.sx-sw i{width:30px;height:30px;border-radius:9px;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.14)}
.sx-sig{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-style:italic;font-size:26px;color:var(--navy)}
.sx-tools{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:12px;padding:12px 14px;color:var(--ink2);margin-top:22px}.sx-tools b{color:var(--ink)}.sx-tools .ico{color:var(--blue);flex:none;margin-top:1px}
.sx-veil{position:fixed;inset:0;background:rgba(11,47,74,.32);z-index:44}
.sx-sheet{position:fixed;top:0;right:0;bottom:0;width:min(640px,100%);background:var(--bg);box-shadow:-20px 0 50px rgba(11,47,74,.2);z-index:44;display:flex;flex-direction:column}
.sx-veil.in{animation:sxFade .2s ease-out}.sx-sheet.in{animation:sxIn .25s ease-out}
@keyframes sxFade{from{opacity:0}}@keyframes sxIn{from{transform:translateX(100%)}}
.sx-sheet header{background:#fff;padding:20px 24px 16px;border-bottom:1px solid var(--line);display:flex;gap:14px;align-items:flex-start;flex:none}
.sx-sheet header h2{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;font-size:29px;margin:0;color:var(--navy);line-height:1.1;letter-spacing:-.01em}
.sx-sheet header p{margin:6px 0 0;color:var(--ink2)}
.sx-x{margin-left:auto;border:1px solid var(--line2);background:#fff;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;flex:none;cursor:pointer;color:var(--ink2)}.sx-x:hover{background:var(--bg)}
.sx-body{overflow:auto;padding:16px 20px 40px;flex:1;display:flex;flex-direction:column;gap:14px}
.sx-body>.card,.sx-body .kg-page>.card{margin:0}
@media (max-width:1150px){.sx-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.sx-hero{grid-template-columns:1fr}}
@media (max-width:640px){
  .sx-hero{padding:22px 20px;border-radius:18px;gap:14px}.sx-hero h1{font-size:30px;margin-top:12px}.sx-mark{width:48px;height:48px;font-size:25px;border-radius:14px}
  .sx-facts span{display:block}.sx-facts span+span:before{display:none}.sx-says{display:none}
  .sx-needs{grid-template-columns:1fr}
  .sx-tt{font-size:22px;margin-top:22px}
  .sx-tiles{grid-template-columns:1fr 1fr;gap:10px}.sx-tile{padding:11px;border-radius:15px}.sx-pic{height:58px}.sx-dt{display:none}
  .sx-card{width:100px;height:46px}.sx-card b{font-size:12px}.sx-card small{font-size:7.5px}.sx-num{font-size:21px}.sx-sw i{width:22px;height:22px;border-radius:7px}.sx-av{width:34px;height:34px;font-size:11px}
  .sx-sheet{top:auto;left:0;width:100%;height:88%;border-radius:22px 22px 0 0}
  .sx-sheet.in{animation-name:sxUp}
  .sx-sheet header{border-radius:22px 22px 0 0;padding:22px 18px 12px;position:relative}
  .sx-sheet header:before{content:"";width:40px;height:5px;border-radius:9px;background:var(--line2);position:absolute;top:8px;left:50%;transform:translateX(-50%)}
  .sx-sheet header h2{font-size:24px}.sx-body{padding:12px 12px 30px}
}
@keyframes sxUp{from{transform:translateY(100%)}}
/* Kodo Guest in its sheet: laid out as on a narrow screen, since the sheet is narrow */
.sx-body .kg-hero{grid-template-columns:1fr;padding:26px 22px 0}.sx-body .kg-hero h2{font-size:30px}.sx-body .kg-stage{justify-content:center;min-height:0;padding-top:10px}.sx-body .kg-float{display:none}.sx-body .kg-phone{margin-bottom:-120px;width:240px}.sx-body .kg-scr{height:440px}.sx-body .kg-groups,.sx-body .kg-steps,.sx-body .kg-ba{grid-template-columns:1fr}.sx-body .kg-arrow{transform:rotate(90deg)}

/* Setup and sign-in */
.ob{position:fixed;inset:0;background:linear-gradient(160deg,var(--tint) 0%,#fff 45%,#f0fdfa 100%);z-index:40;overflow:auto}
.obin{max-width:760px;margin:0 auto;padding:40px 24px 90px}.obsteps{display:flex;gap:8px;margin:28px 0 30px}.obsteps div{flex:1;height:5px;border-radius:9px;background:var(--line)}.obsteps .d{background:var(--teal)}.obsteps .n{background:var(--blue)}
.obh{font-size:30px;letter-spacing:-.03em;font-weight:700;margin:0}.obp{color:var(--ink2);font-size:16px;margin:8px 0 26px}
.home-mail{margin:0 0 18px;padding:22px}
.prov{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.prov button{background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:22px 16px;display:flex;flex-direction:column;align-items:center;gap:12px;font-weight:600;font-size:15px}
.prov button:hover{border-color:var(--blue);box-shadow:0 8px 24px rgba(29,139,201,.12)}.prov small{color:var(--ink3);font-weight:500;font-size:12px;text-align:center}.prov button.done{border-color:var(--teal);background:#f0fdfa}
.drop{border:2px dashed var(--tintline);background:rgba(255,255,255,.75);border-radius:20px;padding:46px 20px;text-align:center;cursor:pointer;display:block}.drop.over{background:var(--tint);border-color:var(--blue)}
.drop .big{font-size:18px;font-weight:700;margin-top:12px}.drop .or{color:var(--ink2);margin-top:6px}
.logos{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:18px}.logos span{background:#fff;border:1px solid var(--line);border-radius:10px;padding:5px 12px;font-size:12.5px;font-weight:600;color:var(--ink2)}
.obnav{display:flex;justify-content:space-between;margin-top:28px}
.found{margin-top:16px;padding:14px 16px;display:flex;gap:12px;align-items:center}
.map{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin-top:14px}
.signin{max-width:420px;margin:12vh auto;padding:34px;text-align:center}.signin img{height:40px;margin-bottom:22px}.signin img.si-logo{height:auto;max-height:64px;max-width:240px;object-fit:contain;margin-bottom:10px}.si-office{font-size:22px;font-weight:650;color:var(--navy);letter-spacing:-.01em;margin-bottom:18px}

/* Overlays */
.modal{position:fixed;inset:0;background:rgba(11,47,74,.35);backdrop-filter:blur(3px);display:flex;z-index:45;align-items:flex-start;justify-content:center;padding:6vh 16px 16px;overflow:auto}
.sheet{width:min(640px,100%);background:#fff;border-radius:20px;box-shadow:0 30px 80px rgba(11,47,74,.35);overflow:hidden}.sheet.wide{width:min(860px,100%)}
.sheet .mh{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line);gap:10px}.sheet .mb{padding:18px 20px;display:grid;gap:12px}
.sheet .mf{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);background:#fbfdff}
.calc .cb{display:grid;grid-template-columns:1fr 1fr}.calc .in{padding:18px 20px;border-right:1px solid var(--line);display:grid;gap:12px;align-content:start}
.calc .out{padding:18px 20px;background:#fbfdff}.calc .ln{display:flex;justify-content:space-between;gap:10px;padding:7px 0;font-size:14px;font-variant-numeric:tabular-nums}
.calc .ln.tot{border-top:2px solid var(--navy);margin-top:6px;padding-top:11px;font-weight:700;font-size:18px;color:var(--navy)}
.calc .ln.sub{border-top:1px solid var(--line);margin-top:4px;padding-top:9px}.calc .ln>:last-child{text-align:right}.calc .ln.tot{flex-wrap:wrap}.calc .ln.tot>span:last-child{margin-left:auto;white-space:nowrap}
.calc .mine{margin-top:14px;background:#f0fdfa;border:1px solid #99f6e4;border-radius:12px;padding:12px 14px}.calc .note{font-size:11.5px;color:var(--ink3);margin-top:12px;line-height:1.45}
.calc .area-note{font-size:11.5px;color:var(--ink2);background:var(--bg);border-radius:8px;padding:8px 10px;line-height:1.45}
.palette{width:min(620px,100%);background:#fff;border-radius:16px;box-shadow:0 30px 80px rgba(11,47,74,.35);overflow:hidden}
.palette input{width:100%;border:0;border-bottom:1px solid var(--line);padding:16px 18px;font-size:16px;outline:none}
.palette .res{max-height:60vh;overflow:auto;padding:6px}.palette .res a{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:9px;cursor:pointer}
.palette .res a.on,.palette .res a:hover{background:var(--aqua)}.palette .res small{color:var(--ink3);margin-left:auto}.palette .grp{font-size:11px;color:var(--ink3);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px 4px}
.toasts{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:60;pointer-events:none;max-width:min(560px,92vw)}
.toast{background:var(--navy);color:var(--onnavy);padding:10px 16px;border-radius:12px;font-size:13px;box-shadow:var(--shadow);pointer-events:auto}
.toast.bad{background:#7f1d1d}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:#fff;z-index:44;box-shadow:-20px 0 60px rgba(11,47,74,.2);overflow:auto}
.drawer .mh{position:sticky;top:0;background:#fff;z-index:2}

@media (max-width:1250px){.file{grid-template-columns:280px minmax(0,1fr)}.file>.side-col{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.file>.side-col .box{margin:0}}
@media (max-width:1100px){.sl{grid-template-columns:44px minmax(0,1fr)}.sl>.row-flex{grid-column:1/-1}.home{grid-template-columns:1fr}.today{border:0;border-top:1px solid var(--line)}.inbox,.cl{grid-template-columns:1fr}.list{max-height:none}.kpis{grid-template-columns:1fr 1fr}.rel{grid-template-columns:1fr}
  .inbox.reading .list,.cl.reading .list{display:none}.inbox:not(.reading) .read,.cl:not(.reading) .read{display:none}.back-btn{display:inline-flex!important}}
@media (min-width:1101px){.back-btn{display:none!important}}
@media (max-width:860px){.file{grid-template-columns:1fr}.set{grid-template-columns:1fr}.calc .cb{grid-template-columns:1fr}.calc .in{border-right:0;border-bottom:1px solid var(--line)}}
@media (max-width:760px){.app{grid-template-columns:1fr}.side{position:fixed;inset:0 auto 0 0;width:260px;z-index:50;transform:translateX(-100%);transition:transform .2s}.side.open{transform:none;box-shadow:var(--shadow)}
  .btn.menu-btn{display:inline-flex}.top{padding:0 12px;gap:8px}.top .hide-sm{display:none}.pad,.stage{padding:16px}.read{padding:16px}.prov{grid-template-columns:1fr}.grid3{grid-template-columns:1fr 1fr}
  .kpis{grid-template-columns:1fr}.hot{font-size:11px;padding:5px 8px 5px 6px}.hot small{display:none}.hot img{width:22px;height:22px}}
.calc{width:min(760px,100%);background:#fff;border-radius:20px;box-shadow:0 30px 80px rgba(11,47,74,.35);overflow:hidden}
.calc .mh{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:8px;margin:-6px 0 18px}
.tool{display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px 10px;text-align:left;min-width:0}
.tool:hover{border-color:var(--blue);box-shadow:0 4px 14px rgba(29,139,201,.12)}.tool img,.tool .ti{width:30px;height:30px;border-radius:9px;flex:none;object-fit:cover}
.tool .ti{display:grid;place-items:center;background:var(--aqua);color:var(--navy)}.tool b{display:block;font-size:12.5px}.tool small{display:block;font-size:11.5px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tool span{min-width:0}.tool.dim{opacity:.6}.tool.warn{border-color:#fde68a;background:#fffbeb}.tool.warn small{color:var(--amberink)}
.picker{width:min(680px,100%)}.picker .pk-head{display:flex;flex-direction:column;gap:4px;padding:16px 18px 0}.picker .pk-head b{font-size:15px}.picker .pk-head input{border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:15px;margin-bottom:10px}
.picker .res{padding:4px 10px 12px}.pk-row{display:flex!important;align-items:center;gap:12px;padding:9px 10px!important;border-radius:12px;border:1px solid transparent;margin:2px 0}
.pk-row:hover,.pk-row.on{background:var(--tint)!important;border-color:var(--tintline)}.pk-tx{display:flex;flex-direction:column;min-width:0;flex:1}.pk-tx b{font-weight:600;font-size:14px}.pk-tx small{color:var(--ink2);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0!important}
.pk-ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--aqua);color:var(--navy);flex:none}.pk-ic .ico{width:18px;height:18px}.pk-img{width:44px;height:36px;border-radius:9px;object-fit:cover;flex:none}
.choices{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:10px}.choice{display:flex;gap:12px;align-items:flex-start;text-align:left;border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px;height:100%}
.choice:hover{border-color:var(--blue);box-shadow:0 6px 18px rgba(29,139,201,.12)}.choice b{display:block;font-size:14px}.choice small{display:block;color:var(--ink2);font-size:12.5px;margin-top:3px;line-height:1.4}
@media (max-width:640px){.choices{grid-template-columns:1fr}}
.enq-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}.enq-mail{padding:18px 20px;background:#fbfdff;border-right:1px solid var(--line);max-height:72vh;overflow:auto}
.enq-body{white-space:pre-wrap;font-size:13.5px;line-height:1.55;margin-top:10px;overflow-wrap:anywhere}.enq-split form{max-height:72vh;overflow:auto}
@media (max-width:860px){.enq-split{grid-template-columns:1fr}.enq-mail{border-right:0;border-bottom:1px solid var(--line);max-height:30vh}}
.tabs-row{display:flex;flex-wrap:nowrap;overflow-x:auto;margin-top:12px;max-width:100%;scrollbar-width:none}.tabs-row::-webkit-scrollbar{display:none}
.tabs-row button{white-space:nowrap;padding:6px 11px;font-size:12.5px}.tabs-row .cnt{display:inline-block;min-width:18px;padding:0 5px;border-radius:10px;background:rgba(11,47,74,.08);font-size:11px;margin-left:3px;text-align:center}
.tabs-row button.on .cnt{background:var(--aqua)}
.steps .look{box-shadow:inset 0 0 0 2px var(--blue);color:var(--navy)!important;background:var(--tint)!important}
.stage-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:-10px 0 16px;font-size:12.5px;flex-wrap:wrap}
.stage-bar.look{background:var(--tint);border:1px solid var(--tintline);border-radius:12px;padding:10px 12px;font-size:13px;margin-top:-8px}
.card.flash,.flash{animation:flash 1.6s ease}@keyframes flash{0%,60%{box-shadow:0 0 0 3px rgba(29,139,201,.45)}100%{box-shadow:none}}
/* Dropdowns: one look everywhere, no browser default. */
select.f,.fact select,.filterbar select,.calc select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px;cursor:pointer}
.fact select{background-position:right 4px center;padding-right:22px}
/* A date shown in words, its calendar under it. */
.dtw{position:relative;display:block;cursor:pointer}.dtw .dtl{display:block;font-weight:600;text-align:right;padding:4px 6px;border:1px solid transparent;border-radius:7px}
.dtw:hover .dtl{border-color:var(--line)}.dtw .dtl.ph{color:var(--ink3);font-weight:500}.dtw input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.next-form{display:grid;grid-template-columns:1fr 120px;gap:8px;margin-top:10px}.next-form .dtw.f{padding:0;display:flex;align-items:center}.next-form .dtw .dtl{text-align:left;width:100%;padding:8px 10px;border:0}
/* The Yachts filters: one bar. */
.filterbar{display:flex;flex-wrap:wrap;align-items:end;gap:10px;padding:12px;margin:16px 0}
.fb-search{flex:1 1 240px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 12px;height:40px;background:var(--bg);color:var(--ink3)}.fb-search input{border:0;background:transparent;outline:none;flex:1;font-size:14px;color:var(--ink)}
.fb{display:flex;flex-direction:column;gap:3px;font-size:11px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.04em}
.fb input,.fb select{height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font-size:14px;color:var(--ink);background-color:#fff;min-width:120px;text-transform:none;letter-spacing:0;font-weight:500}.fb input{width:120px}
.fb input:focus,.fb select:focus,.fb-search:focus-within{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(29,139,201,.12)}
/* Places on the floor and the desk: a glow when pointed at, a pulse and a bubble when something waits there. */
.zone{position:absolute;border:0;background:transparent;border-radius:16px;cursor:pointer;padding:0;transition:box-shadow .2s,background .2s}
.zone.round{border-radius:22px}
.zone:hover,.zone:focus-visible{background:rgba(255,255,255,.10);box-shadow:0 0 0 3px rgba(94,234,212,.95),0 0 28px 6px rgba(29,139,201,.55);outline:none}
.zb{position:absolute;top:-11px;right:-11px;min-width:26px;height:26px;padding:0 7px;border-radius:10px;background:#e5484d;color:#fff;font-weight:700;font-size:13px;display:grid;place-items:center;box-shadow:0 4px 12px rgba(229,72,77,.45),0 0 0 2px #fff}
/* The quiet count: how many there are when nothing waits (slate, a weight below red). */
.zb.q{background:#52708a;box-shadow:0 3px 10px rgba(11,47,74,.3),0 0 0 2px #fff;font-weight:600}
/* The life in the office on Today: the mailbox being read, the agents at work. */
.today .life{display:grid;gap:6px;font-size:12.5px;color:var(--ink2);padding:2px 4px 10px;line-height:1.4}.today .life .lr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 8px;align-items:baseline}.today .life .lt{min-width:0}.today .life .dot{position:relative;top:-1px}.today .life .link{white-space:nowrap;justify-self:end}
.zt{position:absolute;left:50%;bottom:calc(100% + 10px);--tx:-50%;--ty:4px;transform:translate(var(--tx),var(--ty));opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;background:rgba(11,47,74,.94);color:#fff;font-size:12.5px;font-weight:600;padding:7px 11px;border-radius:10px;white-space:nowrap;display:flex;align-items:center;gap:7px;box-shadow:0 8px 20px rgba(11,47,74,.3);z-index:3}
.zt img{width:22px;height:22px;border-radius:6px}
.zone:hover .zt,.zone:focus-visible .zt{opacity:1;--ty:0px}
/* A place along the picture's top edge names itself below, and one along a side hugs that side: the frame never cuts a name off. */
.zone.low .zt{bottom:auto;top:calc(100% + 10px);--ty:-4px}.zone.low:hover .zt,.zone.low:focus-visible .zt{--ty:0px}
.zone.l .zt{left:0;--tx:0}.zone.r .zt{left:auto;right:0;--tx:0}
@media (max-width:600px){.zt{white-space:normal;max-width:min(240px,calc(100vw - 48px))}}
/* The agents at their desks: a small figure each, lit when it has something in hand today, named when the picture is wide. */
/* Clients: an address book of cards, and a profile with a banner (unlike the Inbox's list of mail). */
.people{max-width:1240px}.ptools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:18px 0 6px}.ptools input.f{max-width:320px}
.psec{display:flex;align-items:baseline;gap:10px;margin:22px 0 10px}.psec h2{margin:0;font-size:15px;color:var(--navy)}
.cnt{font-size:11px;font-weight:600;color:var(--ink2);background:var(--bg);border-radius:10px;padding:1px 7px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.pcard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;cursor:pointer;display:flex;flex-direction:column;gap:12px;border-top:4px solid var(--teal);transition:box-shadow .15s,transform .15s}
.pcard:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.ptop{display:flex;gap:12px;align-items:center}.pn{font-weight:700;font-size:15px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ps{font-size:12.5px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.av.lg{width:48px;height:48px;font-size:16px}.av.xl{width:72px;height:72px;font-size:24px;border:3px solid rgba(255,255,255,.8)}
.pnow{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--ink);min-height:22px}.pnow>span:not(.chip):not(.turn){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pnow .turn{flex:none;white-space:nowrap}.pnow.quiet{color:var(--ink3)}
.pstats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;border-top:1px solid var(--line);padding-top:10px}.pstats div{display:flex;flex-direction:column;min-width:0}
.pstats b{font-size:13px;color:var(--navy);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pstats span{font-size:11px;color:var(--ink3)}
.profile{max-width:1240px}.pback{display:inline-flex;align-items:center;gap:6px;margin-bottom:12px}
.phero{display:flex;gap:18px;align-items:center;flex-wrap:wrap;background:linear-gradient(120deg,var(--navy),#155e83 60%,#0f8f8a);color:#fff;border-radius:18px;padding:22px 24px;margin-bottom:16px}
.phero h1{color:#fff;margin:0}.phero .sub{color:rgba(255,255,255,.75);margin:2px 0 0}
.hstats{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:12.5px;color:rgba(255,255,255,.8)}.hstats b{color:#fff;font-size:14px;margin-right:3px}
.phero .btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}.phero .btn:hover{background:rgba(255,255,255,.22)}.phero .btn.pri{background:#fff;color:var(--navy);border-color:#fff}
.phero>.grow{flex:1 1 300px}.hstats span{white-space:nowrap}
/* The charter page: the journey, one line of steps. */
.cv{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start;margin-top:16px}
.jcard{padding:18px 22px 8px}.jcard>form{margin-bottom:16px!important}
.js{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;position:relative}
.js:before{content:"";position:absolute;left:16px;top:34px;bottom:-4px;width:2px;background:var(--line2)}.js:last-child:before{display:none}.js.done:before,.js.passed:before{background:var(--teal)}
.jd{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;background:#fff;border:2px solid var(--line2);color:var(--ink3);position:relative;z-index:1;padding:0}
.js.done .jd{background:var(--teal);border-color:var(--teal);color:#fff}.js.passed .jd{background:#f0fdfa;border-color:#99e6da;color:#0f766e}
.js.now .jd{background:var(--navy);border-color:var(--navy);color:var(--onnavy);box-shadow:0 0 0 5px var(--bluebg)}
.jb{padding:6px 0 20px;min-width:0}.jt{display:flex;justify-content:space-between;gap:10px;align-items:baseline;cursor:pointer}.jt b{font-size:15px}.jt .w{font-size:12px;color:var(--ink3);white-space:nowrap}
.js.later .jt b{color:var(--ink3)}.js.now .jt .w{color:var(--blue);font-weight:700;text-transform:uppercase;font-size:11px}
.jl{font-size:13px;color:var(--ink2);margin-top:2px}.js.later .jl{color:var(--ink3)}
.jev{font-size:12px;color:var(--ink2);margin-top:6px;padding-left:10px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:3px}.jev i{font-style:normal;color:var(--ink3)}.jev>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jopen{margin-top:10px;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fbfcfd}.jopen.now{border-color:#cfe3f1;background:#f8fbfe}
.jopen .card{border:0;background:transparent;padding:6px 0 0;box-shadow:none}.jopen .card h2{font-size:13px}
.when{font-size:11px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.facts.flat{padding:0;margin:4px 0}
.chk{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 12px;border:1px solid var(--line);border-radius:11px;margin-bottom:6px;background:#fff}
.chk .cb{width:20px;height:20px;border-radius:6px;border:2px solid var(--line2);display:grid;place-items:center;font-size:12px;color:#fff;background:#fff;padding:0}
.chk .cb:hover{border-color:var(--teal)}.chk.ok .cb{background:var(--teal);border-color:var(--teal)}.chk.ok .t s{color:var(--ink3)}
.chk.now{border-color:#9cc9e6;background:#f5faff}.chk .t{font-size:13px;min-width:0}.chk .t small{display:block;color:var(--ink3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis}
.seg.sm button{padding:4px 9px;font-size:12px}
@media (max-width:1250px){.cv{grid-template-columns:1fr}.cv>.side-col{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.cv>.side-col .box{margin:0}}
/* The logo as a switch between the demo and the real office, for the people allowed both. */
.twin{display:block;border:0;background:none;padding:0;margin:2px 0 18px;text-align:left;cursor:pointer;border-radius:12px;width:100%}.twin .logo,.twin .office{margin:6px 8px 10px}
.twin .tw{display:flex;justify-content:space-between;align-items:center;gap:6px;margin:0 8px;padding:5px 9px;border-radius:9px;background:var(--aqua);font-size:11.5px;color:var(--navy)}
.twin .tw span{color:var(--blue);font-weight:600}.twin:hover .tw{background:var(--bluebg)}
/* Notes she writes in every day: big and near the top. */
.notes-box{margin-bottom:14px}textarea.notes{font-size:14.5px;line-height:1.5;min-height:150px}
.said{margin:4px 0 0;padding-left:18px}.said li{margin:3px 0}
/* Her own Outlook appointments on the calendar: grey, read only. */
.bar.o{background:#eef1f4;color:#475569}
.outlook-card{display:flex;gap:16px;align-items:center;margin:14px 0 0;flex-wrap:wrap}
.draft{margin:12px 0}.draft textarea{font-size:14px;line-height:1.5}
/* Asking the assistant to change a draft: her words on the right, its replies on the left. */
.draft-chat{margin:10px 0 2px;display:flex;flex-direction:column;gap:6px}.draft-chat .bub{max-width:80%;padding:6px 11px;border-radius:12px;font-size:13px}
.draft-chat .bub.you{align-self:flex-end;background:var(--navy);color:var(--onnavy)}.draft-chat .bub.ai{align-self:flex-start;background:var(--aqua);color:var(--navy)}

.toast .tact{margin-left:12px;border:0;background:rgba(255,255,255,.18);color:inherit;font-weight:700;border-radius:8px;padding:4px 10px;cursor:pointer}
/* Done: three ways it was dealt with, the chosen one marked. */
.choices.three{grid-template-columns:repeat(3,1fr)}.choice{cursor:pointer}.choice.on{border-color:var(--navy);box-shadow:0 0 0 2px var(--navy) inset;background:#f8fbfe}
.done-note{display:flex;flex-direction:column;gap:8px}
@media (max-width:640px){.choices.three{grid-template-columns:1fr}}

/* The office's own look: its logo top left, KodoDesk's top right, and its colours from Settings. */
.top .cd{height:26px;margin-left:auto;cursor:pointer;flex:none}
html.themed{--navy2:color-mix(in srgb,var(--navy) 85%,#fff);--aqua:color-mix(in srgb,var(--navy) 9%,#fff);--bluebg:color-mix(in srgb,var(--blue) 14%,#fff);--blueink:color-mix(in srgb,var(--blue) 70%,#000);--tint:color-mix(in srgb,var(--blue) 7%,#fff);--tintline:color-mix(in srgb,var(--blue) 30%,#fff)}
.logo-pair{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-top:4px}.lz{display:flex;flex-direction:column;gap:6px;min-width:0}.lz>small{color:var(--ink2);font-size:12px;line-height:1.4;min-height:34px}.lz>.btn{align-self:flex-start}
.lz-drop{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:10px;border:2px dashed var(--line2);border-radius:14px;padding:14px;min-height:140px;box-sizing:border-box}label.lz-drop{cursor:pointer}label.lz-drop:hover,.lz-drop.over{border-color:var(--blue);background:var(--bluebg)}
.lz-drop .brand-logo{margin:0}.lz-say{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--navy)}.lz-say .ico{width:15px;height:15px}
.icon-show{display:flex;align-items:center;gap:14px}.icon-show .big{width:76px;height:76px;border-radius:16px;border:1px solid var(--line);background:var(--side,#fff);object-fit:cover}.icon-show .at40{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;color:var(--ink3)}.icon-show .at40 img{width:40px;height:40px;border-radius:10px;object-fit:cover}
.icon-show .ini{width:48px;height:48px;flex:none;border-radius:12px;font-size:22px;background:var(--navy);color:var(--onnavy);box-shadow:none;font-family:inherit;font-weight:700}.icon-show .none{font-size:12px;color:var(--ink3);line-height:1.4}.sx-mark.img.sq{object-fit:cover;padding:0}
@media (max-width:760px){.logo-pair{grid-template-columns:1fr}}
.side .ricon{display:none}
.brand-logo{display:flex;align-items:center;gap:14px;margin-bottom:12px}.brand-logo .shown{height:76px;max-width:260px;object-fit:contain;object-position:left;background:var(--side,#fff);border:1px solid var(--line);border-radius:12px;padding:10px 14px}.brand-logo .shown.plate{background:#fff}.brand-logo .shown.plate-main{background:var(--navy)}.brand-logo .none{font-size:12px;color:var(--ink3);border:1px dashed var(--line2);border-radius:10px;padding:16px 18px}
.swatch{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.swatch:last-of-type{border-bottom:0}
/* Presets for the office colour sit in a drop-down under the pickers. */
.fl.preset{margin-top:12px;color:var(--ink2);font-size:13px}
/* Pages the clients see: their colours or KodoDesk's, and the real itinerary side by side at phone size in each. */
.cfor{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:6px}.cfor small{color:var(--ink3)}.cfor .row-flex{gap:14px}
.fl.preset .dot,.pop .dot{display:inline-block;width:14px;height:14px;border-radius:4px;margin-right:8px;vertical-align:-2px;border:1px solid rgba(0,0,0,.08)}.fl.preset .btn{justify-self:start}
.swatch input{width:44px;height:36px;padding:2px;border:1px solid var(--line2);border-radius:9px;background:#fff;cursor:pointer}.swatch small{display:block;color:var(--ink3)}.swatch code{font-size:12px;color:var(--ink2)}
@media (max-width:980px){.top .cd{display:none}}
html.plainlogo .top .cd{filter:brightness(0)}
/* The office's logo behind the pages: fixed, in the middle of the page area, behind everything, and it never takes a click. */
html{--wm-ink:#000}html.darkbg{--wm-ink:#fff}
html.wm .main::before{content:"";position:fixed;z-index:-1;pointer-events:none;left:calc(232px + (100vw - 232px)*.1);right:calc((100vw - 232px)*.1);top:calc(64px + 12vh);bottom:12vh;background:var(--wm-ink);opacity:var(--wm-a);-webkit-mask:var(--wm) center/contain no-repeat;mask:var(--wm) center/contain no-repeat}
@media (max-width:760px){html.wm .main::before{left:8vw;right:8vw}}
/* Cards let it through a little unless the office chose solid ones, on a light page. On a dark one they stay solid: see-through white over dark turns grey. */
html.wm:not(.darkbg,.wm-solid) :is(.card,.today,.item,.list,.yc,.pcard,.tool,.agent,.cal>div){background:rgba(255,255,255,.72)}
.wm-cards{margin-top:12px}.wm-cards .small{display:block;margin-top:6px}.wm-dark{margin-top:12px}.wm-dark input{flex:1;max-width:320px;accent-color:var(--navy)}.wm-dark b{min-width:38px}.wm-why{color:var(--amberink);background:var(--amberbg);border-radius:9px;padding:8px 10px}
.search span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Selecting people; every way to reach someone; could this be the same person. */
.pcard{position:relative}.pcard.picked{outline:2px solid var(--blue);outline-offset:-2px}
.pbox{position:absolute;top:12px;right:12px;width:22px;height:22px;border:1.5px solid var(--line);border-radius:7px;background:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--blue)}
.pcard.picked .pbox{border-color:var(--blue)}
.pickbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--tint);border:1px solid var(--tintline);border-radius:12px;padding:10px 14px;margin:0 0 14px;position:sticky;top:8px;z-index:5}
.pickbar .right{margin-left:auto}
.way{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13px;min-width:0}.way>span{width:92px;flex:none;color:var(--ink3)}.way>b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.way.add{padding:2px 0 6px}.way.add .f{padding:6px 10px;font-size:13px}
.card.same{border-color:var(--tintline);background:var(--tint)}.join-list{max-height:46vh;overflow:auto;margin-top:8px}
details.exact summary{cursor:pointer;margin:-4px 0 6px;width:max-content}details.exact .grid2{margin-top:6px}
.stepfiles{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line)}.priceline{margin-top:8px}.docread td{vertical-align:top}.docread tr.muted td{color:var(--ink3)}
.officein{width:130px;padding:4px 8px;font-size:12px}.stop{display:flex;gap:6px;align-items:center;margin-bottom:6px}.stop .f{flex:1;min-width:0}.stop .nm{flex:0 0 62px}
/* A coloured side menu: its words turn white on a dark colour, and a dark logo gets a white strip so it still shows. */
.darkside .side{border-right-color:transparent;color:var(--onside)}.darkside .nav a,.darkside .side .foot,.darkside .side .me,.darkside .side .foot .link,.darkside .side .office{color:var(--onside)}
.darkside .side .foot{border-color:rgba(255,255,255,.25)}.darkside .nav .sep{background:rgba(255,255,255,.2)}
.darkside .nav a:hover{background:rgba(255,255,255,.12)}.darkside .nav a.on{background:rgba(255,255,255,.2);color:var(--onside)}
.side .logo.plate{background:#fff;border-radius:10px;padding:8px 10px}.side .logo.plate-main{background:var(--navy);border-radius:10px;padding:8px 10px}.darkside .twin .tw{background:rgba(255,255,255,.14);color:var(--onside)}.darkside .twin .tw b,.darkside .twin .tw span{color:var(--onside)}
/* A dark page: the cards stay white, and the words that sit straight on the page turn white. */
.darkbg .pagehead h1,.darkbg .stagehead h1,.darkbg .pad>h1,.darkbg .phero h1,.darkbg .psec h2{color:#fff}.darkbg .pagehead .sub,.darkbg .stagehead .sub,.darkbg .pad>.sub,.darkbg .phero .sub,.darkbg .psec .muted,.darkbg .hstats,.darkbg .hstats b,.darkbg .pad>h3,.darkbg .cv>h3,.darkbg .profile>h3,.darkbg .pback,.darkbg .ptools .link,.darkbg .viewtabs label{color:rgba(255,255,255,.85)}
.darkbg .home .sub{color:rgba(255,255,255,.85)}.darkbg .home h1{color:#fff}.darkbg .today .sub{color:var(--ink2)}.darkbg .today h2{color:var(--ink)}
.drop.nl{padding:18px;margin:6px 0 10px}
.darkbg .psec .small,.darkbg .psec .cnt,.darkbg .ptools>.small,.darkbg .ptools>.link{color:rgba(255,255,255,.8)}
/* The page grows to its content, so the selection bar can stay in view all the way down. */
.pad.people{align-self:flex-start;width:100%}.pickbar{box-shadow:var(--shadow)}
.nl-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:12px 0}.nl-stats>div{background:var(--bg);border-radius:10px;padding:10px;text-align:center}.nl-stats b{display:block;font-size:18px;color:var(--navy)}.nl-stats span{font-size:11px;color:var(--ink3)}
.cr.ai{color:var(--navy);background:var(--amberbg)}
.want{padding:6px 0;border-top:1px solid var(--line);font-size:13px}.want span{display:block;color:var(--ink3);font-size:12px}.want b{font-weight:500}

/* The deal page's stage headings, the board's columns and its move on a phone */
.jg{padding-top:2px}.jg+.jg{margin-top:6px;border-top:1px solid var(--line);padding-top:14px}.jh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.jh b{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}.jg.here .jh b{color:var(--navy)}.jh .btn{margin-left:auto}
.jnone{font-size:13px;color:var(--ink3);padding:0 0 14px}
.js.later .jd,.js.later .jt{cursor:pointer}
.board{grid-template-columns:repeat(var(--cols,7),minmax(210px,1fr))}
/* The ten-stage board: four groups like the deal page's strip, each with its columns; an empty column stays, narrow */
.board10{display:flex;gap:14px;overflow:auto;padding-bottom:10px;align-items:flex-start}.bgrp{flex:none;display:flex;flex-direction:column;gap:7px}
.bgrp h5{margin:0 4px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);border-bottom:2px solid var(--line);padding-bottom:5px}
.bcols{display:flex;gap:10px;align-items:flex-start}.board10 .col{width:226px;flex:none}.board10 .col h4 b{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board10 .col.thin{width:44px;padding:10px 0;min-height:220px}.board10 .col.thin h4{writing-mode:vertical-rl;transform:rotate(180deg);margin:0 auto;flex-direction:row-reverse;align-items:center;gap:8px;justify-content:flex-end}
.board10 .col.thin h4 span{padding:6px 0;width:20px;text-align:center}.board10 .col.thin.drop{width:226px}.deal .mv{display:none;margin-top:8px}.deal .dealacts{margin-top:7px;flex-wrap:wrap;gap:6px}
@media(max-width:900px),(hover:none){.deal .mv{display:inline-flex}}
@media(max-width:720px){
  .board{grid-template-columns:repeat(var(--cols,7),82vw)}
  .board10 .col{width:78vw}.board10 .col.thin{width:44px}
}

/* Hotels and flights: a clean search, big photographs, and the office's own colours. */
.tv{max-width:1180px;margin:0 auto;padding:26px 28px 34px;min-height:100%}.tv [hidden]{display:none!important}
.tv-top{margin-bottom:18px}.tv-top h1{font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:40px;letter-spacing:-.015em;color:var(--navy);line-height:1.1;margin:6px 0 6px}.tv-top h1 em{font-style:italic}.tv-top p{margin:0;color:var(--ink2);font-size:15px;max-width:640px}
.tv-back{display:inline-flex;align-items:center;gap:3px;color:var(--ink3);font-size:13px;cursor:pointer}.tv-back:hover{color:var(--navy)}.tv-back .ico{width:15px;height:15px}
.tv-off{display:flex;gap:10px;align-items:flex-start;background:var(--tint);border:1px solid var(--tintline);border-radius:12px;padding:11px 14px;margin-bottom:14px;font-size:13.5px;color:var(--ink2)}.tv-off .ico{color:var(--blue);margin-top:1px}
.tv-card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:0 18px 44px rgba(15,23,42,.07)}
.tv-form{padding:18px 20px;display:grid;gap:14px}
.tv-f{display:grid;gap:5px;min-width:0;font-size:11.5px;font-weight:600;color:var(--ink3);letter-spacing:.01em;align-content:start}.tv-f>span{white-space:nowrap}.tv-f .f{width:100%;min-width:0;margin:0;color:var(--ink);font-weight:400;font-size:14px}
.tv-stops{display:grid;gap:10px}.tv-stop{display:grid;grid-template-columns:26px minmax(0,1fr) 170px 74px 28px;gap:10px;align-items:end}.tv-n{width:26px;height:26px;border-radius:50%;background:var(--navy);color:var(--onnavy,#fff);display:grid;place-items:center;font-size:12px;font-weight:700;margin-bottom:7px}
.tv-x{border:0;background:none;color:var(--ink3);width:28px;height:36px;border-radius:8px;display:grid;place-items:center;padding:0}.tv-x:hover{background:var(--bg);color:var(--ink)}.tv-x .ico{width:15px;height:15px}
.tv-add{justify-self:start;border:1px dashed var(--line2);background:none;color:var(--ink2);border-radius:10px;padding:6px 13px;font-size:12.5px;font-weight:600;display:inline-flex;gap:5px;align-items:center}.tv-add .ico{width:14px;height:14px}.tv-add:hover{border-color:var(--blue);color:var(--blue)}
.tv-opts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.tv-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.tv-go{margin-left:auto;padding:10px 24px}
.tv-seg{display:inline-flex;background:var(--bg);border-radius:10px;padding:3px}.tv-seg button{border:0;background:none;color:var(--ink2);font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:8px}.tv-seg button.on{background:var(--card);color:var(--navy);box-shadow:0 1px 3px rgba(15,23,42,.12)}
.tv-check{display:inline-flex;gap:7px;align-items:center;font-size:13px;color:var(--ink2)}
.tv-res{margin-top:26px}.tv-resh{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}.tv-resh h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:26px;color:var(--navy);margin:0;display:block}.tv-resh span{color:var(--ink3);font-size:13px}
.tv-skip{margin-left:auto;border:0;background:none;color:var(--ink3);font-size:12.5px;text-decoration:underline;text-underline-offset:2px}.tv-skip:hover{color:var(--ink)}
.tv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.tv-hotel{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,transform .15s,border-color .15s}.tv-hotel:hover{box-shadow:0 14px 32px rgba(15,23,42,.1);transform:translateY(-2px)}.tv-hotel.pick{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}
.tv-tag{background:var(--navy);color:var(--onnavy,#fff);font-size:11px;font-weight:700;padding:3px 9px;border-radius:10px;align-self:flex-start}.tv-tag.soft{background:var(--bg);color:var(--navy)}
.tv-hb{padding:12px 14px 14px;display:flex;flex-direction:column;gap:5px;flex:1}.tv-hb h3{font-size:15px;font-weight:600;letter-spacing:-.005em;color:var(--ink);text-transform:none;margin:0;line-height:1.25}.tv-hb h3 small{font-weight:400;color:var(--ink3);font-size:12.5px}.tv-room{font-size:13px;color:var(--ink)}.tv-avail{font-size:12.5px;color:var(--amberink)}.tv-terms{font-size:12px;color:var(--ink3)}.tv-whyline{font-size:13px;color:var(--ink2);margin:4px 0 0;line-height:1.45}
.tv-src{font-size:11.5px;color:var(--ink3);display:flex;gap:4px;align-items:center}.tv-src.est{color:var(--amberink)}.tv-src .ico{width:12px;height:12px}.tv-notes{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin-top:18px;font-size:13px;color:var(--ink2)}.tv-notes>b{display:block;color:var(--ink);margin-bottom:4px}.tv-notes p{margin:4px 0 0}.tv-notes p b{color:var(--ink);margin-right:4px}
.tv-meta{font-size:12.5px;color:var(--ink2)}.tv-price{display:flex;align-items:baseline;gap:6px;margin-top:3px}.tv-price b{font-size:20px;color:var(--navy);letter-spacing:-.01em}.tv-price span{font-size:12px;color:var(--ink3)}
.tv-free{display:flex;gap:4px;align-items:center;font-size:12px;color:var(--greenink)}.tv-free .ico{width:13px;height:13px}.tv-do{display:flex;gap:6px;margin-top:auto;padding-top:8px}
.tv-why{display:grid;gap:5px;margin-top:12px;font-size:11.5px;font-weight:600;color:var(--ink3)}.tv-none{background:var(--card);border:1px dashed var(--line2);border-radius:14px;padding:18px;color:var(--ink2);text-align:center}
.tv-bar{position:sticky;bottom:12px;z-index:5;margin-top:22px;display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,260px) auto;gap:12px;align-items:center;background:var(--navy);color:#fff;border-radius:16px;padding:11px 12px 11px 18px;box-shadow:0 18px 40px rgba(15,23,42,.3)}.tv-bar .f{margin:0;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}.tv-bar .f::placeholder{color:rgba(255,255,255,.6)}.tv-bar .btn.pri{background:#fff;color:var(--navy);border-color:#fff}
.tv-sum{min-width:0}.tv-sum b{display:block;font-size:15px}.tv-sum span{display:block;font-size:12px;opacity:.75;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv-route{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 160px 160px;gap:10px}.tv-combo{position:relative}.tv-list{position:absolute;z-index:20;top:100%;left:0;right:0;margin-top:4px;background:var(--card);border:1px solid var(--line2);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;max-height:300px;overflow-y:auto}
.tv-list button{display:flex;gap:10px;width:100%;border:0;background:none;padding:9px 12px;text-align:left;font-size:13px;color:var(--ink);align-items:baseline}.tv-list button:hover{background:var(--bg)}.tv-list b{color:var(--navy);flex:none}.tv-list span{font-weight:400;color:var(--ink2);white-space:normal}
.tv-near{display:flex;gap:7px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--ink2)}.tv-near button{border:1px solid var(--line2);background:var(--card);border-radius:10px;padding:5px 11px;font-size:12.5px;font-weight:600;color:var(--navy)}.tv-near button:hover{border-color:var(--navy)}.tv-near small{font-weight:400;color:var(--ink3);margin-left:6px}.tv-near em{font-style:normal;color:var(--ink3);font-size:11.5px}
.tv-flight{display:grid;grid-template-columns:minmax(0,1fr) 170px auto;grid-auto-rows:auto;gap:8px 16px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin-bottom:8px}.tv-flight:hover{box-shadow:0 10px 26px rgba(15,23,42,.08)}.tv-flight .tv-fare{grid-column:2;grid-row:1/span 2}.tv-flight .tv-do{grid-column:3;grid-row:1/span 2;margin:0;padding:0;flex-direction:column}.tv-flight .tv-whyline{grid-column:1/-1}
.tv-leg{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:14px;align-items:center;grid-column:1}.tv-air b{display:block;font-size:13.5px;line-height:1.25}.tv-air span{display:block;font-size:12px;color:var(--ink3)}
.tv-times{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}.tv-times b{display:block;font-size:19px;letter-spacing:-.01em;color:var(--ink);line-height:1.1}.tv-times sup{font-size:10px;color:var(--amberink)}.tv-times div>span{font-size:11.5px;color:var(--ink3)}
.tv-path{text-align:center;min-width:0}.tv-path i{display:block;height:2px;background:linear-gradient(90deg,var(--navy),var(--blue));border-radius:9px;margin-bottom:4px}
.tv-fare{text-align:right}.tv-fare b{display:block;font-size:19px;color:var(--navy);letter-spacing:-.01em}.tv-fare span{font-size:11.5px;color:var(--ink3)}.tv-fare small{display:block;font-size:11.5px;color:var(--ink2);margin-top:3px;line-height:1.35}.tv-fare .tv-src{justify-content:flex-end;margin-top:3px}
.tv-chosen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 28px;gap:12px;align-items:start;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:8px}.tv-chosen b{margin:0 4px 0 7px;font-size:16px;color:var(--navy)}.tv-chosen small{display:block;color:var(--ink2);margin-top:6px;line-height:1.4}.tv-chosen .f{margin:0}
@media (max-width:860px){.tv{padding:16px 16px 26px}.tv-top h1{font-size:32px}.tv-form{padding:14px}.tv-stop{grid-template-columns:minmax(0,1fr) 74px 28px}.tv-stop .tv-n{display:none}.tv-stop .wide{grid-column:1/-1}.tv-stop .tv-x{grid-column:3;grid-row:2}.tv-stop:not(:has(.tv-x)) .wide~.tv-f:not(.nights){grid-column:1}.tv-opts{grid-template-columns:repeat(3,minmax(0,1fr))}.tv-route{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.tv-route .wide{grid-column:1/-1}.tv-go{width:100%;margin-left:0}
  .tv-grid{grid-template-columns:1fr}.tv-bar{grid-template-columns:1fr;padding:12px;bottom:8px}.tv-bar .f{display:none}.tv-flight{grid-template-columns:1fr;gap:8px;padding:12px}.tv-flight .tv-fare,.tv-flight .tv-do{grid-column:1;grid-row:auto}.tv-fare{text-align:left}.tv-fare .tv-src{justify-content:flex-start}.tv-flight .tv-do{flex-direction:row}.tv-flight .tv-do .btn{flex:1;justify-content:center}.tv-leg{grid-template-columns:1fr;gap:6px}.tv-bar .btn{justify-content:center}.tv-chosen{grid-template-columns:minmax(0,1fr) 28px}.tv-chosen .f{grid-column:1/-1;grid-row:2}}
/* The itinerary tool. */
.it-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}.it-c{padding:16px 18px;margin-bottom:12px}.it-c h3{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink3);margin:0 0 8px}.it-c p{margin:4px 0 0;font-size:13.5px;color:var(--ink2)}
.it-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.it-top .wide{grid-column:1/-1}.it-side{position:sticky;top:14px}
.it-big{display:block;font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:36px;line-height:1.1;color:var(--navy)}.it-apa{height:10px;border-radius:9px;background:var(--line);overflow:hidden;margin-top:10px}.it-apa i{display:block;height:100%;background:var(--teal,#14b8a6)}.it-small{font-size:12.5px!important;color:var(--ink3)!important;margin-top:8px!important}
.it-w{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;background:#fff6e0;border:1.5px solid #f7c948;color:#5c4305;border-radius:14px;padding:11px 14px;margin-bottom:10px;font-size:14px}.it-w div{flex:1 1 240px;min-width:0}.it-w b{display:block;color:#3f2e03}
.it-day{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:10px 14px 12px;margin-bottom:8px}.it-day.drag{border-color:var(--teal,#14b8a6);box-shadow:0 12px 28px rgba(11,47,74,.18)}
.it-dh{display:grid;grid-template-columns:24px 92px minmax(0,1fr) auto 28px;gap:10px;align-items:center}.it-grip{width:24px;height:36px;border:0;background:none;color:var(--ink3);cursor:grab;touch-action:none;padding:0;display:grid;place-items:center}.it-grip svg{width:12px;height:20px}
.it-dn b{display:block;font-size:14px;color:var(--navy)}.it-dn span{font-size:12px;color:var(--ink3)}.it-stop{margin:0;font-weight:600}.it-leg{text-align:right;font-size:13px;white-space:nowrap}.it-leg b{display:block;color:var(--navy)}.it-leg span{font-size:12px;color:var(--ink3)}.it-x{border:0;background:none;color:var(--ink3);cursor:pointer;padding:4px}.it-x .ico{width:16px;height:16px}
.it-db{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) 190px;gap:10px;margin-top:8px}.it-dside{display:grid;gap:8px;align-content:start}.it-photo{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--navy);border:1.5px dashed var(--line);border-radius:10px;padding:8px 10px;cursor:pointer}.it-photo.has{border-style:solid;color:#0a7a6d}.it-photo .ico{width:15px;height:15px}
.it-next{padding:18px 20px}.it-next h3{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink3);margin:0 0 10px}.it-next .it-w{margin-bottom:12px}.it-next .it-small{margin:10px 0 0!important}
.it-step{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px 14px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}.it-step>i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:14px;background:var(--line);color:var(--ink2)}.it-step.now>i{background:var(--navy);color:#fff}.it-step.done>i{background:color-mix(in srgb,var(--teal,#14b8a6) 18%,#fff);color:#0a7a6d}
.it-stept{min-width:0}.it-stept b{display:block;font-size:16px;color:var(--navy)}.it-step.wait .it-stept b{color:var(--ink2)}.it-stept span{font-size:13px;color:var(--ink3)}.it-stepa{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px}.it-stepa .btn{white-space:nowrap}.it-heard{margin-top:12px}
.pk-big{position:relative;height:clamp(180px,34vh,320px);border-radius:12px;overflow:hidden;background:linear-gradient(168deg,#d9ecff 0%,#cdeaf3 34%,#e6eee9 62%,#f6e4d2 84%,#fbd9bb 100%)}.pk-big img{width:100%;height:100%;object-fit:cover;display:block}.pk-big em{position:absolute;left:12px;bottom:10px;background:rgba(11,47,74,.75);color:#fff;font-style:normal;font-size:13px;padding:3px 10px;border-radius:10px}.pk-none{height:100%;display:grid;place-items:center;color:var(--navy);font-size:15px;padding:16px;text-align:center}.pk-says{margin:8px 0 0;min-height:18px}.pk h4{margin:16px 0 8px;font-size:13px;color:var(--ink2)}
.pk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:8px}.pk-tile{padding:0;border:2px solid transparent;border-radius:10px;background:none;cursor:pointer;text-align:left;font:inherit;color:var(--ink2);overflow:hidden}.pk-tile:hover{border-color:var(--line2)}.pk-tile.on{border-color:var(--navy)}.pk-tile img{width:100%;height:86px;object-fit:cover;display:block;border-radius:8px}.pk-tile span{display:block;font-size:12.5px;padding:4px 2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pk-res{min-width:0}.pk-res>small{display:block;font-size:11px;line-height:1.3;color:var(--ink3);padding:0 2px 2px}.pk-res a{color:inherit;text-decoration:underline}.pk-res .pk-tile{display:block;width:100%}.pk-search{display:flex;gap:8px;margin-top:14px}.pk-search .f{flex:1;margin:0}.pk-found{margin-top:10px}
.it-said{font-size:13.5px;padding:7px 0;border-top:1px solid var(--line);color:var(--ink2)}.it-said:first-of-type{border-top:0}.it-said b{display:block;color:var(--ink)}.it-said.chg b{color:#92620a}.it-said a{display:block;font-size:12.5px;color:var(--navy);cursor:pointer;text-decoration:underline}
.it-h{font-size:13px;color:var(--ink3);margin:18px 0 8px}.it-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}.it-pick{display:block;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;cursor:pointer}.it-pick:hover{border-color:var(--navy)}.it-pick b{display:block;color:var(--navy)}.it-pick span{font-size:13px;color:var(--ink3)}
/* A draft on the list: the card opens it, and its quiet Remove (on hover, or a row button on a phone) takes it off the list, kept. */
.it-draft{display:flex;align-items:stretch;gap:6px;padding:0}.it-pickin{flex:1;min-width:0;display:block;padding:12px 14px;cursor:pointer}.it-draft:hover{border-color:var(--navy)}.it-draft span.it-pickin{cursor:default}
.it-rm{display:inline-flex;align-items:center;gap:4px;align-self:center;margin-right:8px;border-radius:8px;font-size:12.5px;color:var(--ink3)}.it-rm em{font-style:normal}.it-rm:hover{background:var(--bg);color:#b42318}
@media (hover:hover){.it-rm{opacity:0;transition:opacity .12s}.it-draft:hover .it-rm,.it-rm:focus-visible{opacity:1}.it-rm em{display:none}}
@media (hover:none){.it-rm .ico{display:none}.it-rm{border:1px solid var(--line);padding:6px 10px}}
.it-gone{margin-top:28px}.it-gone summary{cursor:pointer;font-size:13px;color:var(--ink3)}.it-gone .it-small{margin:6px 0 10px}.it-gone .it-draft .btn{align-self:center;margin-right:10px}
@media (max-width:960px){.it-grid{grid-template-columns:1fr}.it-side{position:static}.it-db{grid-template-columns:1fr}.it-dh{grid-template-columns:24px 70px minmax(0,1fr) auto 24px;gap:6px}}
.it-db{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.it-db .tv-f>span{white-space:normal}
.prov button[disabled]{opacity:.5;cursor:default;box-shadow:none;border-color:var(--line)}
.it-tick{display:flex;gap:8px;align-items:flex-start;font-size:14px;padding:5px 0}.it-tick input{margin-top:3px}
.it-b{margin-top:6px}.it-more summary{cursor:pointer;font-weight:600;color:var(--navy);font-size:14px}.it-more[open] summary{margin-bottom:10px}.it-more .tv-f{display:block;margin-bottom:10px}.it-cap{border-color:var(--teal,#14b8a6)}.it-cap p{margin:0 0 4px;font-size:14px}.it-cap .row-flex{margin-top:10px}

/* Kodo Guest, for an office that connected, and the private place for a client's ID. */
.kg-ways{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:12px}
.kg-way{border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;align-items:flex-start;min-width:0;background:var(--card)}
.kg-way.rec{border-color:var(--tintline);background:var(--tint)}.kg-way.on{border-color:var(--teal)}.kg-way p{margin:0}
.kg-head{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.kg-head b{font-size:14px;color:var(--navy)}
.kg-why{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:13px}.kg-why li{display:grid;gap:1px}.kg-why b{color:var(--navy)}.kg-why span{color:var(--ink2);line-height:1.4}
.kg-link{display:grid;gap:6px;padding:8px 0;border-bottom:1px dashed var(--line)}.kg-link .row-flex{flex-wrap:wrap}
.kg-note{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:8px 10px;margin:6px 0;font-size:13px}
.kg-q{display:grid;grid-template-columns:150px minmax(0,1fr);gap:6px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line)}.kg-q>input{grid-column:1/-1}.kg-q>.row-flex{justify-content:flex-end}
.tv-card .kg-note+button,.it-c .it-small+.btn,.it-c .it-said+.btn{margin-top:8px}
.kg-note.calm{background:var(--tint);border-color:var(--tintline)}
.kg-docs{display:grid;gap:6px;padding-top:8px}
.kyc{border-color:var(--line2)}.kyc h2 .ico{width:15px;height:15px;color:var(--navy)}
@media (max-width:640px){.kg-ways{grid-template-columns:1fr}}
/* The Inbox as two channels (1 Nov): the view picker and channel switch, green WhatsApp rows, the person's pane with
   channel tabs, the chat, the composer with its menus. */
.pick{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 7px 0 12px;border:1.5px solid var(--navy);border-radius:12px;background:#fff;color:var(--navy);font-weight:700;font-size:15px;letter-spacing:-.01em}
.pick .cnt{background:var(--amberbg);color:var(--amberink);border-radius:99px;padding:1px 8px;font-size:12px}.pick .arr{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:var(--navy);color:var(--onnavy)}
.menu-w{position:relative;display:inline-flex}
.pop{position:absolute;top:calc(100% + 6px);left:0;z-index:30;min-width:220px;max-width:min(320px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;font-size:13px;text-align:left}
.pop.r{left:auto;right:0}.pop.fix{position:fixed;right:auto;bottom:auto;z-index:60}.pop.up{top:auto;bottom:calc(100% + 6px)}.pop button,.pop a{display:flex;width:100%;justify-content:space-between;align-items:center;gap:12px;text-align:left;border:0;background:none;padding:8px 10px;border-radius:8px;font:inherit;color:var(--ink);cursor:pointer;white-space:normal}
.pop button:hover,.pop a:hover{background:var(--bg)}.pop .on{background:var(--tint);color:var(--navy);font-weight:600}.pop .cnt{color:var(--ink3);font-size:12px}.pop .cnt.need{color:var(--amberink);font-weight:700}.pop .sep{height:1px;background:var(--line);margin:4px 6px}.pop .hd{padding:6px 10px 2px;font-size:11px;font-weight:700;color:var(--ink3);text-transform:uppercase;letter-spacing:.06em}
.seg.ch button{padding:5px 9px;display:grid;place-items:center}.seg.ch button.on{color:var(--navy)}
.row.wa{background:#f0fdf4}.row.wa.sel{background:#e4f8ea;box-shadow:inset 3px 0 0 var(--green)}.row .wa-line{color:var(--greenink)}.row .wa-line span{color:var(--ink2);font-weight:500}
.avw{position:relative;width:36px;height:36px;flex:none}.avw .av{width:100%;height:100%}.avw .wab{position:absolute;right:-4px;bottom:-3px;width:18px;height:18px;border-radius:50%;border:2px solid #fff;background:#25d366;display:grid;place-items:center}.row.wa .avw .wab{border-color:#f0fdf4}.avw.lg{width:44px;height:44px}.avw.lg .av{font-size:15px}.avw.lg .wab{width:20px;height:20px;border-color:var(--bg)}
.ph{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.ph h1{font-size:20px}.ph .sub2{font-size:12.5px;color:var(--ink2);display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:2px}.ph .acts2{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.ph .wal{color:var(--greenink);font-weight:600}
.row.kg{background:#f3f6fb}.row.kg.sel{background:#e8eef8;box-shadow:inset 3px 0 0 #14284b}.row .kg-line{color:#14284b}.row .kg-line span{color:var(--ink2);font-weight:500}.avw .wab.kg{background:#14284b}.row.kg .avw .wab{border-color:#f3f6fb}
.ph .kgl{color:#14284b;font-weight:600}.kgchat .bub.mine{background:#e8eef8;border-color:#d3ddef}.kgchat .bub.mine .bm{color:#3d5683}
.btn.kg{background:#14284b;border-color:#14284b;color:#fff}.btn.kg:hover{background:#0d1d38}.btn.kg[disabled]{opacity:.55;cursor:default}
.ctabs{display:flex;gap:22px;margin-top:14px;border-bottom:1px solid var(--line);font-size:13px;font-weight:600;align-items:flex-end;flex-wrap:wrap}
.ctabs>a,.ctabs>button{display:inline-flex;align-items:center;gap:7px;padding:0 2px 9px;color:var(--ink2);border:0;background:none;font:inherit;font-weight:600;margin-bottom:-1px;border-bottom:2px solid transparent;cursor:pointer}
.ctabs .on.wa{color:var(--greenink);border-bottom-color:var(--green)}.ctabs .on.em{color:var(--navy);border-bottom-color:var(--navy)}.ctabs .cnt{color:var(--ink3);font-weight:500}.ctabs .new{background:var(--amberbg);color:var(--amberink);border-radius:10px;padding:0 6px;font-size:11px}
.ctabs .right{margin-left:auto;padding-bottom:9px;color:var(--blueink);display:inline-flex;gap:5px;align-items:center;font-weight:600;cursor:pointer}
.thr{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}.thr h2{font-size:16px;letter-spacing:-.01em;margin:0}
.chat{display:flex;flex-direction:column;gap:10px;margin-top:14px}.daysep{align-self:center;font-size:11px;font-weight:600;color:var(--ink3);background:#eef2f6;border-radius:10px;padding:3px 10px}
.bub{max-width:min(620px,78%);padding:10px 14px;border:1px solid var(--line);background:#fff;border-radius:16px 16px 16px 4px;line-height:1.5;font-size:14px}.bub .bt{white-space:pre-wrap;overflow-wrap:anywhere}
.bub.mine{align-self:flex-end;background:#e6f7ec;border-color:#c7eed6;border-radius:16px 16px 4px 16px}.bub .bm{font-size:11px;color:var(--ink3);margin-top:4px;text-align:right}.bub.mine .bm{color:var(--greenink)}.bub .bm .late{color:#b42318}.bub .files{margin-top:8px}.bub .files a{background:#fff}
.composer{margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 12px 10px 16px;display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.composer textarea{flex:1 1 240px;border:0;resize:none;font:inherit;font-size:14px;outline:none;padding:6px 0;background:transparent;min-height:48px}.composer .note{flex:1 1 240px;color:var(--ink3);font-size:14px;padding:6px 0;line-height:1.45}
/* The split button is one control: the main half and the ▾ share a background and an outer border, the outer corners are rounded,
   the join is straight with a 1px lighter divider, and a keyboard focus ring goes round both. */
.composer .btn{height:44px;border-radius:12px}.split{display:inline-flex;align-items:stretch;border-radius:12px}.split .menu-w{display:flex}
.split>.btn{border-radius:12px 0 0 12px;border-right:0}.split>.btn:last-child{border-radius:12px;border-right:1px solid transparent}.split .arr{height:44px;border-radius:0 12px 12px 0;border-left:0;box-shadow:inset 1px 0 0 rgba(255,255,255,.35);padding:0 10px}
.split .btn:focus-visible{outline:none}.split:has(.btn:focus-visible){outline:2px solid var(--blue);outline-offset:2px}
.btn.wa{background:var(--green);border-color:var(--green);color:#fff}.btn.wa:hover{background:#0e8a44}.btn.wa[disabled]{opacity:.55;cursor:default}
.under{margin:8px 4px 0;font-size:12px;color:var(--ink3);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.under a{color:var(--navy);font-weight:600;display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.wa-closed{margin-top:14px}
.composer.ans textarea{flex-basis:100%}.composer.ans .yl{flex:1 1 240px;display:flex;gap:8px;align-items:center;min-width:0}.composer.ans .yl .f{flex:1;min-width:0}.composer.ans .picked{flex-basis:100%;display:flex;gap:5px;flex-wrap:wrap}.composer.ans .picked:empty{display:none}

/* A phone opens on what to do: Today above the picture, and a deal's buttons small enough to leave room for the deal. */
@media (max-width:760px){.home .today{order:-1;border-top:0;border-bottom:1px solid var(--line)}.pagehead .row-flex{gap:6px}.pagehead .row-flex .btn{padding:6px 10px;font-size:13px}}
.signin .lost{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);text-align:left;display:grid;gap:10px}.signin .lost p{margin:0}.signin .sent{margin:0}
.signin .legal-links{margin-top:10px}.signin .legal-links a{color:inherit}
.lostkey{margin-top:12px;background:var(--aqua);border-radius:10px;padding:12px 14px;font-size:13.5px;line-height:1.5}
/* A yacht's brochure: where it's dropped, and the facts beside the lines they came from, to tick. */
.bro-drop{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1.5px dashed #b9cad8;border-radius:14px;padding:14px 16px;margin-bottom:14px;background:#f8fbfd;transition:border-color .15s,background .15s}.bro-drop.over{border-color:var(--blue,#1d8bc9);background:#eaf5fc}.bro-drop .btn{flex:none}
.bro-t{width:100%;border-collapse:collapse;font-size:14px}.bro-t th{text-align:left;font-size:12px;font-weight:600;color:#64748b;padding:0 8px 8px;border-bottom:1px solid #e7ecf1}.bro-t td{padding:9px 8px;border-bottom:1px solid #eef2f5;vertical-align:top}.bro-t td:first-child{width:34px;padding-top:12px}.bro-t td:nth-child(3){width:200px}.bro-t td:nth-child(4){width:150px;padding-top:15px}.bro-t .f{padding:7px 10px}
.bro-t tr.same{opacity:.65}.bro-line{margin-top:3px;font-size:12.5px;color:#64748b;font-style:italic;line-height:1.4;max-width:340px}.bro-was{color:#92400e}
.bro-same{background:#fffbeb;border:1px solid #fde68a;border-radius:12px;padding:10px 14px;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.bro-queue .pay{gap:12px}
@media (max-width:700px){.bro-t thead{display:none}.bro-t tr{display:grid;grid-template-columns:34px 1fr;border-bottom:1px solid #eef2f5;padding:6px 0}.bro-t td{border:0;padding:4px 6px}.bro-t td:first-child{grid-row:span 3}.bro-t td:nth-child(3),.bro-t td:nth-child(4){width:auto;padding-top:4px}.bro-t td:nth-child(4)::before{content:"Stored now: ";color:#94a3b8}.bro-drop{flex-direction:column;align-items:flex-start}}
.mailchk{white-space:nowrap}.mailchk.busy .ico{animation:mailspin 1s linear infinite}@keyframes mailspin{to{transform:rotate(360deg)}}.today .life .lacts{display:flex;flex-direction:column;align-items:flex-end;gap:4px;justify-self:end}
.callagr{display:grid;gap:6px;background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:10px 12px}.callagr small{font-size:12px;color:var(--ink2)}

/* Sending from KodoDesk, and the assistant at work (3 Nov). */
@keyframes cdspin{to{transform:rotate(360deg)}}
.cd-spin{display:inline-block;flex:none;width:16px;height:16px;border-radius:50%;border:2px solid var(--line2);border-top-color:var(--blue);animation:cdspin .8s linear infinite}
.busy-draft{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--ink2);padding:14px 4px}
.sent-note{display:flex;align-items:center;gap:10px;background:var(--greenbg);color:var(--greenink);border-radius:10px;padding:10px 12px;font-size:13.5px}.sent-note .ico{width:16px;height:16px;flex:none}
.from-line{font-size:12.5px;color:var(--ink2);margin-top:8px}.from-line.warn{color:var(--amberink);background:var(--amberbg);border-radius:8px;padding:6px 10px}
.msg .spamnote{margin-top:8px;font-size:12.5px;background:var(--amberbg);color:var(--amberink);border-radius:8px;padding:6px 10px}
.msg details.quoted{margin-top:8px;font-size:12.5px;color:var(--ink3)}.msg details.quoted summary{cursor:pointer}.msg details.quoted pre{white-space:pre-wrap;font:inherit;margin:6px 0 0}
.card.quick{border:1px solid var(--tintline);background:var(--tint)}.card.quick .quickp{white-space:pre-wrap;font:13.5px/1.5 Inter,system-ui,sans-serif;margin:10px 0 0;color:var(--ink2)}
/* What's new: the red counts on Charters and a deal's card, and the news cards at the top of the Inbox. */
.nav .badge.red{background:var(--red,#dc2626);color:#fff}
.newsn{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:10px;background:var(--red,#dc2626);color:#fff;font-size:11px;font-weight:700;vertical-align:1px}
.nws{display:flex;flex-direction:column;gap:10px;padding:2px 0 12px}
.nwc.offer{border-left-color:var(--teal)}
.nwc{border:1px solid var(--line);border-left:3px solid var(--red,#dc2626);border-radius:10px;padding:11px 13px;background:var(--card,#fff);display:flex;flex-direction:column;gap:7px;min-width:0}
.nwc .nw1{display:flex;gap:8px;align-items:baseline;justify-content:space-between}.nwc .nw1 b{font-size:13.5px;line-height:1.35;color:var(--ink)}.nwc .nw1 .tm{font-size:11.5px;color:var(--ink3);white-space:nowrap}
.nwc .nwq{font-size:12.5px;color:var(--ink2);line-height:1.45;overflow-wrap:anywhere}
.nwc .nwk{font-size:12.5px;background:var(--amberbg);color:var(--amberink);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:6px}
.nwc .nwk .btn{white-space:normal;text-align:left}.nwc .nwt{font-size:12.5px;font-weight:600;color:var(--amberink)}.nwc .nwa{flex-wrap:wrap;gap:6px}
/* Reply all, files and the ten seconds to undo (4 Nov). */
.cc-line{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 2px;font-size:12.5px;color:var(--ink2)}.cc-line>span:first-child{display:inline-flex;gap:4px;align-items:center;font-weight:600}.cc-line .ico{width:13px;height:13px}
.cc-chip{display:inline-flex;align-items:center;gap:4px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:2px 4px 2px 10px;max-width:100%;overflow-wrap:anywhere}.cc-chip button{border:0;background:none;cursor:pointer;font-size:15px;line-height:1;color:var(--ink3);padding:0 5px;border-radius:50%}.cc-chip button:hover{color:var(--red);background:var(--redbg)}
.send-wait{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--tint);border:1px solid var(--tintline);border-radius:10px;padding:10px 12px;margin-top:10px;font-weight:600;color:var(--blueink)}.send-wait .btn{margin-left:auto}
.att-list{display:flex;flex-direction:column;gap:6px;max-height:50vh;overflow:auto}.att-row{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer}.att-row b{display:block;font-size:13.5px;overflow-wrap:anywhere}.att-row small{color:var(--ink3)}
/* Notes: the recorder (the top bar's pop-up and the Notes page) and the cards that file each part. */
.vn-rec{display:grid;gap:10px}
.vn-top{display:flex;align-items:center;gap:12px;min-height:52px}
.vn-mic{flex:none;width:52px;height:52px;border-radius:50%;border:1px solid var(--line2);background:#fff;color:var(--navy);display:grid;place-items:center;cursor:pointer}
.vn-mic .ico{width:24px;height:24px;stroke-width:2}
.vn-mic:hover{border-color:var(--navy)}
.vn-mic.on{background:var(--red,#d92d20);border-color:var(--red,#d92d20);color:#fff;animation:vn-pulse 1.4s ease-in-out infinite}
@keyframes vn-pulse{0%,100%{box-shadow:0 0 0 0 rgba(217,45,32,.35)}50%{box-shadow:0 0 0 9px rgba(217,45,32,0)}}
@media (prefers-reduced-motion:reduce){.vn-mic.on{animation:none}}
.vn-state{font-size:13.5px;line-height:1.35}.vn-state .vn-msg{color:var(--amberink,#92400e)}
.vn-words{font-size:15px;line-height:1.45;resize:vertical;min-height:110px}
.vn-words[readonly]{background:var(--bg)}
.vn-foot{display:flex;align-items:center;gap:12px}.vn-foot .vn-priv{flex:1}
.vn-note .vn-nh{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.vn-said{margin:0 0 12px;padding:8px 12px;border-left:3px solid var(--line2);color:var(--ink2);font-style:italic;white-space:pre-wrap}
.vn-item{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-top:10px;display:grid;gap:8px;background:#fff}
.vn-item.waiting{border-color:var(--line2);box-shadow:0 1px 2px rgba(15,23,42,.05)}
.vn-item.saved{background:var(--bg)}.vn-item.skipped{opacity:.7}
.vn-item.edit{gap:10px}
.vn-ih{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.vn-hl{font-weight:700;font-size:14.5px}
.vn-tx{white-space:pre-wrap}
.vn-ch{display:grid;gap:4px;font-size:13px}.vn-ch>div{display:flex;gap:10px;justify-content:space-between;border-top:1px dashed var(--line);padding-top:4px}.vn-ch s{color:var(--ink3)}
.vn-choices{display:flex;flex-wrap:wrap;gap:6px}.vn-choices .btn{flex-direction:column;align-items:flex-start;gap:0;white-space:normal;text-align:left}.vn-choices small{font-weight:500;color:var(--ink3)}
.vn-acts{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.vn-cf{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:8px;font-weight:500}
.vn-list{display:grid;gap:2px}.vn-list>input{margin-bottom:8px}
.vn-row{display:grid;grid-template-columns:110px 1fr;gap:4px 12px;padding:10px 6px;border-top:1px solid var(--line);color:var(--ink);text-decoration:none;cursor:pointer}
.vn-row:hover{background:var(--bg)}.vn-line{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.vn-chips{grid-column:2;display:flex;flex-wrap:wrap;gap:4px}
@media (max-width:760px){.vn-row{grid-template-columns:1fr}.vn-chips{grid-column:1}.vn-foot{flex-wrap:wrap}.vn-foot .btn{width:100%;justify-content:center;padding:11px}.vn-acts .btn{padding:8px 12px;font-size:13px}.vn-cf{grid-template-columns:1fr}}
/* Tools → Proposal page and Enquiry form: the choices on the left, the client's page live on the right at laptop or phone size. */
.lk{max-width:1440px}.lk-grid{display:grid;grid-template-columns:minmax(360px,460px) minmax(0,1fr);gap:22px;align-items:start;margin-top:18px}.lk-side{display:grid;gap:14px}.lk-side>.card,.lk-list>.card{margin:0}
.lk-pre{position:sticky;top:12px;display:grid;gap:10px}.lk-preh{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.lk-preh a{margin-left:auto}
.lk-frame{position:relative;overflow:hidden;border-radius:14px;border:1px solid var(--line2);background:#fff;box-shadow:var(--shadow)}.lk-frame iframe{display:block;border:0;transform-origin:0 0;background:#fff}
.lk-frame.phone{width:392px;max-width:100%;margin:0 auto;border-radius:28px;border:8px solid #1f2933}
.lk-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--line)}.lk-row>b{font-weight:600}
.lk-cover{display:grid;grid-template-columns:108px 1fr;gap:14px;align-items:start;padding-bottom:12px}.lk-thumb{height:76px;border-radius:10px;overflow:hidden;background:linear-gradient(120deg,var(--aqua),#dbe8ee);display:grid;place-items:center;text-align:center;font-size:11px;color:var(--ink2);padding:0}.lk-thumb img{width:100%;height:100%;object-fit:cover}.lk-thumb span{padding:6px}
.lk-logo{flex:1;min-width:0;display:flex;justify-content:center}.lk-logo img{max-height:34px;max-width:160px;object-fit:contain}
.lk-sw .swatch{grid-template-columns:52px 1fr auto}.lk-hint{justify-content:space-between;margin:-4px 0 6px}
.lk-tog{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;padding:10px 0;border-top:1px solid var(--line);cursor:pointer}.lk-tog:first-of-type{border-top:0}.lk-tog input{margin-top:2px}.lk-tog small{display:block;color:var(--ink3);font-size:12px;margin-top:2px}
.lk-ph-h{display:flex;flex-direction:column;gap:2px;margin:14px 0 8px}.lk-ph{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}
.lk-ph figure{margin:0;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#fff}.lk-ph figure.dim{opacity:.55}.lk-ph figure img{display:block;width:100%;height:78px;object-fit:cover}
.lk-ph figcaption{display:flex;align-items:center;gap:2px;padding:4px}.lk-ph figcaption i{font-style:normal;font-weight:700;font-size:12px;color:var(--navy);margin-right:auto;padding-left:4px}
.lk-add{position:relative;padding:0;border:1px dashed var(--line2);border-radius:10px;overflow:hidden;background:#fff}.lk-add img{display:block;width:100%;height:78px;object-fit:cover;opacity:.75}.lk-add span{position:absolute;right:6px;top:6px;width:24px;height:24px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--navy)}.lk-add .ico{width:14px;height:14px}
.lk-drop{margin:14px 0 10px;display:grid;gap:10px}
.lk-qr{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:start}.lk-code svg{width:150px;height:150px;display:block;border-radius:8px;border:1px solid var(--line)}.lk-urlbox{display:grid;gap:10px;min-width:0}.lk-url{display:block;font-size:12px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;overflow-wrap:anywhere}
.lk-q{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:start;padding:10px 0;border-top:1px solid var(--line)}.lk-q.off .lk-qt{opacity:.6}.lk-qt b{display:block;font-weight:600}.lk-qt span{display:block;color:var(--ink2);font-size:13px}.lk-qt small{display:block;color:var(--ink3);font-size:12px;margin-top:3px}.lk-qon input{margin-top:3px}.lk-qmv{display:flex;gap:2px}
@media (max-width:1080px){.lk-grid{grid-template-columns:1fr}.lk-pre{position:static;order:-1}}
@media (max-width:560px){.lk-qr{grid-template-columns:1fr}.lk-cover{grid-template-columns:84px 1fr}}

/* Tools → Proposal (proposal.js) */
.pt-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,44%);gap:22px;align-items:start}.pt-main{display:grid;gap:14px;min-width:0}
.pt-y .pt-yh{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}.pt-y .pt-yh b{font-size:15px}.pt-ord{display:flex;gap:6px;flex-wrap:wrap}
.pt-br{margin-top:10px;display:grid;gap:6px}.pt-sw{display:flex;gap:8px;align-items:center;font-size:13px}.pt-br .ok{color:var(--greenink)}
.pt-list{display:grid;gap:8px;margin:8px 0 18px}.pt-pick{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card,#fff);cursor:pointer;text-decoration:none;color:inherit}.pt-pick span{color:var(--ink3);font-size:13px}
@media (max-width:1080px){.pt-wrap{grid-template-columns:1fr}.pt-wrap .lk-pre{position:static;order:1}}
@keyframes dl-hot{0%{box-shadow:0 0 0 3px var(--teal)}100%{box-shadow:0 0 0 0 transparent}}
/* Fill from listing (yachts.js) */
.li-desc{display:block;margin:12px 0}.li-desc textarea{margin-top:6px}.li-ph{margin:12px 0 0}.li-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:8px}
.li-pic{position:relative;display:block;aspect-ratio:4/3;border-radius:10px;overflow:hidden;border:2px solid transparent;cursor:pointer;background:#e8edf2}.li-pic img{width:100%;height:100%;object-fit:cover;display:block}.li-pic input{position:absolute;top:6px;left:6px;z-index:1}.li-pic.on{border-color:var(--teal)}

/* Kodo Guest on Settings (kodo.js, from the 4 Nov mockup, variant A) */
.kg-navfree{font-size:10px;font-weight:700;color:#0f766e;background:#ccfbf1;border-radius:10px;padding:1px 6px;margin-left:6px;vertical-align:1px}
.kg-page{display:grid;gap:22px}.kg-page .kg-sec>h3{display:block;margin:0 0 4px;font-size:20px;color:var(--navy);text-transform:none;letter-spacing:-.01em;font-weight:700}.kg-lead{margin:0 0 14px;color:var(--ink2)}
.kg-hero{position:relative;overflow:hidden;border-radius:20px;color:#fff;padding:36px 36px 0;display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:30px;background:radial-gradient(120% 90% at 85% 10%,color-mix(in srgb,var(--blue) 45%,var(--navy)) 0%,transparent 55%),radial-gradient(80% 70% at 100% 100%,color-mix(in srgb,var(--teal) 45%,transparent) 0%,transparent 60%),linear-gradient(135deg,var(--navy) 0%,var(--navy2) 100%)}
.kg-txt{position:relative;padding-bottom:36px;z-index:1}.kg-hero h2{display:block;text-transform:none;font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;font-size:34px;line-height:1.08;margin:16px 0 14px;color:#fff;letter-spacing:-.01em}.kg-hero h2 em{font-style:italic;color:#7ee7da}
.kg-hero p{font-size:16px;color:#cfe3ef;max-width:520px;margin:0 0 22px;line-height:1.5}.kg-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.kg-free{display:inline-flex;align-items:center;gap:7px;background:rgba(20,184,166,.16);color:#5eead4;border:1px solid rgba(94,234,212,.4);border-radius:10px;padding:5px 12px;font-size:12.5px;font-weight:700}.kg-free svg{width:15px;height:15px}
.kg-cta{white-space:nowrap;background:#fff;color:var(--navy);border:0;border-radius:12px;padding:12px 18px;font:inherit;font-weight:700;font-size:15px;display:inline-flex;align-items:center;gap:9px;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.18)}.kg-cta.navy{background:var(--navy);color:#fff;box-shadow:0 8px 24px rgba(11,47,74,.25)}
.kg-tag{background:var(--teal);color:#fff;font-size:11.5px;border-radius:10px;padding:2px 8px}
.kg-ghost{white-space:nowrap;color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:12px;padding:11px 16px;font-weight:600;text-decoration:none}
.kg-fine{font-size:12.5px;color:#9bbfd4;margin-top:14px}.kg-band .kg-fine,.kg-steps .kg-fine{color:var(--ink3)}
.kg-stage{position:relative;display:flex;justify-content:flex-end;align-items:flex-end;padding-right:6px;z-index:1;min-height:420px}
.kg-float{position:absolute;z-index:2;background:#fff;color:var(--ink);border-radius:14px;padding:10px 12px;box-shadow:0 16px 40px rgba(2,22,38,.35);font-size:12.5px;display:flex;gap:10px;align-items:center;width:190px}.kg-float.f1{left:0;top:110px}.kg-float.f2{left:10px;top:320px}
.kg-float b{display:block;font-size:12.5px}.kg-float span:not(.kg-dot){color:var(--ink2);font-size:11.5px}.kg-dot{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none}.kg-dot.ok{background:var(--greenbg);color:var(--greenink)}.kg-dot.blue{background:var(--bluebg);color:var(--blueink)}.kg-dot svg{width:16px;height:16px}
.kg-phone{width:280px;border-radius:44px;background:#0a1a28;padding:11px;box-shadow:0 30px 70px rgba(2,22,38,.5),inset 0 0 0 2px #2a3d4f;position:relative;margin-bottom:-56px}
.kg-notch{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:90px;height:24px;border-radius:14px;background:#0a1a28;z-index:3}
.kg-scr{border-radius:34px;overflow:hidden;background:#f7f5f0;color:#0f172a;height:540px;display:flex;flex-direction:column;position:relative}
.kg-st{display:flex;justify-content:space-between;padding:12px 22px 0;font-size:11px;font-weight:600}.kg-ghead{padding:24px 18px 10px;display:flex;align-items:center;gap:8px}.kg-mk{width:22px;height:22px;border-radius:50%;border:2.5px solid #0b2f4a;border-right-color:transparent;transform:rotate(-30deg)}.kg-nm{font-size:10px;font-weight:700;letter-spacing:.16em;color:#0b2f4a}
.kg-gbody{padding:0 14px;flex:1;overflow:hidden;display:flex;flex-direction:column;gap:10px}.kg-ghi{font-family:"Iowan Old Style",Palatino,Georgia,serif;font-size:22px;color:#0b2f4a;line-height:1.15;margin:2px 4px 0}
.kg-gtrip{border-radius:16px;padding:14px;color:#fff;background:linear-gradient(140deg,#0b2f4a,#155e75 70%,#0f766e);position:relative}.kg-gtrip small{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#a5f3fc;font-weight:700}.kg-gtrip b{display:block;font-size:16px;margin:4px 0 2px}.kg-gtrip>span{font-size:11.5px;color:#cfe8f0}.kg-cd{position:absolute;right:12px;top:12px;text-align:right;font-size:10px;color:#a5f3fc}.kg-cd b{font-size:20px;margin:0;color:#fff}
.kg-gcard{background:#fff;border-radius:14px;padding:10px 12px;box-shadow:0 4px 14px rgba(15,23,42,.05)}.kg-gcard h5{margin:0 0 6px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#64748b}
.kg-gstep{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:12px;border-top:1px solid #f1f5f9}.kg-gstep:first-of-type{border-top:0}.kg-ck{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;flex:none;border:1.5px solid #cbd5e1}.kg-ck.done{background:#14b8a6;border-color:#14b8a6;color:#fff}.kg-ck svg{width:11px;height:11px;stroke-width:3}.kg-gstep em{font-style:normal;margin-left:auto;font-size:10.5px;font-weight:700;color:#0d9488}.kg-gstep small{display:block;color:#94a3b8;font-size:10.5px}
.kg-gmsg{display:flex;align-items:center;gap:10px}.kg-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff;background:#1d8bc9;flex:none}.kg-gmsg b{font-size:12px;display:block}.kg-gmsg span{font-size:11px;color:#64748b}
.kg-gtabs{display:flex;justify-content:space-around;padding:9px 6px 16px;background:#fff;border-top:1px solid #eef2f6;font-size:9.5px;color:#94a3b8;font-weight:600}.kg-gtabs .on{color:#0b2f4a}
.kg-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.kg-group{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;border-top:4px solid var(--blue)}.kg-group.teal{border-top-color:var(--teal)}.kg-group.navy{border-top-color:var(--navy)}
.kg-group h4{margin:0;font-size:16px;color:var(--navy)}.kg-who{margin:2px 0 10px;font-size:12.5px;color:var(--ink3)}.kg-group ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:13px;line-height:1.45;color:var(--ink2)}.kg-group li{display:flex;gap:8px}.kg-group li svg{width:16px;height:16px;flex:none;color:var(--teal);margin-top:2px}.kg-group li b{color:var(--ink)}
.kg-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.kg-step{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:6px;align-content:start}.kg-num{width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;font-weight:700;display:grid;place-items:center;font-size:13px}.kg-step h4{margin:4px 0 0;font-size:15px;color:var(--navy)}.kg-step p{margin:0;font-size:13px;color:var(--ink2);line-height:1.45}
.kg-ui{justify-self:start;margin-top:4px;border:1px solid var(--line2);border-radius:9px;padding:6px 11px;font-size:12.5px;font-weight:600;color:var(--ink2);background:var(--bg)}.kg-ui.pri{background:var(--navy);border-color:var(--navy);color:#fff}
.kg-ba{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);gap:12px;align-items:stretch}.kg-today,.kg-with{border-radius:14px;padding:16px;border:1px solid var(--line);background:var(--card)}.kg-with{background:#ecfdf5;border-color:#a7f3d0}.kg-ba h4{margin:0 0 10px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.kg-mail{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;padding:8px 0;border-top:1px solid var(--line);font-size:13px}.kg-mail:first-of-type{border-top:0}.kg-mail b{display:block}.kg-mail span{grid-column:1;color:var(--ink3);font-size:12px}.kg-mail em{grid-row:1/3;align-self:center;font-style:normal;font-size:11px;font-weight:700;background:var(--line);border-radius:6px;padding:2px 6px;color:var(--ink2)}
.kg-arrow{display:grid;place-items:center;font-size:22px;color:var(--teal)}.kg-u{font-family:ui-monospace,monospace;font-size:12px;background:#fff;border:1px solid #a7f3d0;border-radius:8px;padding:6px 8px;margin:4px 0 8px;color:var(--navy)}
.kg-xs{display:inline-flex;align-items:center;gap:4px;border:1px solid #a7f3d0;background:#fff;border-radius:8px;padding:4px 8px;font-size:11.5px;font-weight:600;color:var(--ink2)}.kg-xs svg{width:13px;height:13px}.kg-with p{margin:12px 0 0;font-size:13px;color:#115e59}
.kg-band{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--tint);border:1px solid var(--tintline);border-radius:16px;padding:18px 22px}.kg-band b{display:block;font-size:16px;color:var(--navy)}.kg-band span{font-size:13px;color:var(--ink2)}
.kg-more{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 18px}.kg-more summary{cursor:pointer;font-weight:600;color:var(--navy)}.kg-more .kg-sec{margin-top:16px}
@media (max-width:1100px){.kg-groups,.kg-steps{grid-template-columns:1fr 1fr}.kg-hero{grid-template-columns:minmax(0,1fr) 340px}.kg-float{display:none}}
@media (max-width:860px){.kg-hero{grid-template-columns:1fr;padding:26px 22px 0}.kg-hero h2{font-size:30px}.kg-stage{justify-content:center;min-height:0;padding-top:10px}.kg-float{display:none}.kg-phone{margin-bottom:-120px;width:240px}.kg-scr{height:440px}.kg-groups,.kg-steps{grid-template-columns:1fr}.kg-ba{grid-template-columns:1fr}.kg-arrow{transform:rotate(90deg)}}

/* Where is she now? (whereis.js) */
.wi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:14px;align-items:start}.wi-list{display:grid;gap:4px;margin:8px 0 10px}
.wi-y{font:inherit;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:10px;padding:8px 10px;cursor:pointer;display:grid}.wi-y.on{border-color:var(--teal);background:var(--tint)}.wi-y span{font-size:12px;color:var(--ink3)}
.wi-ids{display:grid;grid-template-columns:1fr 1fr;gap:10px}.wi .acts{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.wi-pos{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--bg)}.wi-pos.live{border-color:#a7f3d0;background:#ecfdf5}.wi-pos.stale{border-color:#fde68a;background:#fffbeb}.wi-pos.unknown p{margin:4px 0 0;color:var(--ink2);font-size:13px}
.wi-top{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px}.wi-top span{color:var(--ink2)}
.wi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}.wi-grid span{display:block;font-size:11.5px;color:var(--ink3);font-weight:600}.wi-grid b{font-size:14px}
.wi-ask{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px}.wi-reach{border-radius:12px;padding:12px 14px;background:var(--bg);border:1px solid var(--line)}.wi-reach.yes{background:#ecfdf5;border-color:#a7f3d0}.wi-reach.no{background:#fef2f2;border-color:#fecaca}.wi-reach p{margin:4px 0 0;font-size:13px;color:var(--ink2)}
@media (max-width:860px){.wi,.wi-ask,.wi-ids{grid-template-columns:1fr}}
/* Settings → People: the company line beside what only its owner changes, and the note of what went where (brokers.ts). */
.owner-sets{margin:8px 0 0}.went-where ul{margin:0;padding:0 0 0 18px;font-size:13px;line-height:1.6;color:var(--ink2)}
.co-nums tr.sum td{border-top:2px solid var(--line);font-weight:600}

/* The Proposal tool's send row: one line on a laptop, wrapping only on a phone (Jordon, 5 Nov) */
.pt-sendrow{justify-content:flex-end;flex-wrap:nowrap;gap:8px}.pt-sendrow .btn{padding:8px 12px}
@media (max-width:700px){.pt-sendrow{flex-wrap:wrap}}
/* Date boxes the British way: web/datebox.js writes the day over the browser's own text. */
.gbw{position:relative;display:inline-block;max-width:100%}.gbw.blk{display:block}.gbw>input[type=date]::-webkit-datetime-edit{color:transparent}.gbw>input[type=date]{color:transparent}.gbw>.gbt{position:absolute;top:0;bottom:0;display:flex;align-items:center;pointer-events:none;white-space:nowrap;overflow:hidden;right:34px}.gbw>.gbt.none{opacity:.55}

/* Kodo Guest in Settings: Kodo's own ensō and wordmark where the drawn phone was (5 Nov). */
.kg-brand{display:grid;justify-items:center;align-content:center;gap:10px;width:280px;min-height:380px;padding-bottom:40px;color:#f3f0e9}.kg-brand img{width:150px;height:auto;opacity:.95}
.kg-brand b{font-family:Cinzel,Georgia,serif;font-weight:600;font-size:30px;letter-spacing:.3em;padding-left:.3em;line-height:1}.kg-brand span{font-size:12px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;padding-left:.32em;opacity:.75}
@media (max-width:860px){.kg-brand{min-height:0;width:auto;padding:10px 0 26px}.kg-brand img{width:96px}}

/* Kodo Guest's before and after, one card (5 Nov): a row a job, today beside with Kodo Guest. */
.kg-ba2{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow1,0 1px 2px rgba(2,22,38,.06))}
.kg-ba2-r{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1fr);gap:16px;padding:14px 18px;border-top:1px solid var(--line);align-items:start;font-size:13.5px;line-height:1.45}
.kg-ba2-r:first-child{border-top:0}.kg-ba2-r>b{color:var(--navy);font-weight:600}.kg-ba2-r .was{color:var(--ink3)}
.kg-ba2-r .now{color:var(--ink);display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}.kg-ba2-r .now svg{flex:none;width:16px;height:16px;margin-top:2px;color:var(--teal,#0f766e)}
.kg-ba2-h{background:var(--bg);padding:10px 18px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}.kg-ba2-h .on{color:var(--teal,#0f766e)}
.kg-ba2-r .now{background:linear-gradient(90deg,rgba(204,251,241,.35),transparent);margin:-6px -8px;padding:6px 8px;border-radius:10px}
.kg-ba2-w{display:none;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;flex-basis:100%;color:var(--ink3)}.kg-ba2-r .now .kg-ba2-w{color:var(--teal,#0f766e)}
@media (max-width:700px){.kg-ba2-h{display:none}.kg-ba2-r{grid-template-columns:1fr;gap:6px}.kg-ba2-w{display:block}.kg-ba2-r .now{margin:0;padding:8px 10px}}
.sx-body .kg-ba2-r{grid-template-columns:120px minmax(0,1fr) minmax(0,1fr)}
.kg-ba2-r .now{display:block}.kg-ba2-r .now svg{display:inline-block;vertical-align:-3px;margin:0 6px 0 0}.kg-ba2-r .was{color:var(--ink2)}.kg-ba2-r{font-size:14px}
.sx-body .kg-brand{min-height:0;width:auto;padding:4px 0 26px}.sx-body .kg-brand img{width:84px}.sx-body .kg-brand b{font-size:24px}

/* Kodo Guest: the real app in a drawn phone, and Kodo's mark above the headline (5 Nov). */
.kg-mark{display:flex;align-items:center;gap:10px;margin-bottom:14px;color:#f3f0e9}.kg-mark img{width:30px;height:auto}.kg-mark b{font-family:Cinzel,Georgia,serif;font-weight:600;font-size:17px;letter-spacing:.3em}.kg-mark span{font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;opacity:.75}
.kg-phones{position:relative;width:340px;height:420px;align-self:flex-end}
.kg-ph{position:absolute;bottom:-60px;border-radius:38px;background:#0a1a28;padding:8px;box-shadow:0 30px 70px rgba(2,22,38,.5),inset 0 0 0 2px #2a3d4f}
.kg-ph img{display:block;width:100%;border-radius:30px}
.kg-ph.front{right:0;width:230px;z-index:2}.kg-ph.back{left:0;bottom:-10px;width:200px;opacity:.92;transform:rotate(-4deg)}
.sx-body .kg-phones{width:300px;height:380px;margin:0 auto}.sx-body .kg-ph.front{width:205px}.sx-body .kg-ph.back{width:178px}
@media (max-width:860px){.kg-phones{width:280px;height:340px;margin:0 auto}.kg-ph.front{width:190px}.kg-ph.back{width:165px}}
.sx-body .kg-phones{width:380px;height:440px}.sx-body .kg-ph.front{width:250px}.sx-body .kg-ph.back{width:215px}
@media (max-width:520px){.sx-body .kg-phones,.kg-phones{width:290px;height:350px}.sx-body .kg-ph.front,.kg-ph.front{width:195px}.sx-body .kg-ph.back,.kg-ph.back{width:168px}}
@media (max-width:700px){.sx-body .kg-ba2-r{grid-template-columns:1fr}}

/* Two-tone tool icons (5 Nov): the outline in the office's main colour, the soft parts its accent. */
.ico .tt{fill:var(--blue);fill-opacity:.3}.tool .ti .ico{width:26px;height:26px}

/* A board card's tag stays inside the card (Jordon, 5 Nov): in a narrow column the name and the tag share the line while they
 * fit, and the tag drops under the name when they don't. */
.deal .c{flex-wrap:wrap;min-width:0}.deal .c>.turn{max-width:100%;overflow:hidden;text-overflow:ellipsis}.deal{overflow:hidden}
/* Tools → Kodo Guest (5 Nov): Kodo's standard sheet as a guest sees it, and a broker's own sheet sorted against it */
.gs-view{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);gap:16px;align-items:start}.gs-view.one{grid-template-columns:1fr}.gs-grp.none{padding:8px 0 2px}.gs-grp.none .gs-gh b{color:var(--ink3)}
.gs-index{display:grid;gap:4px}.gs-ih{display:flex;flex-direction:column;margin:10px 0 2px}.gs-ih:first-child{margin-top:0}.gs-ih b{font-size:13px;color:var(--navy)}.gs-ih small{font-size:11.5px;color:var(--ink3)}
.gs-pg{display:grid;grid-template-columns:22px 1fr;column-gap:8px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:10px;padding:7px 9px;font-size:13px;color:var(--ink);cursor:pointer}.gs-pg i{grid-row:span 2;font-style:normal;font-weight:700;font-size:11px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--ink2)}.gs-pg small{grid-column:2;font-size:11px;color:var(--ink3)}.gs-pg.on{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}.gs-pg.on i{background:var(--navy);color:var(--onnavy)}
.gs-phone{width:340px;max-width:100%;margin:0 auto;border-radius:34px;border:9px solid #1f2933;background:#fbfaf7;box-shadow:var(--shadow);min-height:560px;overflow:hidden}.gs-phone.empty .gs-scr{display:grid;place-items:center;text-align:center;color:var(--ink2);min-height:520px}
.gs-scr{padding:18px 18px 16px;display:flex;flex-direction:column;gap:12px;min-height:540px}.gs-ph-top{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#8a7f6a}
.gs-scr h3{text-transform:none;letter-spacing:0;font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:26px;color:#14284b;margin:2px 0 0;line-height:1.15}.gs-sub{margin:-6px 0 0;color:#5b6474;font-size:13.5px}.gs-for{margin:-6px 0 2px;font-size:11.5px;color:#8a7f6a}
.gs-q{display:grid;gap:6px}.gs-q b{font-weight:600;font-size:14px;color:#1b2230}.gs-box{border:1px solid #e3ddd0;background:#fff;border-radius:10px;padding:9px 11px;font-size:13px;color:#a39a87}.gs-box.short{width:90px}
.gs-pills{display:flex;flex-wrap:wrap;gap:6px}.gs-pills span{border:1px solid #e3ddd0;background:#fff;border-radius:999px;padding:5px 11px;font-size:12.5px;color:#3b4452}
.gs-nav{display:flex;justify-content:space-between;margin-top:auto;padding-top:8px}
.gs-drop{display:flex;gap:12px;align-items:center;border:1.5px dashed var(--line2);border-radius:12px;padding:14px;cursor:pointer;background:var(--bg)}.gs-drop.on{border-color:var(--blue);background:var(--aqua)}.gs-drop.off{opacity:.55;cursor:not-allowed}.gs-drop>.ico{width:22px;height:22px;color:var(--navy);flex:none}.gs-drop b{display:block;font-weight:600}.gs-drop small{display:block;color:var(--ink3);font-size:12px}
.gs-grp{border-top:1px solid var(--line);padding:12px 0 4px}.gs-grp:first-of-type{border-top:0;padding-top:4px}.gs-gh{display:flex;align-items:center;gap:8px}.gs-gh b{font-weight:600}.gs-grp>p{margin:2px 0 6px}.gs-none{margin:0}
.gs-grp.kodo .gs-gh b{color:var(--teal)}.gs-grp.trip .gs-gh b{color:var(--blue)}.gs-grp.yacht .gs-gh b{color:var(--navy)}.gs-grp.missing .gs-gh b{color:#b45309}
.gs-row{display:grid;grid-template-columns:minmax(0,1fr) 170px 30px;gap:6px;align-items:center;padding:7px 0;border-bottom:1px dashed var(--line)}.gs-row.sent{opacity:.8}.gs-rowx{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}.gs-rowx:empty{display:none}
.gs-send{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin-top:10px}.gs-send small{color:var(--ink2);font-size:12px;flex:1;min-width:200px}
@media (max-width:1080px){.gs-pre{order:-1}}
@media (max-width:620px){.gs-view{grid-template-columns:1fr}.gs-index{display:flex;overflow-x:auto;gap:6px;padding-bottom:6px;scroll-snap-type:x proximity}.gs-ih{display:none}.gs-pg{flex:none;grid-template-columns:22px auto;scroll-snap-align:start;white-space:nowrap}.gs-pg small{display:none}.gs-pg i{grid-row:auto}.gs-phone{min-height:0}.gs-scr{min-height:0}.gs-row{grid-template-columns:minmax(0,1fr) 30px}.gs-row select{grid-column:1;grid-row:2}}
/* The guests' trip, from Kodo Guest, on Booked and beside the itinerary */
.kt{display:grid;gap:10px}.kt-g{display:grid;gap:4px;padding-bottom:8px;border-bottom:1px dashed var(--line)}.kt-g:last-of-type{border-bottom:0}.kt-n{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.kt-n b{font-weight:600}
.kt-r{display:grid;grid-template-columns:110px minmax(0,1fr);gap:8px;font-size:13px}.kt-r>span:first-child{color:var(--ink3)}.kt-r small{display:block;color:var(--ink2);font-size:12px}.kt-yours{color:var(--ink3)!important}.kt-cel{font-weight:600;color:#b45309}.kt-foot{margin:0}
/* The newsletter (5 Nov): issues first, set-up as one strip, the block editor beside the email as it will be sent. */
.nlp{max-width:1100px}.nl-big{padding:12px 20px;font-size:15px}.nl-big .ico{width:18px;height:18px}
.nl-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0 6px}
.nl-tile{display:flex;align-items:center;gap:11px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;min-width:0}.nl-tile:hover{border-color:var(--line2);box-shadow:0 2px 10px rgba(11,47,74,.06)}
.nl-ti{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--aqua);color:var(--navy);flex:none}.nl-ti .ico{width:17px;height:17px}
.nl-tt{display:grid;gap:2px;min-width:0;flex:1}.nl-tt b{font-size:14px;color:var(--navy)}.nl-tt small{color:var(--ink2);font-size:12px;line-height:1.3;display:flex;align-items:baseline;gap:6px}
.nl-tt small i{width:7px;height:7px;border-radius:50%;background:var(--green);flex:none;transform:translateY(-1px)}.nl-tile.todo .nl-tt small i{background:var(--amber)}.nl-tile.todo .nl-ti{background:var(--amberbg);color:var(--amberink)}
.nl-tc{font-size:12px;font-weight:600;color:var(--blue);flex:none;align-self:flex-start;margin-top:2px}
.nl-step{display:flex;gap:8px;align-items:flex-start;margin:4px 2px 0;color:var(--ink2);font-size:13px}.nl-step .ico{width:15px;height:15px;color:var(--teal);flex:none;margin-top:1px}
.nl-sec{margin-top:26px}.nl-sec h2{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:500;font-size:22px;color:var(--navy);margin:0 0 10px}
.nl-list{display:grid;gap:8px}.nl-row{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px 10px 8px 8px}.nl-row:hover{border-color:var(--line2)}
.nl-rmain{display:flex;align-items:center;gap:14px;flex:1;min-width:0;border:0;background:none;text-align:left;padding:0}
.nl-th{width:96px;height:62px;border-radius:10px;background:#dfe7ef center/cover no-repeat;flex:none;display:grid;place-items:center;color:var(--ink3)}.nl-th.none{background:linear-gradient(135deg,#0b2f4a,#1d8bc9);color:rgba(255,255,255,.8)}
.nl-rt{display:grid;gap:3px;min-width:0;flex:1}.nl-rt b{font-size:15px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nl-rt small{color:var(--ink2);font-size:12.5px}
.nl-rs{display:flex;gap:18px;flex:none;margin-right:6px}.nl-rs span{display:grid;text-align:center;font-size:11px;color:var(--ink3)}.nl-rs b{font-size:17px;color:var(--navy)}
.chip.warn{background:var(--amberbg);color:var(--amberink)}
.nl-empty{background:#fff;border:1px dashed var(--line2);border-radius:14px;padding:22px;display:grid;gap:4px;color:var(--ink2)}.nl-empty b{color:var(--navy);font-size:15px}
.nl-sheet .card{margin-bottom:12px}.nl-counts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.nl-counts>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}.nl-counts b{display:block;font-size:20px;color:var(--navy)}.nl-counts span{font-size:11.5px;color:var(--ink2)}
.nl-src{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--line)}.nl-src .ico{width:18px;height:18px;color:var(--blue);flex:none;margin-top:2px}.nl-src span{display:grid;gap:2px}.nl-src small{color:var(--ink2)}
.nl-how{margin:0 0 10px;padding-left:18px;color:var(--ink2)}.nl-how li{margin:2px 0}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.bad-t{color:var(--red)}
.nl-find{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:6px}.nl-find .small{flex:1;min-width:200px}
.nl-tick{display:flex;gap:10px;align-items:flex-start;padding:4px 0 8px;cursor:pointer}.nl-tick input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--blue)}.nl-tick span{display:grid;gap:2px}.nl-tick small{color:var(--ink2)}.nl-tick.off{opacity:.7;cursor:default}
.nle{padding:16px 22px 30px;max-width:1500px;flex:1;min-width:0;width:100%}.nle-top{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.nle-back{display:inline-flex;align-items:center;gap:4px;font-size:13px}.nle-back .ico{width:15px;height:15px}
.nle-subj{flex:1 1 420px;min-width:260px;display:grid;gap:4px}.nle-s{font-size:18px;font-weight:600;padding:9px 12px}.nle-p{font-size:13px;padding:6px 12px;color:var(--ink2)}
.nle-saved{font-size:12px;color:var(--ink3);min-width:52px}.nle-send{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;flex:0 1 auto;max-width:440px}.nle-why{font-size:12px;color:var(--ink2);flex-basis:100%;text-align:right}
.nle-ai{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}.nle-ai .btn.on{background:var(--amberbg)}.nle-ask{flex:1;min-width:260px}.nle-ask .f{flex:1}
.nle-brief{margin:10px 0 0;max-width:760px}
.nle-needs{margin-top:10px;background:var(--amberbg);border:1px solid #f6d58a;border-radius:12px;padding:9px 12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--amberink);font-size:13px}
.nle-needs.none{background:var(--greenbg);border-color:#bbe5c8;color:var(--greenink)}.nle-needs .ico{width:16px;height:16px}
.nle-need{border:1px dashed #e8a33d;background:#fff;color:var(--amberink);border-radius:10px;padding:4px 9px;font-size:12px;font-weight:600}.nle-need:hover{background:#fff6e5}
.nle-conv{margin:8px 0 0}.nle-panes{display:none;margin-top:12px}
.nle-grid{display:grid;grid-template-columns:minmax(330px,440px) minmax(0,1fr);gap:18px;margin-top:14px;align-items:start}
.nle-blocks{display:grid;gap:8px;align-content:start}
.nle-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}.nle-card.open{border-color:var(--tintline);box-shadow:0 4px 16px rgba(11,47,74,.07)}.nle-card.dragging{opacity:.4}.nle-card.over{box-shadow:0 -3px 0 var(--blue)}
.nle-ch{display:flex;align-items:center;gap:9px;padding:9px 8px 9px 6px;cursor:pointer}.nle-grip{color:var(--ink3);cursor:grab;letter-spacing:-3px;font-size:13px;padding:0 4px}
.nle-ci{width:28px;height:28px;border-radius:8px;background:var(--aqua);color:var(--navy);display:grid;place-items:center;flex:none}.nle-ci .ico{width:15px;height:15px}
.nle-cn{display:grid;min-width:0;flex:1}.nle-cn b{font-size:13.5px}.nle-cn small{color:var(--ink2);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nle-dot{min-width:20px;height:20px;border-radius:10px;background:var(--amber);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 5px}
.nle-tools{display:flex;gap:0;flex:none}.nle-tools .btn{padding:3px 7px}
.nle-cb{display:none;padding:4px 14px 14px;border-top:1px solid var(--line)}.nle-card.open .nle-cb{display:block}
.nle-cb .fl{margin-top:10px}.fl.lit .f,.f.lit{border-color:#e8a33d;background:#fff9ee;box-shadow:0 0 0 3px rgba(245,158,11,.15)}
.nle-photo{display:flex;gap:12px;align-items:center;margin-top:10px;padding:8px;border:1px solid var(--line);border-radius:12px}.nle-photo.lit{border:2px dashed #e8a33d;background:#fff9ee}
.nle-photo img{width:110px;height:72px;object-fit:cover;border-radius:8px;cursor:pointer;flex:none}.nle-nophoto{width:110px;height:72px;border-radius:8px;border:1px dashed var(--line2);background:var(--bg);display:grid;place-items:center;align-content:center;gap:2px;color:var(--ink2);font-size:11.5px;flex:none}.nle-nophoto .ico{width:16px;height:16px}
.nle-pb{display:grid;gap:6px;min-width:0}.nle-pb b{font-size:12.5px}
.nle-yhead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}.nle-yhead b{font-size:14px;color:var(--navy)}
.nle-yrow{border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:6px}
.nle-yfacts{display:grid;gap:4px;margin-top:8px;font-size:12.5px;color:var(--ink2)}.nle-yfacts .lit{color:var(--amberink);font-weight:600}.nle-yfacts label{gap:6px}
.nle-add{border:1.5px dashed var(--line2);background:transparent;border-radius:14px;padding:12px;font-weight:600;color:var(--blue);display:flex;gap:6px;align-items:center;justify-content:center}.nle-add:hover{background:#fff;border-color:var(--blue)}.nle-add .ico{width:16px;height:16px}
.nle-fixed{margin:2px 4px 0}
.nle-prev{position:sticky;top:12px}.nle-ph{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.nle-stage{background:#e4e9ef;border-radius:16px;padding:16px;display:flex;justify-content:center}
.nle-frame{display:block;width:100%;max-width:680px;height:calc(100vh - 220px);min-height:560px;border:0;border-radius:10px;background:#eef1f5;box-shadow:0 6px 24px rgba(11,47,74,.12)}
.nle-stage.phone .nle-frame{width:390px;max-width:100%;height:760px;border-radius:30px;border:10px solid #10243a}
.nl-pics{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-bottom:10px}.nl-pic{border:2px solid transparent;border-radius:10px;padding:0;overflow:hidden;background:var(--bg);aspect-ratio:3/2}.nl-pic:hover{border-color:var(--blue)}.nl-pic img{width:100%;height:100%;object-fit:cover;display:block}
.nl-h3{font-size:13px;margin:14px 0 8px;color:var(--navy)}
.nl-crop{position:relative;width:100%;overflow:hidden;border-radius:10px;background:#10243a;cursor:grab;touch-action:none}.nl-crop img{position:absolute;left:0;top:0;max-width:none;user-select:none;transform-origin:0 0}
@media(max-width:980px){.nl-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.nle-grid{grid-template-columns:1fr}.nle-panes{display:inline-flex}.nle.blocks .nle-prev{display:none}.nle.preview .nle-blocks{display:none}.nle-prev{position:static}}
@media(max-width:640px){.nle{padding:12px 12px 30px}.nl-tile{padding:10px;gap:8px}.nl-ti{width:30px;height:30px}.nl-tc{display:none}.nl-rs{gap:10px}.nl-th{width:64px;height:48px}.nl-rmain{flex-wrap:wrap;gap:6px 12px}.nl-rt{flex:1 1 150px}.nl-rt b{white-space:normal}.nl-rmain>.chip,.nl-rmain>.nl-rs{margin-left:78px}.nl-tt small{overflow-wrap:anywhere}.nl-tt{overflow:hidden}
  .nle-top{gap:8px}.nle-subj{min-width:0;flex-basis:100%}.nle-send{flex-basis:100%}.nle-why{text-align:left}.nle-stage{padding:8px}.nle-stage.computer .nle-frame,.nle-stage.phone .nle-frame{width:100%;height:70vh;border:0;border-radius:10px}.nl-counts{grid-template-columns:repeat(2,1fr)}.nle-ai{display:grid}.nle-ask{min-width:0}.pagehead .nl-big{width:100%;justify-content:center}}

/* The office floor (5 Nov): rooms as real places with a brass plate and a counter, the agents and the people as round tokens,
   the map laid over it with ?map=1, and the same places as a list on a phone. The panel beside it takes the office's colours. */
/* The whole picture, 3:2 (floor-v3, PIC in floormap.js), every layer on it at the same size. On the floor the panel is 340px and
   the stage's sides 8px, so the picture gets the width. */
.pic.floor{aspect-ratio:1872/1260;cursor:default}.pic.floor>picture>img{display:block;width:100%;height:100%;border-radius:inherit}
@media (min-width:1101px){.home.onfloor{grid-template-columns:1fr 340px}.home.onfloor>.stage{padding:20px 8px}.home.onfloor>.stage>.stagehead,.home.onfloor .floornote{padding:0 16px}}
.room{position:absolute;border:0;background:transparent;border-radius:14px;cursor:pointer;padding:0;transition:box-shadow .18s,background .18s;outline:none}
.room:hover,.room:focus-visible{background:rgba(255,255,255,.12);box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 0 5px var(--blue),0 12px 30px rgba(11,47,74,.35)}
.room.on{background:rgba(29,139,201,.12);box-shadow:0 0 0 3px #fff,0 0 0 6px var(--navy),0 12px 30px rgba(11,47,74,.35)}
.plate{position:absolute;transform:translate(0,-50%);pointer-events:none;background:linear-gradient(180deg,#f3dc9a,#c9a24a);color:#3b2a08;font-weight:700;font-size:12.5px;letter-spacing:.01em;padding:3px 10px;border-radius:6px;box-shadow:0 1px 0 #fff6 inset,0 2px 6px rgba(0,0,0,.35);white-space:nowrap;z-index:4;text-shadow:0 1px 0 #fff5}
.plate.on{box-shadow:0 1px 0 #fff6 inset,0 0 0 2px var(--navy),0 2px 6px rgba(0,0,0,.35)}
.pill{position:absolute;transform:translate(-100%,-50%);pointer-events:none;min-width:30px;height:26px;padding:0 9px;border-radius:13px;background:var(--navy);color:var(--onnavy);font-weight:700;font-size:13px;display:inline-grid;place-items:center;box-shadow:0 0 0 2px #fff,0 4px 12px rgba(11,47,74,.4);z-index:4}
.pill.red{background:var(--red);box-shadow:0 0 0 2px #fff,0 4px 12px rgba(229,72,77,.45)}.pill.zero{background:#fff;color:var(--navy);box-shadow:0 0 0 2px var(--navy) inset,0 2px 8px rgba(11,47,74,.25)}
.cast,.castlive{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:visible}
.castlive .front{position:absolute;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none;max-width:none}
.walker{position:absolute;left:0;top:0;pointer-events:auto;cursor:pointer;image-rendering:pixelated;image-rendering:crisp-edges;will-change:transform;outline:none}
.walker .wk-body{display:block;background-repeat:no-repeat;image-rendering:pixelated;image-rendering:crisp-edges;transform-origin:50% 50%}
.walker .wk-hand{position:absolute;left:0;top:0;pointer-events:none;line-height:0}.walker .wk-hand svg{display:block;image-rendering:pixelated;filter:drop-shadow(0 1px 0 rgba(0,0,0,.35))}
.walker .wk-bd{position:absolute;right:-5px;top:1px;width:9px;height:9px;scale:calc(1 / var(--k, 1));border-radius:50%;background:#aab8c5;box-shadow:0 0 0 2px #fff}
.walker .wk-bd.wk-a{background:var(--teal);box-shadow:0 0 0 2px #fff,0 0 10px rgba(20,184,166,.95)}.walker .wk-bd.wk-busy{animation:bdpulse 1.2s ease-in-out infinite}.walker.wk-off .wk-bd{background:#aab8c5;box-shadow:0 0 0 2px #fff;animation:none}
.walker .wk-bd.wk-p{background:var(--navy)}
@keyframes bdpulse{50%{box-shadow:0 0 0 2px #fff,0 0 16px rgba(20,184,166,1)}}
.walker .wk-nm{position:absolute;top:calc(100% + 1px);left:50%;translate:-50% 0;transform-origin:50% 0;scale:calc(1 / var(--k, 1));font-size:10.5px;font-weight:700;color:#fff;background:rgba(11,47,74,.82);padding:1px 7px;border-radius:7px;white-space:nowrap;line-height:1.4}
.walker.wk-off .wk-body{filter:grayscale(1) brightness(.85);opacity:.7}
.walker:hover .wk-body,.walker:focus-visible .wk-body{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 6px var(--blue))}.walker.wk-on .wk-body{filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px var(--blue)) drop-shadow(0 0 12px var(--blue))}
.walker.wk-going .wk-nm{background:rgba(29,139,201,.9)}
/* Seated, the name would sit under the lap, behind the desk: it shows only when the character stands or walks. */
.walker[data-seated="1"] .wk-nm{display:none}
.awayrow{display:inline-flex;align-items:center;gap:10px;margin-left:auto;flex-wrap:wrap}.awayrow .pill{position:static;transform:none;height:20px;min-width:22px;font-size:11.5px;padding:0 6px}
.frow.arr.on{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue)}
.wpicks{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.wpick{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;font:inherit;color:var(--ink)}
.wpick:hover{border-color:#cbd5e1}.wpick.on{border-color:var(--navy);box-shadow:0 0 0 2px var(--navy)}
.wpick .stand{display:block;background-repeat:no-repeat;image-rendering:pixelated;image-rendering:crisp-edges}.wpick .face{width:44px;height:44px;border-radius:50%;object-fit:cover}.wpick small{font-size:11px;color:var(--ink2);text-align:center;line-height:1.3}.wpick .pair{display:flex;align-items:flex-end;gap:6px}
.fsvg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:5}.fsvg .bx{fill:rgba(255,0,170,.08);stroke:#ff00aa;stroke-width:2;vector-effect:non-scaling-stroke}
.fsvg .ed{stroke:#00e5ff;stroke-width:3;vector-effect:non-scaling-stroke}.fsvg .nd{fill:#fff;stroke:#00a7c2;stroke-width:2;vector-effect:non-scaling-stroke}
.fsvg .st{fill:none;stroke:#ffd400;stroke-width:3;vector-effect:non-scaling-stroke}.fsvg .ar{stroke:#ff3b30;stroke-width:3;vector-effect:non-scaling-stroke}
.fsvg .lb{font:700 15px Inter,system-ui,sans-serif;fill:#fff;paint-order:stroke;stroke:#0b2f4a;stroke-width:4px}
.floornote{display:flex;gap:8px;align-items:center;margin:10px 4px 0;font-size:12.5px;color:var(--ink2)}
.flist{display:none}
.frow{display:flex;width:100%;justify-content:space-between;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px;font:inherit;text-align:left;cursor:pointer;color:var(--ink)}
.frow:hover{border-color:#cbd5e1}.frow>span:first-of-type{display:grid;gap:2px;min-width:0;flex:1}.frow b{font-size:13.5px}.frow small{color:var(--ink2);font-size:12px;overflow-wrap:anywhere}.frow .go{color:var(--ink3);font-size:18px}
.frow.arr{align-items:flex-start}.frow.arr time{flex:none;font-weight:700;color:var(--blue);font-size:12.5px;padding-top:2px;min-width:40px}.frow .kw{color:var(--blue)}
.frow.place .pill{position:static;transform:none}.frow.place .face{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:50% 18%;flex:none}.frow.place.off .face{filter:grayscale(1);opacity:.7}.frow.place.on{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}
.fback{display:inline-flex;align-items:center;gap:4px;padding:0 2px;margin-bottom:4px}.fback svg{width:14px;height:14px}
.fcard{display:flex;gap:12px;align-items:center;margin:6px 0 10px}.fcard .fav{width:62px;height:62px;border-radius:50%;object-fit:cover;object-position:50% 18%;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--teal);flex:none;display:grid;place-items:center;background:var(--navy);color:var(--onnavy);font-weight:800;font-size:20px}
.fcard .fnm{font-size:19px;font-weight:700;letter-spacing:-.01em}.fcard .frl{margin-top:4px;font-size:12px;color:var(--ink2)}
.fsay{margin:0 0 8px;font-size:14px;line-height:1.5;color:var(--ink)}.fnow{font-size:13px;font-weight:600;color:var(--navy)}.fwork{background:var(--bg);border-radius:12px;padding:10px 12px;font-size:13px;line-height:1.5;margin-bottom:6px}
.fwho{margin:14px 0 0;font-size:16px}
.fswitch{display:flex;align-items:center;gap:10px;margin-top:14px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;flex-wrap:wrap}.fswitch b{font-size:14px}
.sw{position:relative;width:44px;height:26px;border-radius:13px;border:0;background:#cbd5e1;padding:0;cursor:pointer;transition:background .15s;flex:none}.sw i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .15s}
.sw.on{background:var(--teal)}.sw.on i{left:21px}.sw:disabled{opacity:.5;cursor:default}
.ffold{border:1px solid var(--line);border-radius:12px;padding:0 10px;margin-bottom:8px;background:#fff}.ffold summary{cursor:pointer;padding:10px 2px;font-weight:700;font-size:13.5px;display:flex;align-items:center;gap:8px;list-style:none}.ffold summary::-webkit-details-marker{display:none}.ffold summary::before{content:"›";display:inline-block;transition:transform .15s;color:var(--ink3)}.ffold[open] summary::before{transform:rotate(90deg)}.ffold .pill{position:static;transform:none;height:22px;min-width:24px;font-size:12px}.ffold .frow{margin:0 0 8px}
.item .tx[role=link]:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:6px}
/* The list behind a thing on the floor or the desk (12 Nov): its heading and number, its items (each its own page), the one
   button to start when it is empty, and the full page at its foot. Beside the picture in the panel, or right under it. */
.fhead{display:flex;align-items:center;gap:10px;margin:4px 0 2px}.fhead h2{margin:0;font-size:20px;letter-spacing:-.01em;outline:none}.fhead .pill{position:static;transform:none;height:24px;min-width:26px;font-size:12.5px}
.fwhat{margin:0 0 6px}.fhead+.fwhat+h3{margin-top:12px}
.fitem{display:flex;gap:6px;align-items:flex-start}.fitem>.frow{flex:1;min-width:0}.fitem .facts{display:flex;flex-direction:column;gap:4px;padding-top:8px}
.fitem .frow.arr time{min-width:62px}.fitem .frow small{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fitem.late .frow{border-color:#f3c4c5;background:#fff8f8}.fitem.late .frow time{color:var(--red)}
.frow:focus-visible,.fhead h2:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.fmore{display:inline-block;margin:0 4px 10px}
.fempty{border:1px dashed var(--line2);border-radius:12px;padding:14px 14px 12px;margin:8px 0 10px;background:#fff}.fempty p{margin:0 0 10px;font-size:13.5px;color:var(--ink2);line-height:1.45}
.ffoot{margin:12px 0 4px;padding-top:12px;border-top:1px solid var(--line)}
.frow small.fmeta{display:block}.frow small.fwords{color:#334155}
/* The popup (12 Nov, Jordon: "on the screen as a popup that you can read, click, or dismiss"): a card in the middle of the screen
   over the desk or the floor, in the look of the app's own windows, under them so a window opened from it comes on top. A phone:
   the whole screen. */
.fpop{position:fixed;inset:0;z-index:42;background:rgba(11,47,74,.35);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:4vh 24px}
.fpop-card{position:relative;width:min(720px,100%);max-height:min(88vh,920px);display:flex;flex-direction:column;background:#fff;border-radius:20px;box-shadow:0 30px 80px rgba(11,47,74,.35);overflow:hidden;outline:none}
.fpop-body{overflow:auto;overscroll-behavior:contain;padding:22px 26px 18px}
.fpop-card>.fx{position:absolute;top:16px;right:16px;z-index:1;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink2);display:grid;place-items:center;cursor:pointer;padding:0}.fpop-card>.fx svg{width:17px;height:17px}.fpop-card>.fx:hover{border-color:var(--line2);color:var(--ink)}
.fpop .fhead,.fpop .fcard{padding-right:48px}.fpop .fhead h2{font-size:22px}.fpop .fitem .frow{padding:12px 14px}.fpop .fitem .frow b{font-size:14px}.fpop .fitem .frow small{font-size:12.5px;-webkit-line-clamp:2}.fpop .fitem .frow.arr time{min-width:70px}
@media (max-width:700px){.fpop{padding:0;align-items:stretch}.fpop-card{width:100%;max-height:none;height:100%;height:100dvh;border-radius:0}.fpop-body{padding:18px 16px calc(18px + env(safe-area-inset-bottom))}.fpop-card>.fx{top:12px;right:12px}.fpop .fitem .frow.arr time{min-width:56px}.fpop .fitem{flex-wrap:wrap;gap:0}.fpop .fitem>.frow{flex-basis:100%;margin-bottom:6px}.fpop .fitem .facts{flex-direction:row;margin:0 0 12px auto;padding-top:0}}
.zone.on{background:rgba(29,139,201,.12);box-shadow:0 0 0 3px #fff,0 0 0 6px var(--navy),0 12px 30px rgba(11,47,74,.35)}
@container (max-width:900px){.walker .wk-nm{display:none}.plate{font-size:11px;padding:2px 7px}.pill{height:22px;min-width:24px;font-size:12px}}
@media (max-width:700px){.pic.floor,.floornote,.today.fp{display:none}.flist{display:block}}
/* The menu as a narrow rail (6 Nov): the chevron on its edge or ⌘B/Ctrl+B. Icons stay where they are and the words slide
   under the edge, so nothing jumps; the words stay for screen readers, and the name on hover is aria-hidden. Phones keep the slide-in menu. */
.app{position:relative}.side{overflow-x:hidden;overflow-y:auto}.side .mark,.side .ai-rail{display:none}
.side .me-pop{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.rail-btn{position:absolute;top:28px;left:220px;z-index:40;width:24px;height:24px;padding:0;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink2);display:grid;place-items:center;cursor:pointer;box-shadow:0 1px 4px rgba(11,47,74,.12);transition:left .2s ease}
.rail-btn .ico{width:14px;height:14px;transition:transform .2s ease}.rail-btn:hover{color:var(--navy);border-color:var(--blue)}.rail-btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.rail-tip{position:fixed;z-index:200;transform:translateY(-50%);background:var(--navy);color:#fff;font-size:12px;font-weight:600;padding:5px 9px;border-radius:8px;white-space:nowrap;pointer-events:none;box-shadow:0 4px 14px rgba(11,47,74,.2)}.rail-tip[hidden]{display:none}
@media (min-width:761px){
  .app{transition:grid-template-columns .2s ease}.nav a{white-space:nowrap;overflow:hidden}.nav .lb{transition:opacity .15s}
  .app.rail{grid-template-columns:64px 1fr}.app.rail .rail-btn{left:52px}.app.rail .rail-btn .ico{transform:rotate(180deg)}
  .rail .nav .lb{opacity:0}.rail .nav a{position:relative;overflow:visible}
  .rail .nav .badge{position:absolute;top:1px;right:1px;margin:0;font-size:9.5px;line-height:15px;min-width:15px;padding:0 4px;text-align:center;box-shadow:0 0 0 2px var(--side,#fff)}
  .rail .nav .sep{margin:12px 4px}
  .rail .side .office,.rail .side .logo.wide{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0;padding:0}
  .rail .side .logo:not(.wide){width:40px;max-height:40px;margin:6px 0 18px;padding:0}
  .rail .side .logo.withicon,.rail .side .office.withicon{position:absolute;width:1px;height:1px;max-height:none;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0;padding:0}
  .rail .side .ricon{display:block;width:40px;height:40px;border-radius:10px;object-fit:cover;margin:4px 0 18px;cursor:pointer}
  .rail .side .office~.mark,.rail .side .logo.wide~.mark{display:grid;place-items:center;width:40px;height:40px;margin:4px 0 18px;border-radius:10px;background:var(--navy);color:var(--onnavy);font-size:18px;font-weight:700;cursor:pointer}
  .rail .twin .tw{display:none}.rail .twin{margin:0}
  .rail .side .foot{border:0;padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:12px}.rail .side .ai-full{display:none}
  .rail .side .ai-rail{display:grid;place-items:center;position:relative;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;color:var(--navy)}
  .rail .ai-rail .dot{position:absolute;top:-3px;right:-3px;width:10px;height:10px;border-radius:50%;background:var(--ink3);box-shadow:0 0 0 2px var(--side,#fff)}.rail .ai-rail .dot.on{background:var(--teal)}
  .rail .side .me{margin:0 0 2px 4px;position:relative}.rail .side .me .av{width:32px;height:32px;cursor:default}
  .app.rail .side .me-pop{position:fixed;left:62px;bottom:14px;z-index:60;flex:none;gap:12px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:9px 12px;white-space:nowrap;color:var(--ink2);opacity:0;pointer-events:none;transition:opacity .12s}
  .app.rail .side .me-pop::before{content:"";position:absolute;left:-18px;top:0;bottom:0;width:18px}
  .app.rail .side .me:hover .me-pop,.app.rail .side .me:focus-within .me-pop{opacity:1;pointer-events:auto}.app.rail .side .me-pop .link{color:var(--blue)}
  .darkside .rail .side .ai-rail{border-color:rgba(255,255,255,.25);color:var(--onside)}
  html.wm .app.rail .main::before{left:calc(64px + (100vw - 64px)*.1);right:calc((100vw - 64px)*.1)}
}
@media (max-width:760px){.rail-btn{display:none}}
@media (prefers-reduced-motion:reduce){.app,.rail-btn,.rail-btn .ico,.nav .lb{transition:none!important}}
/* A brochure dropped on a proposal's shortlist (13 Nov): the popup that asks to add her to the yacht list, its fields filled from
   the brochure with the line each came from, and the mark on a yacht whose details are still to finish. */
.dl-fyc.ba-over{outline:2px dashed var(--blue,#1d8bc9);outline-offset:-6px;background:#eaf5fc;position:relative}
.dl-fyc.ba-over::after{content:"Drop her brochure here";position:absolute;left:50%;top:150px;transform:translateX(-50%);background:#0f3a5c;color:#fff;font-weight:600;font-size:15px;padding:12px 20px;border-radius:12px;box-shadow:0 8px 24px rgba(15,58,92,.25);pointer-events:none;white-space:nowrap;max-width:90%;overflow:hidden;text-overflow:ellipsis}
.ba-state{display:flex;align-items:center;gap:8px;font-size:13px;background:#f8fbfd;border:1px solid #e3ebf2;border-radius:10px;padding:8px 12px;margin-bottom:12px}
.ba-state .ico{width:16px;height:16px;flex:none;color:#7c3aed}
.ba-same{background:#fffbeb;border:1px solid #fde68a;border-radius:12px;padding:10px 14px;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ba-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 12px}
.ba-f{margin:0 0 6px;min-width:0}.ba-f.ba-wide{grid-column:span 2}.ba-f[data-f="name"]{grid-column:span 4}
.ba-l{display:flex;align-items:center;justify-content:space-between;gap:6px}
.ba-from{font-size:10.5px;font-weight:600;color:#7c3aed;background:#f3eefe;border-radius:999px;padding:1px 7px;white-space:nowrap}
.ba-ai .f{background:#fbf9ff;border-color:#d9cdf7}
.ba-q{display:block;font-size:11.5px;color:#64748b;font-style:italic;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ba-acts{justify-content:flex-end;margin-top:12px;flex-wrap:wrap}.ba-sp{flex:1}
.chip.ba-due{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;font-size:11px;vertical-align:2px}
.ba-duebar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:#fff7ed;border:1px solid #fed7aa;border-radius:12px;padding:10px 14px;margin-bottom:14px;font-size:13.5px}
@media (max-width:700px){.ba-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ba-f[data-f="name"],.ba-f.ba-wide{grid-column:span 2}.ba-acts .btn{flex:1 1 auto}.ba-sp{display:none}}
/* Two sources for one yacht (13 Nov): her brochure and her listing, each with how its reading went; where they differ, both
   values on the field to choose from. */
.ba-src{border:1px solid #e3ebf2;border-radius:12px;background:#f8fbfd;padding:6px 12px;margin-bottom:12px}
.ba-sr{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13.5px;min-width:0}.ba-sr+.ba-sr{border-top:1px solid #e9eff4}
.ba-sr>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
.ba-sk{display:inline-flex;align-items:center;gap:6px;font-weight:600;flex:none;width:92px;color:#334155}.ba-sk .ico{width:15px;height:15px}
.ba-lk{display:flex;gap:8px;flex:1;min-width:0}.ba-lk .f{flex:1;min-width:0;height:34px}
.ba-note{margin:4px 0 2px;font-size:12.5px;color:#9a3412}
.ba-from.two{color:#9a3412;background:#fff7ed}
.ba-pick{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.ba-ch{display:inline-flex;align-items:baseline;gap:6px;border:1px solid #d6dee6;background:#fff;border-radius:999px;padding:3px 10px;font-size:12.5px;cursor:pointer;color:#0f172a;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ba-ch span{font-size:11px;color:#64748b;font-weight:600}.ba-ch.on{border-color:var(--teal,#0d9488);background:#ecfdf5}
.ba-two .f{border-color:#fed7aa;background:#fffaf5}
.ba-photos{margin-top:10px}.ba-photos .li-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
@media (max-width:700px){.ba-sr{flex-wrap:wrap}.ba-sk{width:auto}.ba-lk{flex-basis:100%}}
/* A long tag ("Brochure and listing agree") goes under its label rather than widening the field, on a phone above all. */
.ba-l{flex-wrap:wrap;min-width:0}.ba-from{max-width:100%;overflow:hidden;text-overflow:ellipsis}.ba-pick{min-width:0}
.modal form.ba{overflow-x:hidden}