*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%}
body{font:15px/1.4 var(--f-ui);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow:hidden}
#app{height:100dvh;display:flex;flex-direction:column}
.boot{margin:40vh auto;color:var(--ink-3)}
h1,h2,h3{font-family:var(--f-display);margin:0;letter-spacing:-.01em}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--cobalt-ink)}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:8px}
.mono{font-family:var(--f-mono)}
.lbl{font:500 11px/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.mut{color:var(--ink-3)}
.err{color:var(--coral-ink)}
.hand{font-family:var(--f-hand);font-weight:700}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{flex:none}
/* buttons + inputs */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;background:var(--cobalt);color:#fff;font-weight:600;padding:10px 16px;border-radius:12px;min-height:42px;box-shadow:var(--sh-1);text-decoration:none}
.btn:hover{background:var(--cobalt-700)}
.btn.ghost{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.btn.ghost:hover{background:var(--paper-2)}
.btn.dark{background:var(--ink)}
.btn.lime{background:var(--lime);color:var(--ink)}
.btn.danger{background:var(--coral);color:var(--ink)}
.btn.sm{min-height:34px;padding:6px 12px;font-size:13px;border-radius:10px}
.btn[disabled]{opacity:.5;cursor:default}
.ib{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;border:0;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line);color:var(--ink);padding:0;flex:none}
.ib:hover{background:var(--paper-2)}
.ib.sm{width:32px;height:32px;border-radius:10px}
.ib.ink{background:var(--ink);color:#fff;box-shadow:none}
.ib.lime{background:var(--lime);box-shadow:none}
.ib.coral{background:var(--coral);color:#fff;box-shadow:none}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],input[type=search],select,textarea{width:100%;border:1.5px solid var(--line-2);background:#fff;border-radius:12px;padding:10px 12px;min-height:42px}
textarea{resize:vertical;min-height:72px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--cobalt);box-shadow:0 0 0 3px var(--cobalt-100)}
label.f{display:block;margin:0 0 12px}
label.f>.lbl{display:block;margin-bottom:6px}
.row{display:flex;gap:10px;align-items:center}
.row.wrap{flex-wrap:wrap}
.grow{flex:1;min-width:0}
.seg{display:inline-flex;background:var(--paper-2);border-radius:12px;padding:3px;gap:2px}
.seg button{border:0;background:none;border-radius:9px;padding:6px 12px;font-weight:600;font-size:13px;color:var(--ink-2)}
.seg button[aria-pressed=true]{background:var(--ink);color:#fff}
.av{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:hsl(var(--hue) 70% 86%);color:hsl(var(--hue) 60% 22%);font:700 13px var(--f-display);border:2px solid #fff;flex:none}
.av.lg{width:38px;height:38px;font-size:16px}
.avs{display:flex}.avs .av+.av{margin-left:-8px}
.tag{display:inline-flex;align-items:center;gap:4px;font:500 11px/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;padding:5px 8px;border-radius:6px;background:var(--ink);color:#fff}
.tag.soft{background:var(--paper-2);color:var(--ink-2)}
.tag.ok{background:var(--lime);color:var(--ink)}
.tag.warn{background:var(--coral-50);color:var(--coral-ink)}
.tag.blue{background:var(--cobalt-50);color:var(--cobalt-ink)}
.dbadge{display:inline-grid;place-items:center;min-width:26px;height:20px;padding:0 6px;border-radius:6px;font:500 11px var(--f-mono);background:var(--d,var(--cobalt));color:var(--dt,#fff)}
/* wordmark + top bar */
.wm{display:inline-flex;align-items:center;gap:9px;color:#fff;text-decoration:none;font:800 22px var(--f-display);letter-spacing:-.02em}
.wm svg{display:block}
.wm i{font-style:normal;color:var(--lime)}
.top{background:var(--ink);color:#fff;display:flex;align-items:center;gap:8px;padding:8px 12px;padding-top:max(8px,env(safe-area-inset-top));min-height:52px;flex:none;z-index:30}
.top .sp{flex:1}
.top .ib{background:#fff;box-shadow:none;height:36px;width:36px}
.chip{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink);border:0;border-radius:12px;height:36px;padding:0 10px;font-weight:600;font-size:13px}
.chip .av{width:24px;height:24px;font-size:12px;border:0;background:var(--cobalt);color:#fff}
.chip .cur{font-family:var(--f-mono);font-size:12px;background:var(--lime);padding:3px 7px;border-radius:7px}
.chip.share{padding:0 14px}
.chip.share .ic{margin-right:-2px}
/* auth + landing */
.auth{flex:1;overflow:auto;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,var(--cobalt-50),transparent 40%),var(--paper)}
.auth-card{width:min(420px,100%);background:#fff;border-radius:var(--r-xl);box-shadow:var(--sh-3);padding:30px;position:relative}
.auth-card:before,.auth-card:after{content:"";position:absolute;top:96px;width:22px;height:22px;border-radius:50%;background:var(--paper)}
.auth-card:before{left:-11px}.auth-card:after{right:-11px}
.auth-card .wm{color:var(--ink)}
.auth-card hr{border:0;border-top:2px dashed var(--line-2);margin:18px -4px 20px}
.auth-card h1{font-size:28px;line-height:1.1;margin-bottom:6px}
.auth-card .hand{font-size:24px;color:var(--cobalt-ink);margin:0 0 4px}
/* trips list */
.page{flex:1;overflow:auto;padding:24px 16px 60px}
.page-in{max-width:880px;margin:0 auto}
.page h1{font-size:34px}
.trip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:20px}
.ticket{position:relative;background:#fff;border-radius:var(--r-l);box-shadow:var(--sh-2);padding:18px 18px 16px;text-align:left;border:0;display:block;color:inherit;text-decoration:none;overflow:hidden}
.ticket:hover{box-shadow:var(--sh-3);transform:translateY(-1px)}
.ticket .bar{display:flex;height:8px;margin:-18px -18px 14px}
.ticket .bar i{flex:1}
.ticket h3{font-size:22px;line-height:1.15;margin-bottom:4px}
.ticket .perf{border-top:2px dashed var(--line-2);margin:14px -18px 12px;position:relative}
.ticket .perf:before,.ticket .perf:after{content:"";position:absolute;top:-11px;width:20px;height:20px;border-radius:50%;background:var(--paper)}
.ticket .perf:before{left:-10px}.ticket .perf:after{right:-10px}
.empty{border:2px dashed var(--line-2);border-radius:var(--r-l);padding:32px 20px;text-align:center;background:rgba(255,255,255,.5)}
.empty .hand{font-size:28px;color:var(--cobalt-ink)}
.empty p{margin:6px auto 16px;max-width:36ch;color:var(--ink-2)}
.empty.sm{padding:16px;border-radius:var(--r-m)}
.empty.sm p{margin:2px auto 10px;font-size:14px}
/* stage */
.stage{position:relative;flex:1;min-height:0;overflow:hidden}
#map{position:absolute;inset:0;background:var(--sea)}
.side{position:absolute;left:0;top:0;bottom:0;width:332px;background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:6}
.side-top{padding:12px 12px 4px;flex:none}
.side-list{flex:1;min-height:0;overflow:auto;padding:4px 12px 16px;scrollbar-width:thin}
.titlerow{display:flex;align-items:center;gap:8px}
.titlerow h1{font-size:21px;line-height:1.1;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0 10px}
.tile{display:flex;align-items:center;gap:7px;border:0;background:transparent;padding:6px 4px;border-radius:10px;text-align:left;font-size:12px;font-weight:600;line-height:1.15;color:var(--ink)}
.tile:hover,.tile[aria-pressed=true]{background:#fff;box-shadow:var(--sh-1)}
.tile .ti{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;flex:none;color:#fff}
.tile>span:last-child{white-space:nowrap}.tile small{display:block;font-weight:500;color:var(--ink-3);font-size:11px}
.pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:99px;padding:4px 9px 4px 5px;font-size:11px;font-weight:600;border:1.5px dashed var(--line-2);background:transparent;color:var(--ink-3)}
.pill[aria-pressed=true]{border:1.5px solid var(--ink);background:#fff;color:var(--ink)}
.pill .dot{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:9px}
.daterow{display:flex;align-items:center;gap:8px;padding:6px 0 10px;font:500 12px var(--f-mono);color:var(--ink-2)}
.daterow .n{background:var(--paper-2);border-radius:99px;padding:3px 8px;font-size:11px}
.stepper{margin-left:auto;display:flex;align-items:center;gap:6px}
.stepper .cur{min-width:64px;height:30px;border-radius:99px;border:1.5px solid var(--line-2);background:#fff;font-weight:600;font-size:12px}
.stepper .ib{width:30px;height:30px;border-radius:99px}
.dayrow{--d:var(--cobalt);--dt:#fff;position:relative;display:flex;align-items:stretch;background:var(--paper-2);border-radius:14px;margin-bottom:8px;border:2px solid transparent;overflow:hidden;cursor:pointer}
.dayrow:hover{background:#ebe9e0}
.dayrow[aria-current=true]{border-color:var(--ink);background:#fff}
.dayrow .tab{width:46px;flex:none;background:var(--d);color:var(--dt);display:grid;place-content:center;text-align:center;font-family:var(--f-display)}
.dayrow .tab small{font:500 9px var(--f-mono);letter-spacing:.1em;display:block;opacity:.9}
.dayrow .tab b{font-size:26px;line-height:1;font-weight:800}
.dayrow .bd{flex:1;min-width:0;padding:8px 8px 8px 10px;display:flex;flex-direction:column;gap:3px}
.dayrow .tt{font:700 14px/1.2 var(--f-display);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dayrow .mt{font:400 11px var(--f-mono);color:var(--ink-3)}
.stay{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;border:1.5px solid var(--d);color:var(--d);background:#fff;font-size:11px;font-weight:600;border-radius:7px;padding:2px 6px;max-width:100%}
.stay span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dayrow .acts{display:flex;flex-direction:column;gap:6px;justify-content:center;padding:6px 8px 6px 0}
.dayrow .acts .ib{width:30px;height:30px;border-radius:9px;background:#fff}
.dayrow[aria-current=true] .acts .ib.sel{background:var(--lime)}
.opentag{position:absolute;top:-1px;right:44px;background:var(--lime);border:1.5px solid var(--ink);border-radius:6px;font:500 9px var(--f-mono);letter-spacing:.08em;padding:1px 6px}
.about{margin:2px 0 10px;background:var(--cobalt-50);border-left:4px solid var(--cobalt);padding:10px 12px;border-radius:0 12px 12px 0;font-size:13px;color:var(--ink-2)}
/* floating panel */
.fp{position:absolute;left:346px;top:12px;width:352px;max-height:calc(100% - 24px);background:#fff;border-radius:var(--r-l);box-shadow:var(--sh-3);z-index:7;display:flex;flex-direction:column;overflow:hidden}
.fp.wide{width:420px}
.fp-h{display:flex;align-items:center;gap:10px;padding:14px 14px 10px 18px;flex:none}
.fp-h h2{font-size:20px;flex:1}
.fp-b{overflow:auto;padding:4px 16px 18px;flex:1;min-height:0;scrollbar-width:thin}
.grab{display:none;width:44px;height:5px;border-radius:9px;background:var(--line-2);margin:8px auto 0;flex:none}
.plan-h{--d:var(--cobalt);--dt:#fff;background:var(--d);color:var(--dt);padding:14px 56px 22px 18px;position:relative;flex:none;-webkit-mask:radial-gradient(circle 6px at 50% 100%,#0000 5.5px,#000 6px) 0 100%/16px 100% repeat-x;mask:radial-gradient(circle 6px at 50% 100%,#0000 5.5px,#000 6px) 0 100%/16px 100% repeat-x}
.plan-h .lbl{color:inherit;opacity:.9}
.plan-h h2{font-size:23px;line-height:1.1;margin:8px 0 4px}
.plan-h p{margin:0;font-size:13px;opacity:.95}
.plan-h .ib{position:absolute;right:10px;top:10px;background:rgba(255,255,255,.95);color:var(--ink);box-shadow:none}
.plan-h input.ttl{background:transparent;border:0;border-bottom:1.5px dashed currentColor;color:inherit;font:800 23px/1.1 var(--f-display);padding:4px 0;min-height:0;border-radius:0;margin:6px 0 4px}
.plan-h input.ttl::placeholder,.plan-h textarea::placeholder{color:inherit;opacity:.8}
.plan-h textarea{background:transparent;border:0;border-bottom:1.5px dashed currentColor;color:inherit;font-size:13px;padding:4px 0;min-height:36px;border-radius:0}
.plan-h input.ttl:focus,.plan-h textarea:focus{box-shadow:none;border-color:currentColor}
.plan-b{overflow:auto;padding:6px 16px 18px;flex:1;min-height:0}
.two{display:grid;grid-template-columns:1fr 1fr;border:1.5px solid var(--line);border-radius:12px;margin:8px 0 12px}
.two>div{padding:8px 12px}.two>div+div{border-left:2px dashed var(--line-2)}
.two b{display:block;font-family:var(--f-display);font-size:16px;margin-top:3px}
.two small{color:var(--ink-3);font-size:12px}
.sec{display:flex;align-items:center;justify-content:space-between;margin:16px 0 8px;border-top:1px solid var(--line);padding-top:12px}
.sec .lbl:last-child{color:var(--ink-3)}
.steps{list-style:none;margin:0;padding:0 0 0 2px;position:relative}
.steps li{display:flex;gap:10px;align-items:flex-start;padding:5px 0;position:relative;font-size:14px}
.steps li:before{content:"";width:10px;height:10px;border-radius:50%;border:2px solid var(--d,var(--cobalt));background:#fff;margin-top:5px;flex:none;position:relative;z-index:1}
.steps li:not(:last-child):after{content:"";position:absolute;left:6px;top:20px;bottom:-8px;border-left:2px dotted var(--line-2)}
.steps .x{margin-left:auto;display:flex;gap:2px}
.steps input{min-height:30px;padding:3px 8px;border-color:transparent;background:transparent}
.steps input:hover{border-color:var(--line)}
.act{display:flex;gap:10px;background:var(--lime-50);border-radius:12px;padding:10px 12px;margin-bottom:8px;align-items:flex-start;cursor:pointer;border:0;width:100%;text-align:left}
.act:hover{background:#ebfab0}
.act .st{width:30px;height:30px;border-radius:9px;background:var(--lime);display:grid;place-items:center;flex:none;font-size:15px}
.act b{display:block;font-size:14px}
.act small{color:var(--ink-2);font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.plc{display:flex;align-items:center;gap:10px;border:1.5px solid var(--ink);border-radius:12px;padding:10px 12px;margin-bottom:8px;background:#fff;cursor:pointer;width:100%;text-align:left}
.plc:hover{background:var(--paper)}
.plc .pd{width:16px;height:16px;border-radius:50%;border:4px solid var(--d,var(--cobalt));display:grid;place-items:center;flex:none}
.plc .pd:after{content:"";width:4px;height:4px;border-radius:50%;background:var(--cobalt)}
.plc b{flex:1;font-size:14px;min-width:0}
.plc.att .pd{border-color:var(--lime-ink);background:var(--lime)}
.item{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.item .plc,.item .act{margin-bottom:0;flex:1;min-width:0}
.item .mv{display:flex;flex-direction:column}
.item .mv button{border:0;background:none;padding:0;height:18px;color:var(--ink-3)}
.item[draggable=true]{cursor:grab}
.item.over{outline:2px dashed var(--cobalt);outline-offset:2px;border-radius:12px}
.cm-pill{display:inline-flex;align-items:center;gap:5px;border:1.5px solid var(--line-2);background:#fff;border-radius:99px;padding:3px 9px;font-size:12px;font-weight:600;color:var(--ink-2)}
.cm{border:1.5px solid var(--line);border-radius:12px;padding:8px 12px;margin-bottom:8px;font-size:14px}
.cm small{color:var(--ink-3);font:400 11px var(--f-mono);display:block;margin-bottom:2px}
.cm .x{float:right}
/* panels content */
.card{border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px;background:#fff;position:relative}
.card h3{font-size:16px;margin-bottom:2px}
.card .meta{font:400 11.5px var(--f-mono);color:var(--ink-3)}
.card .x{position:absolute;right:8px;top:8px;display:flex;gap:4px}
.goal{display:flex;gap:10px;align-items:flex-start;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.goal .ck{width:20px;height:20px;border-radius:6px;background:var(--lime);display:grid;place-items:center;flex:none;margin-top:1px}
.sum{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 12px}
.sum>div{background:var(--paper);border-radius:12px;padding:10px 12px}
.sum b{display:block;font:700 18px var(--f-display);margin-top:4px}
.bar{height:8px;border-radius:99px;background:var(--paper-2);overflow:hidden;margin:6px 0 2px}
.bar i{display:block;height:100%;background:var(--cobalt);border-radius:99px}
.bar.over i{background:var(--coral)}
.cat{padding:10px 0;border-bottom:1px solid var(--line)}
.cat .top2{display:flex;align-items:center;gap:8px}
.cat .top2 b{flex:1;font-size:14px}
.cat .amt{font:400 12px var(--f-mono);color:var(--ink-2)}
.cat input{width:96px;min-height:32px;padding:3px 8px;text-align:right;font-family:var(--f-mono);font-size:13px}
.xt{position:relative;display:flex;gap:12px;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px;width:100%;text-align:left}
.xt:hover{border-color:var(--ink)}
.xt .ci{width:38px;height:38px;border-radius:11px;background:var(--cobalt-50);color:var(--cobalt-ink);display:grid;place-items:center;flex:none}
.xt .am{margin-left:auto;text-align:right;font:600 15px var(--f-mono);flex:none;padding-left:10px;border-left:2px dashed var(--line-2)}
.xt .am small{display:block;font:400 11px var(--f-mono);color:var(--ink-3)}
.xt b{font-size:15px;display:block;overflow:hidden;text-overflow:ellipsis}
.xt .meta{font:400 11px var(--f-mono);color:var(--ink-3)}
.bal{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.bal .num{font:600 14px var(--f-mono);text-align:right}
.pos{color:#3D7A00}.neg{color:var(--coral-ink)}
.pay{display:flex;align-items:center;gap:8px;background:var(--paper);border-radius:12px;padding:10px 12px;margin-bottom:8px;font-size:14px}
.pay .num{margin-left:auto;font:600 14px var(--f-mono)}
.task{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.task.done b{text-decoration:line-through;color:var(--ink-3)}
.task .ck{width:24px;height:24px;border-radius:8px;border:2px solid var(--line-2);background:#fff;display:grid;place-items:center;padding:0;flex:none}
.task.done .ck{background:var(--lime);border-color:var(--lime)}
.addbar{display:flex;gap:8px;margin:8px 0 14px}
.note{background:var(--cobalt-50);border-radius:12px;padding:10px 12px;font-size:13px;color:var(--ink-2);margin:10px 0}
.mapbar{position:absolute;bottom:34px;left:calc(332px + (100% - 332px)/2);transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:6px;background:#fff;border-radius:99px;box-shadow:var(--sh-2);padding:5px}
.mapbar b{font:600 12px var(--f-mono);padding:0 8px;white-space:nowrap}
.mapbar .ib{width:32px;height:32px;border-radius:99px}
.mapbar .x{background:var(--coral);color:#fff;box-shadow:none}
.fab{position:absolute;right:12px;bottom:92px;z-index:5}
.pickbar{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:40;background:var(--ink);color:#fff;border-radius:99px;padding:8px 8px 8px 16px;display:flex;gap:12px;align-items:center;box-shadow:var(--sh-3);font-size:14px;max-width:calc(100% - 24px)}
.pick-mode #map canvas{cursor:crosshair}
.collapse-tab{display:none}
/* map markers */
.mk{position:relative;cursor:pointer;border:0;background:none;padding:0;display:block}
.mk-stay{width:34px;height:34px;border-radius:10px;background:var(--ink);color:#fff;display:grid;place-items:center;border:2px solid #fff;box-shadow:var(--sh-2)}
.mk-place{width:24px;height:24px;border-radius:50%;background:#fff;border:5px solid var(--d,var(--cobalt));box-shadow:var(--sh-2);display:grid;place-items:center}
.mk-place:after{content:"";width:6px;height:6px;border-radius:50%;background:var(--cobalt)}
.mk-act{width:26px;height:26px;border-radius:50%;background:#F29D00;border:2px solid #fff;color:var(--ink);display:grid;place-items:center;font-size:13px;box-shadow:var(--sh-2)}
.mk-att{width:26px;height:26px;border-radius:50%;background:var(--lime);border:2px solid var(--ink);display:grid;place-items:center;box-shadow:var(--sh-2);color:var(--ink)}
.mk-day{min-width:22px;height:22px;border-radius:99px;background:var(--d);color:var(--dt);border:2px solid #fff;display:grid;place-items:center;font:600 11px var(--f-mono);box-shadow:var(--sh-1);padding:0 4px}
.mk-cl{width:34px;height:34px;border-radius:50%;background:var(--cobalt);color:#fff;border:3px solid #fff;display:grid;place-items:center;font:700 13px var(--f-display);box-shadow:var(--sh-2)}
.mk-cl.dim,.mk.dim{opacity:.35}
.mk.sel .mk-place,.mk.sel .mk-act,.mk.sel .mk-att{transform:scale(1.25)}
.maplibregl-popup.tp{max-width:320px!important;z-index:20}
.maplibregl-popup.tp .maplibregl-popup-content{border-radius:20px;padding:14px 16px;box-shadow:var(--sh-3);font-family:var(--f-ui);min-width:220px}
.maplibregl-popup.tp .maplibregl-popup-close-button{display:none}
.pp-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;padding-right:30px}
.pp h3{font-size:22px;line-height:1.1;margin-bottom:4px}
.pp p{margin:0 0 10px;color:var(--ink-2);font-size:14px}
.pp .x{position:absolute;right:10px;top:10px}
.pp .btns{display:flex;gap:8px;border-top:1.5px dashed var(--line-2);padding-top:10px}
.cbtn{display:inline-flex;align-items:center;gap:8px;background:var(--cobalt);color:#fff;border:0;border-radius:10px;padding:7px 12px;font-weight:600;font-size:13px}
.cbtn i{font-style:normal;border-left:1px solid rgba(255,255,255,.5);padding-left:8px;font-family:var(--f-mono)}
.maplibregl-ctrl-attrib{font-size:10px}
/* modal */
.modal-back{position:fixed;inset:0;background:rgba(14,16,32,.5);z-index:100;display:grid;place-items:center;padding:12px}
.modal{background:#fff;border-radius:var(--r-l);box-shadow:var(--sh-3);width:min(460px,100%);max-height:calc(100dvh - 24px);display:flex;flex-direction:column;overflow:hidden}
.modal.wide{width:min(760px,100%)}
.modal-h{display:flex;align-items:center;gap:10px;padding:16px 16px 8px 20px}
.modal-h h2{font-size:22px;flex:1}
.modal-b{padding:6px 20px 18px;overflow:auto;flex:1;min-height:0}
.modal-f{padding:12px 20px 18px;display:flex;gap:10px;justify-content:flex-end;border-top:1px solid var(--line);flex-wrap:wrap}
.results{border:1.5px solid var(--line);border-radius:12px;margin-top:6px;max-height:210px;overflow:auto}
.results button{display:block;width:100%;text-align:left;border:0;background:#fff;padding:9px 12px;border-bottom:1px solid var(--line)}
.results button:hover,.results button[aria-selected=true]{background:var(--cobalt-50)}
.results small{display:block;color:var(--ink-3);font-size:12px}
.err-box{background:var(--coral-50);color:var(--coral-ink);border-radius:10px;padding:8px 12px;font-size:13px;margin:8px 0}
#toasts{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:200;display:grid;gap:8px;width:min(92vw,420px)}
.toast{background:var(--ink);color:#fff;padding:10px 14px;border-radius:12px;box-shadow:var(--sh-3);font-size:14px;transition:opacity .3s}
.toast.err{background:var(--coral-ink)}
.toast.out{opacity:0}
/* tour */
.tour-back{position:fixed;inset:0;z-index:150}
.tour-hole{position:fixed;border-radius:16px;box-shadow:0 0 0 9999px rgba(14,16,32,.6);transition:all .25s;pointer-events:none}
.tour-card{position:fixed;z-index:151;width:min(340px,calc(100vw - 24px));background:#fff;border-radius:var(--r-l);box-shadow:var(--sh-3);padding:18px}
.tour-card h3{font-size:20px;margin:6px 0}
.tour-card p{margin:0 0 14px;color:var(--ink-2);font-size:14px}
/* share */
.share-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.share-prev{background:var(--paper-2);border-radius:16px;padding:14px;display:grid;place-items:center}
.share-prev canvas{max-width:100%;max-height:60vh;border-radius:10px;box-shadow:var(--sh-2)}
.toggle{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.toggle input{width:20px;height:20px;accent-color:var(--cobalt);flex:none}
.toggle b{display:block;font-size:14px}.toggle small{color:var(--ink-3)}
/* phone */
@media (max-width:820px){
  .top .lbl-txt,.chip.user .nm{display:none}
  .side{left:8px;right:8px;top:8px;bottom:auto;width:auto;max-height:48%;border-radius:22px;border:1px solid var(--line);box-shadow:var(--sh-2)}
  .side-top{padding-top:10px}
  .tiles-wrap{display:none}
  .tiles-wrap.open{display:block}
  .tf-toggle{display:flex}
  .fp,.fp.wide{left:0;right:0;bottom:0;top:auto;width:auto;max-height:74%;border-radius:22px 22px 0 0;z-index:12;padding-bottom:env(safe-area-inset-bottom)}
  .grab{display:block}
  .mapbar{left:50%;bottom:30px}
  .mapbar.hide{display:none}
  .fab{bottom:80px}
  .stage.full .side .side-list,.stage.full .side .side-top>*:not(.titlerow){display:none}
  .share-grid{grid-template-columns:1fr}
  .modal-back{place-items:end center;padding:0}
  .modal{border-radius:22px 22px 0 0;width:100%;max-height:92dvh}
  .page h1{font-size:28px}
  .two b{font-size:15px}
  .collapse-tab{display:grid;position:absolute;left:50%;bottom:-23px;transform:translate(-50%,0);z-index:7;background:#fff;border:0;border-radius:0 0 14px 14px;width:56px;height:24px;place-items:center;box-shadow:var(--sh-1);padding:0}
}
@media (min-width:821px){.tf-toggle{display:none!important}.tiles-wrap{display:block!important}}
.tf-toggle{align-items:center;justify-content:space-between;width:100%;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:8px 12px;font-weight:600;margin:8px 0;display:flex}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.mapbar .btn,.mapbar b{white-space:nowrap}