/* Inselmodus V0.4 – eigenständige App, Original-Designsprache von MyGuide V198 */
:root,
:root[data-theme="light"] {
  --bg: #fafbf9;
  --surface: #ffffff;
  --surface-2: #edf6f8;
  --ink: #132b45;
  --ink-2: #52667a;
  --line: #d9e4eb;
  --accent: #075ca8;
  --accent-soft: #edf6f8;
  --night: #132b45;
  --gold: #f1b44a;
  --sun: #f1b44a;
  --shadow: 0 8px 25px #16334a10;
  --font-head: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color-scheme: light;
}
body { font-size: 15px; line-height: 1.6; }
.topbar { background: rgba(255,255,255,.97); border-bottom-color: var(--line); box-shadow: 0 5px 15px #16334a09; }
.topbar .wrap { max-width:1184px; }
.brand { font-size: 14px; letter-spacing:-.025em; }
.brand img { border-radius: 0; }
.iconbtn:hover { background: var(--surface-2); }
.tabbar { background:rgba(255,255,255,.97); border-top:1px solid var(--line); box-shadow:0 -4px 20px #16334a12; }
.tab { font-size:11px; font-family:system-ui; border:0; background:transparent; cursor:pointer; }
.tab .pill { width:44px; height:27px; }
.tab[aria-current="page"] { color:var(--blue,#075ca8); }
.tab[aria-current="page"] .pill { color:var(--accent); background:var(--accent-soft); }
.tab-action { appearance:none; }
.hero { background:#fafbf9; }
.hero img { aspect-ratio: 1 / 1.06; object-fit:cover; object-position: center top; }
.hero::after { height:17%; background:linear-gradient(to bottom, transparent, #fafbf9); }
.guide-start .wrap { padding-inline:18px; }
.trip-countdown { margin:-22px 0 0; position:relative; z-index:2; padding:14px 17px; display:flex; align-items:center; gap:13px; background:#fff; border:1px solid #d9e4eb; border-left:4px solid #087b8c; box-shadow:0 7px 24px #16334a15; border-radius:15px; min-height:78px; }
.counter-mark { font-size:25px; }
.counter-num { font-size:38px; font-weight:800; line-height:1; letter-spacing:-.04em; color:#075ca8; font-variant-numeric:tabular-nums; }
.counter-text { display:flex; flex-direction:column; font-size:14px; line-height:1.3; color:#132b45; gap:4px; }
.counter-text b { font-size:14px; }
.counter-text small { color:#52667a; font-size:11.5px; }
.sect { margin-top:22px; }
.sect h2 { font-weight:750; color:#132b45; font-size:19px; }
.sect-heading { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.sect-heading h2 { margin-bottom:11px; }
.small-menu { display:flex; align-items:center; gap:4px; border:0; background:none; color:#075ca8; font-weight:700; font-size:12px; padding:8px 2px; cursor:pointer; }
.small-menu .ic { width:17px; height:17px; }
.quick-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:9px; }
.quick-link { min-height:52px; display:flex; align-items:center; padding:11px 12px; background:#fff; border:1px solid #d9e4eb; border-radius:13px; box-shadow:0 3px 9px #16334a06; color:#132b45; font-size:12.5px; font-weight:700; text-decoration:none; line-height:1.3; }
.quick-link:active, .menu-quick-grid a:active { background:#edf6f8; }
.guide-topics { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:10px; }
.guide-topic { min-height:78px; display:flex; align-items:center; gap:8px; background:#fff; border:1px solid #d9e4eb; border-radius:15px; padding:13px; text-decoration:none; color:#132b45; font-size:14px; font-weight:750; }
.guide-topic-index { color:#075ca8; font-size:12px; align-self:flex-start; }
.guide-topic-name { flex:1; }
.guide-topic .ic { width:17px; height:17px; color:#087b8c; }
.rcard { border:1px solid #d9e4eb; }
.rcard strong { color:#132b45; }
.ch-unsere-reise, .ch-insel-entdecken, .ch-unsere-ideen, .ch-gut-vorbereitet { --accent:#075ca8; --accent-soft:#edf6f8; --accent-ink:white; }
.ptile, .pc { border:1px solid #d9e4eb; box-shadow:0 5px 16px #16334a0a; }
.ptile .cv { background:#edf6f8; }
.shead h1 { color:#132b45; }
.sheet-in, .search-in { background:#fff; }
/* All destinations in one responsive, quick-access navigation overlay. */
#dlg-nav { position:fixed; inset:0; margin:0 0 0 auto; height:100dvh; max-height:100dvh; width:min(100%,540px); max-width:100%; padding:0; border:0; border-left:1px solid #d9e4eb; background:#fff; color:#132b45; box-shadow:-10px 0 42px #132b4530; }
#dlg-nav::backdrop { background:rgba(10,35,60,.38); }
.nav-shell { display:flex; flex-direction:column; height:100%; }
.nav-head { display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid #d9e4eb; padding:calc(18px + env(safe-area-inset-top,0px)) 19px 16px; }
.nav-head small { font-size:10px; font-weight:800; letter-spacing:.09em; color:#087b8c; }
.nav-head h2 { margin:4px 0 0; font-size:22px; }
.nav-scroll { overflow-y:auto; overscroll-behavior:contain; padding:14px 18px calc(35px + env(safe-area-inset-bottom,0px)); }
.nav-search { display:flex; align-items:center; gap:10px; width:100%; height:49px; text-align:left; padding:10px 14px; color:#52667a; border:1px solid #d9e4eb; border-radius:12px; background:#f6fafb; font-size:14px; cursor:pointer; }
.nav-search .ic { width:21px; height:21px; }
.menu-quick h3 { margin:21px 0 10px; font-size:15px; }
.menu-quick-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.menu-quick-grid a { min-height:46px; padding:10px 9px; border:1px solid #d9e4eb; border-radius:9px; background:#fff; color:#132b45; text-decoration:none; font-size:12px; font-weight:650; display:flex; align-items:center; }
.menu-categories { margin-top:21px; border-top:1px solid #d9e4eb; }
.menu-section { border-bottom:1px solid #d9e4eb; }
.menu-section > summary { cursor:pointer; padding:16px 5px; display:flex; align-items:center; gap:12px; font-size:15px; }
.menu-section > summary::after { content:'+'; margin-left:auto; color:#075ca8; font-size:22px; font-weight:400; }
.menu-section[open] > summary::after { content:'−'; }
.menu-index { color:#075ca8; font-weight:750; font-size:12px; }
.menu-pages { padding:2px 1px 12px 20px; }
.menu-leaf, .menu-sub > summary { min-height:47px; padding:12px 8px; text-decoration:none; border-top:1px solid #edf2f5; display:flex; align-items:center; gap:5px; font-size:13.5px; color:#132b45; font-weight:630; }
.menu-sub > summary { cursor:pointer; list-style:none; justify-content:space-between; }
.menu-sub > summary::-webkit-details-marker { display:none; }
.menu-sub > summary::after { content:'⌄'; color:#075ca8; font-size:17px; }
.menu-sub[open] > summary::after { content:'⌃'; }
.menu-sub > summary span { margin-left:auto; font-size:11px; font-weight:500; color:#52667a; }
.menu-destinations { display:grid; padding:0 0 9px 14px; }
.menu-destinations a, .menu-overview { display:block; padding:10px 8px; min-height:40px; text-decoration:none; color:#34546a; font-size:13px; border-bottom:1px solid #eff3f5; }
.menu-overview { color:#075ca8!important; font-weight:750; }
.menu-intro { display:flex; align-items:center; width:100%; gap:10px; text-align:left; background:#edf6f8; border:1px solid #c9dfe8; border-radius:13px; margin:17px 0 10px; padding:14px 12px; color:#132b45; cursor:pointer; }
.menu-intro .ic { color:#075ca8; flex-shrink:0; }
.menu-intro span { flex:1; display:flex; flex-direction:column; gap:3px; }
.menu-intro strong { font-size:13px; }
.menu-intro small { font-size:12px; color:#52667a; }
.menu-settings { background:none; border:0; color:#52667a; display:flex; gap:10px; align-items:center; padding:13px 3px; font-size:13px; cursor:pointer; }
.menu-settings .ic { width:19px; height:19px; }
@media(min-width:560px) { .guide-start .wrap { max-width:1184px; } .guide-topics, .quick-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(min-width:900px) { .hero img { aspect-ratio:auto; max-height:650px; object-fit:cover; } .trip-countdown { max-width:760px; } .guide-start .wrap { padding-inline:28px; } .guide-topic { min-height:90px; } }
@media(max-width:370px) { .brand span { max-width:120px; } .counter-mark { display:none; } .quick-link { font-size:12px; } }
@media (prefers-reduced-motion: reduce) { .hero-anim { animation:none; } }

/* V0.5: verständlicher Startstatus auch wenn die JavaScript-Datei fehlt */
.startup-message {max-width:650px;margin:38px auto;padding:24px;border-radius:18px;border:1px solid #d9e4eb;background:white;color:#132b45;box-shadow:0 6px 24px #16334a12;}
.startup-message h1 {font-size:21px;}
.startup-message p {font-size:14px;}
.startup-help {padding-top:12px;border-top:1px solid #edf2f5;color:#52667a;}
.startup-help code {font-family:ui-monospace,monospace;font-size:12px;}