/* Miguu guest app — brand tokens lifted from miguu-site/index.html */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  --bk:#080808; --dk:#111; --cd:#161616;
  --br:rgba(201,168,76,.18); --br2:rgba(201,168,76,.32);
  --gd:#C9A84C; --gl:#E8C97A; --tx:#F5F0E8; --mt:#8A8A8A; --or:#F47621;
  --sf:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --ss:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ez:cubic-bezier(.25,.46,.45,.94);
  --tab-h:58px;
  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);
  color-scheme:dark;
}

html,body{height:100%}
body{
  background:var(--bk); color:var(--tx); font-family:var(--ss);
  font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased;
  overscroll-behavior-y:none;
}
[hidden]{display:none!important}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
input,textarea,select{font:inherit;color:inherit;background:none;border:0;outline:none}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* ---------------------------------------------------------------- shell */
.stage{position:relative;min-height:100%;display:flex;justify-content:center;background:var(--bk)}
.watermark{position:fixed;top:50%;width:min(28vw,400px);opacity:.02;transform:translateY(-50%);pointer-events:none;display:none}
.wm-l{left:2vw} .wm-r{right:2vw}
.app{
  position:relative;width:100%;max-width:520px;min-height:100vh;min-height:100dvh;
  background:var(--bk);display:flex;flex-direction:column;
}
@media(min-width:900px){
  .watermark{display:block}
  .app{border-left:1px solid var(--br);border-right:1px solid var(--br)}
}

/* ---------------------------------------------------------------- topbar */
.head{position:sticky;top:0;z-index:30}
.topbar{
  display:flex;align-items:center;gap:.7rem;
  padding:calc(.6rem + var(--sat)) 1rem .6rem;
  background:rgba(8,8,8,.9);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--br);
}
.topbar-logo{width:30px;height:30px;border-radius:50%;flex:none}
.topbar-txt{flex:1;min-width:0}
.topbar-name{font-family:var(--sf);font-size:1.06rem;line-height:1.1;letter-spacing:.02em}
.topbar-sub{font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gd);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.15rem}
.topbar-gear{color:var(--mt);padding:.35rem;transition:color .25s var(--ez);flex:none}
.topbar-gear:hover,.topbar-gear:focus-visible{color:var(--gd)}

.demo-banner{
  display:block;width:100%;text-align:left;padding:.5rem 1rem;
  background:rgba(244,118,33,.08);border-bottom:1px solid rgba(244,118,33,.28);
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:#F0A374;
  backdrop-filter:blur(10px);
}
.demo-banner b{color:var(--or);font-weight:500}
.demo-banner .chg{float:right;color:var(--gd);border-bottom:1px solid var(--br2)}

/* ---------------------------------------------------------------- views */
.views{flex:1;min-height:0}
.view{padding-bottom:calc(var(--tab-h) + var(--sab) + 28px)}
.view[hidden]{display:none}

/* ---------------------------------------------------------------- type */
.eyebrow{font-size:.63rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gd)}
.eyebrow.mute{color:var(--mt);letter-spacing:.22em}
h1,h2,h3{font-weight:400;font-family:var(--sf);letter-spacing:-.005em}
.dsp{font-family:var(--sf);font-weight:400;line-height:1.18}
.sec{padding:1.5rem 1rem 0}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.85rem}
.sec-h h2{font-size:1.22rem;line-height:1.2}
.muted{color:var(--mt)}
.small{font-size:.78rem;line-height:1.7}
.tiny{font-size:.68rem;line-height:1.6;letter-spacing:.02em}
.note{font-size:.7rem;line-height:1.65;color:var(--mt);border-left:1px solid var(--br);padding-left:.8rem}
.sample-tag{display:inline-block;font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gd);border:1px solid var(--br);padding:.16rem .45rem;vertical-align:middle}

/* ---------------------------------------------------------------- cards */
.card{border:1px solid var(--br);background:var(--dk)}
.card+.card{margin-top:.9rem}
.pad{padding:1rem}

/* hero */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--br)}
.hero img{width:100%;height:clamp(200px,44vw,260px);object-fit:cover}
.hero::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,8,8,.3) 0%,rgba(8,8,8,.14) 22%,rgba(8,8,8,.72) 58%,rgba(8,8,8,.99) 100%)}
/* the copy carries its own scrim so a three-line title is legible over any frame */
.hero-in{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:2.6rem 1rem 1.1rem;
  background:linear-gradient(180deg,rgba(8,8,8,0),rgba(8,8,8,.55) 26%,rgba(8,8,8,.9) 62%,rgba(8,8,8,.97))}
.hero-in h1{font-size:1.62rem;line-height:1.16;margin:.5rem 0 .45rem}
.hero-stay{font-size:.76rem;color:var(--gl);letter-spacing:.02em}
.hero-stay::before{content:'▲ ';font-size:.58rem;opacity:.7}
.hero-stay.plain::before{content:none}
.count-n{font-family:var(--sf);font-size:3.4rem;line-height:1;color:var(--gl);margin:.3rem 0 .1rem}

/* sun strip */
.sun{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--br);
  border-bottom:1px solid var(--br)}
.sun-c{padding:.75rem .5rem;text-align:center}
.sun-c+.sun-c{border-left:1px solid var(--br)}
.sun-l{font-size:.53rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mt);margin-bottom:.28rem}
.sun-v{font-family:var(--sf);font-size:1.06rem;color:var(--tx);line-height:1.2}
.sun-v small{font-family:var(--ss);font-size:.6rem;color:var(--mt);display:block;letter-spacing:.05em;margin-top:.12rem}
.moon-dot{display:inline-block;width:11px;height:11px;border-radius:50%;border:1px solid var(--gd);
  vertical-align:-1px;margin-right:.3rem;background:linear-gradient(90deg,var(--gl) 50%,transparent 50%)}

/* rhythm timeline */
.rhy{position:relative;padding-left:1rem}
.rhy::before{content:'';position:absolute;left:3px;top:.55rem;bottom:.55rem;width:1px;background:var(--br)}
.rhy-r{display:grid;grid-template-columns:52px 1fr;gap:.65rem;padding:.4rem 0;position:relative}
.rhy-r::before{content:'';position:absolute;left:-1rem;top:.82rem;width:7px;height:1px;background:var(--br2)}
.rhy-t{font-size:.68rem;letter-spacing:.1em;color:var(--gd);padding-top:.12rem;font-variant-numeric:tabular-nums}
.rhy-w{font-size:.8rem;line-height:1.6;color:var(--tx)}

/* notices */
.notice{border-left:1px solid var(--br2);padding:.55rem 0 .55rem .85rem}
.notice+.notice{margin-top:.7rem}
.notice-f{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gd);margin-bottom:.2rem}
.notice-t{font-size:.8rem;line-height:1.65;color:var(--mt)}

/* tiles */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--br);border:1px solid var(--br)}
.tile{background:var(--bk);padding:.9rem .85rem;text-align:left;min-height:78px;
  display:flex;flex-direction:column;justify-content:space-between;gap:.4rem;transition:background .25s var(--ez)}
.tile:hover,.tile:focus-visible{background:rgba(201,168,76,.06)}
.tile-l{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gd);display:flex;align-items:center;gap:.4rem}
.tile-v{font-family:var(--sf);font-size:.98rem;line-height:1.25;color:var(--tx)}
.tile svg{width:13px;height:13px;flex:none}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{font-size:.63rem;letter-spacing:.06em;color:var(--gl);border:1px solid var(--br);
  background:rgba(201,168,76,.05);padding:.32rem .6rem;white-space:nowrap}
.chip.on{background:var(--gd);color:var(--bk);border-color:var(--gd)}
.chip.plain{color:var(--mt)}
.chiprow{display:flex;gap:.4rem;overflow-x:auto;padding:0 1rem .1rem;-webkit-overflow-scrolling:touch;
  scrollbar-width:none}
.chiprow::-webkit-scrollbar{display:none}

/* lists */
.blist li{font-size:.8rem;color:var(--mt);line-height:1.7;padding-left:1rem;position:relative;margin-bottom:.5rem}
.blist li::before{content:'';position:absolute;left:0;top:.72em;width:5px;height:1px;background:var(--gd)}
.blist.dim li::before{background:var(--mt)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;
  border:1px solid var(--gd);background:var(--gd);color:var(--bk);padding:.85rem 1.2rem;
  font-size:.63rem;letter-spacing:.2em;text-transform:uppercase;transition:background .25s var(--ez)}
.btn:hover{background:var(--gl)}
.btn.ghost{background:transparent;color:var(--gd)}
.btn.ghost:hover{background:rgba(201,168,76,.1)}
.btn.quiet{border-color:var(--br);color:var(--mt);background:transparent}
.btn.quiet:hover{color:var(--gd);border-color:var(--br2);background:transparent}
.btn.danger{border-color:rgba(244,118,33,.5);color:var(--or);background:transparent}
.btnrow{display:flex;gap:.6rem}

/* forms */
.field{margin-bottom:.9rem}
.field label{display:block;font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--mt);margin-bottom:.35rem}
.field input,.field textarea,.field select{
  width:100%;border:1px solid var(--br);background:var(--cd);padding:.62rem .7rem;font-size:.85rem;
  color:var(--tx);transition:border-color .25s var(--ez)}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--br2)}
.field textarea{min-height:150px;resize:vertical;line-height:1.75}
.check{display:flex;gap:.7rem;align-items:flex-start;padding:.6rem 0;border-bottom:1px solid rgba(201,168,76,.08);
  width:100%;text-align:left}
.check-b{flex:none;width:15px;height:15px;border:1px solid var(--br2);margin-top:.22rem;position:relative}
.check.on .check-b{background:var(--gd);border-color:var(--gd)}
.check.on .check-b::after{content:'';position:absolute;left:4px;top:1px;width:4px;height:8px;
  border:solid var(--bk);border-width:0 1.5px 1.5px 0;transform:rotate(42deg)}
.check-t{font-size:.79rem;line-height:1.6;color:var(--mt)}
.check.on .check-t{color:var(--tx)}

/* ---------------------------------------------------------------- tabbar */
.tabbar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:0;z-index:40;
  width:100%;max-width:520px;display:grid;grid-template-columns:repeat(5,1fr);
  background:rgba(8,8,8,.95);backdrop-filter:blur(10px);
  border-top:1px solid var(--br);padding-bottom:var(--sab);
}
.tab{height:var(--tab-h);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.22rem;
  color:var(--mt);position:relative;transition:color .25s var(--ez)}
.tab svg{width:19px;height:19px}
.tab span{font-size:.53rem;letter-spacing:.14em;text-transform:uppercase}
.tab.on{color:var(--gd)}
.tab.on::before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:var(--gd)}
@media(min-width:900px){.tabbar{border-left:1px solid var(--br);border-right:1px solid var(--br)}}

/* ---------------------------------------------------------------- map
   The card is deliberately tall on a phone: a squeezed map is an unreadable map. */
.mapwrap{position:relative;height:clamp(340px,62vh,560px);
  border-top:1px solid var(--br);border-bottom:1px solid var(--br);
  background:#0d0d0d;overflow:hidden;touch-action:none}
.mapwrap svg{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none}
.map-legend{display:flex;flex-wrap:wrap;gap:.5rem 1rem;padding:.7rem 1rem;font-size:.6rem;
  letter-spacing:.08em;color:var(--mt);border-bottom:1px solid var(--br)}
.map-legend i{display:inline-block;width:9px;height:9px;margin-right:.34rem;vertical-align:-1px}
.map-btns{position:absolute;right:.6rem;bottom:.6rem;display:flex;gap:1px;background:var(--br)}
.map-btns button{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gd);
  background:rgba(8,8,8,.85);padding:.45rem .75rem;transition:background .25s var(--ez)}
.map-btns button:hover{background:rgba(201,168,76,.14)}

/* Screen-space furniture. Each `.s` group is authored in PIXELS and placed by a
   CSS transform: translate(world position) then scale(--u, world units per screen
   px). Type and glyphs therefore keep a constant on-screen size at any zoom. */
#mapSvg{--u:1;--cx:0;--cy:0;--cw:1000;--ch:760}
#mapSvg .s{transform-box:view-box;transform-origin:0 0;
  transform:translate(calc(var(--x,0) * 1px),calc(var(--y,0) * 1px)) scale(var(--u))}
#mapSvg .s.p-tr{transform:translate(calc((var(--cx) + var(--cw)) * 1px),calc(var(--cy) * 1px)) scale(var(--u))}
#mapSvg .s.p-bl{transform:translate(calc(var(--cx) * 1px),calc((var(--cy) + var(--ch)) * 1px)) scale(var(--u))}
#mapSvg .s.p-yb{transform:translate(calc(var(--x,0) * 1px),calc((var(--cy) + var(--ch)) * 1px)) scale(var(--u))}
#mapSvg .s.p-xl{transform:translate(calc(var(--cx) * 1px),calc(var(--y,0) * 1px)) scale(var(--u))}
#mapSvg text{stroke:none;font-family:var(--sf)}
#mapSvg .t-place  {font-size:13px;fill:rgba(245,240,232,.86);text-anchor:middle;letter-spacing:.3px}
#mapSvg .t-region {font-size:15px;font-style:italic;fill:rgba(232,201,122,.5);text-anchor:middle;letter-spacing:1px}
#mapSvg .t-camp   {font-size:11px;fill:rgba(201,168,76,.8);font-family:var(--ss)}
#mapSvg .t-mkr    {font-size:13px;text-anchor:middle;font-family:var(--ss);letter-spacing:.4px}
#mapSvg .t-here   {font-size:9px;text-anchor:middle;fill:#F47621;font-family:var(--ss);letter-spacing:2.2px}
#mapSvg .t-grat   {font-size:10px;fill:rgba(201,168,76,.42);font-family:var(--ss);letter-spacing:1px}
#mapSvg .t-border {font-size:14px;fill:rgba(201,168,76,.62);font-family:var(--ss);letter-spacing:6px}
#mapSvg .t-border.sm{font-size:11px;fill:rgba(201,168,76,.34);letter-spacing:5px}
#mapSvg .t-compass{font-size:12px;text-anchor:middle;fill:rgba(232,201,122,.8);font-family:var(--ss);letter-spacing:2px}
#mapSvg .t-scale  {font-size:11px;fill:rgba(201,168,76,.85);font-family:var(--ss);letter-spacing:2px}
#mapSvg .t-title  {font-size:11px;fill:rgba(232,201,122,.55);font-family:var(--ss);letter-spacing:3.5px}
#mapSvg .t-title.sm{font-size:9px;fill:rgba(201,168,76,.32);letter-spacing:2.5px}
#mapSvg .mk{cursor:pointer}
#mapSvg .mk-hit{fill:transparent}
#mapSvg .pulse{animation:mp 2.4s var(--ez) infinite}
@keyframes mp{0%{opacity:.9}70%{opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){#mapSvg .pulse{animation:none;opacity:.55}}

/* ---------------------------------------------------------------- plan */
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border:1px solid var(--br);margin:0 1rem}
.seg button{padding:.6rem .3rem;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mt);
  transition:all .25s var(--ez)}
.seg button+button{border-left:1px solid var(--br)}
.seg button.on{background:var(--gd);color:var(--bk)}
.dayc{border-top:1px solid var(--br);padding:1rem;position:relative}
.dayc:last-child{border-bottom:1px solid var(--br)}
.dayc.today{background:rgba(201,168,76,.05);border-left:2px solid var(--gd)}
.dayc-h{display:flex;align-items:center;gap:.55rem;margin-bottom:.4rem;flex-wrap:wrap}
.dayc-d{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gd)}
.dayc-date{font-size:.6rem;letter-spacing:.1em;color:var(--mt)}
.pill{font-size:.5rem;letter-spacing:.18em;text-transform:uppercase;background:var(--gd);color:var(--bk);
  padding:.16rem .4rem}
.pill.q{background:transparent;color:var(--gd);border:1px solid var(--br)}
.dayc-t{font-family:var(--sf);font-size:1.12rem;line-height:1.28;margin-bottom:.4rem}
.dayc-b{font-size:.8rem;line-height:1.75;color:var(--mt)}
.dayc-s{margin-top:.55rem;font-size:.73rem;color:var(--gl)}
.dayc-s::before{content:'▲ ';font-size:.58rem;opacity:.7}
details.pack{margin-top:.7rem;border-top:1px solid rgba(201,168,76,.1);padding-top:.55rem}
details.pack summary{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gd);
  cursor:pointer;list-style:none}
details.pack summary::-webkit-details-marker{display:none}
details.pack summary::after{content:' +';color:var(--mt)}
details.pack[open] summary::after{content:' –'}
.dlink{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mt);
  border-bottom:1px solid var(--br);margin-top:.7rem;display:inline-block}
.dlink:hover{color:var(--gd)}

/* ---------------------------------------------------------------- snap */
.ring{display:flex;align-items:center;gap:1rem;padding:1rem;border-bottom:1px solid var(--br)}
.ring svg{flex:none}
.ring-n{font-family:var(--sf);font-size:1.5rem;line-height:1.1}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--br);border-top:1px solid var(--br);
  border-bottom:1px solid var(--br)}
.cc{background:var(--bk);text-align:left;position:relative;padding-bottom:.75rem}
.cc-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--cd)}
.cc-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.02)}
.cc.done .cc-img img{filter:none}
.cc-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(8,8,8,.75))}
.cc-art{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  background:
    repeating-linear-gradient(38deg,rgba(201,168,76,.05) 0 1px,transparent 1px 8px),
    linear-gradient(160deg,#131313,#0b0b0b);
  border-bottom:1px solid var(--br)}
.cc-art span{font-family:var(--sf);font-style:italic;font-size:1.5rem;color:rgba(232,201,122,.72);
  letter-spacing:.02em;border-top:1px solid var(--br);border-bottom:1px solid var(--br);padding:.2rem .7rem}
.cc-pts{position:absolute;top:.4rem;right:.4rem;z-index:2;font-size:.54rem;letter-spacing:.14em;
  color:var(--gl);border:1px solid var(--br2);background:rgba(8,8,8,.75);padding:.16rem .38rem}
.cc-t{font-family:var(--sf);font-size:.95rem;line-height:1.25;padding:.6rem .7rem .25rem}
.cc-s{font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mt);padding:0 .7rem}
.cc.done .cc-s{color:#9BBF7A}
.bingo{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--br);
  border:1px solid var(--br);margin:0 1rem}
.bg-c{background:var(--bk);padding:.6rem .2rem;text-align:center;color:var(--mt)}
.bg-c.on{background:rgba(201,168,76,.14);color:var(--gd)}
.bg-c svg{width:22px;height:22px;margin:0 auto .25rem}
.bg-c span{font-size:.5rem;letter-spacing:.1em;text-transform:uppercase;display:block}
.lb-r{display:flex;align-items:center;gap:.7rem;padding:.5rem 0;border-bottom:1px solid rgba(201,168,76,.08);
  font-size:.78rem}
.lb-r .n{color:var(--mt);width:1.2rem;font-variant-numeric:tabular-nums}
.lb-r .nm{flex:1;color:var(--mt)}
.lb-r.me .nm,.lb-r.me .p{color:var(--gl)}
.lb-r .p{color:var(--gd);font-variant-numeric:tabular-nums}

/* ---------------------------------------------------------------- diary */
.daystrip{display:flex;gap:.35rem;overflow-x:auto;padding:.8rem 1rem;scrollbar-width:none;
  border-bottom:1px solid var(--br)}
.daystrip::-webkit-scrollbar{display:none}
.ds{flex:none;width:44px;padding:.4rem 0;text-align:center;border:1px solid var(--br);color:var(--mt)}
.ds b{display:block;font-family:var(--sf);font-size:1.02rem;color:inherit;font-weight:400}
.ds i{display:block;font-style:normal;font-size:.48rem;letter-spacing:.1em;text-transform:uppercase;margin-top:.1rem}
.ds.on{border-color:var(--gd);color:var(--gd);background:rgba(201,168,76,.08)}
.ds.has::after{content:'';display:block;width:4px;height:4px;background:var(--gd);margin:.28rem auto 0;border-radius:50%}
.stars{display:flex;gap:.5rem}
.stars button{font-size:1.2rem;color:rgba(201,168,76,.28);line-height:1;transition:color .2s var(--ez)}
.stars button.on{color:var(--gd)}
.photostrip{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.3rem;scrollbar-width:none}
.photostrip::-webkit-scrollbar{display:none}
.ph{flex:none;width:76px;height:76px;border:1px solid var(--br);object-fit:cover;background:var(--cd)}
.ph.add{display:flex;align-items:center;justify-content:center;color:var(--gd);font-size:1.3rem}
.sight{display:flex;align-items:baseline;gap:.6rem;padding:.5rem 0;border-bottom:1px solid rgba(201,168,76,.08);
  font-size:.79rem}
.sight .c{color:var(--gd);font-variant-numeric:tabular-nums;width:1.8rem}
.sight .n{flex:1}
.sight .m{color:var(--mt);font-size:.66rem;letter-spacing:.06em}
.sight .x{color:var(--mt);padding:0 .2rem}
.tally{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--br);margin:1rem}
.tally div{padding:.7rem .4rem;text-align:center}
.tally div+div{border-left:1px solid var(--br)}
.tally b{display:block;font-family:var(--sf);font-size:1.3rem;font-weight:400;color:var(--gl)}
.tally span{font-size:.5rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mt)}
.savehint{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gd);
  opacity:0;transition:opacity .3s var(--ez)}
.savehint.on{opacity:1}
.spec-g{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--br);border:1px solid var(--br)}
.spec-c{background:var(--bk);padding:.55rem .6rem;font-size:.72rem;color:var(--mt)}
.spec-c.on{color:var(--gl);background:rgba(201,168,76,.06)}
.spec-c em{display:block;font-style:italic;font-family:var(--sf);font-size:.78rem;color:var(--mt);opacity:.7}

/* ---------------------------------------------------------------- sheet */
.sheet-wrap{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center}
.sheet-wrap[hidden]{display:none}
.sheet-back{position:absolute;inset:0;background:rgba(4,4,4,.72);backdrop-filter:blur(2px);
  animation:fade .2s var(--ez)}
.sheet{position:relative;width:100%;max-width:520px;max-height:90vh;max-height:90dvh;display:flex;flex-direction:column;
  background:var(--dk);border-top:1px solid var(--br2);border-left:1px solid var(--br);border-right:1px solid var(--br);
  animation:rise .25s var(--ez)}
.sheet-grip{padding:.55rem 0 .2rem;text-align:center;flex:none;cursor:grab}
.sheet-grip span{display:inline-block;width:34px;height:2px;background:var(--br2)}
.sheet-body{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 1rem calc(1.4rem + var(--sab));flex:1}
.sheet-h{position:sticky;top:0;background:var(--dk);padding:.3rem 0 .8rem;z-index:2}
.sheet-h h2{font-size:1.3rem;line-height:1.2}
@keyframes rise{from{transform:translateY(18px);opacity:0}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ---------------------------------------------------------------- toast */
.toast{position:fixed;left:50%;transform:translateX(-50%);
  bottom:calc(var(--tab-h) + var(--sab) + 14px);z-index:70;
  background:var(--cd);border:1px solid var(--br2);color:var(--tx);
  padding:.6rem 1rem;font-size:.72rem;letter-spacing:.04em;max-width:min(92vw,460px);
  animation:rise .22s var(--ez)}
.toast[hidden]{display:none}

/* ---------------------------------------------------------------- viewer */
.viewer{position:fixed;inset:0;z-index:80;background:rgba(4,4,4,.96);display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:1rem}
.viewer[hidden]{display:none}
.viewer img{max-width:100%;max-height:76vh;object-fit:contain;border:1px solid var(--br)}
.viewer-bar{display:flex;gap:1.2rem}
.viewer-bar button{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gd);
  border:1px solid var(--br);padding:.55rem 1rem}
.viewer-bar .danger{color:var(--or);border-color:rgba(244,118,33,.4)}

/* ---------------------------------------------------------------- onboarding */
.trip-o{display:flex;gap:.85rem;align-items:center;width:100%;text-align:left;padding:.75rem 0;
  border-bottom:1px solid rgba(201,168,76,.1)}
.trip-o img{width:64px;height:48px;object-fit:cover;flex:none;border:1px solid var(--br)}
.trip-o .n{display:block;font-family:var(--sf);font-size:1rem;line-height:1.25}
.trip-o .d{display:block;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mt);margin-top:.2rem}

/* ---------------------------------------------------------------- recap */
.recap-day{border-top:1px solid var(--br);padding:1rem 0}
.recap-ph{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin-top:.6rem}
.recap-ph img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--br)}

input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:24px;background:transparent}
input[type=range]::-webkit-slider-runnable-track{height:1px;background:var(--br2)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:var(--gd);
  margin-top:-8px;border-radius:50%}
input[type=range]::-moz-range-track{height:1px;background:var(--br2)}
input[type=range]::-moz-range-thumb{width:16px;height:16px;background:var(--gd);border:0;border-radius:50%}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}