:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:#f7f6f1; color:#172e2c; font-synthesis:none; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; }
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { opacity:.5; cursor:not-allowed; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:3px solid #c08d4b; outline-offset:3px; }
.app-shell { max-width:1180px; margin:auto; padding:0 32px; }
.site-header { display:flex; align-items:center; justify-content:space-between; height:86px; }
.brand { display:flex; align-items:center; gap:11px; font-size:25px; letter-spacing:-.07em; font-weight:800; }
.brand-mark { display:grid; place-items:center; width:35px; height:35px; border-radius:10px; background:#123c38; color:#f8e5a6; font-size:26px; line-height:1; }
.header-note { color:#6a7a75; font-size:13px; }
.hero { position:relative; overflow:hidden; display:flex; justify-content:space-between; min-height:240px; border-radius:24px; background:#123c38; color:#fff; padding:43px 48px; }
.eyebrow { margin:0 0 12px; color:#a16e30; font-size:11px; font-weight:800; letter-spacing:.17em; }
.hero .eyebrow { color:#f1d990; }
h1,h2,h3,p { margin-top:0; }
h1 { margin:0 0 10px; font-size:clamp(34px,4vw,54px); line-height:1.03; letter-spacing:-.055em; }
h2 { margin:0; font-size:27px; letter-spacing:-.045em; }
h3 { margin-bottom:8px; }
.hero-copy { max-width:460px; margin:0; color:#c9d8d2; line-height:1.55; }
.hero-art { position:relative; width:270px; flex:none; }
.route-line { position:absolute; left:10px; top:104px; width:280px; height:3px; background:#e8ce81; transform:rotate(-26deg); border-radius:10px; }
.route-dot { position:absolute; width:22px; height:22px; border:5px solid #f6e3aa; background:#123c38; border-radius:50%; }
.route-dot.one { left:17px; top:145px; }.route-dot.two { left:138px; top:91px; }.route-dot.three { left:260px; top:37px; }
.period-bar { display:flex; justify-content:space-between; align-items:center; gap:22px; padding:27px 2px 28px; border-bottom:1px solid #dfe3da; }
.period-control { display:flex; align-items:center; flex-wrap:wrap; gap:10px 16px; }
.period-control label { font-weight:700; font-size:13px; }
.period-control select { max-width:330px; min-width:205px; padding:10px 34px 10px 13px; border:1px solid #d6dfd7; border-radius:10px; background:#fff; color:#172e2c; font-weight:600; }
.period-actions,.data-actions { display:flex; flex-wrap:wrap; gap:9px; }
.muted { color:#6b7a74; font-size:13px; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:7px; min-height:41px; padding:9px 17px; border-radius:10px; border:1px solid transparent; font-size:13px; font-weight:700; line-height:1.2; text-decoration:none; white-space:nowrap; }
.button.primary { background:#d8a657; color:#172e2c; border-color:#d8a657; box-shadow:0 3px 0 #b68439; }
.button.primary:hover { background:#e5b76d; }
.button.ghost { background:#fff; border-color:#d8ded5; color:#234943; }
.button.ghost:hover { background:#eef4ed; }
.button.danger { color:#a53b3b; background:transparent; border-color:transparent; padding-left:0; }
.button.danger:hover { text-decoration:underline; }
.summary-grid { display:grid; grid-template-columns:1.6fr repeat(3,1fr); gap:14px; margin:26px 0 58px; }
.card { min-height:202px; background:#fff; border:1px solid #e7e9e2; border-radius:18px; padding:25px; box-shadow:0 6px 24px rgba(14,46,39,.035); }
.feature-card { background:#e4eee6; border-color:#d8e7d9; }
.card-label { color:#677b72; font-size:12px; font-weight:800; letter-spacing:.035em; margin-bottom:23px; }
.feature-value { display:block; color:#a35f34; font-size:clamp(28px,3vw,39px); letter-spacing:-.06em; line-height:1; }
.feature-value.positive { color:#1b6d4e; }
.feature-caption { margin:8px 0 23px; font-size:13px; color:#49615a; }
.progress-track { overflow:hidden; height:8px; background:#cbdacf; border-radius:20px; }
.progress-track span { display:block; height:100%; width:0; background:#3b8967; border-radius:20px; transition:width .25s ease; }
.progress-caption { margin:9px 0 0; font-size:11px; color:#587467; }
.stat-card strong { display:block; font-size:clamp(22px,2.3vw,30px); letter-spacing:-.055em; white-space:nowrap; }
.stat-card > p:last-child { margin:10px 0 0; color:#829088; font-size:12px; }
.ledger-section { margin-bottom:48px; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:16px; }
.section-head .eyebrow { margin-bottom:7px; }
.section-help { color:#7b8981; font-size:13px; margin:12px 0 22px; }
.trip-list { display:grid; gap:10px; }
.trip-card { background:#fff; border:1px solid #e4e8e1; border-radius:14px; padding:20px 23px; }
.trip-top,.trip-main,.trip-details,.trip-route { display:flex; align-items:center; }
.trip-top,.trip-main { justify-content:space-between; gap:12px; }
.trip-details { gap:11px; }
.trip-date { font-size:12px; color:#75847b; font-weight:650; }
.mode-pill { background:#e8f0e7; color:#376050; font-size:11px; padding:5px 9px; border-radius:20px; font-weight:750; }
.trip-price { font-size:15px; letter-spacing:-.02em; }
.trip-main { margin-top:12px; }
.trip-route { flex-wrap:wrap; gap:9px; font-size:17px; font-weight:750; letter-spacing:-.025em; }
.route-arrow { color:#acb8a8; font-weight:500; }
.trip-note { margin:12px 0 0; color:#718078; font-size:12px; }
.text-button { border:0; background:transparent; color:#316e58; text-decoration:underline; text-underline-offset:3px; font-size:12px; font-weight:700; }
.empty-state { padding:48px 20px; border:1px dashed #c9d5c9; border-radius:17px; text-align:center; background:#fcfdf9; }
.empty-icon { display:grid; place-items:center; margin:0 auto 13px; width:45px; height:45px; border-radius:14px; background:#e9f1e8; color:#3a765d; font-size:29px; }
.empty-state h3 { font-size:17px; }.empty-state p { color:#7c8981; font-size:13px; margin:0; }
.data-section { display:flex; justify-content:space-between; gap:25px; padding:29px 0 40px; border-top:1px solid #dfe3da; }
.data-section h2 { font-size:22px; }.data-section .muted { margin:9px 0 0; }
footer { border-top:1px solid #e3e5df; padding:23px 0 35px; color:#89958d; font-size:12px; }
.edit-dialog { width:min(550px,calc(100% - 22px)); max-height:calc(100% - 28px); padding:28px; border:0; border-radius:20px; box-shadow:0 30px 90px #0d2a2680; color:#172e2c; background:#fff; }
.edit-dialog::backdrop { background:#102a2899; }
.dialog-head { display:flex; justify-content:space-between; align-items:start; margin-bottom:26px; }
.dialog-head h2 { font-size:25px; }.dialog-head .eyebrow { margin-bottom:6px; }
.close-button { border:0; background:#f2f5f0; border-radius:50%; width:31px; height:31px; color:#507066; font-size:22px; line-height:1; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:17px; }
.form-grid label { display:flex; flex-direction:column; gap:7px; font-size:12px; font-weight:750; color:#4a5b55; }
.form-grid label.full { grid-column:1/-1; }
.form-grid input,.form-grid select,.form-grid textarea { width:100%; min-height:44px; border:1px solid #d8e0d7; border-radius:9px; padding:10px 12px; color:#172e2c; background:#fbfcf9; font-size:14px; font-weight:500; }
.form-grid textarea { resize:vertical; }
.form-grid small,.optional { color:#89948d; font-size:11px; font-weight:400; line-height:1.4; }
.form-error { min-height:16px; margin:14px 0 0; font-size:12px; color:#ae3636; }
.dialog-actions { display:flex; justify-content:end; gap:10px; align-items:center; margin-top:18px; }
.dialog-actions.split { justify-content:space-between; }.action-right { display:flex; gap:9px; }
.toast { position:fixed; left:50%; bottom:25px; transform:translate(-50%,20px); opacity:0; pointer-events:none; max-width:calc(100vw - 24px); padding:13px 18px; border-radius:10px; background:#123c38; color:#fff; box-shadow:0 12px 40px #123c3840; font-size:13px; transition:opacity .2s,transform .2s; z-index:10; }
.toast.visible { opacity:1; transform:translate(-50%,0); }.toast.error { background:#9e3a3a; }
@media (max-width:930px) { .summary-grid { grid-template-columns:repeat(3,1fr); }.feature-card { grid-column:1/-1; min-height:180px; }.period-bar,.data-section { align-items:start; flex-direction:column; }.hero-art { width:190px; }.route-dot.three { left:190px; }.route-line { width:210px; } }
@media (max-width:600px) { .app-shell { padding:0 17px; }.site-header { height:70px; }.header-note { display:none; }.hero { min-height:215px; padding:28px 25px; border-radius:19px; }.hero-copy { max-width:270px; font-size:14px; }.hero-art { display:none; }.period-bar { padding:22px 0; }.period-control { width:100%; display:grid; grid-template-columns:1fr; gap:7px; }.period-control select { width:100%; max-width:none; }.period-actions { width:100%; }.period-actions .button { flex:1; }.summary-grid { grid-template-columns:1fr 1fr; gap:9px; margin:20px 0 42px; }.feature-card { grid-column:1/-1; min-height:190px; }.card { padding:19px; min-height:145px; }.card-label { margin-bottom:19px; }.feature-card .card-label { margin-bottom:14px; }.stat-card strong { font-size:22px; }.stat-card > p:last-child { font-size:11px; }.section-head { align-items:start; }.section-head h2 { font-size:24px; }.section-head .button { padding:10px 12px; }.trip-card { padding:17px; }.trip-route { font-size:15px; gap:6px; }.data-section { padding-bottom:30px; }.data-actions { width:100%; }.data-actions > * { flex:1 1 45%; }.edit-dialog { padding:21px; }.form-grid { gap:13px; }.dialog-actions { flex-wrap:wrap; } }