:root{
  --paper:#f6f7f4; --surface:#ffffff; --ink:#18223b; --muted:#525c74; --line:#d6dae2;
  --rail:#18223b; --open:#7a5600; --open-bg:#fff1c4; --open-line:#e0a816;
  --ok:#1f5e40; --ok-bg:#dcefe4; --res:#284f88; --res-bg:#e1e9f6; --warn:#9b3424; --warn-bg:#f7dfd9;
  --focus:#2f63b0; --scrim:rgba(10,15,30,.55);
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#10151e; --surface:#19202d; --ink:#e9edf4; --muted:#a3adbf; --line:#2d3647;
    --rail:#c9d3e6; --open:#f3cf6a; --open-bg:#3a3017; --open-line:#e7b52e;
    --ok:#7fd3a6; --ok-bg:#183428; --res:#9dbcf0; --res-bg:#1c2a42; --warn:#f0a090; --warn-bg:#3d2019;
    --focus:#8fb4f5; --scrim:rgba(0,0,0,.65);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#10151e; --surface:#19202d; --ink:#e9edf4; --muted:#a3adbf; --line:#2d3647;
  --rail:#c9d3e6; --open:#f3cf6a; --open-bg:#3a3017; --open-line:#e7b52e;
  --ok:#7fd3a6; --ok-bg:#183428; --res:#9dbcf0; --res-bg:#1c2a42; --warn:#f0a090; --warn-bg:#3d2019;
  --focus:#8fb4f5; --scrim:rgba(0,0,0,.65);
  color-scheme:dark;
}
html{scroll-padding-top:env(safe-area-inset-top,0px);background:var(--paper)}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:18px;line-height:1.5;-webkit-text-size-adjust:100%}
a{color:inherit}
.wrap{max-width:860px;margin:0 auto;padding:32px 20px 120px}
h1{font-size:clamp(2.1rem,6.5vw,3.3rem);line-height:1.05;margin:0 0 .5rem;letter-spacing:-.015em}
h2{font-size:1.45rem;margin:0 0 .75rem}
.when{font-size:1.3rem;margin:0}
.facts{margin:.6rem 0 0;color:var(--muted);max-width:62ch}
.contact{margin-top:1.25rem;padding:14px 18px;border-left:6px solid var(--rail);background:var(--surface);font-size:1.1rem}
.contact a{font-weight:700;white-space:nowrap}

.route{overflow-x:auto;margin:2.25rem -20px 0;padding:0 20px 6px}
.route ol{display:flex;list-style:none;margin:0;padding:6px 0 0;min-width:max-content}
.stn{position:relative;min-width:150px;padding-right:28px}
.stn::before{content:"";position:absolute;top:13px;left:16px;right:0;height:6px;background:var(--rail)}
.stn.seg-open::before{background:repeating-linear-gradient(90deg,var(--open-line) 0 12px,transparent 12px 20px)}
.stn:last-child::before{display:none}
.dot{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;background:var(--surface);border:6px solid var(--rail)}
.stn.end .dot{background:var(--rail)}
.stn.open .dot{border-color:var(--open-line);background:var(--open-bg)}
.stn .name{font-weight:700;font-size:1.15rem;margin-top:.45rem;line-height:1.2}
.stn .sub{color:var(--muted);font-size:.95rem}
.stn.open .sub{color:var(--open)}

.todo{margin-top:2rem;background:var(--open-bg);border-radius:6px;padding:18px 20px}
.todo h2{color:var(--ink)}
.todo ul{margin:0;padding-left:1.25rem}
.todo li{margin:.25rem 0}
.todo.clear{background:var(--ok-bg)}
.todo p{margin:.5rem 0 0}
.info{margin-top:1.5rem;padding:16px 20px;background:var(--surface);border-radius:6px;white-space:pre-line}
.info h2{font-size:1.15rem;margin-bottom:.35rem}

.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.75rem}
button{font:inherit;font-weight:700;font-size:1rem;line-height:1.2;padding:12px 18px;min-height:48px;border-radius:6px;border:2px solid var(--ink);background:var(--surface);color:var(--ink);cursor:pointer}
button.primary{background:var(--ink);color:var(--paper)}
button.quiet{border-color:var(--line)}
button.danger{border-color:var(--warn);color:var(--warn)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
button[disabled]{opacity:.55;cursor:default}
.tools{margin-top:1rem;padding:16px;border:2px dashed var(--line);border-radius:6px}
.tools p{margin:0 0 .75rem;color:var(--muted)}
.tools .actions{margin-top:0}

.plan{margin-top:2.75rem}
.day{margin-top:1.75rem}
.day h3{font-size:1.25rem;margin:0 0 .25rem;padding-bottom:.4rem;border-bottom:3px solid var(--ink)}
.ev{display:grid;grid-template-columns:5.5rem 1fr auto;gap:4px 16px;padding:14px 0;border-bottom:1px solid var(--line);align-items:start}
.ev .t{font-weight:700;font-size:1.3rem;font-variant-numeric:tabular-nums;line-height:1.3}
.ev .title{font-weight:700;font-size:1.12rem;line-height:1.35}
.ev .meta{color:var(--muted);margin-top:2px}
.ev .meta a{font-weight:700;color:var(--ink)}
.ev.minor .title{font-weight:400}
.ev.minor .t{font-weight:400}
.ev.gap{background:var(--open-bg);border-bottom:none;border-radius:6px;padding:12px 14px;margin:8px 0}
.ev.gap .title{color:var(--ink)}
.ev.overlap{background:var(--warn-bg)}
.ev .edit{margin-top:8px;padding:6px 14px;min-height:40px;font-size:.92rem}
.chip{display:inline-block;font-size:.85rem;font-weight:700;padding:3px 11px;border-radius:999px;white-space:nowrap}
.chip.offen{background:var(--open-bg);color:var(--open)}
.chip.reserviert{background:var(--res-bg);color:var(--res)}
.chip.gebucht,.chip.bezahlt{background:var(--ok-bg);color:var(--ok)}
.empty{color:var(--muted);margin-top:1rem}

.costs{margin-top:2.75rem}
.tbl{overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:420px}
th,td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.92rem;color:var(--muted);font-weight:700}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.sum td{font-weight:700;border-bottom:2px solid var(--ink)}
.foot{margin-top:3rem;color:var(--muted);font-size:.92rem}

.banner{background:var(--res-bg);padding:14px 18px;border-radius:6px;margin-bottom:1.5rem}
.banner .actions{margin-top:.6rem}

.savebar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;padding:12px 20px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--paper)}
.savebar span{font-weight:700}
.savebar button{border-color:var(--paper)}
.savebar button.primary{background:var(--paper);color:var(--ink)}
.savebar button.quiet{background:transparent;color:var(--paper)}

.toast{position:fixed;left:50%;transform:translateX(-50%);top:calc(16px + env(safe-area-inset-top,0px));z-index:40;background:var(--ink);color:var(--paper);padding:12px 18px;border-radius:6px;font-weight:700;max-width:calc(100% - 32px);box-shadow:0 6px 24px rgba(0,0,0,.25)}
.toast[hidden]{display:none}

dialog{border:none;border-radius:8px;padding:0;width:calc(100% - 24px);max-width:660px;max-height:calc(100% - 24px);background:var(--surface);color:var(--ink)}
dialog::backdrop{background:var(--scrim)}
.dlg{padding:22px}
.dlg h2{margin-bottom:1rem}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.full{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:5px;font-weight:700;font-size:.95rem}
label.check{flex-direction:row;align-items:center;gap:10px}
label.check input{width:22px;height:22px}
input,select,textarea{font:inherit;font-weight:400;font-size:1rem;padding:10px;border:2px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);width:100%}
textarea{min-height:5.5rem;resize:vertical}
.err{color:var(--warn);font-weight:700;margin:.75rem 0 0}
.dlg .actions{justify-content:space-between}
.dlg .actions div{display:flex;gap:12px;flex-wrap:wrap}

@media (max-width:560px){
  body{font-size:17px}
  .ev{grid-template-columns:4.3rem 1fr}
  .ev .st{grid-column:2}
  .grid{grid-template-columns:1fr}
}
@media print{
  .actions,.tools,.savebar,.ev .edit,.banner,.toast{display:none!important}
  body{background:#fff;color:#000}
}

/* Ergänzungen für die gehostete Version */
a.btn{display:inline-flex;align-items:center;font-weight:700;font-size:1rem;line-height:1.2;padding:12px 18px;min-height:48px;border-radius:6px;border:2px solid var(--ink);background:var(--surface);color:var(--ink);text-decoration:none}
.topbar{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:space-between;margin-bottom:1.5rem;font-size:.95rem}
.topbar a{font-weight:700}
.share{margin-bottom:2rem;padding:16px 18px;background:var(--res-bg);border-radius:6px}
.share p{margin:0 0 .5rem}
.share .row{display:flex;gap:10px;flex-wrap:wrap}
.share input{flex:1 1 260px;font-size:.95rem}
.share .hint{margin:.5rem 0 0;color:var(--muted);font-size:.92rem}
.msg{padding-top:12vh}
.msg p{color:var(--muted);font-size:1.15rem}
.trips{margin-top:1.5rem}
.trip{padding:16px 0;border-bottom:1px solid var(--line)}
.trip .title{font-weight:700;font-size:1.2rem}
.trip .meta{color:var(--muted)}
.trip .actions{margin-top:.6rem}
