/* Legible at a glance: self-hosted type, strong contrast and generous targets. */
.project-guidance[hidden]{display:none}
.delete-in-editor{margin-top:24px}
@font-face{
  font-family:"Atkinson Hyperlegible Next";
  src:url("fonts/AtkinsonHyperlegibleNext.ttf") format("truetype");
  font-style:normal;
  font-weight:200 800;
  font-display:swap;
}
:root{
  --reading-font:"Atkinson Hyperlegible Next",Arial,system-ui,sans-serif;
  --ink:#13253f;
  --muted:#3b4b60;
  --accent:#174ea6;
  --line:#cbd5e1;
  font-family:var(--reading-font);
  font-size:17px;
  line-height:1.55;
  color:var(--ink);
  background:#f4f6fa;
}
body{background:#f4f6fa;color:var(--ink)}
h1,h2,h3{font-family:var(--reading-font);color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
h1{font-weight:750;letter-spacing:-.5px;line-height:1.15;font-size:42px}
h2{font-size:23px;letter-spacing:0;font-weight:700}
.brand{color:var(--ink);font-size:29px;letter-spacing:-.4px}
.sidebar{background:#eaf0f8;border-color:#cbd5e1}
.tagline,.local-note,.topbar,.eyebrow,.pill,.cover-label,.date,.trip-notes,.trip-footer,
.back,.trip-meta,.toggle,.step-number,.step-mode,.step-details,.route .dot,
.step summary,.empty,.field,.form-help,.drag-hint,
.editor-intro,.ai-intro p,.flow-steps,.ai-preview li span,.ai-notes,
.tip,.tip strong,.ai-banner p{color:var(--muted)}
.sub,.ai-preview li strong{color:var(--ink)}
.eyebrow,.cover-label,.step-number,.next-label{font-size:12px;letter-spacing:1px;font-weight:700}
.tagline,.local-note,.topbar,.pill,.form-help,.flow-steps{font-size:14px;line-height:1.5}
.pill{background:#fff;border-color:#b4c1d3}
.nav button,.side-bottom button{font-size:16px;color:var(--ink);min-height:44px}
.nav button.active{background:#dce7f8;color:#123c7f}
.count{font-size:14px;color:var(--ink);background:#fff}
.hero-buttons{flex-shrink:1}
.btn,.icon-btn,.search,.toggle,.text-btn,.back{font-size:16px}
.btn,.icon-btn,.text-btn{min-height:44px}
.btn{border-color:#a7b5c8;color:var(--accent);font-weight:650;line-height:1.35}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 3px 10px #13253f12}
.btn.primary:hover{background:#103c85;filter:none}
.btn.ai-button{background:#eaf0fc;color:#123c7f;border-color:#9db4d7}
.btn.danger,.form-error{color:#982323}
.icon-btn{color:#174ea6}
.search{padding:12px 15px;color:var(--ink);border-color:#a7b5c8}
input::placeholder,textarea::placeholder{color:#526176;opacity:1}
.sub,.date,.trip-notes,.trip-footer,.trip-meta,.toggle,.tip,.empty p,.editor-intro,
.ai-banner p,.ai-intro p,.ai-notice,.ai-preview li span,.ai-notes{font-size:16px;line-height:1.55}
.trip-title{font-size:22px;font-weight:700;color:var(--ink);line-height:1.3}
.trip{border-color:#cbd5e1}
.trip-cover{background:var(--tint)}
.trip-notes{min-height:49px}
.new-card{font-size:16px;background:#fff;color:var(--accent);border-color:#8599b6;padding:22px}
.tip{background:#edf2fa;border-color:#c6d3e6}
.tip strong{font-size:17px;color:var(--ink)}
.ai-banner{background:#e8f0fc;border-color:#bacde7}
.ai-banner h2{font-size:24px;color:var(--ink);letter-spacing:0}
.text-btn{color:var(--accent);font-weight:700}

.progress{background:#cbd5e1}
.progress span{background:#174ea6}
.journey-head{gap:15px}
.step{background:#fff;border-color:#bac7d9;padding:21px}
.step.next{border:2px solid #b65c00;border-left-width:6px;box-shadow:0 3px 12px #13253f0a}
.next-label{display:inline-block;background:#fff1c2;color:#13253f;padding:3px 8px;border-radius:5px;margin-bottom:9px}
.step-name{font-size:20px;font-weight:750;line-height:1.35;color:var(--ink);overflow-wrap:anywhere}
.step-mode{font-size:17px;font-weight:650;line-height:1.45;margin-top:7px;color:var(--muted)}
.step-check{width:28px;height:28px;accent-color:#174ea6}
.step-details{font-size:17px;line-height:1.55;margin-left:41px;color:var(--ink)}
.route{margin-top:17px;gap:10px 9px}
.route-label{display:inline-block;min-width:42px;font-weight:700;color:#3b4b60}
.route a{display:inline-block;min-height:36px;padding:4px 0;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.time-row{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;gap:10px 20px}
.step summary{font-size:16px;min-height:44px;padding-top:9px;color:var(--accent);font-weight:650}
.step-top{flex-wrap:wrap}
.step-actions{margin-left:41px;flex-basis:100%;max-width:none;justify-content:flex-start;gap:6px}
.move-btn{font-size:15px;color:#123c7f;border-color:#9eb4d3;background:#eef3fc;min-height:44px;min-width:94px}
.move-btn:hover{background:#dce7f8}
.step.done{background:#edf1f6;padding:13px 16px}
.step.done .step-name{color:#3b4b60;font-size:16px;font-weight:550;line-height:1.45}
.step.done .step-check{width:26px;height:26px}
.drag-hint{font-size:14px}
dialog{color:var(--ink);border-color:#b5c5dc}
.modal-head{background:#edf2fa}
.field{font-size:16px;line-height:1.45;font-weight:650;color:var(--ink)}
.field input,.field select,.field textarea{font-size:17px;line-height:1.5;color:var(--ink);border-color:#8b9db6;padding:12px}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid #174ea6;outline-offset:2px}
.more-details summary{font-size:17px;line-height:1.4;color:var(--accent);padding:4px 0}
.more-details summary span{font-size:15px;color:var(--muted);line-height:1.5}
.form-footer{flex-wrap:wrap}
.saved-step h3{font-size:24px}
.saved-step>p,.help-content{font-size:17px;line-height:1.55}
.saved-check{color:#174ea6}
.flow-steps{gap:12px;flex-wrap:wrap;color:var(--muted)}
.flow-steps b{color:var(--accent)}
.ai-notice{background:#edf2fa;color:#263e60}
.ai-preview h3{font-size:22px;color:var(--ink)}
.ai-preview li{font-size:18px;line-height:1.5}
.ai-preview li::marker{color:var(--accent)}
.code-input{font-size:15px;line-height:1.65;color:var(--ink)}
.ai-notes summary{min-height:44px;padding-top:9px}
.form-error{font-size:16px}
a{color:#174ea6}
#toast{font-size:16px;line-height:1.45;background:#13253f}
:focus-visible{outline:3px solid #174ea6;outline-offset:3px}
@media(max-width:1080px){h1{font-size:36px}.step-top{flex-wrap:wrap}.step-actions{margin-left:41px;max-width:none;flex-basis:100%;justify-content:flex-start}}
@media(max-width:700px){
  .main{padding:20px 18px}.sidebar{padding:16px 18px}.brand{font-size:27px}
  h1{font-size:32px;letter-spacing:-.3px}.hero .btn{font-size:16px;white-space:normal;padding:12px}
  .nav button{font-size:16px;padding:9px 12px}.topbar{font-size:12px;align-items:flex-start;gap:10px}
  .pill{font-size:13px;white-space:nowrap}.ai-banner{padding:22px}.ai-banner h2{font-size:23px;max-width:100%}
  .step{padding:18px}.step-details{margin-left:0}.step-actions{margin-left:0;gap:8px}.move-btn{min-width:108px}
  .trip-footer{align-items:flex-start;flex-wrap:wrap}.trip-footer .icon-btn{font-size:16px}
  .journey-head{align-items:flex-start}
  .field input,.field select,.field textarea{font-size:17px}.flow-steps{font-size:14px}
  .drag-hint{display:block}.new-card span{line-height:1.5}
}
@media print{
  body{background:white}.step.next{border:1px solid #555}.next-label{background:none;color:#111}
  .step.done .step-name{font-size:18px;color:#13253f}.step{box-shadow:none}
}
.mobile-account { display: none; }
@media (max-width: 700px) {
  .mobile-account { display: block; margin-top: 14px; }
}
@media print {
  .mobile-account { display: none; }
}

.topbar { flex-wrap: wrap; gap: 8px; }
.topbar-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
