/* Base reset (the Claude artifact wrapper used to provide this). */
body{margin:0;padding:0}
img{max-width:100%}
[hidden]:not([hidden=until-found i]){display:none!important}

:root {
  /* Layout: departure hall. A split-flap board for the next trip, then boarding-pass cards in one column, max 880px. */
  --bg:#ECF0F6; --surface:#FFFFFF; --surface-2:#F3F6FA; --surface-past:#F3F6FA; --ink:#0F1B33; --ink-2:#4C5875; --line:#D3DAE6;
  --accent:#F2A900; --on-accent:#0F1B33; --link:#1D58C9; --sun:#C98400;
  --board:#0F1B33; --board-tile:#1A284A; --board-ink:#FFC53D; --board-dim:#97A6C6;
  --good:#1B7A51; --good-bg:#E1F2E9; --warn:#935C05; --warn-bg:#FBEFD6; --bad:#B8372F; --bad-bg:#F8E1DF;
  --scrim:rgba(15,27,51,.45);
  --shadow:0 1px 2px rgba(15,27,51,.05),0 6px 18px rgba(15,27,51,.06);
  --f-display:"Big Shoulders Display","Arial Narrow","Roboto Condensed",sans-serif;
  --f-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r:14px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:#080E1A; --surface:#1A2641; --surface-2:#243251; --surface-past:#111A2D; --ink:#EEF2F9; --ink-2:#AEBBD3; --line:#3A4968;
    --accent:#FFB82E; --on-accent:#0B1220; --link:#93B4FF; --sun:#FFC53D;
    --board:#213762; --board-tile:#0A1324; --board-ink:#FFC53D; --board-dim:#A3B3D2;
    --good:#4CC38A; --good-bg:#12382A; --warn:#F0B95E; --warn-bg:#3A2D12; --bad:#F2766C; --bad-bg:#45201F;
    --scrim:rgba(0,0,0,.6);
    --shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 24px rgba(0,0,0,.35);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg:#080E1A; --surface:#1A2641; --surface-2:#243251; --surface-past:#111A2D; --ink:#EEF2F9; --ink-2:#AEBBD3; --line:#3A4968;
  --accent:#FFB82E; --on-accent:#0B1220; --link:#93B4FF; --sun:#FFC53D;
  --board:#213762; --board-tile:#0A1324; --board-ink:#FFC53D; --board-dim:#A3B3D2;
  --good:#4CC38A; --good-bg:#12382A; --warn:#F0B95E; --warn-bg:#3A2D12; --bad:#F2766C; --bad-bg:#45201F;
  --scrim:rgba(0,0,0,.6);
  --shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 24px rgba(0,0,0,.35);
  color-scheme: dark;
}
/* The app's own Light / Dark switch wins over the device and the Claude app setting. */
html:root[data-scheme="light"] {
  --bg:#ECF0F6; --surface:#FFFFFF; --surface-2:#F3F6FA; --surface-past:#F3F6FA; --ink:#0F1B33; --ink-2:#4C5875; --line:#D3DAE6;
  --accent:#F2A900; --on-accent:#0F1B33; --link:#1D58C9; --sun:#C98400;
  --board:#0F1B33; --board-tile:#1A284A; --board-ink:#FFC53D; --board-dim:#97A6C6;
  --good:#1B7A51; --good-bg:#E1F2E9; --warn:#935C05; --warn-bg:#FBEFD6; --bad:#B8372F; --bad-bg:#F8E1DF;
  --scrim:rgba(15,27,51,.45);
  --shadow:0 1px 2px rgba(15,27,51,.05),0 6px 18px rgba(15,27,51,.06);
  color-scheme: light;
}
html:root[data-scheme="dark"] {
  --bg:#080E1A; --surface:#1A2641; --surface-2:#243251; --surface-past:#111A2D; --ink:#EEF2F9; --ink-2:#AEBBD3; --line:#3A4968;
  --accent:#FFB82E; --on-accent:#0B1220; --link:#93B4FF; --sun:#FFC53D;
  --board:#213762; --board-tile:#0A1324; --board-ink:#FFC53D; --board-dim:#A3B3D2;
  --good:#4CC38A; --good-bg:#12382A; --warn:#F0B95E; --warn-bg:#3A2D12; --bad:#F2766C; --bad-bg:#45201F;
  --scrim:rgba(0,0,0,.6);
  --shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 24px rgba(0,0,0,.35);
  color-scheme: dark;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.5}
body.locked{overflow:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg)}
.wrap{max-width:880px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0}
button{font:inherit;color:inherit}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--ink-2)}
.small{font-size:13px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ico.tiny{width:14px;height:14px}
:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* top bar */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:10px}
.brand{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:4px 0;cursor:pointer;font-family:var(--f-display);font-weight:800;font-size:22px;letter-spacing:.04em;text-transform:uppercase;line-height:1}
.brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--board);color:var(--board-ink)}
.brand-mark .ico{width:17px;height:17px;transform:rotate(45deg)}
.save-state{font-family:var(--f-mono);font-size:12px;color:var(--ink-2)}
.top-actions{flex-wrap:nowrap;gap:6px}
.theme-wrap{position:relative}
.menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:200px;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);display:grid;gap:2px}
.menu[hidden]{display:none}
.menu button{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--ink);text-align:left;font-weight:500;cursor:pointer}
.menu button:hover{background:var(--surface-2)}
.menu button[aria-checked="true"]{font-weight:700}
.menu .tick{margin-left:auto;color:var(--good);visibility:hidden}
.menu button[aria-checked="true"] .tick{visibility:visible}
@media (max-width:420px){.hide-sm{display:none}.save-state{display:none}.brand{font-size:19px;gap:8px}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--ink-2)}
.btn:disabled{opacity:.6;cursor:default}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn-primary:hover{border-color:var(--ink)}
.btn-ghost{background:transparent;border-color:transparent;color:var(--link);padding-inline:8px}
.btn-ghost:hover{border-color:transparent;text-decoration:underline}
.btn-danger{background:transparent;border-color:transparent;color:var(--bad);padding-inline:8px}
.btn-danger:hover{border-color:var(--bad)}
.btn-danger.armed{background:var(--bad-bg);border-color:var(--bad)}
.btn-sm{min-height:36px;padding:6px 11px;font-size:13px;gap:5px}
.btn-sm .ico{width:15px;height:15px}
.icon-btn{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:9px;border:1px solid transparent;background:transparent;color:var(--ink-2);cursor:pointer;flex:none}
.icon-btn:hover{background:var(--surface-2);color:var(--ink);border-color:var(--line)}

main{padding-block:20px 72px;display:grid;gap:30px}

/* departure board */
.board{display:grid;gap:16px;width:100%;text-align:left;background:var(--board);color:var(--board-ink);border:1px solid var(--board);border-radius:18px;padding:18px 18px 16px;box-shadow:var(--shadow)}
button.board{cursor:pointer}
.board-label{display:flex;justify-content:space-between;gap:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--board-dim)}
.board-grid{display:grid;gap:16px;align-items:end}
@media (min-width:640px){.board-grid{grid-template-columns:minmax(0,1fr) auto}}
.board-main{display:grid;gap:10px;min-width:0}
.board-dest{display:block;font-family:var(--f-display);font-weight:800;font-size:clamp(48px,13vw,96px);line-height:.86;text-transform:uppercase;letter-spacing:.01em;overflow-wrap:anywhere}
.board-dest.small{font-size:clamp(34px,8vw,56px)}
.board-dest.dim{color:var(--board-dim);font-size:clamp(34px,8vw,56px)}
.board-meta{display:block;font-family:var(--f-mono);font-size:13px;color:var(--board-dim);line-height:1.6;max-width:60ch}
.board-count{display:flex;align-items:flex-end;gap:12px}
.flaps{display:flex;gap:5px}
.flap{position:relative;display:grid;place-items:center;width:clamp(46px,13vw,64px);height:clamp(64px,18vw,88px);border-radius:8px;background:var(--board-tile);font-family:var(--f-mono);font-weight:700;font-size:clamp(38px,11vw,56px);line-height:1;color:var(--board-ink);overflow:hidden;perspective:300px}
.flap::after{content:"";position:absolute;left:0;right:0;top:calc(50% - 1px);height:2px;background:var(--board)}
.flap>span{display:block}
.flaps-unit{display:block;font-family:var(--f-display);font-weight:700;font-size:22px;line-height:1;text-transform:uppercase;letter-spacing:.03em;max-width:6ch;padding-bottom:4px}
.board-line{display:block;padding-top:12px;border-top:1px dashed var(--board-tile);font-family:var(--f-mono);font-size:13px;color:var(--board-ink);overflow-wrap:anywhere}
.board-line.dim{color:var(--board-dim)}

.stats{font-family:var(--f-mono);font-size:12.5px;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:4px 16px;letter-spacing:.02em}
.stats b{color:var(--ink);font-weight:700}

/* sections */
.stack{display:grid;gap:12px}
.section-h{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px}
.section-h h2{font-family:var(--f-mono);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.empty{padding:16px 18px;border:1.5px dashed var(--line);border-radius:var(--r);color:var(--ink-2);font-size:14.5px}
.error{color:var(--bad);font-size:14px}
.notice{font-size:13.5px;color:var(--warn);background:var(--warn-bg);padding:8px 10px;border-radius:8px}
.fine{font-size:12.5px;color:var(--ink-2)}

/* coming up */
.todo{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.todo li+li{border-top:1px solid var(--line)}
.todo-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;padding:11px 14px;background:none;border:0;text-align:left;cursor:pointer}
.todo-row:hover{background:var(--surface-2)}
.todo-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--surface-2);color:var(--ink-2)}
.todo-ico .ico{width:16px;height:16px}
.todo-text{min-width:0}
.todo-text b{display:block;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.todo-text small{display:block;font-size:13px;color:var(--ink-2);overflow-wrap:anywhere}

/* trip tickets */
.tickets{display:grid;gap:10px}
.ticket{--dw:78px;position:relative;display:grid;grid-template-columns:var(--dw) minmax(0,1fr) auto;align-items:center;width:100%;text-align:left;cursor:pointer;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:0;box-shadow:var(--shadow)}
.ticket:hover,.ticket:hover .notch{border-color:var(--ink-2)}
.tk-date{display:grid;justify-items:center;gap:3px;padding:14px 6px}
.tk-wd,.tk-mon{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.tk-day{font-family:var(--f-display);font-weight:800;font-size:36px;line-height:.85}
.tk-body{display:grid;gap:3px;padding:14px 12px 14px 16px;border-left:1.5px dashed var(--line);min-width:0}
.tk-city{font-family:var(--f-display);font-weight:800;font-size:30px;line-height:.95;text-transform:uppercase;letter-spacing:.01em;overflow-wrap:anywhere}
.tk-country{font-size:14px;color:var(--ink-2)}
.sep{margin-inline:6px;color:var(--ink-2);opacity:.5}
.tk-bits{font-family:var(--f-mono);font-size:12px;color:var(--ink-2)}
.tk-right{display:flex;align-items:center;gap:12px;padding:12px 14px 12px 4px}
.tk-thumb{width:44px;height:56px;border-radius:7px;overflow:hidden;background:var(--surface-2);flex:none}
.tk-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.tk-count{display:grid;justify-items:end;line-height:1;gap:3px}
.tk-count b{font-family:var(--f-mono);font-size:26px;font-weight:700}
.tk-count small{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.tk-past{font-family:var(--f-mono);font-size:12px;color:var(--ink-2)}
.ticket.is-past{box-shadow:none;background:var(--surface-past)}
.ticket.is-past .tk-city{color:var(--ink-2)}
.notch{position:absolute;left:calc(var(--dw) - 9px);width:18px;height:9px;background:var(--bg);border:1px solid var(--line)}
.notch.top{top:-1px;border-top:0;border-radius:0 0 9px 9px}
.notch.bottom{bottom:-1px;border-bottom:0;border-radius:9px 9px 0 0}

.pill{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;font-family:var(--f-mono);font-size:11.5px;font-weight:700;letter-spacing:.03em;white-space:nowrap}
.pill-accent{background:var(--accent);color:var(--on-accent)}
.pill-warn{background:var(--warn-bg);color:var(--warn)}
.pill-bad{background:var(--bad-bg);color:var(--bad)}
.pill-good{background:var(--good-bg);color:var(--good)}
.pill-neutral{background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line)}

/* annual leave */
.leave{display:grid;gap:14px}
.leave-row{display:grid;gap:7px}
.leave-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.leave-num{font-family:var(--f-mono);font-size:13px;color:var(--ink-2)}
.leave-num b{font-size:20px;color:var(--ink)}

.backup{display:grid;gap:10px;padding-top:22px;border-top:1px solid var(--line)}
.import-preview{display:grid;gap:10px;padding:14px 16px;border-radius:var(--r);background:var(--warn-bg);border:1px solid var(--line)}

/* trip view */
.trip{display:grid;gap:20px}
.trip-nav{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.back{padding-left:0}
.cover{margin:0;border-radius:16px;overflow:hidden;background:var(--surface-2);aspect-ratio:16/7;max-width:100%}
.cover img{width:100%;height:100%;object-fit:cover;object-position:center 35%;display:block}
.trip-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:end}
.eyebrow{font-size:14px;color:var(--ink-2)}
.trip-title{font-family:var(--f-display);font-weight:800;font-size:clamp(50px,14vw,104px);line-height:.85;text-transform:uppercase;letter-spacing:.005em;overflow-wrap:anywhere;margin-top:4px}
.trip-dates{font-size:13px;color:var(--ink-2);margin-top:10px}
.travellers{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.trip-count{display:grid;justify-items:center;gap:4px;padding:10px 14px;border-radius:12px;background:var(--board);color:var(--board-ink);min-width:86px}
.trip-count b{font-family:var(--f-mono);font-size:34px;line-height:1}
.trip-count span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--board-dim);text-align:center}
.trip-count.past{background:var(--surface-2);border:1px solid var(--line)}
.trip-count.past span{color:var(--ink-2)}

.tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;display:inline-flex;align-items:center;gap:6px;padding:10px 10px 11px;background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;font-weight:600;color:var(--ink-2);cursor:pointer}
.tab:hover{color:var(--ink)}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.tab .count{font-family:var(--f-mono);font-size:11px;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:0 6px;line-height:1.6}
.tabpanel{display:grid;gap:30px}

.panel,.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.card{display:grid;gap:10px}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.card-top>div{min-width:0}
.card-title{font-size:17px;font-weight:600;line-height:1.3}
.meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13.5px;color:var(--ink-2);align-items:center}
.meta b{color:var(--ink);font-family:var(--f-mono);font-weight:700}
.lbl{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.link{display:inline-flex;align-items:center;gap:5px;color:var(--link);font-weight:600;text-decoration:none;width:fit-content}
.link:hover{text-decoration:underline}
.link .ico{width:15px;height:15px}
.note{font-size:14px;color:var(--ink-2);white-space:pre-wrap;overflow-wrap:anywhere}
.where{display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:10px}
.where-addr{display:flex;gap:8px;align-items:flex-start;font-size:14.5px;line-height:1.4;-webkit-user-select:text;user-select:text;overflow-wrap:anywhere}
.where-addr .ico{color:var(--link);margin-top:1px}
.where-actions{display:flex;flex-wrap:wrap;gap:6px}
.where-hint{font-size:12.5px;color:var(--ink-2)}
.ev-link{display:inline-flex;align-items:center;gap:4px;margin-top:3px;font-size:13px;font-weight:600;color:var(--link);text-decoration:none}
.ev-link:hover{text-decoration:underline}

/* boarding pass */
.pass{display:grid;grid-template-columns:minmax(0,1fr) 56px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.pass-main{display:grid;gap:14px;padding:14px 16px;min-width:0}
.pass-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:14px}
.pass-airline{font-weight:600}
.pass-date{color:var(--ink-2);font-size:12.5px;white-space:nowrap}
.pass-route{display:grid;grid-template-columns:auto minmax(32px,1fr) auto;align-items:center;gap:12px}
.pass-pt{display:grid;gap:2px}
.pass-pt.end{text-align:right;justify-items:end}
.code{font-family:var(--f-display);font-weight:800;font-size:46px;line-height:.85;letter-spacing:.02em}
.city{font-size:12.5px;color:var(--ink-2);max-width:14ch}
.time{font-family:var(--f-mono);font-size:16px;font-weight:700}
.time sup{font-size:10px;color:var(--warn);margin-left:2px}
.pass-path{display:flex;align-items:center;gap:6px;color:var(--ink-2);margin-bottom:24px}
.pass-path .dash{flex:1;border-top:1.5px dashed var(--line)}
.ico.plane{transform:rotate(45deg)}
.pass-foot{display:flex;flex-wrap:wrap;gap:6px 16px;padding-top:10px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-2);align-items:center}
.pass-foot b{color:var(--ink);font-family:var(--f-mono)}
.pass-stub{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:8px;padding:10px 0;background:var(--surface-2);border-left:1.5px dashed var(--line)}
.stub-label{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--f-display);font-weight:800;font-size:22px;letter-spacing:.14em;color:var(--ink-2)}

.stay-dates{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 12px;background:var(--surface-2);border-radius:10px}
.stay-dates .arrow{color:var(--ink-2)}
.nights{margin-left:auto;font-size:12.5px;color:var(--ink-2)}

.legs{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:10px 12px;background:var(--surface-2);border-radius:10px}
.leg{display:grid;gap:2px;min-width:0;align-content:start}
.leg .place{font-size:14px;overflow-wrap:anywhere}
@media (max-width:480px){.legs{grid-template-columns:1fr}}

.act{grid-template-columns:60px minmax(0,1fr);gap:14px;align-items:start}
.act-when{display:grid;justify-items:center;padding:8px 0 9px;border-radius:10px;background:var(--surface-2);line-height:1.1}
.act-wd,.act-mon{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.act-d{font-family:var(--f-display);font-weight:800;font-size:28px;line-height:1}
.act-body{display:grid;gap:8px;min-width:0}
.prov{font-weight:600;color:var(--ink)}

/* documents */
.docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.doc{display:grid;gap:6px;align-content:start;text-align:left;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer;min-width:0}
.doc:hover{border-color:var(--ink-2)}
.doc-thumb{display:grid;place-items:center;aspect-ratio:4/3;max-width:100%;border-radius:8px;background:var(--surface-2);overflow:hidden;font-family:var(--f-display);font-weight:800;font-size:26px;letter-spacing:.06em;color:var(--ink-2)}
.doc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.doc-name{font-size:13.5px;font-weight:600;overflow-wrap:anywhere;line-height:1.3}
.doc-meta{font-family:var(--f-mono);font-size:11px;color:var(--ink-2)}
.doc-add{place-items:center;align-content:center;justify-items:center;border-style:dashed;color:var(--link);font-weight:600;min-height:130px;text-align:center}
.viewer-img{display:block;width:100%;height:auto;border-radius:10px;background:var(--surface-2)}
.doc-big{display:flex;gap:12px;align-items:center;padding:16px;border-radius:12px;background:var(--surface-2)}
.doc-big .ico{width:32px;height:32px;color:var(--ink-2)}
img.missing{visibility:hidden}

/* weather */
.wx-panel{display:grid;gap:12px}
.wx-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(92px,1fr);gap:8px;overflow-x:auto;padding-bottom:2px}
.wx-day{display:grid;justify-items:center;gap:2px;padding:10px 6px 12px;border-radius:12px;background:var(--surface-2);text-align:center}
.wx-wd{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.wx-dm{font-size:12.5px;color:var(--ink-2)}
.wx{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;margin:4px 0;color:var(--ink-2)}
.wx.c-sunny,.wx.c-partly-cloudy{color:var(--sun)}
.wx.c-rain,.wx.c-showers,.wx.c-storm{color:var(--link)}
.wx-hi{font-family:var(--f-display);font-weight:800;font-size:30px;line-height:1}
.wx-lo{font-family:var(--f-mono);font-size:13px;color:var(--ink-2)}
.wx-rain{display:inline-flex;align-items:center;gap:3px;font-family:var(--f-mono);font-size:12px;color:var(--ink-2);margin-top:2px}
.wx-sun{font-size:11px;color:var(--ink-2)}
.wx-summary{font-size:15px}
.wx-cta{display:grid;gap:12px;justify-items:start}
.wx-wait{color:var(--ink-2)}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px 22px;margin:0}
.fact dt{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.fact dd{margin:3px 0 0;font-size:14.5px}
.suggest{display:grid;gap:10px;justify-items:start;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.suggest-h{font-weight:600;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--surface-2);font-size:13px}
.chip.done{text-decoration:line-through;color:var(--ink-2)}
.chip-btn{cursor:pointer;font-weight:600}
.chip-btn:hover{border-color:var(--ink-2)}

/* day by day */
.days{display:grid;gap:22px}
.day{display:grid;gap:6px;scroll-margin-top:80px}
.day-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.day.today .day-h{border-bottom:2px solid var(--accent)}
.day-n{font-family:var(--f-display);font-weight:800;font-size:24px;line-height:1;text-transform:uppercase;margin-right:10px}
.day-d{font-family:var(--f-mono);font-size:13px;color:var(--ink-2)}
.day .pill{margin-left:8px;vertical-align:3px}
.wx-mini{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:13px}
.wx-mini .wx{width:22px;height:22px;margin:0}
.events{list-style:none;margin:0;padding:0;display:grid;position:relative}
.events.multi::before{content:"";position:absolute;left:77px;top:26px;bottom:26px;border-left:1.5px dashed var(--line)}
.ev{display:grid;grid-template-columns:52px 32px minmax(0,1fr);gap:10px;align-items:start;padding:8px 0}
.ev-time{font-family:var(--f-mono);font-size:13.5px;font-weight:700;padding-top:6px}
.ev-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--surface);border:1px solid var(--line);position:relative;z-index:1}
.ev-icon .ico{width:16px;height:16px}
.ev-flight .ev-icon{background:var(--board);color:var(--board-ink);border-color:var(--board)}
.ev-body{min-width:0;padding-top:4px}
.ev-body b{display:block;font-weight:600}
.ev-body small{display:block;color:var(--ink-2);font-size:13px}
.free{color:var(--ink-2);font-size:14px;padding:8px 0 0}
.day-find{padding-left:94px}
.free+.day-find{padding-left:0}
.find{display:grid;gap:12px}
.find .btn .ico:last-child{width:14px;height:14px;opacity:.7}
@media (max-width:420px){.day-find{padding-left:0}}

/* packing */
.progress{height:8px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);overflow:hidden}
.progress span{display:block;height:100%;background:var(--good);border-radius:999px}
.progress.lv span{background:var(--link)}
.progress.over span{background:var(--bad)}
.pack-add{display:flex;gap:8px}
.pack-add input{flex:1;min-width:0}
.templates{display:grid;gap:8px}
.checklist{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.checklist li{display:flex;align-items:center;gap:8px;padding:2px 6px 2px 14px;border-bottom:1px solid var(--line)}
.checklist li:last-child{border-bottom:0}
.checklist label{flex:1;display:flex;align-items:center;gap:12px;padding:9px 0;cursor:pointer;min-width:0}
.checklist label span{overflow-wrap:anywhere}
.checklist input{accent-color:var(--good)}
.checklist li.done label span{text-decoration:line-through;color:var(--ink-2)}

/* costs */
.cost-cur{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cost-cur+.cost-cur{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.cost-cur>div{display:grid;gap:2px;min-width:0}
.cost-big{font-family:var(--f-mono);font-weight:700;font-size:clamp(16px,4.6vw,22px);overflow-wrap:anywhere}
.cost-big.due{color:var(--warn)}
.bars{display:grid;gap:9px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.bar{display:grid;grid-template-columns:minmax(80px,130px) minmax(0,1fr) auto;align-items:center;gap:10px;font-size:13px}
.bar-track{height:8px;background:var(--surface-2);border-radius:999px;overflow:hidden}
.bar-track span{display:block;height:100%;background:var(--link);border-radius:999px}
.cost-list{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.cost-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:10px 8px 10px 14px;border-bottom:1px solid var(--line)}
.cost-row:last-child{border-bottom:0}
.cost-label{font-weight:600;overflow-wrap:anywhere}
.cost-sub{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;color:var(--ink-2);margin-top:2px}
.cost-right{display:grid;justify-items:end;gap:3px}
.cost-amt{font-family:var(--f-mono);font-weight:700}

/* forms */
input,select,textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:9px 12px;width:100%;min-height:44px}
textarea{min-height:84px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--link);outline-offset:0;border-color:transparent}
input[type=checkbox]{width:20px;height:20px;min-height:0;padding:0;margin:0;accent-color:var(--accent);flex:none}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{display:grid;gap:5px;min-width:0;align-content:start}
.field.wide{grid-column:1/-1}
.field label{font-size:13px;font-weight:600;color:var(--ink-2)}
.field small{font-size:12px;color:var(--ink-2)}
.check{grid-column:1/-1;display:flex;align-items:center;gap:10px;font-size:14.5px;cursor:pointer;padding:4px 0}

/* sheet */
.sheet{position:fixed;inset:0;z-index:50;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center}
.sheet-panel{width:100%;max-width:620px;max-height:92%;overflow-y:auto;background:var(--surface);border-radius:18px 18px 0 0;padding:18px max(16px,env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));box-shadow:var(--shadow)}
.sheet-panel:focus{outline:none}
@media (min-width:700px){.sheet{align-items:center;padding:24px}.sheet-panel{border-radius:18px;max-height:90%;padding:22px}}
.sheet-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}
.sheet-head h2{font-family:var(--f-display);font-weight:800;font-size:30px;text-transform:uppercase;line-height:1;overflow-wrap:anywhere}
.sheet-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap}
.sheet textarea.code-out{font-family:var(--f-mono);font-size:12px;min-height:220px}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:10px;font-weight:600;font-size:14px;box-shadow:var(--shadow);max-width:calc(100% - 32px)}

@media (prefers-reduced-motion:no-preference){
  .flaps.flip .flap>span{animation:flip .55s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--i) * 130ms + 120ms)}
  @keyframes flip{from{transform:rotateX(-90deg);opacity:.25}to{transform:none;opacity:1}}
  .ticket,.btn{transition:border-color .15s,transform .15s}
  .ticket:hover{transform:translateY(-1px)}
  .wx-wait::after{content:"";animation:dots 1.2s steps(4) infinite}
  @keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}
}
@media (max-width:420px){
  .ticket{--dw:66px}
  .tk-city{font-size:26px}
  .tk-thumb{display:none}
  .code{font-size:40px}
}

/* account menu */
.account-btn{font-family:var(--f-mono);font-weight:700;font-size:14px;background:var(--surface);border-color:var(--line);color:var(--ink);border-radius:50%}
.account-menu{min-width:240px}
.menu .menu-who{display:grid;gap:2px;padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;min-width:0}
.menu .menu-who b{font-weight:600;overflow-wrap:anywhere}
.menu .menu-who small{font-size:12.5px;color:var(--ink-2);overflow-wrap:anywhere}
.menu a.menu-link{display:flex;align-items:center;gap:10px;min-height:40px;padding:8px 10px;border-radius:8px;color:var(--ink);text-decoration:none;font-weight:500}
.menu a.menu-link:hover{background:var(--surface-2)}

/* sign-in screen */
.signin{display:grid;gap:22px;padding-top:12px}
.signin .board{gap:14px}
.signin-card{display:grid;gap:14px;justify-items:start}
.signin-card .btn{min-height:48px;padding-inline:18px;font-size:15px}
.ms-logo{display:grid;grid-template-columns:8px 8px;gap:2px}
.ms-logo i{display:block;width:8px;height:8px}
.ms-logo i:nth-child(1){background:#F25022}.ms-logo i:nth-child(2){background:#7FBA00}.ms-logo i:nth-child(3){background:#00A4EF}.ms-logo i:nth-child(4){background:#FFB900}

/* people */
.people{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.person{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:9px 8px 9px 14px;border-bottom:1px solid var(--line)}
.person:last-child{border-bottom:0}
.avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);font-family:var(--f-mono);font-weight:700;font-size:13px;color:var(--ink-2)}
.person-text{min-width:0}
.person-text b{display:block;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.person-text small{display:block;font-size:13px;color:var(--ink-2);overflow-wrap:anywhere}
.share-form{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:8px;align-items:end}
@media (max-width:480px){.share-form{grid-template-columns:minmax(0,1fr) 110px}.share-form .btn{grid-column:1/-1}}
.tk-shared{font-size:12.5px;color:var(--ink-2)}

/* flight lookup */
.pass-pt .term{font-size:12px;color:var(--ink-2)}
.pass-pt .time-new{font-family:var(--f-mono);font-size:12.5px;font-weight:700;color:var(--warn)}
.pass-live{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:12.5px;color:var(--ink-2)}
.pass-live .btn{min-height:32px;padding-block:4px}
.field small.error{color:var(--bad)}
