/* Otto: the postcard visual layer over the existing application controls. */
.privacy-gate,.privacy-document { max-width:760px; margin:0 auto; padding:36px 22px; line-height:1.65; overflow-wrap:anywhere; }
.privacy-gate h1,.privacy-document h1 { font:400 30px/1.25 Georgia,serif; }
.privacy-document h2 { margin:28px 0 12px; font-size:20px; }
.privacy-links { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; font-size:13px; align-items:center; }
.privacy-links .link { width:auto; margin:0; padding:0; font-weight:400; }
.privacy-check { display:flex; align-items:flex-start; gap:12px; font-size:14px; color:var(--ink); margin:20px 0; }
.privacy-check input { width:20px; height:20px; flex:0 0 20px; margin:3px 0 0; accent-color:var(--brand); }
.remember-choice { display:flex; align-items:flex-start; gap:12px; font-size:14px; color:var(--ink); margin:20px 0; }
.remember-choice input { width:20px; height:20px; flex:0 0 20px; margin:3px 0 0; accent-color:var(--brand); }
.privacy-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.privacy-actions button { flex:1 1 150px; width:auto; }
.privacy-document a,.privacy-links a,.privacy-gate a,.privacy-check a { color:var(--brand); }
:root { --bg:#fafcfb; --card:#fff; --ink:#253b34; --muted:#718078; --brand:#285c47; --brand-dark:#1d4837; --line:#e3e9e5; --sticky-tabs-top:0px; }
body { background:#fff; letter-spacing:0; }
button,input,select,textarea,.card,.recap,.transfer,.banner,.modal { border-radius:6px; }
button:focus-visible { outline:2px solid #bc6456; outline-offset:3px; }
button svg { flex-shrink:0; }
h2 { color:var(--ink); }
#app.ft-shell { display:grid; grid-template-columns:216px minmax(0,1fr); max-width:1680px; min-height:100svh; }
.ft-workspace,.ft-view,.ft-body-grid { min-width:0; }
.ft-sidebar { position:sticky; top:0; height:100svh; overflow-y:auto; padding:28px 18px 18px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:18px; background:#f7faf8; }
.ft-sidebar button { margin:0; display:flex; align-items:center; text-align:left; background:none; color:var(--ink); gap:10px; }
.ft-sidebar .ft-wordmark { padding:0 0 28px; font:600 23px Georgia,serif; color:var(--brand); gap:6px; }
.ft-wordmark b { color:#ce7866; }
.ft-wordmark svg { width:25px; height:25px; }
.ft-eyebrow { font:600 10px Arial,sans-serif; color:#849289; }
.ft-trip-links { display:grid; gap:8px; }
.ft-sidebar .ft-trip-link { padding:8px 6px; font-size:12px; line-height:1.45; }
.ft-trip-link span { overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.ft-trip-link img { width:32px; height:38px; object-fit:cover; border-radius:4px; flex-shrink:0; }
.ft-sidebar .ft-trip-link.selected { background:#e6eee8; color:var(--brand); }
.ft-side-nav { display:grid; gap:5px; border-top:1px solid var(--line); padding-top:20px; }
.ft-side-nav button { font-size:13px; padding:12px; }
.ft-side-nav button.active { background:#285c47; color:#fff; }
.ft-sidebar-bottom { margin-top:auto; padding-top:24px; display:grid; gap:20px; }
.ft-sidebar .ft-all-trips { font-size:12px; padding:8px; }
.ft-sidebar .ft-profile { border-top:1px solid var(--line); padding:20px 0 0; font-size:13px; }
.ft-profile small { display:block; color:var(--muted); font-size:10px; margin-top:4px; }
.avatar { background:#e5eee7; color:var(--brand); font-size:12px; }
.topbar { position:relative; z-index:10; background:#fff; color:var(--ink); padding:16px 28px; min-height:68px; border-bottom:1px solid var(--line); }
.topbar h1 { font-family:Georgia,serif; font-size:23px; font-weight:400; }
.topbar .sub { font-family:Arial,sans-serif; font-size:11px; margin-top:3px; }
.ft-icon-button { display:inline-flex; justify-content:center; align-items:center; width:38px; height:38px; padding:0; margin:0; flex:0 0 38px; background:none; color:var(--brand); border:1px solid var(--line); }
.ft-icon-button:hover { background:#edf3ef; }
.ft-breadcrumb { flex:1; font-size:12px; color:var(--muted); }
.ft-member-stack { display:flex; padding-right:10px; }
.ft-member-stack .avatar { width:28px; height:28px; margin-left:-5px; border:2px solid #fff; font-size:9px; }
.group-banner { min-height:245px; height:auto; background-color:#285c47; background-image:none; padding:30px 36px; isolation:isolate; }
.group-banner::before { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,28,19,.68),rgba(10,28,19,0) 85%); z-index:-1; }
.group-banner.no-banner::before { background:none; }
.ft-cover-text { max-width:800px; color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.3); }
.ft-cover-text h1 { font:400 34px/1.17 Georgia,serif; margin:10px 0; overflow-wrap:anywhere; }
.ft-cover-text p { font-size:12px; opacity:.9; margin-bottom:0; }
.ft-cover-text .ft-eyebrow { color:#fff; }
.group-banner .edit { width:36px; height:36px; border-radius:6px; padding:0; top:16px; right:20px; display:flex; align-items:center; justify-content:center; }
.tabs-wrap { box-shadow:none; top:0; }
.tabs { padding:0 22px; }
.tabs button { flex:0 0 auto; display:flex; gap:8px; align-items:center; padding:17px 19px; font-size:12px; height:54px; }
.tabs button svg { width:16px; height:16px; }
.tabs button.active { border-bottom-color:#c97663; }
.ft-body-grid { display:grid; grid-template-columns:minmax(0,1fr) 246px; }
.ft-trip-aside { padding:28px 22px; border-left:1px solid var(--line); background:#fcfdfc; }
.ft-trip-aside h2 { font:400 17px Georgia,serif; margin:0 0 16px; }
.ft-aside-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.ft-aside-heading svg { color:#99a99e; width:17px; }
.ft-fact-preview { font-size:12px; line-height:1.65; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden; padding-bottom:8px; border-bottom:1px solid var(--line); }
.ft-text-button { font-size:11px; padding:0; margin:4px 0; width:auto; color:var(--brand); background:none; display:flex; align-items:center; gap:8px; }
.ft-text-button svg { width:14px; }
.ft-aside-divider { margin:24px 0; border-top:1px solid var(--line); }
.ft-timer-preview { border-left:2px solid #cd8574; padding-left:10px; margin:14px 0; }
.ft-timer-preview p { margin:0 0 4px; font-size:12px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.ft-timer-preview small { font-size:10px; color:var(--muted); }
.ft-person { display:flex; gap:10px; align-items:center; margin:12px 0; font-size:12px; }
.ft-person .avatar { width:28px; height:28px; font-size:10px; }
.ft-signature { display:flex; align-items:center; gap:8px; margin-top:42px; font:italic 12px/1.5 Georgia,serif; color:#8b9b90; }
.ft-signature svg { width:18px; flex-shrink:0; }
.ft-chat-heading { padding:26px 28px 6px; }
.ft-chat-heading h2 { font:400 24px/1.3 Georgia,serif; margin:8px 0 0; }
.context-meter { margin:6px 28px; padding:6px 0; border:0; border-radius:0; font-size:10px; }
.chat-search { top:54px; background:#fff; padding:10px 28px; border:0; }
.chat-search input { background:#f6f9f7; border-color:#e8eeea; font-size:12px; }
.chat-search .small { padding:7px; }
.chat { padding:18px 28px 28px; gap:20px; }
.event.msg,.event.msg.mine,.event.msg.bot { width:100%; max-width:100%; align-self:stretch; min-width:0; }
.event .who { display:flex; align-items:center; gap:8px; margin:0 0 8px; font-size:12px; color:var(--ink); }
.ft-message-avatar { width:27px; height:27px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#f1e4de; font-size:10px; color:#875b4c; }
.ft-message-avatar.otto { background:var(--brand); color:white; }
.ft-message-avatar svg { width:15px; height:15px; }
.ft-otto-label { font-size:9px; color:#65836e; font-weight:400; }
.event.msg .bubble,.event.msg.mine .bubble,.event.msg.bot .bubble { background:#fff; color:var(--ink); border:1px solid #e4ebe6; border-radius:6px; padding:15px 17px; font-size:14px; line-height:1.65; overflow-wrap:anywhere; }
.event.msg.mine .bubble { background:#fffbf9; border-color:#efe6df; }
.event.msg.bot .bubble { background:#f1f7f2; border-color:#dce9df; }
.event.msg.bot .who { color:var(--brand); }
.event.msg.mine .bubble .chat-link { color:var(--brand); }
.event .time { margin-top:6px; font-size:10px; opacity:1; color:#88958d; }
.event.system .bubble { background:#f3f6f4; border-radius:4px; font-size:11px; line-height:1.5; }
.bot-img,.chat-img { max-width:460px; border-radius:6px; box-shadow:none; margin-top:10px; }
.composer { position:sticky; bottom:0; left:auto; right:auto; z-index:16; max-width:none; margin:0; padding:14px 22px max(14px,env(safe-area-inset-bottom)); }
.composer-field { border-radius:6px; background:#fafcfb; }
.composer-field textarea { font:14px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
.composer .composer-send { width:42px; height:42px; padding:0; background:var(--brand); color:#fff; }
.composer-icon { color:#6e8275; border:0; }
.otto-responding { color:var(--brand); background:#f1f7f2; border-color:#dce9df; }
.ft-view>.content { padding:26px 28px; }
.ft-view>.content>.card,.ft-home>.content>.card { padding:0 0 26px; margin:0 0 26px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:none; }
.ft-view>.content>.card>h2 { font:400 23px Georgia,serif; margin-bottom:20px; }
.ft-view .fact-avatar { background:#e7eee9; color:var(--brand); }
.ft-view .list-item { font-size:14px; line-height:1.55; }
.ft-view .list-item .grow { min-width:0; overflow-wrap:anywhere; }
.ft-view .fab-bar { position:sticky; bottom:14px; left:auto; right:auto; max-width:none; margin:20px 28px; }
.ft-home>.content { max-width:1100px; margin:0 auto; padding:36px; }
.ft-home-heading h2 { font:400 36px Georgia,serif; margin:10px 0 18px; }
.ft-home-heading { margin-bottom:30px; }
.ft-home-heading .ft-text-button { font-size:15px; }
.ft-new-group>.content { max-width:680px; }
.ft-group-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.ft-group-list>h2 { grid-column:1/-1; font:400 22px Georgia,serif; margin:0; }
.ft-group-list .list-item { display:flex; align-items:flex-start; flex-wrap:wrap; gap:12px; border:1px solid var(--line); border-radius:6px; padding:16px; min-width:0; }
.ft-group-list .list-item .avatar { width:100%; height:160px; border-radius:4px; font-size:32px; }
.ft-group-list .list-item .grow { min-width:0; flex-basis:80%; }
.ft-group-list .title { font:400 20px/1.35 Georgia,serif; overflow-wrap:anywhere; }
.ft-group-list .muted { font-size:12px; margin-top:6px; }
#app.ft-auth-shell { display:block; max-width:100%; }
.ft-login .topbar { justify-content:center; }
.ft-login .topbar h1 { flex:none; }
.ft-login-photo { height:240px; position:relative; background:#294538; }
.ft-login-photo>img { width:100%; height:100%; object-fit:cover; object-position:center 52%; }
.ft-login-photo>div { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.22); }
.ft-login-photo h2 { font:400 38px/1.15 Georgia,serif; color:#fff; text-align:center; text-shadow:0 1px 6px #243d32; }
.ft-login>.content { max-width:440px; margin:12px auto; }
.ft-login .card { border:0; padding:16px; }
.ft-login .card h2 { font:400 26px Georgia,serif; }
.modal { border-radius:8px 8px 0 0; }
@media(min-width:1600px) { #app.ft-shell { border-left:1px solid var(--line); border-right:1px solid var(--line); } }
@media(max-width:1150px) and (min-width:761px) { #app.ft-shell { grid-template-columns:76px minmax(0,1fr); } .ft-sidebar { padding:24px 12px; } .ft-sidebar .ft-wordmark { justify-content:center; padding-bottom:12px; } .ft-sidebar button span:not(.avatar),.ft-sidebar .ft-eyebrow { display:none; } .ft-sidebar button { justify-content:center; } .ft-side-nav button { padding:13px; } .ft-trip-link img { width:32px; height:36px; } }
@media(max-width:1000px) { .ft-body-grid { grid-template-columns:minmax(0,1fr); } .ft-trip-aside { display:none; } }
@media(max-width:760px) { #app.ft-shell { display:block; } .ft-sidebar { display:none; } .topbar { padding:10px 16px; min-height:60px; } .group-banner { min-height:205px; padding:26px 20px; } .ft-cover-text h1 { font-size:28px; } .tabs { padding:0 8px; } .tabs button { padding:15px 13px; gap:6px; } .ft-chat-heading { padding:22px 18px 4px; } .ft-chat-heading h2 { font-size:23px; } .context-meter { margin:6px 18px; } .chat-search { padding:8px 14px; } .chat { padding:14px 16px 24px; gap:18px; } .composer { padding:10px 12px max(10px,env(safe-area-inset-bottom)); gap:5px; } .composer .composer-icon { width:34px; flex-basis:34px; } .ft-view>.content { padding:22px 18px; } .ft-home>.content { padding:26px 20px; } .ft-home-heading h2 { font-size:30px; } .ft-group-list { gap:16px; } .ft-group-list .list-item { padding:12px; } .ft-group-list .list-item .avatar { height:130px; } .ft-group-list .title { font-size:18px; } }
@media(max-width:480px) { .ft-group-list { grid-template-columns:minmax(0,1fr); } .ft-group-list .list-item .avatar { height:170px; } .ft-cover-text h1 { font-size:26px; } .event.msg .bubble,.event.msg.mine .bubble,.event.msg.bot .bubble { padding:12px 13px; } .ft-login-photo { height:200px; } .ft-login-photo h2 { font-size:32px; } .chat-search-status { flex-basis:36px; font-size:10px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }