* { box-sizing: border-box; }
:root { --bg:#f1f4f8; --panel:#fff; --ink:#1f304c; --muted:#526278; --accent:#2856b8; --line:#dce3ef; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.55 "Segoe UI",sans-serif; }
button,input,select,textarea { font:inherit; }
a { color:var(--accent); }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #a54112 !important; outline-offset:3px; }
h1[tabindex="-1"]:focus { outline:none !important; }
.shell { max-width:1550px; margin:auto; padding:30px 5% 45px; display:grid; grid-template-columns:185px minmax(0,1fr); gap:30px; }
header { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:20px; border-bottom:1px solid var(--line); padding-bottom:24px; }
.brand { font-size:25px; font-weight:750; letter-spacing:-1px; text-decoration:none; color:var(--ink); min-height:44px; display:flex; align-items:center; }
.brand span { color:var(--accent); padding:0 6px; }
.header-note { font-size:12px; text-align:right; color:var(--muted); }
.sidebar { padding-top:24px; }
.sidebar a { display:flex; align-items:center; min-height:48px; padding:10px 14px; color:var(--ink); text-decoration:none; border-radius:6px; margin:8px 0; }
.sidebar a:first-of-type { color:#234a9c; background:#dfe8fb; }
.sidebar .note { padding:18px 14px; }
main { min-width:0; }
.eyebrow { text-transform:uppercase; letter-spacing:1.8px; font-size:11px; font-weight:750; color:var(--accent); margin-bottom:8px; }
.intro { padding:18px 0 8px; }
h1 { font-size:clamp(32px,3.5vw,44px); letter-spacing:-1.5px; line-height:1.12; margin:12px 0 18px; font-weight:750; }
h2 { font-size:23px; line-height:1.3; font-weight:700; letter-spacing:-.5px; }
h3 { font-size:19px; line-height:1.4; font-weight:700; margin:8px 0; }
p { margin:8px 0 16px; }
.intro p { color:var(--muted); max-width:580px; }
.feedback { min-height:28px; font-size:13px; color:#245b3b; }
.panel { border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.trip-toolbar { display:flex; gap:20px; justify-content:space-between; align-items:end; margin:8px 0 16px; }
.trip-switch { min-width:160px; max-width:400px; flex:1; }
.trip-switch label { display:block; font-size:12px; color:var(--muted); margin-bottom:4px; }
.trip-meta { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px; }
.trip-meta span,.tag { padding:6px 11px; border:1px solid var(--line); border-radius:30px; background:white; font-size:12px; }
.section-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.comparison { padding:24px; margin-bottom:32px; }
.filters { display:flex; flex-wrap:wrap; gap:0 18px; border:0; padding:0; margin:18px 0 12px; }
.filters legend { font-size:12px; color:var(--muted); margin-bottom:4px; }
.filters label,.check-row,.select-variant { display:flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; font-size:13px; }
input[type=checkbox] { width:18px; height:18px; flex:0 0 18px; accent-color:var(--accent); cursor:pointer; }
.scroll-hint { color:var(--muted); font-size:12px; }
.table-wrap { overflow:auto; max-height:530px; border:1px solid var(--line); border-radius:5px; }
table { border-collapse:separate; border-spacing:0; width:100%; min-width:660px; font-size:14px; table-layout:fixed; }
th,td { padding:15px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); width:210px; overflow-wrap:anywhere; }
th:first-child { width:160px; min-width:160px; position:sticky; left:0; z-index:1; background:#fff; font-weight:500; }
thead th { position:sticky; top:0; z-index:2; background:#f7f9fc; font-size:13px; font-weight:650; }
thead th:first-child { z-index:3; background:#f7f9fc; }
tr:last-child>* { border-bottom:0; }
td .price { font-size:19px; }
.note,.units { color:var(--muted); font-size:12px; }
.note { margin:14px 0 0; }
.empty-inline { padding:20px; background:#f6f8fc; border-radius:6px; }
.empty { padding:36px; text-align:center; }
.empty p { color:var(--muted); max-width:500px; margin:12px auto 24px; }
.first-trip { padding:40px 25px; }
.empty-symbol { color:var(--accent); background:#e8eefb; width:56px; height:56px; border-radius:16px; margin:0 auto 20px; font-size:30px; line-height:56px; }
.actions,.card-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.mud-button-root { min-height:44px; text-transform:none !important; font-family:inherit; font-weight:600; border-radius:6px; }
.action-link { display:inline-flex; min-height:44px; align-items:center; font-size:13px; padding:4px 6px; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:start; }
.variant-card { padding:18px; min-width:0; overflow-wrap:anywhere; }
.card-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.place { color:var(--muted); font-size:12px; font-weight:400; }
.accommodation { color:var(--muted); font-size:13px; }
.budget-summary { display:flex; flex-direction:column; gap:6px; }
.price { font-size:25px; line-height:1.25; letter-spacing:-.6px; }
.status-warning { display:block; font-size:12px; color:#754700; background:#fff4d9; padding:4px 7px; border-radius:4px; }
.missing { font-size:12px; color:#754700; margin:8px 0; }
.units { margin-top:6px; }
details { margin-top:16px; border-top:1px solid var(--line); }
summary { display:list-item; cursor:pointer; color:var(--accent); font-size:13px; font-weight:600; min-height:44px; padding:12px 0; }
.cost { display:flex; justify-content:space-between; gap:12px; font-size:12px; margin-top:8px; }
.cost strong { flex-shrink:0; }
.features { display:flex; gap:6px; flex-wrap:wrap; margin:16px 0; }
.features span { font-size:11px; background:var(--bg); padding:4px 7px; border-radius:4px; }
.road,.user-text { font-size:12px; white-space:pre-wrap; }
.road { border-top:1px solid var(--line); padding-top:12px; }
.card-actions { border-top:1px solid var(--line); margin-top:12px; padding-top:8px; justify-content:space-between; }
.card-actions .mud-button-root { font-size:12px; }
.count { font-size:15px; color:var(--muted); padding-left:6px; }
footer { margin-top:40px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
footer details { max-width:700px; }
dialog { color:var(--ink); border:1px solid var(--line); border-radius:12px; padding:26px; width:min(720px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; margin:auto; background:#fff; }
dialog::backdrop { background:rgba(21,36,58,.55); }
.dialog-heading { display:flex; gap:20px; justify-content:space-between; align-items:center; margin-bottom:20px; }
.icon-button { border:0; background:var(--bg); border-radius:6px; min-width:44px; min-height:44px; font-size:25px; cursor:pointer; }
.form-fields { border:0; padding:0; margin:0; min-width:0; }
.workspace-fields { border:0; padding:0; margin:0; min-width:0; }
.form-fields h3 { margin-top:24px; }
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:0 16px; }
.amenities { grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); }
.field { display:flex; flex-direction:column; gap:6px; margin:14px 0; min-width:0; }
.field label { font-size:13px; font-weight:600; }
.field input,select,textarea { width:100%; min-width:0; border:1px solid #8796ab; color:var(--ink); background:white; border-radius:5px; padding:10px 12px; min-height:44px; }
textarea { resize:vertical; }
.field [aria-invalid=true] { border-color:#af231a; }
.field-error { color:#af231a; font-size:12px; }
.child-row { display:flex; align-items:end; gap:12px; }
.child-row .field { flex:1; }
.child-row .mud-button-root { margin-bottom:14px; }
.form-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; border-top:1px solid var(--line); padding-top:18px; }
.budget-preview { background:var(--bg); padding:16px; border-radius:6px; font-size:12px; margin:14px 0; }
.boot { text-align:center; padding:100px 24px; font-size:22px; }
.auth-page { min-height:100dvh; display:grid; place-items:center; padding:24px; background:var(--bg); }
.auth-card { width:min(100%,430px); display:grid; gap:16px; }
.auth-card form { display:grid; gap:16px; }
#blazor-error-ui { display:none; position:fixed; bottom:0; width:100%; background:#fff0ed; color:#922319; padding:20px; z-index:9999; }
.skip-link { position:fixed; top:-100px; z-index:100; background:#fff; padding:12px; }
.skip-link:focus { top:0; }
@media(max-width:1150px) { .cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) { .shell { display:block; } .sidebar { display:none; } .trip-toolbar { flex-wrap:wrap; } .cards { grid-template-columns:1fr; } }
@media(max-width:520px) {
    .shell { padding:20px 16px 35px; }
    .header-note { max-width:115px; font-size:10px; }
    .brand { font-size:21px; }
    header { gap:10px; }
    .intro { padding-top:28px; }
    .comparison { padding:16px; }
    .section-head { flex-wrap:wrap; }
    .trip-toolbar { display:block; }
    .trip-toolbar .actions { margin-top:10px; }
    .empty { padding:24px 16px; }
    .form-grid,.amenities { grid-template-columns:1fr; }
    dialog { padding:20px 16px; width:calc(100% - 20px); max-height:calc(100dvh - 20px); }
    .filters { gap:0 12px; }
    table { min-width:650px; }
    th,td { width:180px; }
    th:first-child { width:110px; min-width:110px; padding-left:10px; padding-right:10px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
/* Analytics consent is deliberately compact and never obscures primary actions. */
.analytics-consent {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1200;
    max-width: 30rem;
    padding: .75rem 1rem;
    border: 1px solid #a9b8cc;
    border-radius: .75rem;
    background: #fff;
    box-shadow: 0 .3rem 1.2rem rgb(31 48 76 / 18%);
}

.analytics-consent p { margin: 0 0 .5rem; }
.auth-divider { margin: .75rem 0 .25rem; color: #526278; text-align: center; }
.trip-budget-settings { color: var(--ink); font-size: 14px; margin: 12px 0 20px; }
.budget-assessment { font-size: 13px; margin: 8px 0; }
.budget-assessment p { margin: 4px 0; overflow-wrap: anywhere; }
.clarifications { margin: 14px 0; border-top: 1px solid var(--line); padding-top: 12px; }
.clarifications summary { cursor: pointer; min-height: 44px; padding: 10px 0; font-weight: 600; }
.clarifications ul { padding-left: 20px; margin: 0; }
.clarifications li { margin: 6px 0; overflow-wrap: anywhere; }
.clarifications li .mud-button-root { display: block; }
