:root {
  --kvb-red: #d71920;
  --kvb-red-dark: #a90f17;
  --kvb-red-soft: #fff0f1;
  --ink: #17191d;
  --muted: #656a73;
  --line: #e5e7eb;
  --surface: #ffffff;
  --canvas: #f2f3f5;
  --shadow: 0 18px 50px rgba(19, 23, 31, 0.14);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; margin: 0; }
body { overflow: hidden; }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible { outline: 3px solid rgba(215, 25, 32, 0.24); outline-offset: 2px; }
svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
[hidden] { display: none !important; }

.login-view { min-height: 100vh; display: grid; grid-template-columns: minmax(20rem, 0.95fr) minmax(28rem, 1.05fr); background: #fff; }
.login-brand { display: flex; min-height: 100vh; flex-direction: column; justify-content: flex-end; padding: clamp(2rem, 7vw, 7rem); color: #fff; background: var(--kvb-red); }
.login-brand p { margin: 1.25rem 0 0; font-size: clamp(1.3rem, 2vw, 2rem); font-weight: 650; letter-spacing: -0.02em; }
.login-panel { display: grid; min-height: 100vh; place-items: center; padding: 2rem; }
.login-card { width: min(100%, 27rem); }
.eyebrow { color: var(--kvb-red); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; }
.login-card h1 { margin: 0.55rem 0 0.8rem; font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1; letter-spacing: -0.045em; }
.login-copy { margin: 0 0 2.1rem; color: var(--muted); font-size: 1rem; line-height: 1.65; }
.login-card label { display: block; margin-bottom: 0.5rem; font-size: 0.9rem; font-weight: 750; }
.password-field { position: relative; }
.password-field input { width: 100%; height: 3.35rem; border: 1px solid #ced1d7; border-radius: 0.65rem; padding: 0 3.5rem 0 1rem; color: var(--ink); background: #fff; font-size: 1rem; transition: border-color 160ms, box-shadow 160ms; }
.password-field input:hover { border-color: #a9adb5; }
.password-field input:focus { border-color: var(--kvb-red); box-shadow: 0 0 0 4px rgba(215, 25, 32, 0.1); outline: none; }
.form-error { min-height: 1.35rem; margin: 0.55rem 0; color: var(--kvb-red-dark); font-size: 0.88rem; }
.primary-button { display: flex; width: 100%; height: 3.35rem; align-items: center; justify-content: space-between; border: 0; border-radius: 0.65rem; padding: 0 1.15rem; color: #fff; background: var(--kvb-red); font-weight: 800; cursor: pointer; transition: background 160ms, transform 160ms; }
.primary-button:hover { background: var(--kvb-red-dark); }
.primary-button:active { transform: translateY(1px); }
.primary-button:disabled { cursor: wait; opacity: 0.7; }
.primary-button svg { width: 1.2rem; }
.privacy-note { display: flex; align-items: center; gap: 0.45rem; margin: 1.15rem 0 0; color: #7a7f88; font-size: 0.78rem; }
.privacy-note svg { width: 1rem; flex: none; }
.brand-mark { display: inline-flex; width: fit-content; align-items: center; gap: 0.55rem; font-size: 0.85rem; letter-spacing: 0.055em; }
.brand-mark span { display: grid; height: 2rem; place-items: center; border-radius: 0.2rem; padding: 0 0.45rem; color: #fff; background: var(--kvb-red); font-size: 1rem; font-weight: 900; letter-spacing: -0.04em; }
.brand-mark strong { font-weight: 850; }
.brand-mark--large { display: flex; align-items: flex-end; gap: 1rem; }
.brand-mark--large span { height: auto; padding: 0; color: #fff; background: transparent; font-size: clamp(4.8rem, 10vw, 9rem); line-height: 0.8; }
.brand-mark--large strong { padding-bottom: 0.18em; font-size: clamp(1.4rem, 3vw, 2.8rem); }

.app-view { height: 100vh; min-height: 36rem; background: var(--canvas); }
.topbar { position: relative; z-index: 1000; display: flex; height: 4.5rem; align-items: center; gap: 1.5rem; border-bottom: 1px solid var(--line); padding: 0 1.3rem; background: rgba(255,255,255,0.96); box-shadow: 0 2px 12px rgba(20,24,31,0.05); }
.topbar-status { display: flex; align-items: center; gap: 0.55rem; margin-left: auto; color: var(--muted); font-size: 0.82rem; font-weight: 650; }
.status-dot { width: 0.48rem; height: 0.48rem; border-radius: 999px; background: #9aa0aa; box-shadow: 0 0 0 4px rgba(154,160,170,0.14); }
.status-dot.is-live { background: #1f9d61; box-shadow: 0 0 0 4px rgba(31,157,97,0.13); }
.status-dot.is-stale { background: #e29b19; box-shadow: 0 0 0 4px rgba(226,155,25,0.15); }
.topbar-actions { display: flex; align-items: center; gap: 0.35rem; }
.icon-button, .toolbar-button { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 0.5rem; color: #50555e; background: transparent; cursor: pointer; }
.icon-button { width: 2.55rem; height: 2.55rem; }
.icon-button:hover, .toolbar-button:hover { color: var(--ink); background: #f2f3f5; }
.icon-button svg { width: 1.2rem; height: 1.2rem; }
.icon-button--inside { position: absolute; top: 50%; right: 0.4rem; transform: translateY(-50%); }
.toolbar-button { height: 2.55rem; gap: 0.5rem; padding: 0 0.75rem; font-size: 0.82rem; font-weight: 700; }
.toolbar-button svg { width: 1.05rem; }
.toolbar-button.is-loading svg { animation: spin 900ms linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.workspace { display: grid; height: calc(100vh - 4.5rem); grid-template-columns: 23.5rem minmax(0, 1fr); }
.sidebar { position: relative; z-index: 850; display: flex; min-height: 0; flex-direction: column; border-right: 1px solid var(--line); padding: 1.65rem 1.25rem 0.8rem; background: var(--surface); box-shadow: 12px 0 28px rgba(30,35,45,0.06); }
.sidebar-heading { display: flex; align-items: flex-start; justify-content: space-between; }
.sidebar-heading h1 { margin: 0.35rem 0 1.25rem; font-size: 1.65rem; line-height: 1.05; letter-spacing: -0.04em; }
.mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem; margin: -0.25rem 0 0.9rem; border-radius: 0.65rem; padding: 0.28rem; background: #eceef1; }
.mode-button { display: inline-flex; min-height: 2.45rem; align-items: center; justify-content: center; gap: 0.48rem; border: 0; border-radius: 0.48rem; color: #686d75; background: transparent; font-size: 0.82rem; font-weight: 800; cursor: pointer; }
.mode-button svg { width: 1.05rem; }
.mode-button.is-active { color: var(--ink); background: #fff; box-shadow: 0 2px 7px rgba(24,28,34,0.12); }
.mode-button[data-mode="transit"].is-active { color: #fff; background: #172338; }
.stats { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 0.55rem; }
.stat-card { min-width: 0; border: 1px solid var(--line); border-radius: 0.7rem; padding: 0.75rem; background: #fff; }
.stat-card span { display: block; overflow: hidden; color: var(--muted); font-size: 0.68rem; font-weight: 700; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.stat-card strong { display: block; margin-top: 0.35rem; font-size: 1.35rem; letter-spacing: -0.04em; }
.stat-card--primary { border-color: var(--kvb-red); color: #fff; background: var(--kvb-red); }
.stat-card--primary span { color: rgba(255,255,255,0.82); }
.search-box { display: flex; height: 3rem; align-items: center; gap: 0.6rem; margin-top: 1rem; border: 1px solid var(--line); border-radius: 0.65rem; padding: 0 0.75rem; background: #f8f9fa; }
.search-box:focus-within { border-color: var(--kvb-red); background: #fff; box-shadow: 0 0 0 3px rgba(215,25,32,0.08); }
.search-box svg { width: 1.05rem; flex: none; color: #7d828b; }
.search-box input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 0.9rem; }
.search-box kbd { border: 1px solid #d9dce1; border-radius: 0.25rem; padding: 0.12rem 0.3rem; color: #8a8f98; background: #fff; font-family: inherit; font-size: 0.66rem; white-space: nowrap; }
.filter-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.3rem; margin-top: 0.75rem; border-radius: 0.55rem; padding: 0.25rem; background: #f0f1f3; }
.filter-tab { min-height: 2rem; border: 0; border-radius: 0.4rem; color: #686d75; background: transparent; font-size: 0.76rem; font-weight: 750; cursor: pointer; }
.filter-tab.is-active { color: var(--ink); background: #fff; box-shadow: 0 1px 4px rgba(24,28,34,0.12); }
.transit-controls { border: 1px solid #dce0e6; border-radius: 0.75rem; padding: 0.85rem; background: #f7f8fa; }
.transit-controls > label { display: block; margin-bottom: 0.45rem; color: #5f646d; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.02em; }
.line-select-wrap { position: relative; display: grid; height: 3rem; grid-template-columns: 2.15rem minmax(0, 1fr) 1rem; align-items: center; gap: 0.65rem; border: 1px solid #cfd3d9; border-radius: 0.6rem; padding: 0 0.8rem 0 0.48rem; background: #fff; }
.line-select-wrap:focus-within { border-color: var(--kvb-red); box-shadow: 0 0 0 3px rgba(215,25,32,0.08); }
.line-select-wrap select { width: 100%; border: 0; outline: 0; appearance: none; color: var(--ink); background: transparent; font-size: 0.9rem; font-weight: 800; cursor: pointer; }
.line-select-wrap > svg { width: 1rem; color: #737983; pointer-events: none; }
.selected-line-badge, .line-badge { display: inline-grid; place-items: center; border-radius: 0.28rem; color: #fff; background: var(--line-color, var(--kvb-red)); font-weight: 900; line-height: 1; }
.selected-line-badge { width: 2.15rem; height: 2.15rem; font-size: 0.88rem; }
.transit-summary { display: flex; align-items: center; gap: 1rem; margin-top: 0.7rem; color: #666c75; font-size: 0.7rem; }
.transit-summary strong { color: var(--ink); font-size: 0.86rem; }
.transit-controls p { margin: 0.55rem 0 0; color: #747a83; font-size: 0.68rem; line-height: 1.35; }
.result-heading { display: flex; align-items: center; justify-content: space-between; margin: 1.2rem 0 0.55rem; color: #5d626b; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.02em; }
.result-heading span:last-child { font-variant-numeric: tabular-nums; }
.result-list { min-height: 0; flex: 1; overflow-y: auto; margin: 0 -0.45rem; padding: 0 0.3rem; scrollbar-width: thin; scrollbar-color: #cfd2d7 transparent; }
.result-item { display: grid; width: 100%; grid-template-columns: 2.35rem minmax(0,1fr) auto; align-items: center; gap: 0.7rem; border: 0; border-radius: 0.6rem; padding: 0.65rem 0.55rem; text-align: left; background: transparent; cursor: pointer; }
.result-item:hover { background: #f5f6f7; }
.result-item-icon { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border: 1px solid #f2b8bb; border-radius: 0.55rem; color: var(--kvb-red); background: var(--kvb-red-soft); font-weight: 850; }
.result-item-icon svg { width: 1.15rem; }
.result-item-copy { min-width: 0; }
.result-item-copy strong, .result-item-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.result-item-copy strong { font-size: 0.86rem; }
.result-item-copy span { margin-top: 0.18rem; color: var(--muted); font-size: 0.72rem; }
.availability { min-width: 1.9rem; border-radius: 999px; padding: 0.28rem 0.45rem; color: #fff; background: var(--kvb-red); text-align: center; font-size: 0.73rem; font-weight: 850; }
.availability.is-empty { color: #696e77; background: #e8eaed; }
.sidebar-note { margin: 0.65rem 0 0; color: #8a8f98; font-size: 0.68rem; line-height: 1.4; }
.transit-result { align-items: start; padding-top: 0.72rem; padding-bottom: 0.72rem; }
.result-line-badge { width: 2.25rem; height: 2.25rem; font-size: 0.85rem; }
.result-departures { margin-top: 0.28rem !important; white-space: normal !important; }
.result-departures > span { display: block; margin: 0.16rem 0 0 !important; overflow: hidden; color: #686e77; font-size: 0.68rem; text-overflow: ellipsis; white-space: nowrap; }
.result-departures b { color: var(--ink); font-weight: 850; }
.nearby-count { display: inline-flex; align-items: center; gap: 0.2rem; border-radius: 999px; padding: 0.3rem 0.42rem; color: var(--kvb-red-dark); background: var(--kvb-red-soft); font-size: 0.7rem; }
.nearby-count svg { width: 0.9rem; height: 0.9rem; stroke-width: 2; }
.nearby-count b { font-weight: 900; }
.empty-results { padding: 2rem 1rem; color: var(--muted); text-align: center; font-size: 0.88rem; line-height: 1.5; }

.map-shell { position: relative; min-width: 0; }
#map { width: 100%; height: 100%; background: #e9e9e7; }
.leaflet-tile-pane { filter: grayscale(0.78) saturate(0.7) contrast(0.96) brightness(1.04); }
.leaflet-control-zoom { overflow: hidden; border: 0 !important; border-radius: 0.55rem !important; box-shadow: 0 8px 24px rgba(23,27,35,0.18) !important; }
.leaflet-control-zoom a { color: #333 !important; }
.leaflet-control-attribution { font-size: 0.62rem !important; }
.map-legend { position: absolute; z-index: 700; right: 1rem; bottom: 1.5rem; display: flex; align-items: center; gap: 1rem; border: 1px solid rgba(0,0,0,0.08); border-radius: 0.65rem; padding: 0.65rem 0.8rem; background: rgba(255,255,255,0.94); box-shadow: 0 8px 24px rgba(20,24,31,0.14); backdrop-filter: blur(8px); color: #4f545d; font-size: 0.72rem; font-weight: 700; }
.map-legend span { display: inline-flex; align-items: center; gap: 0.4rem; }
.map-legend small { color: #888d96; font-size: 0.64rem; font-weight: 600; }
.legend-icon { display: inline-grid; width: 1.2rem; height: 1.2rem; place-items: center; border-radius: 999px; font-size: 0; }
.legend-icon--bike { border: 3px solid #fff; background: var(--kvb-red); box-shadow: 0 0 0 1px var(--kvb-red); }
.legend-icon--station { border: 2px solid var(--kvb-red); background: #fff; }
.legend-icon--transit { border: 3px solid #fff; background: #172338; box-shadow: 0 0 0 1px #172338; }
.legend-icon--nearby { border: 2px dashed var(--kvb-red); background: rgba(215,25,32,0.08); }
.transit-legend strong { color: var(--ink); font-size: 0.72rem; }
.map-message { position: absolute; z-index: 750; top: 1rem; left: 50%; max-width: min(28rem, calc(100% - 2rem)); transform: translateX(-50%); border-radius: 0.55rem; padding: 0.7rem 0.9rem; color: #6a4700; background: #fff4d9; box-shadow: 0 8px 24px rgba(20,24,31,0.14); font-size: 0.82rem; font-weight: 700; }
.custom-leaflet-icon { background: none !important; border: 0 !important; }
.bike-pin, .station-pin { position: relative; display: grid; place-items: center; color: #fff; background: var(--kvb-red); box-shadow: 0 4px 12px rgba(121,10,17,0.28); }
.bike-pin { width: 1.75rem; height: 1.75rem; border: 2px solid #fff; border-radius: 999px; }
.bike-pin svg { width: 1.05rem; height: 1.05rem; stroke-width: 2.2; }
.station-pin { width: 2.1rem; height: 2.1rem; border: 3px solid var(--kvb-red); border-radius: 0.62rem; color: var(--kvb-red); background: #fff; font-size: 0.73rem; font-weight: 900; }
.station-pin.is-empty { border-color: #747983; color: #747983; }
.station-pin::after { position: absolute; right: -0.25rem; bottom: -0.25rem; width: 0.5rem; height: 0.5rem; border: 2px solid #fff; border-radius: 999px; background: var(--kvb-red); content: ""; }
.station-pin.is-empty::after { background: #747983; }
.bike-pin.is-nearby, .station-pin.is-nearby { box-shadow: 0 0 0 5px rgba(215,25,32,0.18), 0 5px 14px rgba(121,10,17,0.3); }
.transit-icon-wrap { overflow: visible !important; }
.transit-pin { position: relative; display: flex; width: 5.1rem; height: 2.25rem; align-items: stretch; overflow: hidden; border: 2px solid #fff; border-radius: 0.55rem; color: #fff; background: #172338; box-shadow: 0 5px 15px rgba(15,25,42,0.28); }
.transit-pin::after { position: absolute; bottom: -0.38rem; left: calc(50% - 0.35rem); width: 0.7rem; height: 0.7rem; transform: rotate(45deg); border-right: 2px solid #fff; border-bottom: 2px solid #fff; background: #172338; content: ""; }
.transit-pin > b { position: relative; z-index: 1; display: grid; min-width: 2.15rem; place-items: center; padding: 0 0.35rem; background: var(--line-color, var(--kvb-red)); font-size: 0.8rem; }
.transit-pin > div { position: relative; z-index: 1; display: flex; flex: 1; align-items: center; justify-content: center; gap: 0.12rem; background: #172338; }
.transit-pin > div span, .transit-pin--city > span { display: grid; min-width: 1.08rem; height: 1.3rem; place-items: center; border-radius: 0.25rem; color: #172338; background: #fff; font-size: 0.66rem; font-weight: 900; }
.transit-pin--city { width: 3.25rem; }
.transit-pin--city > span { position: relative; z-index: 1; align-self: center; margin: 0 auto; }
.leaflet-popup-content-wrapper { border-radius: 0.75rem !important; box-shadow: var(--shadow) !important; }
.leaflet-popup-content { width: 18.5rem !important; margin: 1rem !important; font-family: inherit; }
.popup-kicker { color: var(--kvb-red); font-size: 0.67rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.popup-title { margin: 0.25rem 0 0.4rem; color: var(--ink); font-size: 1rem; line-height: 1.25; }
.popup-address { margin: 0 0 0.8rem; color: var(--muted); font-size: 0.75rem; line-height: 1.4; }
.popup-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.45rem; margin: 0.75rem 0; }
.popup-stat { border-radius: 0.5rem; padding: 0.55rem; background: #f4f5f6; }
.popup-stat strong, .popup-stat span { display: block; }
.popup-stat strong { font-size: 1.05rem; }
.popup-stat span { color: var(--muted); font-size: 0.65rem; }
.popup-bike-list { margin: 0.6rem 0; color: #4e535c; font-size: 0.72rem; line-height: 1.5; word-break: break-word; }
.popup-section-title { margin: 0.9rem 0 0.4rem; color: #6b717a; font-size: 0.66rem; font-weight: 850; letter-spacing: 0.06em; text-transform: uppercase; }
.popup-section-title--bikes { padding-top: 0.7rem; border-top: 1px solid var(--line); }
.departure-row { display: grid; grid-template-columns: 1.9rem minmax(0, 1fr) auto; align-items: center; gap: 0.5rem; padding: 0.38rem 0; }
.departure-row + .departure-row { border-top: 1px solid #eef0f2; }
.departure-row .line-badge { width: 1.9rem; height: 1.9rem; font-size: 0.7rem; }
.departure-direction { min-width: 0; }
.departure-direction strong, .departure-direction small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.departure-direction strong { color: var(--ink); font-size: 0.72rem; }
.departure-direction small { margin-top: 0.1rem; color: #7b8088; font-size: 0.62rem; }
.departure-countdown { color: var(--ink); font-size: 0.75rem; font-weight: 900; white-space: nowrap; }
.departure-countdown small { margin-left: 0.22rem; color: var(--kvb-red); font-size: 0.58rem; }
.departure-empty { border-radius: 0.45rem; padding: 0.62rem; color: #777c84; background: #f5f6f7; font-size: 0.7rem; line-height: 1.35; }
.nearby-row { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr) auto; align-items: center; gap: 0.4rem; padding: 0.32rem 0; color: #5c626b; }
.nearby-row > svg { width: 1rem; color: var(--kvb-red); }
.nearby-row span { min-width: 0; }
.nearby-row strong, .nearby-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nearby-row strong { color: var(--ink); font-size: 0.7rem; }
.nearby-row small { margin-top: 0.08rem; color: #858a92; font-size: 0.59rem; }
.nearby-row em { color: #7d828b; font-size: 0.64rem; font-style: normal; white-space: nowrap; }
.popup-link { display: inline-flex; align-items: center; gap: 0.25rem; margin-top: 0.25rem; color: var(--kvb-red-dark); font-size: 0.75rem; font-weight: 800; text-decoration: none; }
.popup-link:hover { text-decoration: underline; }
.mobile-only { display: none; }

@media (max-width: 780px) {
  .login-view { grid-template-columns: 1fr; }
  .login-brand { min-height: 29vh; justify-content: flex-end; padding: 2rem 1.5rem; }
  .brand-mark--large span { font-size: 4rem; }
  .brand-mark--large strong { font-size: 1.35rem; }
  .login-brand p { margin-top: 0.7rem; font-size: 1.15rem; }
  .login-panel { min-height: 71vh; place-items: start center; padding: 2.3rem 1.35rem; }
  .login-card h1 { font-size: 2.25rem; }
  .mobile-only { display: inline-flex; }
  .topbar { height: 4rem; gap: 0.65rem; padding: 0 0.65rem; }
  .topbar-status { display: none; }
  .topbar-actions { margin-left: auto; }
  .toolbar-button { width: 2.55rem; padding: 0; }
  .toolbar-button span { display: none; }
  .workspace { display: block; height: calc(100vh - 4rem); }
  .map-shell { width: 100%; height: 100%; }
  .sidebar { position: absolute; z-index: 1100; right: 0; bottom: 0; left: 0; max-height: 78vh; border: 0; border-radius: 1rem 1rem 0 0; padding: 0.65rem 1rem 0.8rem; box-shadow: 0 -14px 45px rgba(20,24,31,0.22); transform: translateY(105%); transition: transform 220ms ease; }
  .sidebar.is-open { transform: translateY(0); }
  .sidebar-handle { width: 2.7rem; height: 0.25rem; margin: 0 auto 0.8rem; border-radius: 999px; background: #d3d5da; }
  .sidebar-heading h1 { margin-bottom: 1rem; font-size: 1.45rem; }
  .mode-switch { margin-bottom: 0.7rem; }
  .result-list { min-height: 8rem; }
  .map-legend { right: 0.7rem; bottom: 1.2rem; left: 0.7rem; justify-content: center; }
  .transit-legend { flex-wrap: wrap; row-gap: 0.35rem; }
}

@media (max-width: 440px) {
  .brand-mark strong { display: none; }
  .stats { grid-template-columns: 1.2fr 1fr 1fr; }
  .stat-card { padding: 0.65rem 0.55rem; }
  .stat-card strong { font-size: 1.2rem; }
  .map-legend small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}