
:root {
  --bg:#0a0f0c; --panel:#0f1612; --panel2:#141f17; --border:#1c2b1f; --border2:#253528;
  --text:#aec0a6; --dim:#556055; --muted:#2e3e2e; --cream:#F2EDE4; --ash:#c0d0b8;
  --high:#4dc46a; --mid:#e8a020; --low:#7a9e8e;
  --accent:#D4621A; --ember:#D4621A; --sage:#7A9E7E; --sun:#E8A030;
  --red:#d44040; --blue:#5098e0; --amber:#e8a020; --purple:#9078f0;
  --sidebar-w:340px; --topbar-h:54px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{background:var(--bg);color:var(--text);font-family:'DM Mono',monospace;font-size:13px}
::-webkit-scrollbar{width:3px;height:3px}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}
::-webkit-scrollbar-track{background:transparent}

/* SHELL */
#shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;grid-template-rows:var(--topbar-h) 1fr;height:100vh;transition:grid-template-columns .28s cubic-bezier(.4,0,.2,1)}
#shell.collapsed{grid-template-columns:0px 1fr}
#shell.collapsed #left{overflow:hidden;border-right-color:transparent}

/* TOPBAR */
#topbar{grid-column:1/-1;background:var(--panel);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.5rem;padding:0 .85rem;z-index:500;flex-shrink:0}
.tog{width:28px;height:28px;background:transparent;border:1px solid var(--border2);color:var(--dim);border-radius:3px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;font-size:.85rem}
.tog:hover{border-color:var(--accent);color:var(--accent)}
.logo{font-family:'Bebas Neue',sans-serif;font-size:1.5rem;letter-spacing:.12em;color:var(--cream);flex-shrink:0;line-height:1}
.logo em{color:var(--ember);font-style:normal}
.logo-sub{font-size:.44rem;letter-spacing:.28em;text-transform:uppercase;color:var(--dim);display:block;margin-top:-3px}
.tdiv{width:1px;height:22px;background:var(--border);flex-shrink:0}
.sbox{flex:1;max-width:300px;position:relative}
.sbox::before{content:'⌕';position:absolute;left:.5rem;top:50%;transform:translateY(-50%);color:var(--dim);font-size:.9rem;pointer-events:none}
.sbox input{width:100%;background:var(--panel2);border:1px solid var(--border2);color:var(--text);font-family:'DM Mono',monospace;font-size:.65rem;padding:.3rem .5rem .3rem 1.55rem;border-radius:3px;outline:none;transition:border-color .2s}
.sbox input:focus{border-color:var(--accent)}
.sbox input::placeholder{color:var(--muted)}
.scanbtn{background:var(--ember);color:var(--cream);border:none;font-family:'Bebas Neue',sans-serif;font-size:.9rem;letter-spacing:.15em;padding:.3rem 1rem;border-radius:3px;cursor:pointer;transition:all .15s;flex-shrink:0;display:flex;align-items:center;gap:.38rem;white-space:nowrap}
.scanbtn:hover{background:#e8721a}
.scanbtn:active{transform:scale(.97)}
.scanbtn.busy{background:var(--muted);cursor:wait;pointer-events:none}
.sspin{width:10px;height:10px;border:1.5px solid rgba(242,237,228,.2);border-top-color:var(--cream);border-radius:50%;animation:spin .6s linear infinite;display:none}
.scanbtn.busy .sspin{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.statrow{display:flex;align-items:center;gap:.3rem;font-size:.46rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);flex-shrink:0}
.sdot{width:5px;height:5px;border-radius:50%;background:var(--dim);flex-shrink:0}
.sdot.live{background:var(--high);animation:pulse 2s infinite}
.sdot.warn{background:var(--sun);animation:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.tb-key{background:transparent;border:1px solid var(--border2);color:var(--dim);font-family:'DM Mono',monospace;font-size:.48rem;padding:.26rem .52rem;border-radius:3px;cursor:pointer;transition:all .15s;white-space:nowrap;letter-spacing:.06em;text-transform:uppercase;flex-shrink:0}
.tb-key:hover{border-color:var(--amber);color:var(--amber)}
.tb-key.set{border-color:var(--high);color:var(--high)}

/* SIDEBAR */
#left{background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;z-index:300;transition:border-color .28s}
.ltabs{display:flex;border-bottom:1px solid var(--border);flex-shrink:0}
.ltab{flex:1;font-family:'DM Mono',monospace;font-size:.48rem;letter-spacing:.09em;text-transform:uppercase;color:var(--dim);padding:.5rem 0;border:none;background:none;cursor:pointer;border-bottom:2px solid transparent;transition:all .15s}
.ltab:hover{color:var(--text)}
.ltab.on{color:var(--accent);border-bottom-color:var(--accent)}
.tbadge{display:inline-block;background:var(--amber);color:#030200;border-radius:8px;padding:0 4px;font-size:.38rem;vertical-align:middle;margin-left:2px;line-height:1.5}
.lpanel{display:none;flex:1;overflow-y:auto;flex-direction:column;overflow-x:hidden}
.lpanel.on{display:flex}

/* SECTIONS */
.sec{padding:.65rem .7rem;border-bottom:1px solid var(--border)}
.sec:last-child{border-bottom:none}
.slbl{font-size:.46rem;letter-spacing:.28em;text-transform:uppercase;color:var(--dim);margin-bottom:.5rem;display:flex;align-items:center;gap:.42rem}
.slbl::after{content:'';flex:1;height:1px;background:var(--border)}
.finput{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:'DM Mono',monospace;font-size:.66rem;padding:.38rem .5rem;border-radius:3px;outline:none;transition:border-color .2s;margin-bottom:.5rem}
.finput:focus{border-color:var(--accent)}
.finput::placeholder{color:var(--muted)}
select.finput option{background:var(--panel)}

/* Forest quick picks */
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:.22rem;margin-bottom:.5rem}
.fbtn{font-family:'DM Mono',monospace;font-size:.47rem;padding:.28rem .42rem;border:1px solid var(--border2);border-radius:3px;background:transparent;color:var(--dim);cursor:pointer;transition:all .15s;text-align:left;line-height:1.4}
.fbtn:hover{border-color:var(--sage);color:var(--sage);background:rgba(122,158,126,.05)}
.fbtn.sel{border-color:var(--accent);background:rgba(212,98,26,.1);color:var(--ash)}

/* Vehicle */
.vgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:.22rem}
.vchip{font-size:.44rem;padding:.3rem .05rem;border:1px solid var(--border2);border-radius:3px;background:transparent;color:var(--dim);cursor:pointer;text-align:center;line-height:1.4;transition:all .15s;font-family:'DM Mono',monospace}
.vchip:hover{border-color:var(--sage);color:var(--sage)}
.vchip.on{border-color:var(--accent);background:rgba(212,98,26,.1);color:var(--ash)}

/* Chips */
.chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-family:'DM Mono',monospace;font-size:.48rem;padding:.2rem .42rem;border:1px solid var(--border2);border-radius:3px;background:transparent;color:var(--dim);cursor:pointer;transition:all .15s}
.chip:hover{border-color:var(--sage);color:var(--sage)}
.chip.on{border-color:var(--sage);background:rgba(122,158,126,.12);color:var(--sage)}
.chip.amb.on{border-color:var(--amber);background:rgba(232,160,32,.08);color:var(--amber)}

/* Sliders */
.srow{display:flex;align-items:center;gap:.5rem;margin-bottom:.48rem}
.srow label{font-size:.46rem;color:var(--dim);text-transform:uppercase;letter-spacing:.07em;width:68px;flex-shrink:0}
.srow input[type=range]{flex:1;-webkit-appearance:none;height:2px;background:var(--border2);border-radius:1px;outline:none;cursor:pointer}
.srow input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:11px;height:11px;border-radius:50%;background:var(--accent);cursor:pointer}
.sval{font-size:.54rem;color:var(--ember);width:30px;text-align:right;flex-shrink:0}

/* Trip length */

/* OSM radius */
.rpills{display:flex;gap:.25rem;flex-wrap:wrap}
.rpill{font-family:'DM Mono',monospace;font-size:.46rem;padding:.18rem .45rem;border:1px solid var(--border2);border-radius:12px;background:transparent;color:var(--dim);cursor:pointer;transition:all .15s}
.rpill:hover{border-color:var(--blue);color:var(--blue)}
.rpill.on{border-color:var(--blue);background:rgba(80,152,224,.08);color:var(--blue)}

/* Draw polygon */
.draw-wrap{background:var(--panel2);border:1px solid var(--border);border-radius:3px;padding:.48rem .52rem;margin-top:.28rem}
.draw-info{font-size:.48rem;color:var(--dim);margin-bottom:.3rem;line-height:1.55}
.draw-btns{display:flex;gap:.22rem;flex-wrap:wrap}
.dact{font-family:'DM Mono',monospace;font-size:.48rem;padding:.26rem .52rem;border-radius:3px;cursor:pointer;border:1px solid var(--border2);background:transparent;color:var(--dim);transition:all .15s;white-space:nowrap}
.dact:hover{color:var(--text);border-color:var(--text)}
.dact.start{border-color:rgba(212,98,26,.4);color:var(--accent)}
.dact.start:hover,.dact.start.on{border-color:var(--accent);background:rgba(212,98,26,.1)}
.dact.fin{border-color:rgba(77,196,106,.35);color:var(--high)}
.dact.fin:hover{background:rgba(77,196,106,.08)}
.dact.clr:hover{border-color:var(--red);color:var(--red)}
.poly-status{font-size:.48rem;color:var(--sage);margin-top:.28rem;display:none;padding:.2rem .38rem;background:var(--bg);border-radius:3px;border:1px solid var(--border)}
.poly-status.show{display:flex;align-items:center;justify-content:space-between}

/* Weight sliders */
.wt-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.3rem}
.wt-lbl{font-size:.46rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.wt-v{font-size:.54rem;color:var(--ember)}
.wt-track{height:2px;background:var(--border2);border-radius:1px;margin-bottom:.45rem;overflow:hidden}
.wt-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--sage));border-radius:1px;transition:width .28s}
.adv-tog{display:flex;align-items:center;gap:.35rem;cursor:pointer;font-size:.46rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em;user-select:none}
.adv-tog:hover{color:var(--text)}
.adv-arr{transition:transform .2s;display:inline-block;font-size:.5rem}
.adv-arr.open{transform:rotate(90deg)}
.adv-body{display:none;padding-top:.28rem}
.adv-body.show{display:block}

/* URL/upload */
.url-row{display:flex;gap:.25rem;margin-bottom:.22rem}
.url-row input{flex:1;min-width:0;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:'DM Mono',monospace;font-size:.6rem;padding:.3rem .45rem;border-radius:3px;outline:none;transition:border-color .2s}
.url-row input:focus{border-color:var(--accent)}
.ibtn{width:22px;height:22px;background:var(--border);border:none;color:var(--text);border-radius:3px;cursor:pointer;font-size:.78rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}
.ibtn:hover{background:var(--accent)}
.agg-row{display:flex;gap:.2rem;flex-wrap:wrap;margin-top:.25rem}
.agg{font-family:'DM Mono',monospace;font-size:.44rem;padding:.16rem .38rem;border:1px solid var(--border2);border-radius:3px;background:transparent;color:var(--dim);cursor:pointer;transition:all .15s}
.agg:hover{border-color:var(--blue);color:var(--blue)}
.dz{border:1px dashed var(--border2);border-radius:3px;padding:.6rem;text-align:center;cursor:pointer;position:relative;transition:all .18s;background:var(--bg)}
.dz:hover,.dz.over{border-color:var(--accent);background:rgba(212,98,26,.04)}
.dz input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.dz-t{font-size:.52rem;color:var(--dim);line-height:1.5}
.fitem{font-size:.5rem;color:var(--sage);display:flex;align-items:center;gap:.28rem;padding:.1rem 0;margin-top:.25rem}

/* RESULTS */
.rh{display:flex;align-items:center;justify-content:space-between;padding:.5rem .7rem;border-bottom:1px solid var(--border);flex-shrink:0}
.rcnt{font-size:.48rem;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.rcnt span{color:var(--amber)}
.rsort{background:var(--bg);border:1px solid var(--border);color:var(--dim);font-family:'DM Mono',monospace;font-size:.46rem;padding:.16rem .32rem;border-radius:3px;outline:none}
#rlist{flex:1;overflow-y:auto;padding:.3rem}
.rempty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;text-align:center;padding:2rem;color:var(--dim)}
.rempty .ei{font-size:2.2rem;opacity:.28}
.rempty h3{font-family:'Bebas Neue',sans-serif;font-size:1.25rem;color:var(--sage);letter-spacing:.08em}
.rempty p{font-size:.56rem;line-height:1.6}

/* Result cards */
.rcard{background:var(--panel2);border:1px solid var(--border);border-radius:3px;margin-bottom:.28rem;cursor:pointer;transition:border-color .15s,transform .1s;overflow:hidden;animation:fadeU .22s ease forwards;opacity:0}
.rcard:hover{border-color:var(--accent);transform:translateX(2px)}
.rcard.intri{border-left:2px solid var(--amber)}
.rcard.act{border-color:var(--accent);background:rgba(212,98,26,.04)}
@keyframes fadeU{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.rci{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:.5rem;padding:.5rem .6rem}
.rsc{width:34px;height:34px;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}
.rsc.h{background:rgba(77,196,106,.08);border:1px solid var(--high)}
.rsc.m{background:rgba(232,160,32,.08);border:1px solid var(--mid)}
.rsc.l{background:rgba(122,158,142,.08);border:1px solid var(--low)}
.rsc-n{font-family:'Bebas Neue',sans-serif;font-size:1.1rem;line-height:1}
.rsc.h .rsc-n{color:var(--high)}.rsc.m .rsc-n{color:var(--mid)}.rsc.l .rsc-n{color:var(--low)}
.rsc-s{font-size:.34rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.rcb h3{font-family:'Instrument Serif',serif;font-style:italic;font-size:.86rem;color:var(--cream);margin-bottom:.16rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rtags{display:flex;flex-wrap:wrap;gap:.16rem;margin-bottom:.13rem}
.rtag{font-size:.41rem;padding:.05rem .28rem;border-radius:2px;text-transform:uppercase;letter-spacing:.04em}
.rt-rd{background:rgba(212,98,26,.12);color:var(--ember);border:1px solid rgba(212,98,26,.2)}
.rt-w{background:rgba(80,152,224,.1);color:var(--blue);border:1px solid rgba(80,152,224,.2)}
.rt-op{background:rgba(77,196,106,.1);color:var(--high);border:1px solid rgba(77,196,106,.2)}
.rt-se{background:rgba(232,160,32,.08);color:var(--amber);border:1px solid rgba(232,160,32,.2)}
.rt-ft{background:rgba(122,158,126,.1);color:var(--sage);border:1px solid rgba(122,158,126,.2)}
.rsub{font-size:.46rem;color:var(--dim)}
.rbars{display:flex;flex-direction:column;gap:.2rem;min-width:54px}
.mbr{display:flex;align-items:center;gap:.25rem}
.mbl{font-size:.38rem;color:var(--dim);width:26px;text-align:right;text-transform:uppercase;letter-spacing:.04em}
.mbt{flex:1;height:2px;background:var(--border2);border-radius:1px;overflow:hidden}
.mbf{height:100%;border-radius:1px}
.mbf.a{background:var(--accent)}.mbf.f{background:var(--sage)}.mbf.s{background:var(--sun)}
.tadd{width:20px;height:20px;border:1px solid var(--border2);background:transparent;color:var(--dim);font-size:.75rem;cursor:pointer;border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.tadd:hover{border-color:var(--amber);color:var(--amber)}
.tadd.on{border-color:var(--amber);background:rgba(232,160,32,.08);color:var(--amber)}

/* TRIP */
.trip-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:.52rem;color:var(--dim);text-align:center;padding:2rem}
.trip-empty .ei{font-size:2rem;opacity:.28}
.trip-empty p{font-size:.56rem;line-height:1.7;font-family:'Instrument Serif',serif;font-style:italic}
.thdr{display:flex;align-items:center;gap:.4rem;padding:.5rem .62rem;border-bottom:1px solid var(--border);flex-shrink:0}
.thdr input{flex:1;background:transparent;border:none;color:var(--cream);font-family:'Instrument Serif',serif;font-size:.88rem;font-style:italic;outline:none}
.thdr input::placeholder{color:var(--muted)}
.tacts{display:flex;gap:.2rem;flex-wrap:wrap;padding:.36rem .62rem;border-bottom:1px solid var(--border);flex-shrink:0}
.sml{font-family:'DM Mono',monospace;font-size:.44rem;letter-spacing:.07em;text-transform:uppercase;padding:.18rem .42rem;border-radius:3px;cursor:pointer;border:1px solid var(--border2);background:transparent;color:var(--dim);transition:all .15s}
.sml:hover{color:var(--text);border-color:var(--dim)}
.sml.shr{border-color:rgba(144,120,240,.3);color:var(--purple)}.sml.shr:hover{background:rgba(144,120,240,.08)}
.sml.pdf{border-color:rgba(80,152,224,.3);color:var(--blue)}.sml.pdf:hover{background:rgba(80,152,224,.08)}
.sml.rte{border-color:rgba(232,160,32,.3);color:var(--amber)}.sml.rte:hover{background:rgba(232,160,32,.08)}
#tsites{flex:1;overflow-y:auto;padding:.3rem .46rem}
.tsite{background:var(--panel2);border:1px solid var(--border);border-radius:3px;padding:.46rem .56rem;margin-bottom:.26rem;display:flex;align-items:flex-start;gap:.4rem}
.tsnum{font-family:'Bebas Neue',sans-serif;font-size:.88rem;color:var(--amber);flex-shrink:0;width:16px;text-align:center;margin-top:.04rem}
.tsb{flex:1;min-width:0}
.tsname{font-size:.6rem;color:var(--cream);margin-bottom:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tsreg{font-size:.46rem;color:var(--dim);margin-bottom:.2rem}
.tsnote{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:'DM Mono',monospace;font-size:.52rem;padding:.24rem .38rem;border-radius:3px;outline:none;resize:none;height:32px;line-height:1.5;transition:border-color .2s}
.tsnote:focus{border-color:var(--accent)}
.tsrm{width:16px;height:16px;background:transparent;border:none;color:var(--muted);cursor:pointer;font-size:.62rem;display:flex;align-items:center;justify-content:center;border-radius:2px;transition:color .15s;flex-shrink:0}
.tsrm:hover{color:var(--red)}

/* SAVED */
.svhdr{display:flex;align-items:center;justify-content:space-between;padding:.5rem .7rem;border-bottom:1px solid var(--border);flex-shrink:0}
.svhdr-t{font-size:.48rem;text-transform:uppercase;letter-spacing:.1em;color:var(--dim)}
#svslist{flex:1;overflow-y:auto;padding:.35rem}
.svslot{background:var(--panel2);border:1px solid var(--border);border-radius:3px;padding:.5rem .56rem;margin-bottom:.26rem;display:flex;align-items:center;gap:.4rem;transition:border-color .15s}
.svslot:hover{border-color:var(--accent)}
.svb{flex:1;min-width:0}
.svname{font-size:.56rem;color:var(--cream);margin-bottom:.11rem}
.svmeta{font-size:.44rem;color:var(--dim)}
.svld{font-size:.44rem;color:var(--high);background:transparent;border:1px solid rgba(77,196,106,.22);padding:.14rem .36rem;border-radius:3px;cursor:pointer}
.svdl{font-size:.44rem;color:var(--red);background:transparent;border:1px solid rgba(212,64,64,.18);padding:.14rem .36rem;border-radius:3px;cursor:pointer}
.svempty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.48rem;color:var(--dim);text-align:center;padding:2rem}
.svempty .ei{font-size:2rem;opacity:.28}
.svempty p{font-size:.56rem;line-height:1.6;font-family:'Instrument Serif',serif;font-style:italic}

/* MAP */
#mapwrap{position:relative;overflow:hidden;background:var(--bg)}
#gmap{position:absolute;inset:0;z-index:1}

/* Map type buttons — top right, clean */
#ltog{position:absolute;bottom:5.5rem;right:.75rem;z-index:400;display:flex;border:1px solid rgba(37,53,40,.9);border-radius:3px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.6)}
.ltb{background:rgba(10,15,12,.92);border:none;color:#7a9a7a;font-family:'DM Mono',monospace;font-size:.48rem;padding:.3rem .58rem;cursor:pointer;transition:all .15s;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;backdrop-filter:blur(8px)}
.ltb:not(:last-child){border-right:1px solid rgba(37,53,40,.9)}
.ltb.on{background:rgba(212,98,26,.2);color:var(--ash)}
.ltb:hover:not(.on){background:rgba(212,98,26,.08);color:var(--text)}

/* Draw mode banner */
#draw-banner{position:absolute;top:.75rem;left:50%;transform:translateX(-50%);background:rgba(212,98,26,.95);border:1px solid var(--ember);border-radius:3px;padding:.4rem .8rem;z-index:450;display:none;align-items:center;gap:.5rem;font-size:.56rem;color:var(--cream);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;box-shadow:0 3px 14px rgba(212,98,26,.4)}
#draw-banner.show{display:flex}
.dbc{background:rgba(0,0,0,.28);border-radius:2px;padding:.07rem .35rem;font-family:'Bebas Neue',sans-serif;font-size:.82rem;letter-spacing:.1em}

/* Scan log */
#scanlog{display:none;position:absolute;bottom:.75rem;left:50%;transform:translateX(-50%);background:rgba(10,15,12,.98);border:1px solid var(--border2);border-radius:4px;padding:.7rem .88rem;min-width:320px;max-width:480px;z-index:450;box-shadow:0 8px 32px rgba(0,0,0,.7)}
#scanlog.show{display:block}
.slhdr{display:flex;align-items:center;gap:.45rem;margin-bottom:.42rem}
.slspin{width:8px;height:8px;border:1.5px solid rgba(77,196,106,.2);border-top-color:var(--high);border-radius:50%;animation:spin .6s linear infinite}
.slttl{font-size:.52rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sage)}
.sllines{max-height:100px;overflow-y:auto;margin-bottom:.42rem}
.sll{display:flex;gap:.5rem;margin-bottom:.16rem}
.slt{font-size:.48rem;color:var(--muted);flex-shrink:0;font-variant-numeric:tabular-nums}
.slm{font-size:.5rem;line-height:1.5}
.slm.ok{color:var(--sage)}.slm.inf{color:var(--dim)}.slm.warn{color:var(--sun)}.slm.err{color:var(--red)}.slm.hi{color:var(--cream)}
.slprog{width:100%;height:2px;background:var(--border);border-radius:1px;overflow:hidden}
.slpf{height:100%;background:var(--accent);transition:width .38s;border-radius:1px}

/* Legend */
#legend{position:absolute;bottom:.75rem;left:.75rem;background:rgba(10,15,12,.92);border:1px solid var(--border2);border-radius:3px;padding:.5rem .7rem;z-index:400;backdrop-filter:blur(8px)}
.legr{display:flex;align-items:center;gap:.4rem;margin-bottom:.2rem;font-size:.5rem;color:var(--text)}
.legr:last-child{margin-bottom:0}
.legd{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* Closure alerts */
#ctoasts{position:absolute;top:.75rem;right:130px;display:flex;flex-direction:column;gap:.32rem;z-index:440;max-width:250px}
.ctoa{background:rgba(10,15,12,.97);border-radius:3px;padding:.48rem .62rem;font-size:.53rem;line-height:1.5;border-left:3px solid var(--red);color:var(--text);cursor:pointer;animation:slIn .28s ease forwards}
.ctoa.warn{border-left-color:var(--amber)}
.ctoa strong{display:block;color:var(--cream);margin-bottom:.1rem;font-size:.54rem}
@keyframes slIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}

/* Map empty state */
#mte{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65rem;pointer-events:none;z-index:2;transition:opacity .35s}
#mte.gone{opacity:0}
.mte-i{font-size:2.6rem;opacity:.2}
.mte-t{font-family:'Bebas Neue',sans-serif;font-size:1rem;color:var(--dim);letter-spacing:.1em}
.mte-s{font-size:.52rem;color:var(--muted);text-align:center;line-height:1.6}

/* DETAIL PANEL */
#detail{position:absolute;top:0;right:0;bottom:0;width:355px;background:var(--panel);border-left:1px solid var(--border);z-index:350;transform:translateX(100%);transition:transform .26s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;overflow:hidden}
#detail.open{transform:translateX(0)}
.dpclose{position:absolute;top:.52rem;right:.58rem;z-index:10;width:24px;height:24px;background:rgba(10,15,12,.88);border:1px solid var(--border2);border-radius:3px;color:var(--dim);cursor:pointer;font-size:.7rem;display:flex;align-items:center;justify-content:center;transition:all .15s}
.dpclose:hover{border-color:var(--red);color:var(--red)}
#dphotos{height:155px;overflow:hidden;position:relative;flex-shrink:0;background:var(--panel2)}
#dphotos.empty{height:0}
.pstrip{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;gap:2px}
.pstrip::-webkit-scrollbar{height:2px}
.pstrip img{height:100%;width:auto;min-width:170px;object-fit:cover;scroll-snap-align:start;flex-shrink:0}
.pcnt{position:absolute;bottom:.36rem;right:.46rem;background:rgba(0,0,0,.7);font-size:.44rem;color:rgba(242,237,228,.8);padding:.1rem .32rem;border-radius:2px;pointer-events:none}
.dpscroll{flex:1;overflow-y:auto;padding:.65rem .7rem}
.dp-name{font-family:'Instrument Serif',serif;font-style:italic;font-size:1.1rem;color:var(--cream);margin-bottom:.14rem;line-height:1.3}
.dp-reg{font-size:.48rem;color:var(--dim);margin-bottom:.46rem}
.dpbadges{display:flex;gap:.32rem;flex-wrap:wrap;margin-bottom:.52rem}
.dpb{font-size:.44rem;padding:.09rem .36rem;border-radius:2px;text-transform:uppercase;letter-spacing:.05em}
.dpb.road{background:rgba(212,98,26,.12);color:var(--ember);border:1px solid rgba(212,98,26,.2)}
.dpb.spots{background:rgba(80,152,224,.08);color:var(--blue);border:1px solid rgba(80,152,224,.2)}
.dpb.open{background:rgba(77,196,106,.1);color:var(--high);border:1px solid rgba(77,196,106,.2)}
.dpb.seas{background:rgba(232,160,32,.08);color:var(--amber);border:1px solid rgba(232,160,32,.2)}
.dpscrow{display:flex;align-items:flex-start;gap:.58rem;margin-bottom:.58rem}
.dpscn{font-family:'Bebas Neue',sans-serif;font-size:2rem;line-height:1;flex-shrink:0}
.dpscn.h{color:var(--high)}.dpscn.m{color:var(--mid)}.dpscn.l{color:var(--low)}
.dpbrs{flex:1}
.dbar{display:flex;align-items:center;gap:.4rem;margin-bottom:.26rem}
.dbarlbl{font-size:.44rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;width:48px}
.dbart{flex:1;height:3px;background:var(--border2);border-radius:2px;overflow:hidden}
.dbarf{height:100%;border-radius:2px;transition:width .5s .1s}
.dbarf.a{background:var(--accent)}.dbarf.f{background:var(--sage)}.dbarf.s{background:var(--sun)}
.dbarv{font-size:.44rem;color:var(--dim);width:17px;text-align:right}
.dpsec{margin-bottom:.62rem}
.dpsec-t{font-size:.44rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);margin-bottom:.36rem;padding-bottom:.2rem;border-bottom:1px solid var(--border)}
.dpnotes{font-family:'Instrument Serif',serif;font-style:italic;font-size:.73rem;color:var(--dim);line-height:1.75;padding:.46rem .55rem;background:var(--panel2);border-radius:3px;border-left:2px solid var(--border2)}
.livrow{display:flex;align-items:flex-start;gap:.4rem;padding:.4rem .5rem;background:var(--panel2);border-radius:3px;border:1px solid var(--border);margin-bottom:.22rem}
.livi{font-size:.8rem;flex-shrink:0;margin-top:.04rem}
.livb{flex:1;min-width:0}
.livt{font-size:.52rem;color:var(--text);margin-bottom:.1rem;line-height:1.4}
.livs{font-size:.46rem;color:var(--dim);line-height:1.5}
.wdays{display:grid;grid-template-columns:repeat(5,1fr);gap:.16rem}
.wday{background:var(--panel2);border:1px solid var(--border);border-radius:3px;padding:.26rem .13rem;text-align:center;display:flex;flex-direction:column;gap:.06rem}
.wdl{font-size:.4rem;color:var(--dim);text-transform:uppercase}
.wdi{font-size:.82rem}
.wdt{font-size:.42rem;color:var(--text);white-space:nowrap}
.wdr{font-size:.38rem;color:var(--blue)}
.dpnote{width:100%;background:var(--panel2);border:1px solid var(--border);color:var(--text);font-family:'DM Mono',monospace;font-size:.56rem;padding:.4rem .5rem;border-radius:3px;outline:none;resize:none;height:54px;line-height:1.6;transition:border-color .2s;margin-bottom:.26rem}
.dpnote:focus{border-color:var(--accent)}
.dpnote::placeholder{color:var(--muted)}

.dpacts{display:flex;gap:.26rem;flex-wrap:wrap;margin-bottom:.36rem}
.dptrip{flex:1;background:var(--amber);color:#030200;border:none;font-family:'Bebas Neue',sans-serif;font-size:.8rem;letter-spacing:.1em;padding:.42rem;border-radius:3px;cursor:pointer;transition:background .15s}
.dptrip:hover{background:#f0b030}
.dptrip.on{background:rgba(232,160,32,.08);color:var(--amber);border:1px solid var(--amber)}
.dpmaps,.dpsv{font-size:.46rem;color:var(--dim);padding:.38rem .52rem;border:1px solid var(--border2);border-radius:3px;background:transparent;cursor:pointer;transition:all .15s;font-family:'DM Mono',monospace;text-decoration:none;display:flex;align-items:center;gap:.26rem;white-space:nowrap}
.dpmaps:hover{color:var(--text);border-color:var(--dim)}
.dpsv{color:var(--blue);border-color:rgba(80,152,224,.25)}
.dpsv:hover{background:rgba(80,152,224,.08)}
.dpcoords{font-size:.44rem;color:var(--muted);text-align:center;padding:.3rem;background:var(--bg);border-radius:3px;border:1px solid var(--border);letter-spacing:.05em}

/* MODALS */
.mbg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:1000;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.mbg.on{display:flex}
.mbox{background:var(--panel);border:1px solid var(--border2);border-radius:4px;padding:1.2rem;width:440px;max-width:92vw}
.mtit{font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:.1em;color:var(--cream);margin-bottom:.2rem}
.msub{font-size:.54rem;color:var(--dim);line-height:1.6;margin-bottom:.8rem}
.mf{margin-bottom:.62rem}
.mf label{display:block;font-size:.46rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:.26rem}
.mf input,.mf select,.mf textarea{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:'DM Mono',monospace;font-size:.64rem;padding:.4rem .56rem;border-radius:3px;outline:none;transition:border-color .2s}
.mf input:focus,.mf select:focus,.mf textarea:focus{border-color:var(--accent)}
.mf textarea{resize:vertical;min-height:52px}
.macts{display:flex;gap:.45rem;flex-wrap:wrap}
.mbp{flex:1;background:var(--accent);color:var(--cream);border:none;font-family:'Bebas Neue',sans-serif;font-size:.9rem;letter-spacing:.12em;padding:.48rem;border-radius:3px;cursor:pointer;transition:background .15s}
.mbp:hover{background:#e8721a}
.mbs{background:transparent;color:var(--dim);border:1px solid var(--border2);font-family:'DM Mono',monospace;font-size:.6rem;padding:.48rem .9rem;border-radius:3px;cursor:pointer;transition:all .15s}
.mbs:hover{color:var(--text);border-color:var(--dim)}
.tmodes{display:flex;gap:.26rem;margin-bottom:.62rem}
.tmode{flex:1;text-align:center;padding:.36rem .12rem;border:1px solid var(--border2);border-radius:3px;cursor:pointer;transition:all .15s;font-size:.72rem}
.tmode:hover{border-color:var(--sage)}
.tmode.on{border-color:var(--accent);background:rgba(212,98,26,.1)}
.tmode span{display:block;font-size:.4rem;color:var(--dim);margin-top:.1rem;text-transform:uppercase;letter-spacing:.05em}
.crow{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
.key-note{font-size:.48rem;color:var(--dim);line-height:1.6;margin-bottom:.62rem;padding:.38rem .52rem;background:var(--panel2);border-radius:3px;border-left:2px solid var(--amber)}

/* First run welcome */
#welcome{display:none;position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:2000;align-items:center;justify-content:center;backdrop-filter:blur(6px)}
#welcome.on{display:flex}
.welcome-box{background:var(--panel);border:1px solid var(--border2);border-radius:6px;padding:1.6rem;width:480px;max-width:92vw}
.welcome-logo{font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:.12em;color:var(--cream);margin-bottom:.1rem}
.welcome-logo em{color:var(--ember);font-style:normal}
.welcome-tagline{font-size:.6rem;color:var(--dim);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1.2rem}
.welcome-body{font-size:.6rem;color:var(--text);line-height:1.8;margin-bottom:1rem;font-family:'Instrument Serif',serif;font-style:italic}
.welcome-steps{margin-bottom:1.2rem}
.wstep{display:flex;align-items:flex-start;gap:.6rem;margin-bottom:.6rem;font-size:.56rem;color:var(--dim)}
.wstep-n{font-family:'Bebas Neue',sans-serif;font-size:1rem;color:var(--accent);flex-shrink:0;line-height:1;margin-top:-.1rem}
.wstep strong{color:var(--text)}

/* TOASTS */
#toastwrap{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:.28rem;z-index:2000;pointer-events:none;align-items:center}
.toast{background:rgba(10,15,12,.98);border:1px solid var(--border2);border-radius:3px;padding:.5rem .84rem;font-size:.54rem;color:var(--text);box-shadow:0 8px 28px rgba(0,0,0,.55);animation:tIn .26s ease forwards;display:flex;align-items:center;gap:.52rem;white-space:nowrap}
.toast.ok{border-left:2px solid var(--high)}.toast.warn{border-left:2px solid var(--sun)}.toast.err{border-left:2px solid var(--red)}
@keyframes tIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes tOut{from{opacity:1}to{opacity:0;transform:translateY(7px)}}
.toast.out{animation:tOut .26s ease forwards}
#sharetoa{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%) translateY(32px);background:var(--panel);border:1px solid var(--border2);border-radius:3px;padding:.46rem .9rem;font-size:.56rem;color:var(--text);z-index:2000;opacity:0;transition:all .26s;pointer-events:none;border-left:2px solid var(--purple)}
#sharetoa.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media print{#shell,#topbar,#legend,#scanlog,#detail,#toastwrap,#sharetoa,#ctoasts,#draw-banner,.mbg,#ltog,#welcome{display:none!important}#psheet{display:block!important}}

/* ═══ MOBILE RESPONSIVE ═══ */
@media(max-width:768px){
  :root{--sidebar-w:100vw;--topbar-h:50px}
  #shell{grid-template-columns:1fr;grid-template-rows:var(--topbar-h) 1fr}
  #shell.collapsed #left{display:none}
  #left{position:fixed;top:var(--topbar-h);left:0;right:0;bottom:0;z-index:600;border-right:none;border-bottom:1px solid var(--border);overflow-y:auto}
  #mapwrap{grid-column:1;grid-row:2}
  #detail{width:100vw;border-left:none;border-top:1px solid var(--border);bottom:0;top:var(--topbar-h)}
  #topbar .tdiv,#topbar .statrow{display:none}
  #topbar .sbox{max-width:none;flex:1;min-width:0}
  .scanbtn{padding:.28rem .5rem;font-size:.68rem;flex-shrink:0}
  .logo-sub{display:none}
  #legend{bottom:4rem;right:.4rem;padding:.3rem .46rem;font-size:.42rem}
  #ltog{bottom:4.5rem;right:.4rem}
  .dpscroll{padding:.6rem .7rem;-webkit-overflow-scrolling:touch}
  .auth-btn span{display:none}
  .auth-btn{padding:.22rem .4rem;flex-shrink:0}
  /* Cards full width on mobile */
  .rcard{border-radius:4px}
  /* Detail panel full height scrollable */
  #detail .dpscroll{padding-bottom:4rem}
  /* Larger touch targets */
  .chip,.vchip,.rpill,.ltab{min-height:36px;display:inline-flex;align-items:center;justify-content:center}
  .ltab{flex:1;text-align:center}
  /* Road report buttons easier to tap */
  .rr-btn{min-height:38px}
  .rr-sub{width:100%;padding:.5rem}
  /* Map toggle bigger */
  .ltb{padding:.36rem .6rem;font-size:.55rem}
  /* Topbar tighter */
  #topbar{padding:0 .4rem;gap:.25rem}
  .logo{font-size:1.1rem}
  /* Welcome screen */
  .welcome-box{padding:1.4rem 1.1rem;margin:.6rem}
  .welcome-logo{font-size:2.6rem}
  .wstep{padding:.5rem}
  /* Modal full-width on small screens */
  .mbox{margin:.5rem;max-width:calc(100vw - 1rem) !important}
  /* Draw banner */
  #draw-banner{bottom:3.5rem;font-size:.55rem}
}
@media(max-width:400px){
  .logo{font-size:.95rem}
  .scanbtn span{font-size:.62rem}
  #topbar{gap:.18rem;padding:0 .3rem}
}
@media(max-width:480px){
  .welcome-box{padding:1.6rem 1.2rem;margin:1rem}
  .welcome-logo{font-size:2.4rem}
  #topbar{gap:.3rem;padding:0 .5rem}
}

/* ═══ AUTH ═══ */
.auth-btn{background:transparent;border:1px solid var(--border2);color:var(--dim);font-family:'DM Mono',monospace;font-size:.46rem;letter-spacing:.06em;text-transform:uppercase;padding:.22rem .6rem;border-radius:3px;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:.32rem;flex-shrink:0}
.auth-btn:hover{border-color:var(--accent);color:var(--accent)}
.auth-btn.in{border-color:var(--high);color:var(--high)}
.auth-avatar{width:18px;height:18px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:.5rem;color:var(--cream);flex-shrink:0;font-weight:500}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:.8rem}
.auth-tab{flex:1;background:none;border:none;border-bottom:2px solid transparent;color:var(--dim);font-family:'DM Mono',monospace;font-size:.48rem;letter-spacing:.08em;text-transform:uppercase;padding:.5rem 0;cursor:pointer;transition:all .15s}
.auth-tab.on{color:var(--accent);border-bottom-color:var(--accent)}
.auth-divider{display:flex;align-items:center;gap:.6rem;margin:.6rem 0;color:var(--dim);font-size:.46rem}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.auth-google{width:100%;background:var(--panel2);border:1px solid var(--border2);color:var(--text);font-family:'DM Mono',monospace;font-size:.52rem;padding:.38rem;border-radius:3px;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:.4rem}
.auth-google:hover{border-color:var(--blue);color:var(--blue)}
.auth-user-info{padding:.5rem .6rem;border-bottom:1px solid var(--border);font-size:.46rem;color:var(--dim);display:flex;align-items:center;justify-content:space-between}
.auth-signout{background:transparent;border:1px solid var(--border2);color:var(--dim);font-family:'DM Mono',monospace;font-size:.43rem;padding:.15rem .4rem;border-radius:3px;cursor:pointer;transition:all .15s}
.auth-signout:hover{border-color:var(--red);color:var(--red)}
.sync-row{display:flex;align-items:center;gap:.3rem;padding:.36rem .5rem;background:var(--panel2);border-radius:3px;border:1px solid var(--border);margin-bottom:.18rem;font-size:.46rem;color:var(--dim)}
.sync-dot{width:6px;height:6px;border-radius:50%;background:var(--dim);flex-shrink:0}
.sync-dot.ok{background:var(--high)}.sync-dot.busy{background:var(--amber);animation:pulse 1s infinite}

/* ═══ ROAD REPORTS ═══ */
.rr-list{margin-bottom:.4rem}
.rr-item{background:var(--panel2);border:1px solid var(--border);border-radius:3px;padding:.36rem .46rem;margin-bottom:.2rem}
.rr-head{display:flex;align-items:center;gap:.36rem;margin-bottom:.1rem}
.rr-cond{font-size:.42rem;padding:.04rem .22rem;border-radius:2px;text-transform:uppercase;letter-spacing:.05em}
.rr-cond.good{background:rgba(77,196,106,.1);color:var(--high);border:1px solid rgba(77,196,106,.2)}
.rr-cond.rough{background:rgba(232,160,32,.08);color:var(--amber);border:1px solid rgba(232,160,32,.2)}
.rr-cond.washed{background:rgba(212,98,26,.1);color:var(--accent);border:1px solid rgba(212,98,26,.2)}
.rr-cond.closed{background:rgba(212,68,64,.1);color:var(--red);border:1px solid rgba(212,68,64,.2)}
.rr-date{font-size:.4rem;color:var(--muted);margin-left:auto}
.rr-note{font-size:.47rem;color:var(--dim);line-height:1.5}
.rr-user{font-size:.4rem;color:var(--muted)}
.rr-form{background:var(--panel2);border:1px solid var(--border);border-radius:3px;padding:.46rem .5rem;margin-top:.3rem}
.rr-form-t{font-size:.42rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);margin-bottom:.32rem}
.rr-btns{display:grid;grid-template-columns:repeat(4,1fr);gap:.18rem;margin-bottom:.3rem}
.rr-btn{font-family:'DM Mono',monospace;font-size:.43rem;padding:.22rem .1rem;border:1px solid var(--border2);border-radius:3px;background:transparent;color:var(--dim);cursor:pointer;transition:all .15s;text-align:center}
.rr-btn:hover{border-color:var(--sage);color:var(--sage)}
.rr-btn.on{border-color:var(--accent);background:rgba(212,98,26,.1);color:var(--ash)}
.rr-inp{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:'DM Mono',monospace;font-size:.52rem;padding:.3rem .42rem;border-radius:3px;outline:none;margin-bottom:.26rem;transition:border-color .2s}
.rr-inp:focus{border-color:var(--accent)}
.rr-inp::placeholder{color:var(--muted)}
.rr-sub{background:var(--accent);color:var(--cream);border:none;font-family:'Bebas Neue',sans-serif;font-size:.75rem;letter-spacing:.1em;padding:.28rem .8rem;border-radius:3px;cursor:pointer;transition:background .15s}
.rr-sub:hover{background:#e07020}
.rr-login-note{font-size:.46rem;color:var(--dim);font-style:italic;text-align:center;padding:.3rem}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

/* ═══ MONETIZATION ═══ */
/* Pro badge */
.pro-badge{background:linear-gradient(135deg,#D4621A,#e8a020);color:#fff;font-size:.38rem;font-family:'Bebas Neue',sans-serif;letter-spacing:.12em;padding:.08rem .28rem;border-radius:2px;vertical-align:middle;margin-left:.3rem}
/* Gear affiliate section */
.gear-section{margin-top:.3rem}
.gear-item{display:flex;align-items:center;justify-content:space-between;padding:.28rem .4rem;background:var(--panel2);border:1px solid var(--border);border-radius:3px;margin-bottom:.14rem;text-decoration:none;transition:border-color .15s}
.gear-item:hover{border-color:var(--accent)}
.gear-item-left{display:flex;align-items:center;gap:.3rem}
.gear-icon{font-size:.8rem}
.gear-name{font-size:.48rem;color:var(--text)}
.gear-price{font-size:.44rem;color:var(--dim)}
.gear-buy{font-size:.42rem;color:var(--accent);font-family:'DM Mono',monospace;letter-spacing:.06em}
/* Sponsored pin */
.sponsored-badge{font-size:.38rem;background:rgba(212,98,26,.12);color:var(--accent);border:1px solid rgba(212,98,26,.25);border-radius:2px;padding:.05rem .2rem;letter-spacing:.06em;text-transform:uppercase}
/* Pro gate overlay */
.pro-gate{background:var(--panel2);border:1px solid var(--border2);border-radius:4px;padding:.7rem;text-align:center;margin:.3rem 0}
.pro-gate-icon{font-size:1.4rem;margin-bottom:.3rem}
.pro-gate-t{font-family:'Bebas Neue',sans-serif;font-size:1rem;letter-spacing:.08em;color:var(--cream);margin-bottom:.2rem}
.pro-gate-s{font-size:.48rem;color:var(--dim);line-height:1.6;margin-bottom:.5rem}
.pro-gate-btn{background:linear-gradient(135deg,#D4621A,#e8a020);color:#fff;border:none;font-family:'Bebas Neue',sans-serif;font-size:.8rem;letter-spacing:.1em;padding:.32rem 1.2rem;border-radius:3px;cursor:pointer;transition:opacity .15s}
.pro-gate-btn:hover{opacity:.88}
/* Tip button */
.tip-btn{background:transparent;border:1px solid var(--border2);color:var(--dim);font-family:'DM Mono',monospace;font-size:.44rem;padding:.22rem .5rem;border-radius:3px;cursor:pointer;transition:all .15s;text-decoration:none;display:inline-flex;align-items:center;gap:.25rem}
.tip-btn:hover{border-color:var(--sun);color:var(--sun)}
/* Upgrade modal */
.upgrade-perk{display:flex;align-items:flex-start;gap:.4rem;padding:.32rem 0;border-bottom:1px solid var(--border);font-size:.5rem;color:var(--text)}
.upgrade-perk:last-child{border-bottom:none}
.upgrade-perk-icon{font-size:.9rem;flex-shrink:0}
.price-tag{font-family:'Bebas Neue',sans-serif;font-size:2rem;color:var(--accent);letter-spacing:.05em;text-align:center;margin:.5rem 0 .1rem}
.price-sub{font-size:.46rem;color:var(--dim);text-align:center;margin-bottom:.7rem}
