/* Dichoi.de — one stylesheet, no build step (same approach as di.cafe, dichoi.fit and 0to1.live). Mobile first.
   Order: reset · tokens · shell · components · pages · admin · utilities (last, so they win). */

/* ---------------------------------------------------------------- reset */
*,::before,::after{box-sizing:border-box;margin:0;padding:0;border:0 solid}
html{line-height:1.5;-webkit-text-size-adjust:100%;height:100%}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure{margin:0}
h1,h2,h3,h4{font-size:inherit}
ol,ul{list-style:none}
a{color:inherit;text-decoration:inherit}
img,svg,video{display:block;vertical-align:middle;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit;background:transparent;letter-spacing:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.6}
fieldset{min-width:0}
table{border-collapse:collapse}
summary{cursor:pointer}
[hidden]{display:none!important}
input::placeholder,textarea::placeholder{color:var(--faint);opacity:1}

/* Nunito (SIL Open Font License, public/fonts/OFL.txt), self-hosted, with the Vietnamese subset: no third-party font request */
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/fonts/nunito-vietnamese-wght-normal.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/fonts/nunito-latin-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/fonts/nunito-latin-wght-normal.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------------------------------------------------------------- tokens */
:root{
  --ink:#17302e;--body:#2b3d3b;--muted:#55615f;--faint:#8a9492;
  --sand:#f7f3ec;--paper:#fffdf9;--line:#e7dfd2;--line-soft:#efe9df;
  --sea:#0e6b63;--sea-dark:#0a524c;--sea-tint:#d6ece6;--sea-50:#edf6f3;
  --sun:#ffb627;--sun-hover:#ffc757;--sun-tint:#fff1d1;--sun-ink:#7a4d00;
  --coral:#d4472c;--coral-tint:#fde4dd;--ok:#1d7a4f;--ok-tint:#dcf2e5;
  --shadow:0 1px 2px rgb(23 48 46 / .06),0 6px 18px rgb(23 48 46 / .06);--shadow-lift:0 10px 30px rgb(23 48 46 / .12);
  --r:1.1rem;--font:"Nunito",ui-rounded,ui-sans-serif,system-ui,sans-serif;--tabbar:64px;
}
body{display:flex;flex-direction:column;min-height:100%;background:var(--sand);color:var(--ink);font-family:var(--font);font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-bottom:calc(var(--tabbar) + env(safe-area-inset-bottom))}
h1{font-weight:900}h2{font-weight:800}h3,h4{font-weight:800}
:focus-visible{outline:3px solid var(--sea);outline-offset:2px;border-radius:6px}
.hero :focus-visible,.trip-hero :focus-visible,.go-head :focus-visible{outline-color:var(--sun)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
.skip{position:absolute;left:-9999px}
.skip:focus{position:fixed;left:16px;top:16px;z-index:60;border-radius:999px;background:#fff;padding:12px 20px;font-weight:800}

/* ---------------------------------------------------------------- shell */
.wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:1rem}
@media (min-width:640px){.wrap{padding-inline:1.5rem}}
.narrow{max-width:680px}.narrow-wide{max-width:900px}
main{flex:1}
.top{position:sticky;top:0;z-index:40;background:rgb(255 253 249 / .94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:12px;min-height:58px}
.logo{display:inline-flex;align-items:center;font-size:23px;font-weight:900;letter-spacing:-.02em;color:var(--ink);min-height:44px}
.logo>span:not(.logo-sun):not(.admin-tag){color:var(--coral)}
.logo-sun{margin-right:6px;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 50% 50%,var(--sun) 0 45%,transparent 47%),conic-gradient(from 0deg,var(--sun) 0 8%,transparent 8% 17%,var(--sun) 17% 25%,transparent 25% 33%,var(--sun) 33% 42%,transparent 42% 50%,var(--sun) 50% 58%,transparent 58% 67%,var(--sun) 67% 75%,transparent 75% 83%,var(--sun) 83% 92%,transparent 92%);flex:none}
.top-links{display:none;gap:22px;margin-left:18px;font-weight:800;color:var(--muted)}
.top-links a{padding-block:18px;border-bottom:3px solid transparent}
.top-links a:hover{color:var(--ink)}
.top-links a[aria-current="page"]{color:var(--ink);border-color:var(--sea)}
.btn.top-create{display:none}
.lang{display:inline-flex;margin-left:auto;border:1.5px solid var(--line);border-radius:999px;padding:2px;font-size:13px;font-weight:900}
.lang button{min-width:36px;min-height:32px;border-radius:999px;color:var(--muted)}
.lang button[aria-pressed="true"]{background:var(--ink);color:#fff}
.top-me{display:inline-flex;align-items:center;gap:8px;font-weight:800;min-height:44px}
.top-me[aria-current="page"] .avatar{box-shadow:0 0 0 2px var(--sea)}
@media (min-width:860px){.top-links{display:flex}.btn.top-create{display:inline-flex;margin-left:auto}.lang{margin-left:0}}
.tabbar{position:fixed;inset:auto 0 0 0;z-index:45;display:grid;grid-template-columns:repeat(4,1fr);height:calc(var(--tabbar) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -4px 18px rgb(23 48 46 / .06)}
.tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:12px;font-weight:800;color:var(--muted)}
.tabbar a[aria-current="page"]{color:var(--sea)}
.tabbar .tab-create .ic{width:40px;height:40px;padding:8px;border-radius:14px;background:var(--sun);color:var(--ink)}
.tabbar .tab-create span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media (min-width:860px){.tabbar{display:none}body{padding-bottom:0}}
body.bare .tabbar{display:none}body.bare{padding-bottom:0}
.foot{margin-top:72px;background:var(--ink);color:#cfe2de}
.foot-in{display:grid;gap:18px;padding-block:36px;font-size:15px}
@media (min-width:860px){.foot-in{grid-template-columns:1fr auto;align-items:center}}
.foot-logo{font-size:22px;font-weight:900;color:#fff}.foot-logo span{color:var(--sun)}
.foot-tag{font-weight:800;color:var(--sun)}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 20px}.foot-links a{font-weight:800;color:#fff}.foot-links a:hover{text-decoration:underline}
.flash{margin-top:16px;border-radius:14px;background:var(--ok-tint);color:#0c4a2f;padding:12px 16px;font-weight:700}
.flash-err{background:var(--coral-tint);color:#8a2412}

/* ---------------------------------------------------------------- type */
.h-display{font-size:clamp(32px,7vw,58px);line-height:1.04;letter-spacing:-.03em;font-weight:900}
.h-hero{font-size:clamp(28px,6vw,48px);line-height:1.08;letter-spacing:-.02em;font-weight:900}
.h-1{font-size:clamp(26px,5vw,36px);line-height:1.15;letter-spacing:-.02em}
.h-30{font-size:28px;line-height:1.2}
.h-2{font-size:21px;line-height:1.3}
.h-day{font-size:18px;line-height:1.3}
.h-side{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:800}
.lead{font-size:17px;line-height:1.55;color:var(--body)}
.small{font-size:14px}.muted{color:var(--muted)}.b{font-weight:800}
.eyebrow{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:var(--sea)}
.pre{white-space:pre-line}
.link{color:var(--sea);font-weight:800;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;display:inline-flex;align-items:center;gap:4px}
.link:hover{color:var(--sea-dark)}
.link-plain:hover{text-decoration:underline}
.big-n{font-size:28px;font-weight:900;margin-top:6px}
.ic{flex:none}
.req{color:var(--coral)}
.prose h2{font-size:20px;margin-top:28px}.prose p,.prose ul{margin-top:12px;line-height:1.65;color:var(--body)}.prose ul{list-style:disc;padding-left:22px}.prose ol{list-style:decimal;padding-left:22px;margin-top:12px;line-height:1.65}.prose li{margin-top:6px}

/* ---------------------------------------------------------------- buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:46px;padding:0 1.25rem;border-radius:999px;font-weight:800;font-size:16px;text-align:center;transition:background-color 120ms,color 120ms,box-shadow 120ms,border-color 120ms;line-height:1.25;padding-block:.35rem}
.btn-sm{min-height:38px;padding:0 .95rem;font-size:14px}
.btn-lg{min-height:52px;padding:0 1.6rem;font-size:17px}
.btn-xl{min-height:64px;font-size:20px}
.btn-sea{background:var(--sea);color:#fff}.btn-sea:hover{background:var(--sea-dark)}
.btn-sun{background:var(--sun);color:var(--ink)}.btn-sun:hover{background:var(--sun-hover)}
.btn-ghost{border:2px solid var(--line);background:var(--paper);color:var(--ink)}.btn-ghost:hover{border-color:var(--sea)}
.btn-ghost[aria-pressed="true"]{border-color:var(--coral);color:var(--coral)}
.btn-white{background:#fff;color:var(--ink)}.btn-white:hover{background:var(--sun-tint)}
.btn-white[aria-pressed="true"]{color:var(--coral)}
.btn-ghost-dark{border:2px solid rgb(255 255 255 / .6);color:#fff}.btn-ghost-dark:hover{border-color:#fff}
.btn-danger{background:var(--coral);color:#fff}.btn-danger:hover{background:#b33a22}
.btn-danger-ghost{border:2px solid var(--coral-tint);color:#b33a22;background:var(--paper)}.btn-danger-ghost:hover{border-color:var(--coral)}
.btn-link{min-height:auto;padding:0;border-radius:0;color:var(--sea);text-decoration:underline;font-weight:800}
.btn-icon{min-height:40px;width:40px;padding:0;border:2px solid var(--line);background:var(--paper)}.btn-icon:hover{border-color:var(--sea)}
.btn-icon.on{background:var(--ok);border-color:var(--ok);color:#fff}
.btn-google{border:2px solid var(--line);background:#fff;color:var(--ink)}.btn-google:hover{border-color:var(--ink)}
.btn-facebook{background:#1877f2;color:#fff}.btn-facebook:hover{background:#0f63d0}
.btn-tag{min-height:30px;padding:0 10px;font-size:12px;border-radius:999px;background:rgb(23 48 46 / .72);color:#fff}
.btn-tag.on{background:var(--sea)}
.inline-form{display:inline-flex}
.w-full{width:100%}

/* ---------------------------------------------------------------- forms */
.form{display:flex;flex-direction:column;gap:16px}
.field{display:flex;flex-direction:column;gap:6px;font-weight:800;font-size:15px}
.field legend{margin-bottom:8px;font-weight:800;font-size:15px}
.input{width:100%;min-height:46px;border:2px solid var(--line);border-radius:12px;background:#fff;padding:9px 12px;font-weight:600;font-size:16px;color:var(--ink)}
.input:focus{outline:none;border-color:var(--sea);box-shadow:0 0 0 3px var(--sea-tint)}
textarea.input{min-height:auto;resize:vertical;line-height:1.5}
.input-lg{min-height:54px;font-size:17px;border-radius:999px;padding-inline:20px}
.input-sm{min-height:38px;padding:4px 8px;font-size:14px}
.input-time{width:auto}
.input-pre{display:flex;align-items:center;border:2px solid var(--line);border-radius:12px;background:#fff;padding-left:12px;font-weight:600;color:var(--muted)}
.input-pre .input{border:0;padding-left:2px;min-height:42px}.input-pre:focus-within{border-color:var(--sea)}
.hint{font-weight:600;font-size:13px;color:var(--muted)}
.check{display:flex;align-items:flex-start;gap:10px;font-weight:700;font-size:15px;line-height:1.4}
.check input,.radio-card input{width:20px;height:20px;margin-top:1px;accent-color:var(--sea);flex:none}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.check-chip{position:relative}
.check-chip input{position:absolute;opacity:0;inset:0}
.check-chip span{display:inline-flex;min-height:40px;align-items:center;padding:0 14px;border:2px solid var(--line);border-radius:999px;background:#fff;font-weight:700;font-size:14px}
.check-chip input:checked+span{background:var(--sea);border-color:var(--sea);color:#fff}
.check-chip input:focus-visible+span{outline:3px solid var(--sea);outline-offset:2px}
.radios{display:grid;gap:10px}
.radio-card{display:flex;gap:12px;align-items:flex-start;border:2px solid var(--line);border-radius:14px;background:#fff;padding:12px 14px;font-weight:600}
.radio-card>span{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.radio-card:has(input:checked){border-color:var(--sea);background:var(--sea-50)}
.seg-radio{display:inline-flex;border:2px solid var(--line);border-radius:999px;padding:3px;background:#fff;align-self:flex-start}
.seg-radio input{position:absolute;opacity:0}
.seg-radio span{display:inline-flex;min-height:38px;align-items:center;padding:0 16px;border-radius:999px;font-weight:800;font-size:14px;cursor:pointer}
.seg-radio input:checked+span{background:var(--ink);color:#fff}
.seg-radio input:focus-visible+span{outline:3px solid var(--sea)}
.alert{border-radius:12px;background:var(--coral-tint);color:#8a2412;padding:12px 14px;font-weight:700}
.note{display:block;border-radius:12px;background:var(--sun-tint);color:var(--sun-ink);padding:12px 14px;font-weight:700;font-size:15px}
.note .ic,.link .ic,.eyebrow .ic{display:inline-block;vertical-align:-3px}
.or{display:flex;align-items:center;gap:12px;margin-block:18px;color:var(--muted);font-weight:700;font-size:14px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---------------------------------------------------------------- components */
.card{background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);border:1px solid var(--line-soft)}
.pad-4{padding:14px}.pad-5{padding:18px}.pad-6{padding:22px}
@media (min-width:640px){.pad-6{padding:28px}}
.pill{display:inline-flex;align-items:center;gap:4px;min-height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:900;background:var(--line-soft);color:var(--body)}
.pill-sample{background:var(--sun-tint);color:var(--sun-ink)}
.pill-private{background:#ece7f6;color:#4b3a7a}.pill-people{background:var(--sea-tint);color:var(--sea-dark)}.pill-link{background:#e3eefc;color:#1f4f8f}.pill-public{background:var(--ok-tint);color:#0c4a2f}
.pill-ok{background:var(--ok-tint);color:#0c4a2f}.pill-danger{background:var(--coral-tint);color:#8a2412}
.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 10px;border-radius:999px;background:var(--sea-50);color:var(--sea-dark);font-size:13px;font-weight:800;border:1.5px solid var(--sea-tint)}
.chip-sm{min-height:22px;padding:0 8px;font-size:12px}
.chip-tag{background:transparent;border-style:dashed}
.chip-ok{background:var(--ok-tint);color:#0c4a2f;border-color:var(--ok-tint)}
.chip-lg{min-height:40px;padding:0 16px;font-size:14px;background:#fff;border-color:var(--line);color:var(--ink);white-space:nowrap}
.chip-lg.on,.chip-lg:hover{border-color:var(--sea);background:var(--sea);color:#fff}
.chip-x{background:var(--ink);color:#fff;border-color:var(--ink);min-height:32px}
.chip-btn{min-height:34px;padding:0 12px;border-radius:999px;background:#fff;border:1.5px solid var(--line);font-size:13px;font-weight:800}
.chip-btn:hover{border-color:var(--sea)}
.avatar{border-radius:50%;object-fit:cover;flex:none;background:var(--line)}
.avatar-i{display:inline-flex;align-items:center;justify-content:center;font-weight:900;color:#fff;background:hsl(var(--h) 45% 40%)}
.byline{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:14px;min-width:0}
.empty{border:2px dashed var(--line);border-radius:var(--r);padding:36px 20px;text-align:center}
.empty-t{font-size:19px;font-weight:900}
.cover{position:relative;overflow:hidden;background:var(--sea-tint)}
.cover img{width:100%;height:100%;object-fit:cover}
.cover-gen{display:flex;align-items:flex-end;padding:16px;color:#fff;background:radial-gradient(circle at 82% 22%,hsl(42 100% 70% / .95) 0 9%,transparent 9.5%),linear-gradient(160deg,hsl(var(--h) 52% 36%) 0%,hsl(calc(var(--h) + 28) 58% 46%) 55%,hsl(calc(var(--h) + 60) 72% 62%) 100%)}
.cover-gen::after{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:radial-gradient(120% 70% at 20% 100%,rgb(255 255 255 / .14) 0 60%,transparent 61%),radial-gradient(120% 60% at 90% 110%,rgb(0 0 0 / .14) 0 60%,transparent 61%)}
.cover-gen span{position:relative;z-index:1;font-weight:900;font-size:22px;letter-spacing:-.01em;text-shadow:0 1px 8px rgb(0 0 0 / .25)}
.cover-card{aspect-ratio:16/9}.cover-thumb{aspect-ratio:16/9;border-radius:12px}

/* trip cards */
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr))}
.trip-card{display:flex;flex-direction:column;overflow:hidden;transition:box-shadow 160ms,transform 160ms}
.trip-card:hover{box-shadow:var(--shadow-lift)}
.trip-card-body{display:flex;flex:1;flex-direction:column;gap:8px;padding:14px 16px 16px}
.trip-card-title{font-size:18px;line-height:1.3}
.trip-card-title a:hover{text-decoration:underline}
.trip-card-desc{font-size:15px;color:var(--body);line-height:1.5}
.trip-card-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;align-items:center;margin-top:auto;padding-top:6px}
.trip-card-actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:4px}
.under-card{display:flex;justify-content:space-between;align-items:center;padding:6px 6px 0}
.col-strip{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-inline:-1rem;padding-inline:1rem;scrollbar-width:thin}
.col-cards{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))}
.col-card{display:flex;flex-direction:column;justify-content:flex-end;gap:2px;min-height:118px;border-radius:var(--r);padding:16px;color:#fff;font-weight:700;background:radial-gradient(circle at 85% 20%,hsl(42 100% 70% / .9) 0 8%,transparent 8.5%),linear-gradient(150deg,hsl(var(--h) 50% 34%),hsl(calc(var(--h) + 45) 65% 55%));box-shadow:var(--shadow);transition:transform 160ms}
.col-card:hover{transform:translateY(-2px)}
.col-card-t{font-size:18px;font-weight:900;line-height:1.25}

/* ---------------------------------------------------------------- landing */
.hero{background:radial-gradient(circle at 88% 18%,var(--sun) 0 70px,transparent 71px),linear-gradient(170deg,#0b5a53 0%,#0e6b63 55%,#138476 100%);color:#fff;overflow:hidden;position:relative}
.hero::after{content:"";position:absolute;inset:auto -10% -1px -10%;height:70px;background:var(--sand);border-radius:50% 50% 0 0/100% 100% 0 0}
.hero-in{position:relative;z-index:1;padding-block:44px 92px}
.hero .h-display{max-width:760px}
.hero-kicker{font-weight:900;font-size:20px;color:var(--sun);margin-bottom:8px}
.hero-lead{margin-top:14px;font-size:18px;line-height:1.55;color:#d8efe9;max-width:44rem}
.hero-search{display:flex;gap:8px;margin-top:22px;max-width:640px}
.hero-search .btn span{display:none}
@media (min-width:640px){.hero-search .btn span{display:inline}}
.loop{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr))}
.loop li{display:flex;gap:12px;align-items:flex-start;background:var(--paper);border:1px solid var(--line-soft);border-radius:14px;padding:14px}
.loop-ic{display:inline-flex;padding:9px;border-radius:12px;background:var(--sea-50);color:var(--sea)}
.promise{display:flex;flex-direction:column;gap:16px;background:var(--ink);color:#fff;border:0}
.promise .muted{color:#cfe2de}
@media (min-width:860px){.promise{flex-direction:row;align-items:center;justify-content:space-between}}

/* explore filters */
.filters{display:grid;gap:10px;grid-template-columns:1fr 1fr}
.filters .f-q{grid-column:1/-1}
.filters label{display:flex;flex-direction:column;gap:4px}
.f-l{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.filters .btn{grid-column:1/-1}
@media (min-width:860px){.filters{grid-template-columns:2fr repeat(5,1fr) auto;align-items:end}.filters .f-q{grid-column:auto}.filters .btn{grid-column:auto}}
.pager{display:flex;justify-content:space-between;align-items:center;gap:8px}

/* ---------------------------------------------------------------- trip page */
.trip-hero{position:relative;color:#fff;background:var(--ink)}
.trip-hero .cover-hero{position:absolute;inset:0}
.trip-hero .cover-hero span{display:none}
.trip-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(10 30 28 / .15) 0%,rgb(10 30 28 / .55) 55%,rgb(10 30 28 / .85) 100%)}
.trip-hero-in{position:relative;z-index:1;display:flex;flex-direction:column;gap:8px;padding-block:120px 26px}
@media (min-width:860px){.trip-hero-in{padding-top:200px}}
.on-dark{color:#fff}.on-dark-muted{color:#d6e7e3}
.hero-meta{font-weight:800;color:#e5f1ee}
.trip-hero .byline a,.trip-hero .byline span{color:#fff}
.hero-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.trip-layout{display:grid;gap:28px;padding-top:24px}
@media (min-width:960px){.trip-layout{grid-template-columns:minmax(0,1fr) 360px;align-items:start}.trip-side{position:sticky;top:76px}}
.trip-side{display:flex;flex-direction:column;gap:16px}
.attrib{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:12px;border-radius:12px;background:var(--sea-50);padding:10px 12px;font-weight:700;font-size:15px}
.subnav{display:flex;gap:4px;overflow-x:auto;border-bottom:2px solid var(--line);margin-inline:-1rem;padding-inline:1rem}
.subnav a{padding:10px 12px;font-weight:800;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap}
.subnav a[aria-current="page"]{color:var(--ink);border-color:var(--sea)}
.seg{display:inline-flex;border:2px solid var(--line);border-radius:999px;padding:3px;background:var(--paper)}
.seg a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;font-weight:800;font-size:14px;color:var(--muted)}
.seg a[aria-current="page"]{background:var(--ink);color:#fff}
.day{margin-top:18px}
.day-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.day-note{margin-top:8px;color:var(--body)}
.stops{position:relative;margin-top:10px}
.stops::before{content:"";position:absolute;left:15px;top:8px;bottom:8px;width:2px;background:repeating-linear-gradient(var(--sea-tint) 0 6px,transparent 6px 11px)}
.stop{position:relative;display:flex;gap:12px;padding-block:10px}
.stop-n{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex:none;border-radius:50%;background:var(--sea);color:#fff;font-weight:900;font-size:14px;box-shadow:0 0 0 4px var(--sand)}
.stop.visited .stop-n{background:var(--ok)}
.stop-b{min-width:0;flex:1}
.stop-top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.stop-time{font-weight:900;color:var(--coral);font-variant-numeric:tabular-nums}
.stop-name{font-size:17px;line-height:1.3}
.stop-note{margin-top:4px;color:var(--body);font-size:15px}
.stop-links{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px}
.kv li{display:flex;justify-content:space-between;gap:8px;padding-block:6px;border-bottom:1px dashed var(--line);font-weight:700;font-size:15px}
.sketch svg{width:100%;height:auto;border-radius:16px}
.sketch figcaption{margin-top:6px}
.sketch-empty{border:2px dashed var(--line);border-radius:16px;padding:22px;text-align:center}
.sk-bg{fill:#e7f1ee}.sk-grid line{stroke:#d5e6e1;stroke-width:1}
.sk-line{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 7}
.sk-pt circle{stroke:#fff;stroke-width:3}.sk-pt text{fill:#fff;font:900 15px var(--font)}
.sk-d0{stroke:var(--sea)}.sk-pt.sk-d0 circle{fill:var(--sea)}.sk-d1{stroke:var(--coral)}.sk-pt.sk-d1 circle{fill:var(--coral)}.sk-d2{stroke:#6b4fb3}.sk-pt.sk-d2 circle{fill:#6b4fb3}
.sk-d3{stroke:#c47f00}.sk-pt.sk-d3 circle{fill:#c47f00}.sk-d4{stroke:#2a6fb0}.sk-pt.sk-d4 circle{fill:#2a6fb0}
.sk-pt{stroke:none}.sk-n{fill:var(--muted);font:900 13px var(--font)}.sk-arrow{fill:var(--muted)}
.gallery{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
.gallery-big{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.gallery-item{position:relative;aspect-ratio:1;overflow:hidden;border-radius:12px;background:var(--line)}
.gallery-item img{width:100%;height:100%;object-fit:cover}
.ph-tools{position:absolute;inset:auto 6px 6px 6px;display:flex;gap:4px;justify-content:space-between}
.ticks li,.crosses li{position:relative;padding-left:24px;margin-top:6px;font-weight:700}
.ticks li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:900}
.crosses li::before{content:"✕";position:absolute;left:0;color:var(--coral);font-weight:900}

/* ---------------------------------------------------------------- editor */
.edit-layout{display:grid;gap:24px;padding-top:20px}
@media (min-width:960px){.edit-layout{grid-template-columns:minmax(0,1fr) 380px;align-items:start}}
.edit-main{display:flex;flex-direction:column;gap:14px}
.edit-side{display:flex;flex-direction:column;gap:16px}
.ed-day{padding:16px}
.ed-day-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ed-sub{margin-top:8px}
.ed-sub>summary{display:inline-flex;align-items:center;min-height:36px;font-weight:800;font-size:14px;color:var(--sea)}
.ed-stops{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.ed-stop{border:1.5px solid var(--line);border-radius:14px;background:#fff;padding:10px 12px}
.ed-stop:target{border-color:var(--sun);box-shadow:0 0 0 3px var(--sun-tint)}
.ed-stop-row{display:flex;gap:10px;align-items:center}
.ed-stop-name{font-weight:800}
.add-stop{margin-top:12px}
.add-stop>summary{list-style:none}.add-stop>summary::-webkit-details-marker{display:none}
.add-stop-in{margin-top:10px;border-radius:14px;background:var(--sea-50);padding:14px}
.pick{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.pick li{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#fff;border-radius:12px;padding:8px 8px 8px 12px}
details>summary.h-side{list-style:none}details>summary.h-side::-webkit-details-marker{display:none}
details>summary.h-side::after{content:"▾";margin-left:auto;color:var(--muted)}
details[open]>summary.h-side::after{content:"▴"}

/* sharing, people lists */
.people{display:flex;flex-direction:column}
.people li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding-block:10px;border-bottom:1px solid var(--line-soft)}
.people li:last-child{border-bottom:0}

/* journal */
.jday{display:flex;flex-direction:column;gap:12px}
.jentry:target{box-shadow:0 0 0 3px var(--sun)}

/* travel mode */
.go-head{background:linear-gradient(160deg,#0b5a53,#138476);color:#fff;padding-block:18px 16px}
.day-chips{display:flex;gap:6px;overflow-x:auto}
.day-chips a{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:999px;border:2px solid rgb(255 255 255 / .4);font-weight:800;white-space:nowrap}
.day-chips a[aria-current="page"]{background:#fff;color:var(--ink);border-color:#fff}
.next-stop{border:2px solid var(--sun)}
.go-list{display:flex;flex-direction:column;gap:8px}
.go-list li{display:flex;align-items:center;gap:12px;background:var(--paper);border:1px solid var(--line-soft);border-radius:14px;padding:10px 12px}
.go-list li.current{border:2px solid var(--sun)}
.go-list li.visited strong{text-decoration:line-through;color:var(--muted)}
.dot-empty{width:14px;height:14px;border-radius:50%;border:2px solid var(--faint)}

/* tables, numbers */
.table-scroll{overflow-x:auto}
.table{width:100%;font-size:15px}
.table th,.table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top}
.table thead th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:900}
.table tbody th{font-weight:800}
.table .num,.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.kpis{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr))}
.kpi{padding:16px}.kpi-n{font-size:26px;font-weight:900;margin-block:4px}

/* me, saved, profile, auth */
.first-trip{background:radial-gradient(circle at 92% 20%,var(--sun-tint) 0 60px,transparent 61px),var(--paper)}
.profile-head{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.saved-layout{display:grid;gap:24px}
@media (min-width:960px){.saved-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:start}}
.auth{padding-top:32px}.auth-card{max-width:460px;margin-inline:auto;padding:26px}
.ok-circle{display:inline-flex;width:54px;height:54px;align-items:center;justify-content:center;border-radius:50%;background:var(--sea-50);font-size:24px}
.nf-n{font-size:84px;font-weight:900;color:var(--sea-tint);line-height:1}
.two{display:grid;gap:22px}
@media (min-width:860px){.two{grid-template-columns:1fr 1fr;align-items:start}}

/* ---------------------------------------------------------------- admin */
body.admin{padding-bottom:0}
.admin-top .top-in{flex-wrap:wrap}
.admin-tag{margin-left:8px;border-radius:999px;background:var(--ink);color:#fff;font-size:12px;padding:2px 8px;font-weight:900}
.admin-nav{display:flex;gap:16px;overflow-x:auto;font-weight:800;color:var(--muted)}
.admin-nav a{padding-block:16px;border-bottom:3px solid transparent;white-space:nowrap}
.admin-nav a[aria-current="page"]{color:var(--ink);border-color:var(--sea)}
.admin-me{display:flex;gap:10px;align-items:center;margin-left:auto}
.admin-head{padding-block:22px 14px}.admin-foot{padding-block:40px}

/* ---------------------------------------------------------------- utilities (last) */
.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}
.wrap-row{flex-wrap:wrap}.nowrap{flex-wrap:nowrap;white-space:nowrap}
.split{display:flex;justify-content:space-between;align-items:center;gap:12px}
.center{text-align:center}.center-x{justify-content:center}
.grow{flex:1;min-width:0}.min0{min-width:0}.self-end{align-self:flex-end}.block{display:block}.right{text-align:right}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gap-1{gap:4px}.gap-1-5{gap:6px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}
.grid-2{display:grid;gap:12px}.grid-3{display:grid;gap:12px}
@media (min-width:560px){.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}}
.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-5{margin-top:22px}.mt-6{margin-top:36px}
.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.mb-5{margin-bottom:22px}
.pt-3{padding-top:12px}.pt-4{padding-top:16px}.pt-5{padding-top:22px}.pt-6{padding-top:36px}
@media (max-width:559px){.sm-hide{display:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
