:root {
  --bg: #070a0f;
  --panel: #0d121a;
  --panel-2: #111824;
  --panel-3: #151e2b;
  --border: #202b3a;
  --border-soft: #182231;
  --text: #f3f6fb;
  --muted: #8c9aae;
  --muted-2: #637187;
  --blue: #7c9cff;
  --blue-soft: rgba(124, 156, 255, 0.12);
  --green: #25c58a;
  --green-soft: rgba(37, 197, 138, 0.12);
  --red: #f0616a;
  --red-soft: rgba(240, 97, 106, 0.12);
  --amber: #efb74f;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.24);
}

* { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; }
body {
  margin: 0;
  background: radial-gradient(circle at 18% -10%, rgba(67, 101, 190, 0.12), transparent 28rem), var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-variant-numeric: tabular-nums;
}
button, input, select { font: inherit; }
button { color: inherit; }
.app-shell { min-height: 100vh; }

.topbar {
  height: 72px;
  border-bottom: 1px solid var(--border-soft);
  background: rgba(7, 10, 15, 0.82);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  z-index: 20;
}
.topbar-inner {
  width: calc(100% - 16px);
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand { display: flex; align-items: center; gap: 13px; min-width: 0; }
.brand-mark {
  width: 38px; height: 38px; border-radius: 11px;
  display: grid; place-items: center;
  background: linear-gradient(145deg, #8ca9ff, #526fce);
  box-shadow: 0 10px 28px rgba(82, 111, 206, 0.25);
}
.brand-bars { display: flex; gap: 3px; align-items: flex-end; height: 17px; }
.brand-bars i { display: block; width: 3px; border-radius: 2px; background: #08101f; }
.brand-bars i:nth-child(1) { height: 7px; }
.brand-bars i:nth-child(2) { height: 12px; }
.brand-bars i:nth-child(3) { height: 17px; }
.brand-name { font-size: 15px; font-weight: 720; letter-spacing: -0.01em; white-space: nowrap; }
.brand-sub { color: var(--muted-2); font-size: 11px; margin-top: 2px; white-space: nowrap; }
.top-status { display: flex; align-items: center; gap: 10px; }
.hidden { display: none !important; }
.table-scroll { overflow-x: auto; }
.chart-stage { position: relative; flex: 1 1 auto; min-height: 190px; }
.legend-up { background: var(--green); }
.legend-down { background: var(--red); }
.catalog-empty { color: var(--muted); font-size: 11px; padding: 10px; }
.inline-error { min-height: 16px; margin-top: 8px; color: var(--red); font-size: 10px; }
.mobile-actions { display: flex; align-items: center; gap: 7px; }
.mobile-remove { opacity: 1; }
.mobile-empty { padding: 36px 18px; text-align: center; color: var(--muted); }

.user-menu { position: relative; }
.user-menu summary {
  min-height: 34px; padding: 0 12px; display: flex; align-items: center;
  border: 1px solid var(--border); border-radius: 999px; list-style: none;
  color: var(--muted); background: rgba(13,18,26,.8); font-size: 12px; cursor: pointer;
}
.user-menu summary::-webkit-details-marker { display: none; }
.user-menu summary::after { content: "⌄"; margin-left: 8px; color: var(--muted-2); }
.user-menu-card {
  position: absolute; top: calc(100% + 9px); right: 0; width: 178px; padding: 7px;
  background: #111824; border: 1px solid var(--border); border-radius: 11px;
  box-shadow: 0 18px 50px rgba(0,0,0,.4); z-index: 30;
}
.user-menu-card a, .user-menu-card button {
  width: 100%; min-height: 34px; padding: 0 10px; display: flex; align-items: center;
  border: 0; border-radius: 7px; background: transparent; color: var(--muted);
  text-decoration: none; font-size: 11px; cursor: pointer; text-align: left;
}
.user-menu-card a:hover, .user-menu-card button:hover { background: var(--panel-3); color: var(--text); }
.user-menu-card form { margin: 0; }
.toast {
  position: fixed; right: 22px; top: 88px; z-index: 50; padding: 11px 14px;
  border: 1px solid rgba(37,197,138,.35); border-radius: 10px;
  background: #10221c; color: #8ce0bf; font-size: 12px; box-shadow: var(--shadow);
}
.market-badge, .connection-badge {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 34px; padding: 0 12px;
  border: 1px solid var(--border); border-radius: 999px;
  color: var(--muted); background: rgba(13,18,26,.8); font-size: 12px;
}
.dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--muted-2); }
.dot.live { background: var(--green); box-shadow: 0 0 0 4px rgba(37,197,138,.1); }
.dot.loading { background: var(--amber); animation: pulse 1.1s infinite; }
.dot.error { background: var(--red); }
@keyframes pulse { 50% { opacity: .35; } }

.workspace {
  width: calc(100% - 16px);
  margin: 0 auto;
  padding: 10px 0 22px;
  display: grid;
  grid-template-columns: minmax(330px, 380px) minmax(0, 1fr);
  grid-template-areas: "sidebar desktop" "foot foot";
  align-items: start;
  gap: 10px;
}
.panel {
  background: linear-gradient(180deg, rgba(16,23,34,.98), rgba(11,16,24,.98));
  border: 1px solid var(--border);
  border-radius: 17px;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.market-sidebar { grid-area: sidebar; min-width: 0; display: grid; align-content: start; gap: 10px; max-height: calc(100vh - 92px); overflow-y: auto; scrollbar-width: thin; }
.watch-panel { min-width: 0; }
.desktop-panel { grid-area: desktop; min-width: 0; }
.panel-head { padding: 19px 20px 16px; border-bottom: 1px solid var(--border-soft); }
.panel-title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.eyebrow { color: var(--muted-2); font-size: 10px; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }
h1, h2, p { margin: 0; }
.panel-title { font-size: 18px; letter-spacing: -.025em; margin-top: 4px; font-weight: 680; }
.head-actions { display: flex; gap: 8px; align-items: center; }
.icon-button, .secondary-button, .primary-button {
  border: 1px solid var(--border); border-radius: 10px; min-height: 36px;
  background: var(--panel-2); cursor: pointer; transition: .18s ease;
}
.icon-button { width: 36px; display: grid; place-items: center; color: var(--muted); font-size: 18px; }
.icon-button:hover, .secondary-button:hover { color: var(--text); border-color: #344258; background: var(--panel-3); }
.primary-button { padding: 0 14px; border-color: rgba(124,156,255,.3); background: var(--blue-soft); color: #b7c6ff; font-size: 12px; font-weight: 680; }
.primary-button:hover { background: rgba(124,156,255,.18); }
.secondary-button { padding: 0 12px; color: var(--muted); font-size: 12px; }
.watch-toolbar { padding: 11px 12px; display: flex; flex-wrap: wrap; gap: 8px; border-bottom: 1px solid var(--border-soft); }
.search-wrap { position: relative; flex: 1; }
.search-wrap::before { content: "⌕"; position: absolute; left: 12px; top: 8px; color: var(--muted-2); font-size: 19px; line-height: 1; }
.search-input, .field-input {
  width: 100%; height: 38px; border: 1px solid var(--border); border-radius: 10px;
  background: #0a0f17; color: var(--text); outline: none;
}
.search-input { padding: 0 12px 0 38px; }
.field-input { padding: 0 11px; }
.search-input:focus, .field-input:focus { border-color: rgba(124,156,255,.55); box-shadow: 0 0 0 3px rgba(124,156,255,.08); }
.search-input::placeholder, .field-input::placeholder { color: #536074; }
.refresh-control { width: 100%; display: flex; align-items: center; justify-content: flex-end; gap: 7px; color: var(--muted-2); font-size: 11px; white-space: nowrap; }
.refresh-select { height: 38px; border: 1px solid var(--border); border-radius: 10px; padding: 0 28px 0 10px; color: var(--muted); background: var(--panel-2); outline: none; }
.stock-table { width: 100%; min-width: 610px; border-collapse: collapse; }
.stock-table th {
  padding: 10px 12px; color: var(--muted-2); font-size: 10px; text-transform: uppercase;
  letter-spacing: .08em; text-align: right; font-weight: 700; border-bottom: 1px solid var(--border-soft);
}
.stock-table th:first-child { padding-left: 18px; text-align: left; }
.stock-table th:last-child { width: 42px; }
.stock-row { border-bottom: 1px solid var(--border-soft); cursor: pointer; transition: background .14s ease; }
.stock-row:hover { background: rgba(255,255,255,.018); }
.stock-row.selected { background: linear-gradient(90deg, rgba(124,156,255,.10), rgba(124,156,255,.025)); box-shadow: inset 3px 0 var(--blue); }
.stock-row td { padding: 10px 8px; text-align: right; font-size: 11px; }
.stock-row td:first-child { text-align: left; padding-left: 12px; }
.stock-name { font-size: 11px; font-weight: 670; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px; }
.stock-meta { color: var(--muted-2); font-size: 10px; margin-top: 4px; display: flex; align-items: center; gap: 7px; }
.venue-tag { padding: 2px 5px; border-radius: 4px; background: rgba(124,156,255,.08); color: #7890d6; }
.quote-main { font-weight: 720; letter-spacing: .01em; }
.quote-sub { font-size: 9px; color: var(--muted-2); margin-top: 4px; }
.change { display: inline-flex; justify-content: flex-end; min-width: 66px; padding: 4px 7px; border-radius: 6px; font-weight: 680; }
.change.up, .up { color: var(--green); }
.change.up { background: var(--green-soft); }
.change.down, .down { color: var(--red); }
.change.down { background: var(--red-soft); }
.change.flat, .flat { color: var(--muted); }
.change.flat { background: rgba(140,154,174,.08); }
.remove-button { opacity: 0; width: 28px; height: 28px; border: 0; background: transparent; color: var(--muted-2); cursor: pointer; border-radius: 7px; }
.stock-row:hover .remove-button, .remove-button:focus { opacity: 1; }
.remove-button:hover { color: var(--red); background: var(--red-soft); }
.chart-open-button { min-width: 32px; height: 28px; padding: 0 8px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel-2); color: var(--muted); cursor: pointer; font-size: 12px; }
.chart-open-button:hover, .chart-open-button.active { color: #c7d2ff; border-color: rgba(124,156,255,.4); background: var(--blue-soft); }
.skeleton { display: inline-block; width: 54px; height: 10px; border-radius: 5px; background: linear-gradient(90deg, #17202d, #202b3a, #17202d); background-size: 200%; animation: shimmer 1.4s infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
.add-drawer { padding: 15px 16px; background: rgba(7,10,15,.35); border-bottom: 1px solid var(--border-soft); }
.catalog-results { display: grid; grid-template-columns: 1fr; gap: 7px; max-height: 210px; overflow: auto; }
.catalog-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 11px; border: 1px solid var(--border-soft); border-radius: 9px; background: #0b1119; cursor: pointer; text-align: left; }
.catalog-item:hover { border-color: #35445a; background: #101722; }
.catalog-item b { display: block; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.catalog-item span { color: var(--muted-2); font-size: 9px; }
.catalog-plus { color: var(--blue) !important; font-size: 18px !important; }
.catalog-add { color: #aebeff !important; font-size: 10px !important; font-weight: 680; white-space: nowrap; }
.type-tag { display: inline-block; margin-left: 5px; padding: 1px 5px; border-radius: 4px; background: var(--blue-soft); color: #aebeff; font-size: 8px; font-style: normal; text-transform: uppercase; letter-spacing: .06em; }
.search-drawer-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 11px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.search-close { flex: 0 0 auto; border: 0; background: transparent; color: #aebeff; font-size: 10px; cursor: pointer; }
.search-close:hover { color: var(--text); }
.desktop-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.desktop-head p { margin-top: 7px; color: var(--muted); font-size: 11px; }
.desktop-count { margin-left: 6px; color: var(--muted-2); font-size: 11px; font-weight: 600; }
.desktop-notice { padding: 10px 16px; color: #f4cb79; background: rgba(239,183,79,.08); border-bottom: 1px solid rgba(239,183,79,.16); font-size: 11px; }
.chart-desktop { position: relative; height: calc(100vh - 183px); min-height: 640px; overflow: auto; background-color: #080c12; background-image: linear-gradient(rgba(76,91,116,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(76,91,116,.07) 1px, transparent 1px), radial-gradient(circle at 50% 0, rgba(63,87,144,.09), transparent 42rem); background-size: 24px 24px, 24px 24px, auto; }
.chart-tile { position: absolute; min-width: 330px; min-height: 320px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #2c3b51; border-radius: 13px; background: var(--panel); box-shadow: 0 20px 55px rgba(0,0,0,.42); }
.chart-tile-head { min-height: 72px; padding: 13px 45px 12px 15px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--border-soft); background: linear-gradient(180deg, #111824, #0d131d); }
.drag-handle { cursor: move; touch-action: none; user-select: none; }
.chart-identity { min-width: 0; }
.chart-identity h2 { margin: 3px 0 2px; overflow: hidden; color: var(--text); font-size: 16px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.chart-identity > div:last-child { overflow: hidden; color: var(--muted-2); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.tile-price { flex: 0 0 auto; text-align: right; }
.tile-price strong { display: block; font-size: 16px; }
.tile-price span { display: block; margin-top: 3px; font-size: 10px; }
.chart-close { position: absolute; top: 12px; right: 12px; width: 27px; height: 27px; border: 0; border-radius: 7px; background: rgba(255,255,255,.035); color: var(--muted); cursor: pointer; font-size: 18px; line-height: 1; }
.chart-close:hover { color: var(--red); background: var(--red-soft); }
.desktop-empty { width: 100%; min-height: 270px; display: grid; place-content: center; gap: 7px; color: var(--muted); text-align: center; }
.desktop-empty strong { color: var(--text); font-size: 15px; }
.desktop-empty span { font-size: 11px; }
.resize-grip { position: absolute; right: 4px; bottom: 4px; width: 15px; height: 15px; border-right: 2px solid #60708a; border-bottom: 2px solid #60708a; opacity: .8; pointer-events: none; }
.resize-note { color: var(--muted-2); font-size: 9px; white-space: nowrap; }
.chart-controls { padding: 11px 15px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-soft); }
.segmented { display: inline-flex; padding: 3px; border: 1px solid var(--border); border-radius: 9px; background: #0a0f17; }
.segmented button { min-width: 34px; height: 27px; padding: 0 8px; border: 0; border-radius: 6px; color: var(--muted-2); background: transparent; cursor: pointer; font-size: 10px; font-weight: 650; }
.segmented button.active { color: var(--text); background: var(--panel-3); box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.chart-wrap { position: relative; width: 100%; height: 100%; background: #0a0f16; }
.chart-canvas { display: block; width: 100%; height: 100%; cursor: crosshair; }
.chart-loading, .chart-error { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: 12px; background: rgba(10,15,22,.72); z-index: 2; }
.chart-tooltip { position: absolute; left: 18px; top: 13px; display: flex; gap: 10px; font-size: 10px; color: var(--muted); pointer-events: none; }
.chart-tooltip b { color: #c5cfdd; font-weight: 650; margin-left: 3px; }
.chart-footer { min-height: 50px; padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid var(--border-soft); }
.source-note { display: flex; align-items: center; gap: 8px; color: var(--muted-2); font-size: 10px; }
.source-note strong { color: var(--muted); font-weight: 620; }
.legend { display: flex; gap: 12px; color: var(--muted-2); font-size: 9px; }
.legend i { display: inline-block; width: 7px; height: 7px; border-radius: 2px; margin-right: 4px; }
.disclaimer { grid-area: foot; display: flex; justify-content: space-between; gap: 30px; padding: 0 4px; color: var(--muted-2); font-size: 10px; line-height: 1.55; }
.disclaimer a { color: var(--muted); text-decoration: none; }
.disclaimer a:hover { color: var(--text); }
.empty-row td { padding: 40px 20px !important; text-align: center !important; color: var(--muted); }
.mobile-cards { display: none; }

.index-panel summary { list-style: none; min-height: 58px; padding: 13px 15px; display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; border-bottom: 1px solid transparent; }
.index-panel summary::-webkit-details-marker { display: none; }
.index-panel[open] summary { border-bottom-color: var(--border-soft); }
.index-panel summary b { display: block; font-size: 14px; }
.index-panel summary small { display: block; margin-top: 3px; color: var(--muted-2); font-size: 9px; }
.index-count { min-width: 30px; padding: 4px 7px; border: 1px solid var(--border); border-radius: 999px; color: #afbeef; background: var(--blue-soft); font-size: 10px; text-align: center; }
.index-panel .compact-scroll { max-height: 310px; overflow: auto; }
.compact-table th { padding: 8px; }
.compact-table th:first-child { padding-left: 12px; }

.auth-body {
  min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(circle at 50% -10%, rgba(67,101,190,.18), transparent 34rem), var(--bg);
}
.auth-shell { width: min(100%, 430px); }
.auth-shell.wide { width: min(100%, 620px); }
.auth-card {
  padding: 28px; border: 1px solid var(--border); border-radius: 18px;
  background: linear-gradient(180deg, rgba(16,23,34,.99), rgba(11,16,24,.99));
  box-shadow: 0 30px 90px rgba(0,0,0,.38);
}
.auth-brand { display: flex; align-items: center; gap: 12px; padding-bottom: 22px; border-bottom: 1px solid var(--border-soft); }
.auth-heading { margin: 26px 0 20px; }
.auth-heading h1, .check-title { margin: 5px 0 8px; font-size: 25px; letter-spacing: -.035em; }
.auth-heading p, .check-summary { color: var(--muted); font-size: 12px; line-height: 1.55; }
.auth-form { display: grid; gap: 15px; }
.auth-form label { color: var(--muted); font-size: 11px; font-weight: 650; }
.auth-form .field-input { height: 43px; margin-top: 7px; }
.auth-submit { min-height: 43px; justify-content: center; margin-top: 2px; }
.auth-note { margin-top: 20px; color: var(--muted-2); font-size: 10px; text-align: center; }
.alert { margin-bottom: 17px; padding: 11px 12px; border-radius: 9px; font-size: 11px; line-height: 1.45; }
.alert.error { color: #ffadb2; background: var(--red-soft); border: 1px solid rgba(240,97,106,.23); }
.alert.success { color: #8ce0bf; background: var(--green-soft); border: 1px solid rgba(37,197,138,.23); }
.field-hint { color: var(--muted-2); font-size: 10px; line-height: 1.45; }
.back-link { display: inline-block; margin-top: 20px; color: #a9b9ed; font-size: 11px; text-decoration: none; }
.back-link:hover { color: var(--text); }
.check-summary { margin: 0 0 20px; }
.check-list { border: 1px solid var(--border-soft); border-radius: 11px; overflow: hidden; }
.check-row { display: flex; justify-content: space-between; gap: 16px; padding: 13px; border-bottom: 1px solid var(--border-soft); color: var(--muted); font-size: 11px; }
.check-row:last-child { border-bottom: 0; }
.check-row strong { font-weight: 680; text-align: right; }

@media (max-width: 1180px) {
  .workspace { grid-template-columns: minmax(300px, 340px) minmax(0, 1fr); }
  .chart-desktop { min-height: 600px; }
}
@media (max-width: 720px) {
  .topbar { height: 62px; }
  .topbar-inner, .workspace { width: calc(100% - 12px); }
  .brand-sub, .market-badge { display: none; }
  .connection-badge { padding: 0 10px; }
  .user-menu summary { width: 34px; padding: 0; justify-content: center; font-size: 0; }
  .user-menu summary::before { content: "●"; font-size: 8px; color: var(--green); }
  .user-menu summary::after { display: none; }
  .workspace { padding-top: 8px; gap: 8px; grid-template-columns: 1fr; grid-template-areas: "sidebar" "desktop" "foot"; }
  .market-sidebar { max-height: none; overflow: visible; }
  .panel { border-radius: 13px; }
  .panel-head { padding: 15px; }
  .watch-toolbar { flex-wrap: wrap; }
  .refresh-control { width: 100%; justify-content: flex-end; }
  .stock-table { min-width: 580px; }
  .mobile-stock { padding: 14px 15px; border-bottom: 1px solid var(--border-soft); }
  .mobile-stock.selected { background: var(--blue-soft); }
  .mobile-stock-top, .mobile-quotes { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
  .mobile-actions { display: flex; align-items: center; gap: 7px; }
  .mobile-actions .remove-button { opacity: 1; }
  .mobile-quotes { margin-top: 12px; }
  .mobile-quotes > div { flex: 1; }
  .mobile-quotes label { display: block; color: var(--muted-2); font-size: 9px; text-transform: uppercase; margin-bottom: 3px; }
  .catalog-results { grid-template-columns: 1fr; }
  .desktop-head { align-items: flex-start; }
  .desktop-head p, .resize-note, .resize-grip { display: none; }
  .chart-desktop { height: auto; min-height: 440px; overflow: visible; padding: 8px; display: grid; gap: 10px; }
  .chart-tile { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; min-width: 0; height: 420px !important; }
  .drag-handle { cursor: default; }
  .chart-controls { overflow-x: auto; }
  .chart-tooltip { gap: 5px; font-size: 8px; }
  .legend { display: none; }
  .disclaimer { display: block; }
  .auth-body { padding: 13px; }
  .auth-card { padding: 22px; }
}

/* v1.5: einheitlicher, frei platzierbarer Fenster-Desktop */
.workspace { width:calc(100% - 16px); margin:0 auto; padding:8px 0 20px; display:block; }
.workspace-toolbar { min-height:58px; padding:8px 12px; display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid var(--border); border-radius:13px 13px 0 0; background:linear-gradient(180deg,rgba(16,23,34,.98),rgba(11,16,24,.98)); }
.workspace-toolbar strong { display:block; margin-top:3px; font-size:13px; }
.workspace-toolbar span { display:block; margin-top:2px; color:var(--muted-2); font-size:10px; }
.toolbar-actions { display:flex; align-items:center; gap:8px; }
.window-canvas-scroll { width:100%; height:calc(100vh - 160px); min-height:650px; overflow:auto; border:1px solid var(--border); border-top:0; border-radius:0 0 15px 15px; background:#080c12; scrollbar-width:thin; }
.window-canvas { position:relative; min-width:100%; min-height:100%; background-image:linear-gradient(rgba(76,91,116,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(76,91,116,.07) 1px,transparent 1px),radial-gradient(circle at 50% 0,rgba(63,87,144,.09),transparent 42rem); background-size:24px 24px,24px 24px,auto; }
.desktop-window { position:absolute; min-width:300px; min-height:220px; display:flex; flex-direction:column; overflow:hidden; border:1px solid #2c3b51; border-radius:13px; background:var(--panel); box-shadow:0 20px 55px rgba(0,0,0,.42); }
.window-titlebar { position:relative; flex:0 0 auto; min-height:64px; padding:11px 46px 10px 14px; display:flex; align-items:center; justify-content:space-between; gap:14px; border-bottom:1px solid var(--border-soft); background:linear-gradient(180deg,#111824,#0d131d); }
.window-title { margin:3px 0 0; font-size:15px; line-height:1.15; letter-spacing:-.02em; }
.window-subtitle { margin-top:4px; color:var(--muted-2); font-size:9px; }
.drag-handle { cursor:move; touch-action:none; user-select:none; }
.resize-grip { display:block; position:absolute; right:0; bottom:0; z-index:60; width:34px; height:34px; border:0; border-radius:10px 0 11px 0; background:linear-gradient(135deg,transparent 42%,rgba(124,156,255,.18) 43%); cursor:nwse-resize; touch-action:none; opacity:1; }
.resize-grip::after { content:""; position:absolute; right:7px; bottom:7px; width:13px; height:13px; border-right:3px solid #91a5ca; border-bottom:3px solid #91a5ca; border-radius:1px; }
.resize-grip:hover { background:linear-gradient(135deg,transparent 36%,rgba(124,156,255,.32) 37%); }
.list-window > .table-scroll { flex:1 1 auto; min-height:0; max-height:none; overflow:auto; scrollbar-width:thin; }
.watch-toolbar { flex:0 0 auto; padding:9px 10px; gap:7px; }
.search-wrap { flex:1 1 220px; }
.search-input { font-size:11px; }
.refresh-control { width:100%; font-size:10px; }
.refresh-select { height:34px; font-size:10px; }
.add-drawer { flex:0 0 auto; padding:11px 12px; }
.catalog-results { max-height:170px; }
.stock-table { width:100%; min-width:500px; table-layout:fixed; }
.stock-table th { position:sticky; top:0; z-index:2; padding:8px 5px; background:#0d131c; font-size:9px; }
.stock-table th:first-child { width:132px; padding-left:10px; }
.stock-table th:nth-child(2),.stock-table th:nth-child(3),.stock-table th:nth-child(4) { width:68px; }
.stock-table th:nth-child(5) { width:70px; }
.stock-table th:nth-child(6) { width:46px; }
.stock-table th:last-child { width:34px; }
.stock-row td { padding:8px 5px; font-size:10px; overflow:hidden; }
.stock-row td:first-child { padding-left:10px; }
.stock-name { max-width:118px; font-size:10px; }
.stock-meta { gap:5px; overflow:hidden; font-size:8px; white-space:nowrap; }
.change { min-width:59px; padding:3px 5px; white-space:nowrap; }
.chart-tile { min-width:330px; min-height:320px; display:flex; flex-direction:column; }
.chart-identity h2 { font-size:15px; }
.chart-controls { flex:0 0 auto; padding:9px 12px; overflow-x:auto; }
.chart-stage { flex:1 1 auto; min-height:170px; }
.chart-footer { flex:0 0 auto; min-height:44px; padding:9px 14px; }
.resize-note { padding-right:20px; }
.disclaimer { display:flex; justify-content:space-between; gap:30px; padding:8px 4px 0; }

@media (max-width:720px) {
  .workspace { width:calc(100% - 12px); display:block; }
  .workspace-toolbar { align-items:flex-start; }
  .workspace-toolbar span { max-width:180px; }
  .toolbar-actions { flex-direction:column; align-items:stretch; }
  .toolbar-actions button { min-height:29px; }
  .window-canvas-scroll { height:calc(100vh - 156px); min-height:520px; }
  .desktop-window,.chart-tile { position:absolute!important; left:auto; top:auto; width:auto!important; height:auto!important; }
  .resize-grip { display:block; }
  .drag-handle { cursor:move; }
  .disclaimer { display:block; }
}

/* v1.6: Hauptleiste, robuste Skalierung und Kursimpulse */
.topbar-inner { gap:14px; }
.topbar-actions,.top-status { display:flex; align-items:center; gap:8px; }
.topbar-actions { margin-left:auto; }
.topbar-interval { display:flex; align-items:center; gap:6px; color:var(--muted-2); font-size:10px; white-space:nowrap; }
.topbar-message { min-width:74px; color:#9eb0e9; font-size:10px; white-space:nowrap; }
.workspace { padding-top:8px; }
.window-canvas-scroll { height:calc(100vh - 104px); border:1px solid var(--border); border-radius:15px; }
.desktop-window { isolation:isolate; }
.resize-grip { display:block; position:absolute; right:0; bottom:0; z-index:100; width:42px; height:42px; border:0; border-radius:12px 0 11px 0; background:linear-gradient(135deg,transparent 36%,rgba(124,156,255,.26) 37%); cursor:nwse-resize!important; touch-action:none; user-select:none; pointer-events:auto; opacity:1; }
.resize-grip:hover { background:linear-gradient(135deg,transparent 28%,rgba(124,156,255,.42) 29%); }
.window-resizing,.window-resizing * { cursor:nwse-resize!important; user-select:none!important; }
.quote-flash { margin:-4px; padding:4px; border-radius:5px; }
.quote-flash.up { animation:quote-flash-up .9s ease-out; }
.quote-flash.down { animation:quote-flash-down .9s ease-out; }
@keyframes quote-flash-up { 0%,35% { color:#d9fff0; background:rgba(37,197,138,.58); box-shadow:0 0 0 1px rgba(37,197,138,.45); } 100% { background:transparent; box-shadow:none; } }
@keyframes quote-flash-down { 0%,35% { color:#ffe5e7; background:rgba(240,97,106,.58); box-shadow:0 0 0 1px rgba(240,97,106,.45); } 100% { background:transparent; box-shadow:none; } }

@media (max-width:1180px) {
  .brand-sub,.market-badge { display:none; }
  .topbar-message { display:none; }
}
@media (max-width:820px) {
  .topbar { height:auto; min-height:104px; }
  .topbar-inner { padding:7px 0; flex-wrap:wrap; }
  .topbar-actions { order:3; width:100%; justify-content:flex-end; }
  .topbar-actions button { min-height:30px; padding:0 8px; }
  .window-canvas-scroll { height:calc(100vh - 126px); min-height:520px; }
  .resize-grip { display:block; }
}

/* v1.7: kompakte, sortierbare Listen und stufenloser Chart-Zoom */
.window-titlebar { min-height:56px; padding:8px 46px 8px 11px; gap:11px; }
.watch-toolbar { padding:6px 8px; gap:6px; }
.search-input { height:32px; }
.stock-table { min-width:410px; }
.stock-table th { padding:5px 3px; font-size:8px; letter-spacing:.04em; }
.stock-table th:first-child { width:106px; padding-left:7px; }
.stock-table th:nth-child(2),.stock-table th:nth-child(3),.stock-table th:nth-child(4) { width:58px; }
.stock-table th:nth-child(5) { width:58px; }
.stock-table th:nth-child(6) { width:40px; }
.stock-table th:last-child { width:28px; }
.sort-button { display:inline-flex; align-items:center; gap:3px; padding:1px 0; border:0; background:transparent; color:inherit; font:inherit; text-transform:inherit; letter-spacing:inherit; cursor:pointer; }
.sort-button span { color:#526176; font-size:8px; }
.sort-button:hover,.sort-button.active { color:#c6d1f5; }
.sort-button.active span { color:var(--blue); }
.stock-row td { padding:5px 3px; font-size:9px; }
.stock-row td:first-child { padding-left:7px; }
.stock-name { max-width:96px; font-size:9px; }
.stock-meta { margin-top:1px; gap:3px; font-size:7px; }
.quote-main { white-space:nowrap; }
.change { min-width:52px; padding:2px 3px; }
.remove-button { width:22px; height:22px; border-radius:6px; }
.chart-open-button { min-width:25px; height:22px; padding:0 4px; border-radius:6px; font-size:10px; }
.zoom-reset { padding:2px 4px; border:0; border-radius:5px; background:transparent; color:#9aabd9; font-size:8px; cursor:pointer; }
.zoom-reset:hover { color:var(--text); background:var(--blue-soft); }

/* v1.8: größere Schrift, flache Indexmitglieder und eigenes Indexfenster */
.stock-table th { font-size:9px; }
.stock-row td { padding-top:6px; padding-bottom:6px; font-size:10px; }
.stock-name { max-width:100px; font-size:10px; }
.stock-meta { margin-top:2px; gap:4px; font-size:8px; }
.component-window .stock-row td { padding-top:3px; padding-bottom:3px; font-size:10px; }
.component-window .stock-name { max-width:102px; font-size:10px; line-height:1.15; }
.watch-window .remove-button { opacity:.62; }

/* v1.9: größere Typografie, kräftigeres Grün, sichere Menüebene und PWA */
:root {
  --green:#20df78;
  --green-soft:rgba(32,223,120,.16);
}
body { font-size:15px; }
.topbar { z-index:100000; overflow:visible; }
.topbar-inner,.top-status { position:relative; overflow:visible; }
.workspace { position:relative; z-index:1; }
.user-menu { z-index:100001; }
.user-menu[open] { z-index:100002; }
.user-menu-card { z-index:100003; width:194px; }
.brand-name { font-size:16px; }
.brand-sub { font-size:12px; }
.topbar-interval,.topbar-message { font-size:11px; }
.secondary-button,.primary-button { font-size:12px; }
.market-badge,.connection-badge,.user-menu summary { font-size:13px; }
.user-menu-card a,.user-menu-card button { font-size:12px; }
.window-title { font-size:16px; }
.window-subtitle,.eyebrow { font-size:10px; }
.search-input { font-size:12px; }
.stock-table { min-width:421px; }
.stock-table th { font-size:10px; }
.stock-table th:first-child { width:108px; }
.stock-table th:nth-child(2),.stock-table th:nth-child(3),.stock-table th:nth-child(4) { width:61px; }
.sort-button span { font-size:9px; }
.stock-row td { font-size:11px; }
.stock-name { max-width:102px; font-size:11px; }
.stock-meta { font-size:9px; }
.component-window .stock-row td { padding-top:3px; padding-bottom:3px; font-size:11px; line-height:1.12; }
.component-window .stock-name { max-width:104px; font-size:11px; line-height:1.12; }
.chart-open-button { font-size:11px; }
.catalog-item b { font-size:11px; }
.catalog-item span { font-size:9px; }
.catalog-add,.search-drawer-head,.search-close { font-size:10px!important; }
.index-count { font-size:11px; }
.chart-identity h2 { font-size:16px; }
.chart-identity > div:last-child { font-size:9px; }
.tile-price strong { font-size:15px; }
.tile-price span { font-size:10px; }
.segmented button { font-size:10px; }
.chart-tooltip,.source-note { font-size:10px; }
.resize-note,.zoom-reset { font-size:9px; }
.disclaimer { font-size:10px; }
.dot.live { background:var(--green); box-shadow:0 0 0 4px rgba(32,223,120,.14); }
@keyframes quote-flash-up {
  0%,35% { color:#e4fff0; background:rgba(32,223,120,.64); box-shadow:0 0 0 1px rgba(32,223,120,.52); }
  100% { background:transparent; box-shadow:none; }
}
.install-button {
  border-color:rgba(32,223,120,.32);
  background:rgba(32,223,120,.11);
  color:#8bf4b8;
}
.install-button:hover { border-color:rgba(32,223,120,.52); background:rgba(32,223,120,.18); }
.menu-install-button { color:#8bf4b8!important; }
.menu-install-button::before { content:"↓"; margin-right:8px; font-weight:800; }
.pwa-login-button { width:100%; margin-top:12px; color:#8bf4b8; border-color:rgba(32,223,120,.32); }
.pwa-toast {
  position:fixed; right:22px; top:88px; z-index:100010; max-width:min(380px,calc(100vw - 32px));
  padding:12px 15px; border:1px solid rgba(32,223,120,.36); border-radius:10px;
  background:#10251b; color:#a7f7c8; font-size:12px; line-height:1.45; box-shadow:var(--shadow);
  opacity:0; transform:translateY(-8px); pointer-events:none; transition:opacity .18s ease,transform .18s ease;
}
.pwa-toast.visible { opacity:1; transform:translateY(0); }

@media (max-width:820px) {
  .install-button { order:4; }
  .pwa-toast { right:12px; top:118px; }
}