/* Embarque — "Capa": cada viagem ganha a sua capa de revista.
   A foto do destino é a capa; o resto é papel calmo: listas sem caixa, um fio de tinta por cima, serifa nos títulos.
   A cor de destaque acompanha a foto (--h), sempre na família verde–petróleo–azul. */
@property --h{syntax:'<number>';inherits:true;initial-value:215}
:root{
  --h:215;
  --bg:#F4F5F5; --surface:#FFFFFF; --sunken:#ECEEEE;
  --ink:#15191C; --ink-2:#434A50; --muted:#636B72;
  --line:#DEE1E1; --line-soft:#E8EAEA; --line-strong:#B9C0C2; --ctl:#7C858B; --rule:#15191C;
  --accent:#246876; --accent-strong:#135360; --accent-soft:#E0F2F7; --on-accent:#FFFFFF;
  --ok:#1B7A57; --danger:#B4322E;
  --scrim-c:#040F13;
  --glass:rgba(4,15,19,.62); --glass-solid:#1B2529; --bar:rgba(244,245,245,.9);
  --on-photo:#FFFFFF; --on-photo-2:rgba(255,255,255,.84);
  --edge:rgba(21,25,28,.12); --plate-filter:none;
  --tile:#FFFFFF; --tile-ink:#5B6274; --scrim:rgba(10,14,16,.48);
  --r-photo:4px; --r-field:10px; --r-card:12px; --r-sheet:18px;
  --shadow:0 1px 2px rgba(21,25,28,.05),0 10px 28px -14px rgba(21,25,28,.18);
  --shadow-lg:0 2px 6px rgba(21,25,28,.08),0 32px 64px -24px rgba(21,25,28,.36);
  --gutter:clamp(20px,5vw,72px);
  --ease:cubic-bezier(.2,.7,.2,1); --ease-spring:cubic-bezier(.3,1.5,.5,1);
  --display:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --body:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  --code:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  color-scheme:light;
  transition:--h .8s ease;
}
@supports (color:oklch(0 0 0)){:root{
  --accent:oklch(48% .07 var(--h)); --accent-strong:oklch(41% .065 var(--h)); --accent-soft:oklch(95% .02 var(--h));
}}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0E1113; --surface:#161A1D; --sunken:#1D2226;
    --ink:#ECEEEE; --ink-2:#B9C0C4; --muted:#8D969C;
    --line:#262C30; --line-soft:#1E2327; --line-strong:#3B444A; --ctl:#6B757B; --rule:#6B757B;
    --accent:#7FCBDE; --accent-strong:#ACDEEB; --accent-soft:#142A30; --on-accent:#01151A;
    --ok:#4CC495; --danger:#F0706A; --bar:rgba(14,17,19,.9);
    --edge:rgba(255,255,255,.10); --plate-filter:brightness(.92);
    --tile:#F4F5F7; --scrim:rgba(2,4,6,.64);
    --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px -14px rgba(0,0,0,.6);
    --shadow-lg:0 2px 6px rgba(0,0,0,.5),0 32px 64px -24px rgba(0,0,0,.8);
    color-scheme:dark;
  }
  @supports (color:oklch(0 0 0)){:root{
    --accent:oklch(80% .08 var(--h)); --accent-strong:oklch(87% .055 var(--h)); --accent-soft:oklch(27% .03 var(--h)); --on-accent:oklch(18% .03 var(--h));
  }}
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{height:100%}
body{margin:0;padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);background:var(--bg);color:var(--ink);font:400 15px/1.55 var(--body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-optical-sizing:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0;text-align:inherit}
a{color:inherit}
h1,h2,h3,p{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.mono{font-variant-numeric:lining-nums}
.ic{width:20px;height:20px;flex:none;display:block}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#root{min-height:100%}
.lbl,.nav-label,.xhead{font:600 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

/* ---------- fotos ---------- */
.pic{position:relative;overflow:hidden;isolation:isolate;background:var(--sunken)}
.pic>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 42%;opacity:0;transform:scale(1.035);transition:opacity .5s var(--ease),transform 1.4s cubic-bezier(.16,1,.3,1)}
.pic>img.cur{opacity:1;transform:none}
.pic.is-loading>img.cur{opacity:.6}
.pic.plate{border-radius:var(--r-photo)}
.pic.plate>img{filter:var(--plate-filter)}
.pic.plate::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--edge);pointer-events:none;z-index:2}
.pic.is-loading::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,transparent 35%,rgb(255 255 255/.1) 50%,transparent 65%);background-size:220% 100%;animation:sheen 1.6s linear infinite}
@keyframes sheen{from{background-position:120% 0}to{background-position:-120% 0}}
/* capa tipográfica: o estado sem foto é desenhado, não um erro */
.cover-art{position:absolute;inset:0;overflow:hidden;--a:#084551;--b:#001F28;background:
  repeating-radial-gradient(circle at 82% 16%,transparent 0 27px,rgb(255 255 255/.055) 27px 28px),
  radial-gradient(90% 70% at 82% 16%,rgb(255 255 255/.12) 0,transparent 62%),
  linear-gradient(168deg,var(--a),var(--b))}
@supports (color:oklch(0 0 0)){.cover-art{--a:oklch(36% .06 var(--art-h,var(--h)));--b:oklch(22% .045 var(--art-h,var(--h)))}}
.cover-art::after{content:attr(data-initial);position:absolute;right:-.06em;bottom:-.28em;font:italic 300 var(--art-fs,min(56vw,520px))/1 var(--display);color:rgb(255 255 255/.07)}
.cover-cap{position:absolute;inset:auto 0 0;z-index:2;padding:112px var(--gutter) 28px;color:var(--on-photo);text-shadow:0 1px 2px rgb(0 0 0/.28);background:linear-gradient(to top,rgba(4,15,19,.88) 0,rgba(4,15,19,.72) calc(100% - 112px),transparent 100%)}
.cover-cap .lbl{color:var(--on-photo-2)}
.cover-title{font:500 clamp(40px,6vw,92px)/.98 var(--display);letter-spacing:-.02em;text-wrap:balance;max-width:15ch;overflow-wrap:anywhere}
.cover-meta{font:500 15px/1.3 var(--body);font-variant-numeric:lining-nums;color:var(--on-photo-2)}
.glass-btn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--glass);border:1px solid rgb(255 255 255/.22);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);transition:background .12s}
.glass-btn:hover{background:rgba(4,15,19,.72)}
.glass-btn:focus-visible,.cover-cap a:focus-visible{outline-color:#fff}
.glass-chip{display:inline-flex;align-items:center;padding:7px 12px;border-radius:999px;color:#fff;font:700 15px/1 var(--body);letter-spacing:-.02em;background:var(--glass);border:1px solid rgb(255 255 255/.22);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4)}
@media (prefers-reduced-transparency:reduce){.glass-btn,.glass-chip{background:var(--glass-solid);-webkit-backdrop-filter:none;backdrop-filter:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass-btn,.glass-chip{background:var(--glass-solid)}}
.credit{font:400 11px/1.4 var(--body);color:var(--muted);text-align:right}
.credit a{text-decoration:none}
.credit a:hover{text-decoration:underline}

/* ---------- estrutura ---------- */
.app{display:grid;grid-template-columns:264px minmax(0,1fr);min-height:100vh;min-height:100dvh}
.side{position:sticky;top:0;height:100vh;height:100dvh;overflow:auto;padding:28px 20px 20px;display:flex;flex-direction:column;gap:24px;border-right:1px solid var(--line);background:var(--bg)}
.brand{font:700 16px/1 var(--body);letter-spacing:-.02em;color:var(--ink)}
.brand i{font-style:normal;color:var(--accent)}
.trip-mini{display:flex;flex-direction:column;gap:10px;width:100%}
.trip-mini .pic{aspect-ratio:3/2;width:100%;--art-fs:150px}
@media (max-height:820px){.trip-mini .pic{aspect-ratio:2/1}}
.trip-mini b{font:500 20px/1.15 var(--display);letter-spacing:-.01em;overflow-wrap:anywhere}
.trip-mini span{font-size:12.5px;color:var(--muted)}
.trip-mini>div:last-child{display:flex;flex-direction:column;gap:3px}
.nav{display:flex;flex-direction:column;gap:1px}
.nav-label{padding:16px 10px 8px}
.nav-gap{height:14px}
.nav-item{position:relative;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--ink-2);font:500 14.5px/1.3 var(--body);width:100%;transition:background .12s,color .12s}
.nav-item .ic{width:18px;height:18px;color:var(--muted)}
.nav-item:hover{background:var(--sunken)}
.nav-item.on{color:var(--ink);font-weight:600}
.nav-item.on::before{content:"";position:absolute;left:-8px;top:50%;translate:0 -50%;width:3px;height:16px;border-radius:2px;background:var(--accent)}
.nav-item.on .ic{color:var(--accent)}
.nav-item .n{margin-left:auto;font:400 11.5px/1 var(--body);color:var(--muted)}
.side-foot{margin-top:auto;display:flex;align-items:center;gap:8px;padding:0 10px;font-size:11.5px;color:var(--muted)}
.dot-s{width:6px;height:6px;border-radius:50%;background:var(--ok);flex:none}
.dot-s.saving{background:var(--line-strong)}
.dot-s.error{background:var(--danger)}

.main{padding-block:48px 96px;padding-inline:var(--gutter);min-width:0}
.page{max-width:720px;margin-inline:auto;display:flex;flex-direction:column;gap:32px;animation:rise .24s var(--ease)}
.page.wide,.page.home{max-width:1160px}
.page-body{display:flex;flex-direction:column;gap:32px;min-width:0}
@keyframes rise{from{opacity:0;transform:translateY(6px)}}
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ph h1{font:400 clamp(32px,3.4vw,46px)/1.04 var(--display);letter-spacing:-.015em;text-wrap:balance}
.ph p{color:var(--muted);margin-top:8px;max-width:56ch}
.ph-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* em telas largas, as páginas de texto ganham uma coluna de margem com o título fixo */
@media (min-width:1480px){
  .page.cols{display:grid;grid-template-columns:280px minmax(0,720px);column-gap:56px;max-width:1056px;align-items:start}
  .page.cols>.ph{position:sticky;top:48px;flex-direction:column;align-items:flex-start;gap:16px}
  .page.cols>.ph h1{font-size:40px}
}

.topbar,.tabbar{display:none}
@media (max-width:860px){
  .app{display:block}
  .side{display:none}
  .topbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;position:sticky;top:0;z-index:20;padding:calc(8px + env(safe-area-inset-top,0px)) 16px 10px;background:var(--bar);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
  .app[data-tab="inicio"] .topbar{display:none}
  .tb-pic{width:36px;height:36px;flex:none}
  .tb-pic .cover-art::after{content:none}
  .tb-pic>img{object-position:50% 50%}
  .tb-trip{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
  .tb-trip b{font:500 18px/1.1 var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .tb-trip span{font-size:12px;color:var(--muted);white-space:nowrap}
  .subnav{display:flex;gap:6px;overflow-x:auto;flex-basis:calc(100% + 32px);margin-inline:-16px;padding:2px 16px;scrollbar-width:none}
  .subnav::-webkit-scrollbar{display:none}
  .tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--bar);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px))}
  .tab{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border-radius:10px;font:600 10.5px/1.2 var(--body);color:var(--muted)}
  .tab.on{color:var(--ink)}
  .tab.on .ic{color:var(--accent)}
  .main{padding:24px 16px 110px}
  .page,.page-body{gap:26px}
  input,select,textarea{font-size:16px!important}
}

/* ---------- controles ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:999px;background:var(--ink);color:var(--bg);font:600 14px/1.2 var(--body);white-space:nowrap;transition:transform .1s,opacity .15s}
.btn:hover{opacity:.9}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.45;cursor:default}
.btn .ic{width:16px;height:16px}
.btn.accent{background:var(--accent);color:var(--on-accent)}
.btn.soft{background:var(--sunken);color:var(--ink)}
.btn.danger{background:none;color:var(--danger);box-shadow:inset 0 0 0 1px currentColor}
.btn.lg{min-height:48px;padding:0 24px;font-size:15.5px}
.btn.sm{padding:7px 13px;font-size:13px}
.btn-text{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);font:600 13px/1.2 var(--body);padding:6px 2px;border-radius:6px;text-underline-offset:4px}
.btn-text:hover{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px}
.btn-text .ic{width:15px;height:15px}
.icon-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--muted);flex:none;transition:background .12s,color .12s}
.icon-btn:hover{background:var(--sunken);color:var(--ink)}
.icon-btn .ic{width:18px;height:18px}
.icon-btn.sm{width:28px;height:28px}
.icon-btn.sm .ic{width:15px;height:15px}
.pill{padding:7px 12px;border-radius:999px;font:500 13px/1.2 var(--body);color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line-strong);white-space:nowrap;flex:none;transition:box-shadow .12s}
.pill:hover{box-shadow:inset 0 0 0 1px var(--ctl)}
.pill.on{background:var(--ink);color:var(--bg);box-shadow:none}
.in,.sel{width:100%;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-field);padding:11px 12px;outline:none;transition:border-color .12s,box-shadow .12s;min-width:0;color:var(--ink)}
.in:focus,.sel:focus{border-color:var(--ink);box-shadow:0 0 0 3px var(--accent-soft)}
.in::placeholder{color:var(--muted)}
.sel{appearance:none;-webkit-appearance:none;padding-right:32px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 17px) 55%,calc(100% - 12px) 55%;background-size:5px 5px;background-repeat:no-repeat}
.sel.sm{width:auto;padding:7px 30px 7px 12px;font-size:13px;border-radius:999px;background-color:transparent}
textarea.in{resize:vertical;min-height:70px}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld>span{font:500 12.5px/1.2 var(--body);color:var(--ink-2)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form{display:flex;flex-direction:column;gap:14px}
.sw{display:flex;align-items:center;gap:10px;font-weight:500}
.hint{font-size:13px;color:var(--muted)}
.seg{display:inline-flex;padding:3px;border-radius:999px;background:var(--sunken)}
.seg button{padding:5px 12px;border-radius:999px;font:500 12.5px/1.2 var(--body);color:var(--muted)}
.seg button.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.code{font:500 11.5px/1 var(--code);padding:3px 6px;border-radius:4px;background:var(--sunken);color:var(--ink-2);letter-spacing:.04em}

.check{position:relative;inline-size:22px;block-size:22px;flex:none;border-radius:50%;border:1.5px solid var(--ctl);display:grid;place-items:center;color:var(--on-accent);transition:transform .32s var(--ease-spring),background-color .15s,border-color .15s}
.check::after{content:"";position:absolute;inset:-9px}
.check .ic{width:13px;height:13px;stroke-width:2.6}
.check .ic path{stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .26s var(--ease) .06s}
.check.on .ic path{stroke-dashoffset:0}
.check:hover{border-color:var(--accent)}
.check.on{background:var(--accent);border-color:var(--accent)}
.check:active{transform:scale(.88)}
.bar{height:3px;border-radius:2px;background:var(--line);overflow:hidden}
.bar>i{display:block;height:100%;border-radius:2px;background:var(--accent);transition:width .35s cubic-bezier(.2,.8,.2,1)}
.bar.over>i{background:var(--danger)}

/* ---------- listas: papel, sem caixa ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card)}
.empty{padding:28px 20px;text-align:center;color:var(--muted);font-size:14px;border:1px dashed var(--line-strong);border-radius:var(--r-card)}
.items .empty{border:0;padding:22px 0}
.progress{display:flex;flex-direction:column;gap:8px}
.progress span{font-size:12.5px;color:var(--muted)}
.groups{display:flex;flex-direction:column;gap:36px}
.group{display:flex;flex-direction:column}
.group-h{display:flex;align-items:baseline;gap:10px;padding-bottom:10px;min-height:28px}
.group-h .etext,.mod h2,.closet-h h2{font:500 21px/1.2 var(--display);letter-spacing:-.01em}
.group-h .count{font-size:12.5px;color:var(--muted)}
.group-h .count.all-done{color:var(--accent-strong)}
.group-h .icon-btn{opacity:0;align-self:center;margin-left:auto}
.group-h:hover .icon-btn,.group-h:focus-within .icon-btn{opacity:1}
.items{border-top:1px solid var(--rule)}
.item{display:flex;align-items:center;gap:12px;padding:13px 0;min-height:50px;font-size:15.5px}
.item+.item,.item+.add-row,.add-row+.item{border-top:1px solid var(--line)}
.item .grow{flex:1;min-width:0}
.item .etext{transition:color .25s,text-decoration-color .25s;text-decoration:line-through 1px transparent}
.item.done .etext{color:var(--muted);text-decoration-color:var(--line-strong)}
.item .del{opacity:0}
.item:hover .del,.item:focus-within .del{opacity:1}
@media (hover:none){.item .del,.group-h .icon-btn{opacity:.8}}
.etext{display:block;cursor:text;overflow-wrap:anywhere;border-radius:6px}
.etext.empty{color:var(--muted);border:0;padding:0;text-align:left}
.etext-in{width:100%;border:0;outline:0;background:var(--sunken);border-radius:6px;padding:2px 6px;margin:-2px -6px}
.add-row{display:flex;align-items:center;gap:12px;padding:11px 0;color:var(--muted)}
.add-row .ic{width:22px;height:22px;padding:3px;flex:none}
.add-row input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:4px 0;color:var(--ink)}
.add-row input::placeholder{color:var(--muted)}
.add-row .mini{flex:0 0 92px;text-align:right}
.add-row select{border:0;background:transparent;font:600 12.5px var(--body);color:var(--muted);border-radius:6px}
.price-in{flex:0 0 96px;width:96px;border:0;outline:0;background:transparent;text-align:right;font:500 13.5px var(--body);padding:4px 6px;border-radius:6px}
.price-in:focus{background:var(--sunken)}
.price-in::placeholder{color:var(--ctl);font-weight:400}
.totals{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--rule);padding-top:12px;color:var(--muted);font:500 14px/1.4 var(--body)}
.totals b{color:var(--ink);font-weight:600}
.totals.plain{border-top:0;padding-top:0;font-weight:400;font-size:13px}

/* ---------- início ---------- */
.cover{position:relative;color:#fff;margin-inline:calc(-1*var(--gutter));margin-top:-48px;height:clamp(380px,58vh,600px);background:#001F28}
.cover::before{content:"";position:absolute;inset:0 0 auto;height:120px;z-index:1;background:linear-gradient(to bottom,rgba(4,15,19,.46),transparent);pointer-events:none}
.cover.is-loading::before{animation:none}
.cover-ctl{position:absolute;right:var(--gutter);top:20px;display:flex;gap:8px;z-index:3}
.cover-cap .inner{max-width:1160px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;row-gap:12px;align-items:end}
.cover-cap .inner>.lbl,.cover-cap .inner>.cover-title,.cover-row .cover-meta{grid-column:1}
.cover-row{display:contents}
.cover-row .cover-count{grid-column:2;grid-row:1/span 3;align-self:end}
.cover-count{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.cover-count .num{font:italic 300 clamp(56px,8vw,128px)/.8 var(--display);letter-spacing:-.03em;padding-top:.12em}
.cover-count .num.word{font-size:clamp(34px,4.4vw,64px);line-height:1}
.cover-count .unit{font-size:14px;color:var(--on-photo-2)}
.home-top{display:flex;flex-direction:column;gap:12px}
.note-ex{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:10px;background:var(--accent-soft);color:var(--accent-strong);font-size:14px;font-weight:500}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 32px;padding:8px 0 20px;border-bottom:1px solid var(--line)}
.facts div{display:flex;flex-direction:column;gap:7px}
.facts b{font:500 15px/1.2 var(--body);font-variant-numeric:lining-nums}
.home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 56px}
.mod{border-top:1px solid var(--rule);padding-top:14px;display:flex;flex-direction:column;gap:14px;min-width:0}
.mod-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.prow{display:grid;grid-template-columns:120px minmax(0,1fr) 44px;align-items:center;gap:12px;padding:7px 0;width:100%;font-size:14.5px;color:var(--ink-2)}
.prow:hover{color:var(--ink)}
.prow .n{text-align:right;font-size:12.5px;color:var(--muted)}
.mini-list{display:flex;flex-direction:column}
.mini-item{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line-soft);font-size:15px}
.mini-item:first-child{border-top:0;padding-top:2px}
.mini-item .t{font:500 13px/1.75 var(--body);color:var(--muted);flex:0 0 52px}
.figure{font:400 clamp(26px,2.6vw,38px)/1.05 var(--display);font-variant-numeric:lining-nums;letter-spacing:-.01em}
.figure small{display:block;font:400 13px/1.5 var(--body);letter-spacing:0;color:var(--muted);margin-top:8px}
.quick,.capture{display:flex;gap:12px;align-items:flex-end}
.quick input,.capture input{flex:1;min-width:0;border:0;border-bottom:1px solid var(--line-strong);border-radius:0;background:none;padding:10px 0;outline:0;color:var(--ink)}
.quick input:focus,.capture input:focus{border-bottom-color:var(--accent);box-shadow:0 1px 0 var(--accent)}
.capture input{font:400 20px/1.3 var(--display);border-bottom-color:var(--rule)}
.capture input::placeholder,.quick input::placeholder{color:var(--muted)}
.capture input::placeholder{font-style:italic;font-weight:300}
@media (max-width:860px){
  .cover{margin:-24px -16px 0;height:min(56vh,440px);height:min(56svh,440px);min-height:360px}
  .cover>img{object-position:50% 50%}
  .cover-ctl{top:calc(12px + env(safe-area-inset-top,0px));right:16px}
  .cover-cap{padding:96px 16px 20px;background:linear-gradient(to top,rgba(4,15,19,.88) 0,rgba(4,15,19,.72) calc(100% - 96px),transparent 100%)}
  .cover-cap .inner{display:flex;flex-direction:column;align-items:stretch;gap:10px}
  .cover-title{font-size:40px}
  .cover-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
  .cover-count{flex-direction:row;align-items:baseline;gap:6px}
  .cover-count .lbl{display:none}
  .cover-count .num{font-size:44px}
  .cover-count .num.word{font-size:26px}
  .cover-count .unit{font-size:13px}
  .facts{grid-template-columns:1fr 1fr}
  .home-grid{grid-template-columns:1fr;gap:36px}
  .capture input{font-size:18px!important}
}

/* ---------- itinerário ---------- */
.tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.tl li{position:relative;padding:0 0 40px 30px}
.tl li::before{content:"";position:absolute;left:4px;top:14px;bottom:-10px;border-left:1px solid var(--line-strong)}
.tl li:last-child{padding-bottom:0}
.tl li:last-child::before{display:none}
.tl .node{position:absolute;left:0;top:10px;width:9px;height:9px;border-radius:50%;background:var(--ink)}
.tl .end .node{background:var(--line-strong);top:3px}
.tl .end{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.tl .end .mono{font-size:12.5px;color:var(--muted)}
.move{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-2);margin-bottom:14px;padding-top:4px}
.move .ic{width:16px;height:16px;color:var(--accent)}
.leg{display:grid;grid-template-columns:232px minmax(0,1fr);gap:24px;width:100%;align-items:start}
.leg .pic{aspect-ratio:3/2;--art-fs:170px}
.leg .pic>img{transition:opacity .5s var(--ease),transform .6s ease-out}
.leg:hover .pic>img.cur,.leg:focus-visible .pic>img.cur{transform:scale(1.03)}
.leg-txt{display:flex;flex-direction:column;gap:9px;min-width:0;padding-top:2px}
.leg h3{font:500 30px/1.05 var(--display);letter-spacing:-.015em;text-underline-offset:4px}
.leg:hover h3{text-decoration:underline;text-decoration-thickness:1px}
.leg .when{font-size:13.5px;color:var(--muted)}
.leg .stay{display:flex;gap:8px;font-size:14px;color:var(--ink-2)}
.leg .stay .ic{width:16px;height:16px;margin-top:3px;color:var(--muted)}
.leg .stay small{display:block;color:var(--muted);font-size:13px}
.empty-art{aspect-ratio:16/6;border-radius:var(--r-photo)}
.empty-art .cover-art::after{content:none}
.foot-credit{font-size:11.5px;color:var(--muted)}
.foot-credit button{text-decoration:underline;text-underline-offset:3px}
@media (max-width:860px){
  .tl li{padding-left:22px}
  .leg{grid-template-columns:1fr;gap:12px}
  .leg .pic{aspect-ratio:16/9}
  .leg h3{font-size:26px}
}

/* ---------- roteiro ---------- */
.strip{display:flex;gap:6px;overflow-x:auto;padding:2px 1px 4px;scrollbar-width:none}
.strip::-webkit-scrollbar{display:none}
.daychip{flex:none;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:48px;padding:7px 8px;border-radius:10px;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-2);transition:transform .1s}
.daychip b{font:500 18px/1.1 var(--display);font-variant-numeric:lining-nums}
.daychip span{font:600 10.5px/1.2 var(--body);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.daychip:hover{box-shadow:inset 0 0 0 1px var(--line-strong)}
.daychip.today{box-shadow:inset 0 0 0 1.5px var(--accent)}
.daychip:active{transform:scale(.96)}
.chapter{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.chapter .pic{aspect-ratio:4/1;max-height:200px;--art-fs:220px}
.chapter-cap{display:flex;flex-direction:column;gap:8px}
.chapter-cap b{font:500 28px/1.05 var(--display);letter-spacing:-.015em}
.day{display:flex;flex-direction:column;gap:10px;scroll-margin-top:120px}
.day-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.day-h h2{font:500 21px/1.2 var(--display);letter-spacing:-.01em;display:inline-block}
.day-h h2::first-letter,.look-h b::first-letter{text-transform:uppercase}
.day-h .city{color:var(--muted);font-size:13.5px;margin-left:auto}
.act .time{flex:0 0 52px;font:500 13px/1.4 var(--body);color:var(--ink-2);padding:3px 0;border-radius:6px}
.act .time.none{color:var(--ctl)}
.act small{display:block;color:var(--muted);font-size:13px;overflow-wrap:anywhere}
@media (max-width:860px){.chapter .pic{aspect-ratio:5/2}.chapter-cap b{font-size:24px}}

/* ---------- dicas ---------- */
.tip-list{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.tip{display:flex;flex-direction:column;gap:12px;padding:16px 0;font-size:16px;line-height:1.5}
.tip+.tip{border-top:1px solid var(--line)}
.tip-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.opt{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:var(--r-field);box-shadow:inset 0 0 0 1px var(--line-strong);width:100%;font-weight:500;font-size:14px}
.opt .ic{width:18px;height:18px;color:var(--muted)}
.opt.on{box-shadow:inset 0 0 0 1.5px var(--ink)}
.opt.on .ic{color:var(--accent)}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}

/* ---------- gastos ---------- */
.sum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.sum>div{padding:18px 24px 18px 0;display:flex;flex-direction:column;gap:10px;min-width:0}
.sum>div+div{border-left:1px solid var(--line);padding-left:24px}
.sum .figure{overflow-wrap:anywhere}
.budget{padding:14px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px;font-size:12.5px;color:var(--muted)}
.budget div:first-child{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.split{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
.split>div{display:flex;flex-direction:column;gap:14px;min-width:0}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.bd{border-top:1px solid var(--rule);padding:14px 0;display:flex;flex-direction:column;gap:12px}
.bd-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.bd-row{display:flex;flex-direction:column;gap:6px;width:100%;padding:7px 8px;margin-inline:-8px;border-radius:8px;font-size:13.5px}
.bd-row:hover,.bd-row.on{background:var(--sunken)}
.bd-row span{display:flex;justify-content:space-between;gap:10px}
.bd-row em{font:500 12.5px var(--body);font-style:normal;color:var(--ink-2);white-space:nowrap}
.xhead,.xrow{display:grid;grid-template-columns:64px minmax(0,1.5fr) minmax(0,1fr) minmax(0,.8fr) minmax(104px,auto) 26px;gap:14px;align-items:center}
.xhead{padding:10px 0;border-bottom:1px solid var(--rule)}
.xrow{padding:13px 10px;margin-inline:-10px;border-radius:8px;cursor:pointer;position:relative}
.xrow+.xrow::before{content:"";position:absolute;left:10px;right:10px;top:0;border-top:1px solid var(--line)}
.xrow:hover{background:var(--sunken)}
.x-date{font-size:12.5px;color:var(--muted)}
.x-desc{font-weight:500;min-width:0;overflow-wrap:anywhere}
.x-meta{display:none;font-weight:400;font-size:12.5px;color:var(--muted)}
.x-cat,.x-city{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.x-amt{text-align:right;font:500 13.5px/1.35 var(--body)}
.x-amt small{display:block;font-size:11.5px;font-weight:400;color:var(--muted)}
.r{text-align:right}
@media (max-width:980px){.split{grid-template-columns:1fr;gap:32px}}
@media (max-width:640px){
  .item{gap:10px;font-size:16px;padding:12px 0}
  .price-in{flex-basis:78px;width:78px}
  .item .del{width:24px;height:24px}
  .sum{grid-template-columns:1fr 1fr}
  .sum>div{padding:16px 0}
  .sum>div:first-child{grid-column:1/-1;border-bottom:1px solid var(--line)}
  .sum>div:first-child .figure{font-size:34px}
  .sum>div:nth-child(2){border-left:0;padding-left:0}
  .sum>div:nth-child(3){padding-left:16px}
  .xhead{display:none}
  .xrow{grid-template-columns:minmax(0,1fr) auto 26px;gap:12px}
  .xrow:first-of-type::before,.xhead+.xrow::before{content:"";position:absolute;left:10px;right:10px;top:0;border-top:1px solid var(--rule)}
  .x-date,.x-cat,.x-city{display:none}
  .x-meta{display:block}
}

/* ---------- desejos ---------- */
.wish-main{display:flex;flex-direction:column;gap:1px}
.wish-main small{color:var(--muted);font-size:13px}
.wish-price{font:500 13.5px var(--body);white-space:nowrap}

/* ---------- looks: única tela com cartões (são alvos de arrastar) ---------- */
.looks{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;align-items:start}
.daylooks{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.look{padding:14px;display:flex;flex-direction:column;gap:10px;transition:border-color .15s,box-shadow .15s;cursor:pointer;text-align:left}
.look.sel{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.look.over{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.look-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.look-h b{font:500 17px/1.2 var(--display);display:inline-block}
.look-h span{font-size:12.5px;color:var(--muted)}
.pieces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.piece{position:relative;aspect-ratio:1;border-radius:8px;background:var(--tile);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;display:block;width:100%}
.piece img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.piece.svg img{object-fit:contain;padding:9%}
.piece .rm{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;background:var(--glass-solid);color:#fff;display:grid;place-items:center;opacity:0;transition:opacity .12s}
.piece .rm .ic{width:12px;height:12px;stroke-width:2.4}
.piece:hover .rm,.piece .rm:focus-visible{opacity:1}
@media (hover:none){.piece .rm{opacity:.85}}
.piece.add{display:grid;place-items:center;background:none;box-shadow:none;border:1.5px dashed var(--line-strong);color:var(--muted)}
.piece.add:hover{color:var(--ink);border-color:var(--ctl)}
.look-note{border:0;outline:0;background:transparent;width:100%;font-size:13px;color:var(--ink-2);padding:2px 0}
.look-note::placeholder{color:var(--ctl)}
.closet{position:sticky;top:24px;padding:16px;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 48px);overflow:auto}
.closet-h{display:flex;flex-direction:column;gap:4px}
.closet-h p{font-size:12.5px;color:var(--muted)}
.closet-actions{display:flex;gap:8px;flex-wrap:wrap}
.cats{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding:1px 16px}
.cats::-webkit-scrollbar{display:none}
.cats .pill{padding:5px 10px;font-size:12.5px}
.cgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 8px}
@media (hover:hover) and (min-width:901px){.cats{flex-wrap:wrap;overflow:visible;margin-inline:0;padding-inline:0}.strip{flex-wrap:wrap;overflow:visible}}
.cpiece{display:flex;flex-direction:column;gap:5px;min-width:0}
.cpiece .piece.picked{box-shadow:inset 0 0 0 2px var(--accent)}
.cpiece .badge{position:absolute;top:4px;left:4px;width:20px;height:20px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center}
.cpiece .badge .ic{width:11px;height:11px;stroke-width:3}
.cpiece .nm{font-size:11.5px;line-height:1.25;color:var(--muted);text-align:left;overflow-wrap:anywhere;border-radius:4px}
.cpiece .nm:hover{color:var(--ink)}
.draw{aspect-ratio:1;width:min(200px,100%);margin-inline:auto;border-radius:12px;background:var(--tile);box-shadow:inset 0 0 0 1px var(--line);position:relative;overflow:hidden}
.draw img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:9%}
.types{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.type{display:flex;flex-direction:column;gap:4px;align-items:center;font-size:11.5px;color:var(--muted);text-align:center;min-width:0}
.type .piece{border-radius:8px}
.type.on .piece{box-shadow:inset 0 0 0 2px var(--accent)}
.type.on{color:var(--ink)}
.swatches{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.swatch{width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--edge);position:relative}
.swatch.on,.swatch:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.swatch input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.swatch.custom{background:conic-gradient(#e44,#ee4,#4c4,#4cc,#44e,#e4e,#e44)}
@media (max-width:900px){
  .looks{grid-template-columns:1fr}
  .pieces{grid-template-columns:repeat(4,minmax(0,1fr))}
  .closet{position:static;max-height:none}
  .cgrid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
}

/* ---------- folhas, avisos ---------- */
.overlay{position:fixed;inset:0;background:var(--scrim);display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:16px;z-index:50;animation:fd .15s ease-out}
.sheet{background:var(--surface);border-radius:var(--r-sheet);width:min(480px,100%);max-height:min(88vh,780px);display:flex;flex-direction:column;box-shadow:var(--shadow-lg);animation:pop .2s cubic-bezier(.2,.9,.3,1)}
.sheet.wide{width:min(560px,100%)}
.sheet-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:20px 16px 8px 24px}
.sheet-h h3{font:500 24px/1.15 var(--display);letter-spacing:-.01em}
.sheet-b{padding:8px 24px 24px;overflow:auto;min-width:0;display:flex;flex-direction:column;gap:14px}
.closet>*,.sheet-b>*{flex-shrink:0}
.sheet-f{display:flex;gap:8px;justify-content:space-between;align-items:center;flex-wrap:wrap;margin-top:6px}
.sheet-f .end{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
@keyframes fd{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.985)}}
@media (max-width:600px){
  .overlay{place-items:end stretch;padding:0}
  .sheet,.sheet.wide{width:100%;border-radius:20px 20px 0 0;max-height:90vh;padding-bottom:env(safe-area-inset-bottom,0px)}
  .sheet-h{padding-left:20px}
  .sheet-b{padding-inline:20px}
  @keyframes pop{from{transform:translateY(40px);opacity:.4}}
}
.toast{position:fixed;left:16px;right:16px;margin-inline:auto;width:fit-content;bottom:28px;z-index:60;display:flex;align-items:center;gap:14px;padding:10px 18px;border-radius:999px;background:var(--ink);color:var(--bg);font-size:14px;font-weight:500;box-shadow:var(--shadow-lg);animation:pop .2s}
.toast button{color:var(--accent-soft);font-weight:700;white-space:nowrap}
@media (max-width:860px){.toast{bottom:calc(84px + env(safe-area-inset-bottom,0px));border-radius:16px}}
.rates{display:flex;flex-direction:column;gap:8px}
.rate{display:grid;grid-template-columns:52px minmax(0,1fr) 28px;gap:10px;align-items:center;font-size:14px}
.rate .in{padding:7px 10px;font-size:13.5px}
.rate span{color:var(--muted);font-size:13px}
.hr{height:1px;background:var(--line);margin-block:6px}
.photo-block{display:flex;flex-direction:column;gap:10px}
.photo-strip{aspect-ratio:16/6;border-radius:10px;--art-fs:160px}
.photo-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.photo-search{display:flex;gap:8px}
.city-row{display:grid;grid-template-columns:minmax(0,1fr) 64px;gap:12px;align-items:end}
.city-row .pic{width:64px;height:64px}
.city-row .cover-art::after{content:none}
.credits{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.credits a{overflow-wrap:anywhere}
.spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--accent-soft);border-top-color:var(--accent);animation:sp .7s linear infinite;flex:none}
@keyframes sp{to{transform:rotate(360deg)}}

/* ---------- boas-vindas: a pergunta é o campo ---------- */
.onb{display:grid;grid-template-columns:minmax(440px,36vw) minmax(0,1fr);min-height:100vh;min-height:100dvh}
.onb-form{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:28px;padding:40px clamp(32px,4.5vw,72px);background:var(--bg)}
.onb-form .inner{margin-block:auto;width:100%;max-width:420px;display:flex;flex-direction:column;gap:26px}
.onb-cover{grid-column:2;grid-row:1;position:sticky;top:0;height:100vh;height:100dvh;color:#fff}
.onb-cover>img{object-position:50% 50%}
.onb-cover .cover-cap{display:flex;flex-direction:column;gap:12px}
.onb-cover .cover-cap .credit{color:var(--on-photo-2);text-align:left;margin-top:6px}
.onb-empty{position:absolute;inset:0;display:grid;place-items:center;z-index:2;font:italic 300 20px/1.3 var(--display);color:rgb(255 255 255/.86);text-align:center;padding:24px}
.onb-cover .glass-chip{display:none}
.onb-dest{width:100%;font:400 clamp(38px,3.6vw,56px)/1.05 var(--display);letter-spacing:-.02em;background:none;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:0 0 10px;outline:0;color:var(--ink)}
.onb-dest.long{font-size:clamp(30px,2.8vw,40px)}
.onb-dest::placeholder{font-style:italic;font-weight:300;color:var(--muted)}
.onb-dest:focus{border-bottom:2px solid var(--accent);padding-bottom:9px}
.onb-head{display:flex;flex-direction:column;gap:12px}
.onb-credit{display:none;text-align:left}
.onb-help{font-size:13px;color:var(--muted);min-height:20px;display:flex;align-items:center;gap:8px}
.onb-chips{display:flex;gap:6px;flex-wrap:wrap}
.onb .btn.lg{width:100%}
.onb-form>.btn-text{align-self:flex-start}
@media (max-width:860px){
  .onb{display:block}
  .onb-cover{position:relative;height:clamp(220px,34vh,280px);height:clamp(220px,34svh,280px)}
  .onb-cover .cover-cap{display:none}
  .onb-cover .glass-chip{display:inline-flex;position:absolute;z-index:3;left:16px;top:calc(12px + env(safe-area-inset-top,0px))}
  .onb-empty{font-size:17px}
  .onb-credit{display:block}
  .onb-form{padding:22px 20px 32px;gap:22px}
  .onb-form>.brand,.onb-head>.lbl{display:none}
  .onb-form .inner{gap:20px;max-width:none}
  .onb-dest{font-size:36px!important}
  .onb-dest.long{font-size:30px!important}
  .onb-form>.btn-text{align-self:center}
}
.boot{min-height:100vh;display:grid;place-items:center;color:var(--muted);padding:24px;text-align:center}
.boot div{display:flex;flex-direction:column;align-items:center;gap:14px;font:italic 300 20px/1.3 var(--display)}
.boot .crash{color:var(--ink);max-width:340px}
.boot .hint{font:400 13px/1.5 var(--body)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .pic>img{transform:none;transition:opacity .2s!important}
  :root{transition:none}
}