/*! * Liquid Design-System · Stylesheet (v0.264.0 · siehe docs/CHANGELOG.md) · Single Source * Radiologie Parkstrasse Ulm. Konsolidiert aus dem Hub-Skin (06_Personal/code/hub.html), * der Basis-Theme-Schicht (06_Personal/code/assets/themes.css, generiert aus branding/theme.json) * und dem in BI gehärteten Chrome (_bi_chrome_css). Paart mit liquid-skin.js (Engine/Tokens) * und liquid-icons.json (Icons). * * SELBSTTRAGEND: enthält die Lab-Basis-Tokens (dunkel = Liquid-Default) als :root-Defaults; * seit v0.5.0 zusätzlich ein VOLLWERTIGES Hell-Theme (§2c): system-adaptiv via * prefers-color-scheme, data-theme am überstimmt (May-freigegeben 2026-07-18) – * ein Modul, das NUR liquid.css einbindet, bekommt den Liquid-Look. Wird zusätzlich themes.css * (+ theme-switcher.js) geladen, greift der Studio/Lab-Umschalter und überschreibt die Basis. * Kanonische Farbquelle bleibt branding/theme.json → themes.css (NICHT hier doppelt pflegen; * hier nur als Standalone-Default gespiegelt). */ @font-face{font-family:'Onest';font-style:normal;font-weight:300 900;font-display:swap;src:url(/liquid/fonts/onest-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family:'Onest';font-style:normal;font-weight:300 900;font-display:swap;src:url(/liquid/fonts/onest-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 700;font-display:swap;src:url(/liquid/fonts/bricolage-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 700;font-display:swap;src:url(/liquid/fonts/bricolage-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/liquid/fonts/instrument-italic-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/liquid/fonts/instrument-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/liquid/fonts/instrument-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/liquid/fonts/instrument-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} [hidden]{ display:none !important; } :root{ --text-10: 10px; --text-11: 11px; --text-12: 12px; --text-13: 13px; --text-14: 14px; --text-16: 16px; --radius-sm:6px; --radius-md:10px; --radius-lg:14px; --radius-pill:999px; --shadow-sm:0 1px 3px rgba(0,0,0,.06); --shadow-md:0 4px 16px rgba(0,0,0,.08); --shadow-lg:0 12px 40px rgba(0,0,0,.18); --h-marke:28px; --h-bedien:36px; --h-wahl:44px; --trennlinie:color-mix(in srgb,var(--text,#fff) 26%,transparent); --ring-farbe:color-mix(in srgb,var(--text,#fff) 9%,transparent); --schatten-1: 0 1.2px 1.5px rgba(0,0,0,.04), 0 0 0 1px var(--ring-farbe); --schatten-2: 0 5.2px 7px rgba(0,0,0,.05), 0 2.8px 3.7px rgba(0,0,0,.04), 0 1.2px 1.5px rgba(0,0,0,.03), 0 0 0 1px var(--ring-farbe); --schatten-3: 0 17.5px 23.4px rgba(0,0,0,.10), 0 9.4px 12.5px rgba(0,0,0,.07), 0 5.2px 7px rgba(0,0,0,.05), 0 2.8px 3.7px rgba(0,0,0,.04), 0 1.2px 1.5px rgba(0,0,0,.03), 0 0 0 1px var(--ring-farbe); --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-6:1.5rem; --radius:var(--radius-lg); --shadow:var(--shadow-md); --dur-xfast:.12s; --dur-fast:.18s; --dur-base:.25s; --dur-slow:.4s; --dur-slower:.62s; --ease-quint:cubic-bezier(.22,1,.36,1); --elev-0:none; --elev-1:var(--shadow-sm); --elev-2:var(--shadow-md); --elev-3:var(--shadow-lg); } :root{ color-scheme:dark; --bg:#0f1117; --bg-deep:#0b0d13; --surface:#1d1d1d; --surface-alt:#272727; --ink:#e2e8f0; --ink-soft:#c2cad8; --muted:#8892a4; --subtle:#5a6377; --border:#333333; --border-strong:#414141; --accent:#4f8ef7; --accent-deep:#3a6fd0; --accent-soft:rgba(79,142,247,.18); --accent-gradient:linear-gradient(135deg,#4f8ef7 0%,#3a6fd0 100%); --success:#3ecf8e; --warning:#f59e0b; --danger:#e55353; --liq-uebung:#f59e0b; --liq-art-groesse:clamp(10px, 0.625rem, 15px); --frist-bald:#e2c08d; --frist-faellig:#e9b4b0; --ki:#f5a524; --ki-naht:repeating-linear-gradient(180deg, var(--ki,#f5a524) 0 6px, transparent 6px 11px); --ki-text:color-mix(in srgb, var(--ki,#f5a524) 62%, #fff); --role-inhaber:#e0b64d; --role-leitung:#f472b6; --patt:#8b95ad; --blue:var(--accent); --primary:var(--accent); --primary-dark:var(--accent-deep); --surface2:var(--surface-alt); --text:var(--ink); --text-muted:var(--muted); --green:var(--success); --red:var(--danger); --yellow:var(--warning); --ok:var(--success); --warn:var(--warning); } @supports (color: oklch(0% 0 0)){ @media (color-gamut: p3){ :root{ --accent:oklch(65.6% 0.185 260); --accent-deep:oklch(55.7% 0.175 261); --accent-soft:oklch(65.6% 0.185 260 / .18); --accent-gradient:linear-gradient(135deg, oklch(65.6% 0.185 260) 0%, oklch(55.7% 0.175 261) 100%); } } } :root{ --d-font-display:'Bricolage Grotesque', system-ui, sans-serif; --d-font-display-weight:500; --d-font-display-style:normal; --d-font-accent:'Onest', system-ui, sans-serif; --d-font-accent-style:normal; --d-font-accent-weight:700; --d-font-ui:'Onest', -apple-system, 'Segoe UI', system-ui, sans-serif; --d-size-mult:1; --d-glow:14px; --d-glow-alpha:.10; --d-accent-rgb:102,126,234; } html{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; } body,p,li,figcaption,.liq-pretty{ text-wrap:pretty; } html, body{ font-family:var(--d-font-ui); } button, input, select, textarea, optgroup{ font-family:inherit; } h1,h2,h3,h4,.liq-balance{ text-wrap:balance; } body:not([data-skin="classic"]){ --bg:#07060c; color:var(--ink); } body:not([data-skin="classic"])::before{ content:""; position:fixed; inset:0; z-index:-1; background:var(--bg,#07060c); } body:not([data-skin="classic"]) .liq-glass:not(.liq-bloom), body:not([data-skin="classic"]) .liq-card, body:not([data-skin="classic"]) .liq-kpi{ position:relative; } body:not([data-skin="classic"]) .liq-bloom{ position:fixed; } body:not([data-skin="classic"]) .liq-glass, body:not([data-skin="classic"]) .bi-side, body:not([data-skin="classic"]) .liq-card, body:not([data-skin="classic"]) .liq-kpi{ --liq-glanz: color-mix(in srgb, var(--accent,#4f8ef7) 40%, #ffffff); background:linear-gradient(165deg, color-mix(in srgb, var(--liq-glanz) 9%, transparent), color-mix(in srgb, var(--liq-glanz) 3.5%, transparent) 58%, color-mix(in srgb, var(--liq-glanz) 1.6%, transparent)); backdrop-filter:blur(22px) saturate(170%); -webkit-backdrop-filter:blur(22px) saturate(170%); box-shadow: 0 0 0 1px color-mix(in srgb, var(--liq-glanz) 16%, transparent), 0 20px 50px -22px rgba(0,0,0,.55), 0 10.7px 26.7px -14px rgba(0,0,0,.30), 0 5.7px 14.3px -8px rgba(0,0,0,.20), 0 3px 7.6px -5px rgba(0,0,0,.14), inset 0 1px 0 color-mix(in srgb, var(--liq-glanz) 16%, transparent), inset 0 -1px 0 color-mix(in srgb, var(--liq-glanz) 5%, transparent); } body:not([data-skin="classic"]) .liq-glass::after, body:not([data-skin="classic"]) .liq-card::after, body:not([data-skin="classic"]) .liq-kpi::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(130deg, color-mix(in srgb, var(--liq-glanz,#b9d1fc) 20%, transparent), transparent 30%); opacity:.55; } body:not([data-skin="classic"]) h1, body:not([data-skin="classic"]) .liq-title{ font-family:var(--d-font-display); font-weight:var(--d-font-display-weight); } body:not([data-skin="classic"]) .liq-accent{ font-family:var(--d-font-accent); font-style:var(--d-font-accent-style); font-weight:var(--d-font-accent-weight,700); } .page{ max-width:none; margin:0; padding:0; position:relative; z-index:1; } .bi-layout{ display:flex; gap:0; align-items:stretch; min-height:100vh; } .bi-side{ flex:0 0 212px; position:sticky; top:0; align-self:flex-start; height:100vh; display:flex; flex-direction:column; gap:.15rem; padding:.85rem .55rem; border-radius:0; border:none; border-right:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.055); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%); } .bi-brand{ display:flex; align-items:center; gap:.55rem; padding:.35rem .55rem 1rem; } .bi-brand-mark{ width:30px; height:30px; border-radius:10px; background:var(--blue); color:#fff; font-weight:800; font-size:.8rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; } .bi-brand strong{ display:block; font-size:.92rem; font-weight:700; line-height:1.15; } .bi-brand small{ display:block; font-size:.66rem; color:rgba(244,241,234,.6); } .bi-nav-list{ display:flex; flex-direction:column; gap:.15rem; } .bi-nav{ display:flex; align-items:center; gap:.6rem; padding:.55rem .7rem; border-radius:10px; color:var(--text); text-decoration:none; font-size:.85rem; cursor:pointer; border:1px solid transparent; } .bi-nav:hover{ background:rgba(255,255,255,.06); } .bi-nav.active{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.14); font-weight:700; } .bi-nav .bi-ic, .bi-nav svg{ width:18px; height:18px; flex:0 0 auto; opacity:.92; } .bi-ic{ stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .bi-content{ flex:1; min-width:0; padding:1.25rem 1.9rem 3rem; } .bi-burger{ display:none; } @media (max-width:820px){ .bi-layout{ flex-direction:column; } .bi-content{ padding:1rem; } .bi-side{ position:fixed; top:0; left:0; z-index:1200; height:100dvh; width:min(84vw,300px); flex-direction:column; flex-wrap:nowrap; align-items:stretch; gap:.15rem; overflow-y:auto; -webkit-overflow-scrolling:touch; border-right:1px solid rgba(255,255,255,.10); border-bottom:none; border-radius:0; padding:calc(.85rem + env(safe-area-inset-top,0px)) .6rem calc(1rem + env(safe-area-inset-bottom,0px)) .6rem; transform:translateX(-100%); transition:transform .28s cubic-bezier(.2,.7,.2,1); will-change:transform; } .bi-side.open{ transform:none; box-shadow:0 0 60px rgba(0,0,0,.5); } .bi-nav-list{ flex-direction:column; flex-wrap:nowrap; } .bi-nav{ min-height:44px; } .bi-burger{ position:fixed; top:calc(.5rem + env(safe-area-inset-top,0px)); left:.6rem; z-index:1190; width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; background:rgba(255,255,255,.06); border:1px solid var(--liq-glass-border,rgba(255,255,255,.12)); color:var(--text); cursor:pointer; backdrop-filter:blur(12px) saturate(150%); -webkit-backdrop-filter:blur(12px) saturate(150%); } .bi-scrim{ position:fixed; inset:0; z-index:1150; background:var(--liq-abdunklung,rgba(8,10,16,.5)); opacity:0; pointer-events:none; transition:opacity .25s ease; } .bi-scrim.open{ opacity:1; pointer-events:auto; } .bi-side[data-mobile="strip"]{ position:static; height:auto; width:100%; transform:none; box-shadow:none; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:.1rem; overflow-x:auto; overflow-y:visible; -webkit-overflow-scrolling:touch; scrollbar-width:none; border-right:none; border-bottom:1px solid rgba(255,255,255,.10); padding:.5rem .4rem; } .bi-side[data-mobile="strip"]::-webkit-scrollbar{ display:none; } .bi-side[data-mobile="strip"] .bi-nav-list{ flex-direction:row; flex-wrap:nowrap; gap:.3rem; } .bi-side[data-mobile="strip"] .bi-nav{ flex:0 0 auto; white-space:nowrap; min-height:44px; padding:.5rem .7rem; } .bi-side[data-mobile="strip"] .bi-brand{ flex:0 0 auto; padding:.35rem .5rem; } .bi-side[data-mobile="strip"] .bi-brand small{ display:none; } } @media (max-width:820px){ body:not([data-skin="classic"]) .bi-side{ position:fixed; } body:not([data-skin="classic"]) .bi-side.open{ box-shadow:0 0 60px rgba(0,0,0,.5); } body:not([data-skin="classic"]) .bi-side[data-mobile="strip"]{ position:static; box-shadow:none; } } @media (max-width:820px) and (prefers-reduced-motion:reduce){ .bi-side{ transition:none; } .bi-scrim{ transition:none; } } .liq-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:var(--space-6); box-shadow:var(--shadow); } .liq-card--akzent, body:not([data-skin="classic"]) .liq-card--akzent{ position:relative; border-top:3px solid var(--akz,var(--accent,#4f8ef7)); border-color:color-mix(in srgb,var(--akz,var(--accent,#4f8ef7)) 30%,var(--border,#333333)); border-top-color:var(--akz,var(--accent,#4f8ef7)); background: linear-gradient(180deg, color-mix(in srgb,var(--akz,var(--accent,#4f8ef7)) 13%,transparent) 0, transparent 78px), var(--surface); box-shadow:var(--shadow), 0 -1px 16px -6px color-mix(in srgb,var(--akz,var(--accent,#4f8ef7)) 55%,transparent); } @media (prefers-reduced-transparency:reduce){ .liq-card--akzent{ background:var(--surface); box-shadow:var(--shadow); } } .hub-tile{ position:relative; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:22px; cursor:pointer; transition:border-color .15s, transform .1s, box-shadow .15s; text-align:left; } .hub-tile:hover{ border-color:var(--primary); transform:translateY(-2px); box-shadow:var(--shadow); } .hub-tile .tile-icon{ width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--surface2); margin-bottom:14px; } .hub-tile .tile-icon svg{ width:24px; height:24px; stroke:var(--primary); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } body:not([data-skin="classic"]) .hub-tile .tile-icon{ background:color-mix(in srgb,var(--tile-acc,#4f8ef7) 22%,rgba(255,255,255,.05)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tile-acc,#4f8ef7) 40%,transparent); } body:not([data-skin="classic"]) .hub-tile .tile-icon svg{ stroke:var(--tile-acc,#4f8ef7); } .liq-overlay{ position:fixed; inset:0; background:rgba(8,10,16,.55); backdrop-filter:blur(4px); z-index:9999; display:flex; align-items:center; justify-content:center; padding:18px; opacity:0; pointer-events:none; transition:opacity .22s var(--ease-soft,ease); } .liq-overlay.is-open{ opacity:1; pointer-events:auto; } .liq-overlay--statisch{ opacity:1; pointer-events:auto; transition:none; } .liq-overlay[hidden]{ display:none; } .liq-overlay--statisch > .liq-card{ width:min(380px, 100%); box-sizing:border-box; } @media (prefers-reduced-motion:reduce){ .liq-overlay{ transition:none; } } .liq-listrow--wischbar{ position:relative; overflow:hidden; border-radius:11px; } .liq-listrow--wischbar + .liq-listrow--wischbar{ margin-top:2px; } .liq-listrow--wischbar__blatt{ position:relative; z-index:1; background:var(--bg,#0f1117); transition:transform .18s ease; will-change:transform; } .liq-listrow--wischbar.is-zieht .liq-listrow--wischbar__blatt{ transition:none; } .liq-listrow--wischbar.is-offen .liq-listrow--wischbar__blatt{ transform:translateX(calc(-1 * var(--liq-wisch-weite,150px))); } .liq-listrow--wischbar__aktionen{ position:absolute; inset:0 0 0 auto; display:flex; align-items:stretch; visibility:hidden; } .liq-listrow--wischbar.is-zieht .liq-listrow--wischbar__aktionen, .liq-listrow--wischbar.is-offen .liq-listrow--wischbar__aktionen{ visibility:visible; } .liq-listrow--wischbar__akt{ border:0; font:inherit; font-size:12.5px; font-weight:600; color:#fff; cursor:pointer; width:75px; min-height:44px; display:grid; place-items:center; padding:0 6px; line-height:1.2; } .liq-listrow--wischbar__akt--still{ background:var(--surface-2,#242836); color:var(--text,#e9eef6); border-left:1px solid var(--border,#333333); } .liq-listrow--wischbar__akt--weg{ background:#b3403f; } @media (prefers-reduced-motion:reduce){ .liq-listrow--wischbar__blatt{ transition:none; } } .liq-abdunklung{ position:fixed; inset:0; z-index:var(--liq-abdunklung-z,120); display:none; align-items:center; justify-content:center; padding:20px; box-sizing:border-box; background:var(--liq-abdunklung-bg, rgba(8,6,14,.62)); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); overscroll-behavior:contain; } .liq-abdunklung.is-auf, .liq-abdunklung.open{ display:flex; } @media (prefers-reduced-transparency:reduce){ .liq-abdunklung{ -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--liq-abdunklung-bg, rgba(8,6,14,.86)); } } @media (max-width:600px){ .liq-abdunklung.liq-sheet-scrim{ padding:0; } } .liq-sheet__grip{ display:none; } @media (max-width:600px){ .liq-sheet-scrim{ align-items:flex-end; padding:0; } .liq-sheet-scrim .liq-sheet{ width:100%; max-width:100%; border-radius:20px 20px 0 0; max-height:90dvh; inset:auto; transform:none; box-shadow:0 -18px 50px rgba(0,0,0,.5); padding-bottom:calc(16px + env(safe-area-inset-bottom)); animation:liq-sheet-up .26s cubic-bezier(.22,1,.36,1); touch-action:pan-y; } .liq-sheet-scrim .liq-sheet__grip{ display:block; width:38px; height:4px; border-radius:999px; flex:none; background:var(--border-strong,rgba(255,255,255,.28)); margin:2px auto 10px; } .liq-sheet-scrim .liq-sheet__foot{ padding-bottom:calc(8px + env(safe-area-inset-bottom)); } } @keyframes liq-sheet-up{ from{ transform:translateY(100%); } to{ transform:translateY(0); } } @media (prefers-reduced-motion:reduce){ .liq-sheet{ animation:none; } } .liq-hit{ position:relative; } .liq-hit::after{ content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); min-width:44px; min-height:44px; width:100%; height:100%; } .liq-hit--axis::after{ top:auto; left:auto; transform:none; width:auto; height:auto; inset:calc(-1 * var(--liq-hit-y, 12px)) calc(-1 * var(--liq-hit-x, 12px)); } [data-hit-debug] .liq-hit::after{ outline:1px dashed var(--accent,#4f8ef7); outline-offset:-1px; background:var(--accent-soft,rgba(79,142,247,.18)); border-radius:6px; } .liq-vlist > *{ content-visibility:auto; contain-intrinsic-size:auto var(--liq-vlist-row,56px); } .liq-dvh{ height:100dvh; } .liq-min-dvh{ min-height:100dvh; } .liq-topnav{ display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; position:sticky; top:0; z-index:20; padding:8px 16px; background:color-mix(in srgb, var(--bg,#0f1117) 94%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid color-mix(in srgb, var(--text,#fff) 8%, transparent); } .liq-topnav::-webkit-scrollbar{ display:none; } .liq-topnav > a, .liq-topnav > button{ flex:none; min-height:38px; padding:0 15px; display:inline-flex; align-items:center; gap:7px; border:0; border-radius:var(--radius-pill,99px); font-size:var(--text-13); font-weight:600; text-decoration:none; white-space:nowrap; color:var(--muted,#8892a4); background:color-mix(in srgb, var(--text,#fff) 6%, transparent); cursor:pointer; } .liq-topnav > .active{ color:#fff; background:color-mix(in srgb, var(--accent,#4f8ef7) 26%, transparent); } .liq-topnav > *:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } .liq-frow{ display:flex; align-items:baseline; gap:12px; padding:9px 0; border-bottom:1px solid color-mix(in srgb, var(--text,#fff) 6%, transparent); } .liq-frow:last-child{ border-bottom:0; } .liq-frow__k{ font-size:var(--text-13); color:var(--muted,#8892a4); line-height:1.3; } .liq-frow__v{ min-width:0; font-size:var(--text-14); color:var(--text,#e9eef6); line-height:1.35; word-break:break-word; } .liq-frow__v.empty{ color:color-mix(in srgb, var(--muted,#8892a4) 55%, transparent); } .liq-mcard{ display:flex; align-items:center; gap:12px; min-height:60px; padding:12px 14px; border-radius:14px; text-decoration:none; color:var(--text,#e9eef6); background:color-mix(in srgb, var(--surface,#1d1d1d) 62%, transparent); border:1px solid color-mix(in srgb, var(--text,#fff) 7%, transparent); } .liq-mcard__main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; } .liq-mcard__t{ font-weight:600; font-size:var(--text-14); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-mcard__sub{ font-size:var(--text-12); color:var(--muted,#8892a4); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-mob{ display:block; } .liq-mob__scroll{ min-height:0; } @media (min-width:721px){ .liq-mtop{ display:none; } } @media (max-width:720px){ .liq-mob{ position:fixed; inset:0; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); height:100dvh; overflow:hidden; } .liq-mob > *{ min-width:0; } .liq-mob__scroll{ overflow-y:auto; overscroll-behavior:contain; min-height:0; -webkit-overflow-scrolling:touch; padding:0 16px calc(28px + env(safe-area-inset-bottom,0px)); } .liq-mob__scroll > .liq-topnav{ margin:2px -16px 10px; } .liq-mtop{ display:flex; align-items:center; gap:6px; min-height:52px; z-index:25; padding:calc(8px + env(safe-area-inset-top,0px)) 8px 6px; background:color-mix(in srgb, var(--bg,#0f1117) 84%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); } .liq-mtop__act{ width:44px; height:44px; flex:none; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:10px; background:none; color:var(--text,#e9eef6); cursor:pointer; } .liq-mtop__act svg{ width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:2; } .liq-mtop__act:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } .liq-mtop__title{ flex:1 1 auto; min-width:0; padding-left:2px; font-weight:650; font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-frow{ min-height:44px; } .liq-frow__k{ flex:0 0 40%; } .liq-frow__v{ flex:1 1 auto; text-align:right; } } .liq-btn, .liq-btn-sec, .liq-btn-ghost, .liq-btn-text, .liq-btn-abbruch, .liq-iconbtn, .liq-kebab-btn, .liq-modal-btn, .liq-navbtn, .liq-navgroup__btn, .liq-navitem, .liq-chip, .liq-wahlchip, .liq-ph-chip, .liq-listfilter__chip, .liq-ctxchip, .liq-tab, .liq-klartab, .liq-coach-btn, .liq-empty-action, .liq-field__zahlbtn, .liq-weeknav__btn, .liq-weekrow__btn, .liq-chain__edit, .liq-listrow, .liq-sprungkopf__ausloeser, .liq-aufklapp__ausloeser{ text-decoration:none; } .liq-btn{ display:inline-flex; align-items:center; justify-content:center; text-align:center; gap:.5rem; padding:10px 20px; border:none; border-radius:10px; background:var(--primary); color:#fff; font-size:var(--text-14); font-weight:600; cursor:pointer; text-decoration:none; } body:not([data-skin="classic"]) .liq-btn{ background:var(--accent-gradient,var(--primary)); border-radius:var(--radius-pill); } .liq-btn:hover{ filter:brightness(1.08); } .liq-btn-sec{ background:none; color:var(--text); border:1px solid color-mix(in srgb,var(--text,#fff) 34%,transparent); } .liq-btn:disabled, .liq-btn[disabled], .liq-btn-sec:disabled, .liq-btn-sec[disabled], .liq-btn-ghost:disabled, .liq-btn-ghost[disabled], .liq-btn-text:disabled, .liq-btn-text[disabled]{ opacity:.42; cursor:not-allowed; box-shadow:none; } .liq-btn:disabled:hover, .liq-btn[disabled]:hover, .liq-btn-sec:disabled:hover, .liq-btn-sec[disabled]:hover, .liq-btn-ghost:disabled:hover, .liq-btn-ghost[disabled]:hover{ transform:none; box-shadow:none; filter:none; } .liq-btn[data-kopiert], .liq-btn-sec[data-kopiert], .liq-btn-ghost[data-kopiert]{ border-color:color-mix(in srgb,var(--success,#4ade80) 55%,transparent); color:var(--success,#4ade80); } .liq-btn[data-kopiert]{ animation:liq-kopiert .9s ease-out; } @keyframes liq-kopiert{ 0% { transform:scale(1); } 22% { transform:scale(.965); } 55% { transform:scale(1.012); } 100% { transform:scale(1); } } @media (prefers-reduced-motion:reduce){ .liq-btn[data-kopiert]{ animation:none; } } .liq-hint--frage{ color:var(--ink-soft,#c2cad8); border-left:2px solid var(--accent,#4f8ef7); padding-left:9px; } .liq-hint--frage b{ color:var(--text,#e9eef6); } .liq-input, input[type=text].liq, input[type=time].liq, input[type=number].liq, input[type=date].liq, .liq textarea, .liq select{ background:var(--bg); border:1px solid var(--border); border-radius:10px; color:var(--text); padding:8px 11px; font-size:var(--text-14); font-family:inherit; } .liq-input:focus{ outline:none; border-color:var(--accent); } .liq-table{ width:100%; border-collapse:collapse; font-size:var(--text-14); } .liq-table th{ text-align:left; padding:8px 12px; color:var(--muted); font-size:var(--text-11); text-transform:uppercase; letter-spacing:.05em; border-bottom:2px solid var(--border); } .liq-table td{ padding:8px 12px; border-bottom:1px solid var(--border); } .liq-pill{ display:inline-block; padding:2px 9px; border-radius:var(--radius-pill); font-size:var(--text-12); font-weight:600; background:var(--surface2); border:1px solid var(--border); } .liq-progress{ position:fixed; top:0; left:0; height:3px; width:0; z-index:60; background:var(--accent-gradient,var(--accent)); box-shadow:0 0 12px var(--accent-soft); transition:width .15s linear; pointer-events:none; } .liq-navrail{ position:fixed; right:22px; top:50%; transform:translateY(-50%); z-index:50; display:flex; flex-direction:column; gap:14px; } .liq-navdot{ position:relative; width:11px; height:11px; border-radius:50%; padding:0; cursor:pointer; border:1px solid var(--border-strong); background:transparent; transition:.3s; } .liq-navdot::after{ content:attr(data-label); position:absolute; right:20px; top:50%; transform:translateY(-50%); white-space:nowrap; font-size:var(--text-12); color:var(--muted); background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-pill); padding:3px 10px; opacity:0; pointer-events:none; transition:opacity .25s; box-shadow:var(--shadow-sm); } .liq-navdot:hover{ border-color:var(--accent); } .liq-navdot:hover::after{ opacity:1; } .liq-navdot.active{ background:var(--accent); border-color:var(--accent); box-shadow:0 0 14px var(--accent); transform:scale(1.3); } @media (max-width:820px){ .liq-navrail{ display:none; } } :root{ --liq-aurora-strength:1; --liq-aurora-2:#3a6fd0; --liq-aurora-3:#2c5aa8; } .liq-aurora{ position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; filter:saturate(135%); } .liq-blob{ position:absolute; border-radius:50%; filter:blur(64px); mix-blend-mode:screen; will-change:transform; opacity:calc(.62 * var(--liq-aurora-strength)); } .liq-blob.b1{ width:58vw; height:58vw; left:-12vw; top:-18vw; background:radial-gradient(circle at 35% 35%, var(--accent), transparent 66%); animation:liq-drift1 19s ease-in-out infinite; } .liq-blob.b2{ width:52vw; height:52vw; right:-15vw; top:-10vw; opacity:calc(.5 * var(--liq-aurora-strength)); background:radial-gradient(circle at 50% 50%, var(--liq-aurora-2), transparent 66%); animation:liq-drift2 23s ease-in-out infinite; } .liq-blob.b3{ width:50vw; height:50vw; left:8vw; bottom:-22vw; opacity:calc(.46 * var(--liq-aurora-strength)); background:radial-gradient(circle at 50% 50%, var(--liq-aurora-3), transparent 66%); animation:liq-drift3 21s ease-in-out infinite; } .liq-blob.b4{ width:40vw; height:40vw; right:-6vw; bottom:-16vw; opacity:calc(.4 * var(--liq-aurora-strength)); background:radial-gradient(circle at 50% 50%, var(--accent-deep,var(--accent)), transparent 66%); animation:liq-drift1 27s ease-in-out infinite reverse; } @keyframes liq-drift1{ 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(7vw,5vw) scale(1.16)} } @keyframes liq-drift2{ 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(-6vw,7vw) scale(1.1)} } @keyframes liq-drift3{ 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(6vw,-6vw) scale(1.2)} } @media (prefers-reduced-motion:reduce){ .liq-blob{ animation:none; } } .liq-navbtns{ position:fixed; right:clamp(20px,4vw,40px); bottom:clamp(18px,4vw,34px); z-index:55; display:flex; gap:10px; } .liq-navbtn{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center; cursor:pointer; font-size:1.2rem; line-height:1; color:var(--ink); border:1px solid var(--border-strong); background:var(--surface); transition:transform .2s, border-color .2s, box-shadow .2s, opacity .2s; } body:not([data-skin="classic"]) .liq-navbtn{ background:linear-gradient(150deg, rgba(255,255,255,.14), rgba(255,255,255,.04)); backdrop-filter:blur(18px) saturate(170%); -webkit-backdrop-filter:blur(18px) saturate(170%); border:1px solid rgba(255,255,255,.18); box-shadow:0 10px 28px -12px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.28); } .liq-navbtn:hover{ transform:translateY(-2px); border-color:var(--accent); box-shadow:0 0 18px var(--accent-soft); } .liq-navbtn:active{ transform:scale(.93); } .liq-navbtn[disabled]{ opacity:.35; pointer-events:none; } .liq-kpi{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:22px 24px; box-shadow:var(--shadow); } body:not([data-skin="classic"]) .liq-kpi{ background:rgba(255,255,255,.055); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%); border:1px solid rgba(255,255,255,.10); } .liq-kpi .k{ font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:600; } .liq-kpi .stat{ font-family:var(--d-font-accent); font-style:var(--d-font-accent-style); font-weight:var(--d-font-accent-weight,700); font-size:clamp(2rem,4vw,3rem); line-height:1; margin:8px 0 4px; font-variant-numeric:tabular-nums; color:var(--accent); } .liq-kpi .note{ color:var(--muted); font-size:.86rem; line-height:1.45; } .liq-kpi__k{ font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:600; } .liq-kpi__wert{ font-family:var(--d-font-accent); font-style:var(--d-font-accent-style); font-weight:var(--d-font-accent-weight,700); line-height:1; } .liq-kpi__note{ color:var(--muted); font-size:.86rem; line-height:1.45; } .liq-bullet{ position:relative; height:14px; border-radius:6px; overflow:hidden; border:1px solid var(--border); } .liq-bullet-z{ position:absolute; top:0; bottom:0; } .liq-bullet-z.bad{ background:color-mix(in srgb,var(--warning,#f59e0b) 14%,transparent); } .liq-bullet-z.ok{ background:color-mix(in srgb,var(--muted,#8892a4) 14%,transparent); } .liq-bullet-z.good{ background:color-mix(in srgb,var(--success,#3ecf8e) 14%,transparent); } .liq-bullet-bar{ position:absolute; top:3px; bottom:3px; left:0; border-radius:4px; background:rgb(var(--acc-1)); box-shadow:var(--glow-2); } .liq-bullet-target{ position:absolute; top:-1px; bottom:-1px; width:2px; background:var(--ink); border-radius:4px; } .liq-bullet-scale{ display:flex; justify-content:space-between; font-size:var(--text-10); color:var(--muted); margin-top:3px; } .liq-bullet--kante{ overflow:visible; } .liq-bullet--kante > .liq-bullet-z{ border-radius:inherit; } .liq-bullet--kante > .liq-bullet-target{ transform:translateX(-50%); } .liq-bullet-ueber{ position:absolute; top:3px; bottom:3px; border-radius:4px; background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--warning,#f59e0b) 70%,transparent) 0 4px, color-mix(in srgb,var(--warning,#f59e0b) 34%,transparent) 4px 8px); } .liq-sparkline{ --spark-rgb:var(--acc-1); width:100%; height:26px; display:block; } .liq-sparkline .band{ fill:rgba(var(--spark-rgb) / .16); stroke:none; } .liq-sparkline .line{ fill:none; stroke:rgb(var(--spark-rgb)); stroke-width:1.6; stroke-linejoin:round; stroke-linecap:round; } .liq-sparkline .dot{ fill:rgb(var(--spark-rgb)); } .liq-sparkline.is-area .line{ filter:drop-shadow(0 0 4px rgba(var(--spark-rgb) / .5)); } .liq-sparkline .liq-area-band{ stroke:none; } @media (prefers-reduced-transparency:reduce){ .liq-sparkline .liq-area-band{ fill:rgba(var(--spark-rgb) / .26) !important; } .liq-sparkline.is-area .line{ filter:none; } } .liq-rv{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .7s cubic-bezier(.2,.7,.2,1); } .liq-rv.in{ opacity:1; transform:none; } @media (prefers-reduced-motion:reduce){ .liq-rv{ opacity:1; transform:none; transition:none; } } .liq-hero{ text-align:center; max-width:920px; margin:0 auto; padding:clamp(24px,6vw,72px) 16px; } .liq-hero-kicker{ font-size:var(--text-12); font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--text-muted,#8892a4); margin:0 0 14px; } .liq-hero-title{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-weight:var(--d-font-display-weight,600); font-style:var(--d-font-display-style,normal); font-size:clamp(34px,6.4vw,76px); line-height:1.04; letter-spacing:-.02em; color:var(--ink,#f2f4f8); margin:0; text-shadow:0 0 calc(var(--d-glow,0px) * .55) rgba(var(--acc-1) / calc(var(--d-glow-alpha,0) * .55)); } .liq-hero-title .dim{ color:var(--text-muted,#8892a4); } .liq-hero-sub{ font-size:clamp(15px,2vw,19px); color:var(--ink-soft,#c4ccd8); max-width:640px; margin:18px auto 0; line-height:1.5; } .liq-stage{ position:relative; } .liq-stage-mock{ opacity:0; transform:translateY(40px) scale(.96); transform-origin:center bottom; will-change:transform,opacity; transition:opacity .8s ease, transform .9s cubic-bezier(.2,.7,.2,1); border-radius:var(--radius,14px); box-shadow:0 40px 120px -40px rgba(0,0,0,.6); } .liq-stage-mock.in{ opacity:1; transform:none; } @media (prefers-reduced-motion:reduce){ .liq-stage-mock{ opacity:1; transform:none; transition:none; } } :root{ --acc-1:79 142 247; --acc-2:58 111 208; --acc-3:44 90 168; --glow-1:0 0 24px rgba(var(--acc-1) / .63); --glow-2:0 0 24px rgba(var(--acc-2) / .56); --grain-opacity:.045; --liq-mesh-strength:1; --liq-glass-strength:1; --ease-liquid:cubic-bezier(.34,1.56,.64,1); --ease-soft:cubic-bezier(.22,.61,.36,1); } .liq-mesh{ background-color:var(--bg); background-image: radial-gradient(at 18% 22%, rgba(var(--acc-1) / calc(.20 * var(--liq-mesh-strength,1))) 0, transparent 55%), radial-gradient(at 82% 12%, rgba(var(--acc-2) / calc(.18 * var(--liq-mesh-strength,1))) 0, transparent 50%), radial-gradient(at 45% 88%, rgba(var(--acc-3) / calc(.12 * var(--liq-mesh-strength,1))) 0, transparent 55%), radial-gradient(at 70% 60%, rgba(var(--acc-1) / calc(.10 * var(--liq-mesh-strength,1))) 0, transparent 50%); } .liq-mesh--drift{ background-size:150% 150%; background-position:22% 28%; animation:liq-mesh-drift 22s ease-in-out infinite alternate; } @keyframes liq-mesh-drift{ from{ background-position:22% 28%; } to{ background-position:62% 68%; } } .liq-grain{ position:relative; } .liq-grain::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:1; opacity:var(--grain-opacity); mix-blend-mode:overlay; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); } .liq-glow{ box-shadow:var(--glow-1); } .liq-glow-2{ box-shadow:var(--glow-2); } .liq-glow:hover{ box-shadow:0 0 34px rgba(var(--acc-1) / .85); transition:box-shadow .4s var(--ease-soft); } :root{ --liq-gradient-strength:1; } .liq-wortmarke{ font-family:var(--d-font-display); font-weight:700; letter-spacing:-.01em; background:linear-gradient(100deg, var(--accent,#4f8ef7) 0%, var(--text,#e9eef6) 92%); -webkit-background-clip:text; background-clip:text; color:transparent; } @media (prefers-contrast:more){ .liq-wortmarke{ background:none; color:var(--text,#e9eef6); } } .liq-gradient-text{ background:linear-gradient(100deg, rgb(var(--acc-1)), color-mix(in oklab, rgb(var(--acc-2)) calc(var(--liq-gradient-strength,1) * 100%), rgb(var(--acc-1)))); -webkit-background-clip:text; background-clip:text; color:transparent; font-family:var(--d-font-display); } :is(.liq-cta,.liq-handlungsknopf){ border:1px solid var(--accent-soft); border-radius:14px; padding:12px 22px; font-weight:700; cursor:pointer; color:var(--ink); background:var(--surface); transition:box-shadow .3s var(--ease-soft), border-color .3s var(--ease-soft), transform .18s var(--ease-liquid); } :is(.liq-cta,.liq-handlungsknopf):hover{ box-shadow:var(--glow-1); border-color:rgb(var(--acc-1)); } :is(.liq-cta,.liq-handlungsknopf):active{ transform:scale(.98); } :is(.liq-cta--fill,.liq-handlungsknopf--voll){ border:none; color:#fff; background:rgb(var(--acc-1)); box-shadow:0 6px 18px rgba(var(--acc-1) / .32); } :is(.liq-cta--fill,.liq-handlungsknopf--voll):hover{ box-shadow:0 8px 26px rgba(var(--acc-1) / .48); border-color:transparent; } :is(.liq-cta--hell,.liq-handlungsknopf--hell){ border:none; background:#f2f4f8; color:#0b0b0d; box-shadow:none; } :is(.liq-cta--hell,.liq-handlungsknopf--hell):hover{ background:#ffffff; box-shadow:0 6px 18px rgba(0,0,0,.28); border-color:transparent; } .liq-grid{ --spalten:5; display:grid; grid-template-columns:46px repeat(var(--spalten),minmax(0,1fr)); gap:2px; background:var(--surface,#1a1d27); border:1px solid var(--border,#2e3347); border-radius:var(--radius-lg,14px); padding:2px; box-sizing:border-box; } .liq-grid__kopf{ position:sticky; top:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-height:44px; padding:4px 2px; background:var(--surface,#1a1d27); border-radius:8px; } .liq-grid__dow{ font-size:var(--text-11,11px); font-weight:700; color:var(--muted,#8892a4); text-transform:uppercase; letter-spacing:.04em; } .liq-grid__dnum{ font-size:var(--text-14,14px); font-weight:700; font-variant-numeric:tabular-nums; } .liq-grid__kopf--heute .liq-grid__dnum{ color:var(--accent,#4f8ef7); } .liq-grid__zeit{ display:flex; align-items:flex-start; justify-content:flex-end; padding:2px 6px 0 0; font-size:var(--text-11,11px); font-weight:600; color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; } .liq-grid__zeit--halb{ opacity:.42; } .liq-slot{ min-height:44px; border:0; padding:0; margin:0; cursor:pointer; border-radius:7px; font:inherit; color:inherit; box-sizing:border-box; position:relative; background:color-mix(in srgb,var(--accent,#4f8ef7) 13%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 26%,transparent); transition:background .12s,transform .12s; } .liq-slot:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 24%,transparent); } .liq-slot:active{ transform:scale(.96); } .liq-slot:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-slot--belegt{ cursor:not-allowed; border-color:transparent; background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--text,#fff) 11%,transparent) 0 4px, transparent 4px 8px); } .liq-slot--belegt:hover,.liq-slot--belegt:active{ transform:none; background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--text,#fff) 11%,transparent) 0 4px, transparent 4px 8px); } .liq-slot--weg{ cursor:default; background:transparent; border:1px dashed color-mix(in srgb,var(--text,#fff) 9%,transparent); } .liq-slot--weg:hover,.liq-slot--weg:active{ transform:none; background:transparent; } .liq-slot--anfang,.liq-slot--reihe{ background:var(--accent,#4f8ef7); border-color:transparent; box-shadow:0 2px 12px color-mix(in srgb,var(--accent,#4f8ef7) 45%,transparent); } .liq-slot--anfang::after{ content:''; position:absolute; left:8px; right:8px; top:6px; height:2px; border-radius:2px; background:#fff; opacity:.9; } .liq-slot--reihe{ opacity:.82; } .liq-grid--unsicher .liq-slot:not(.liq-slot--belegt):not(.liq-slot--weg){ background:repeating-linear-gradient(45deg, color-mix(in srgb,var(--warning,#f59e0b) 13%,transparent) 0 5px, transparent 5px 10px); border-color:color-mix(in srgb,var(--warning,#f59e0b) 32%,transparent); } @media (prefers-reduced-motion:reduce){ .liq-slot{ transition:none; } .liq-slot:active{ transform:none; } } @media (prefers-reduced-transparency:reduce){ .liq-slot{ background:var(--surface-2,#242836); border-color:var(--border,#2e3347); } } body[data-cta="fill"] :is(.liq-cta,.liq-handlungsknopf):not(:is(.liq-cta--ghost,.liq-handlungsknopf--leer,.liq-cta--hell,.liq-handlungsknopf--hell)){ border:none; color:#fff; background:rgb(var(--acc-1)); box-shadow:0 6px 18px rgba(var(--acc-1) / .32); } body[data-cta="fill"] :is(.liq-cta,.liq-handlungsknopf):not(:is(.liq-cta--ghost,.liq-handlungsknopf--leer,.liq-cta--hell,.liq-handlungsknopf--hell)):hover{ box-shadow:0 8px 26px rgba(var(--acc-1) / .48); border-color:transparent; } .liq-interactive{ transition:transform .25s var(--ease-liquid), opacity .25s var(--ease-soft); } .liq-interactive:active{ transform:scale(.98); } @media (prefers-reduced-motion:reduce){ .liq-interactive{ transition:none; } } .liq-glass-chrome{ background:linear-gradient(155deg, rgba(255,255,255,.07), rgba(255,255,255,.022)); backdrop-filter:blur(calc(16px * var(--liq-glass-strength,1))) saturate(150%); -webkit-backdrop-filter:blur(calc(16px * var(--liq-glass-strength,1))) saturate(150%); border:1px solid rgba(255,255,255,.10); box-shadow:inset 0 1px 0 rgba(255,255,255,.14); } .liq-glass-chrome.liq-glass-tint{ background:linear-gradient(155deg, color-mix(in srgb, var(--surface,#1d1d1d) 62%, transparent), color-mix(in srgb, var(--bg,#0f1117) 72%, transparent)); } button.liq-glass-chrome, .liq-glass-chrome.liq-glass-btn{ cursor:pointer; transition:background .18s, border-color .18s, box-shadow .18s, transform .18s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } button.liq-glass-chrome:hover, .liq-glass-chrome.liq-glass-btn:hover{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 45%, transparent); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 0 0 3px color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); } button.liq-glass-chrome:active, .liq-glass-chrome.liq-glass-btn:active{ transform:scale(.97); } @media (prefers-reduced-transparency:reduce){ .liq-glass-chrome,.liq-glass-chrome.liq-glass-tint{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface,#1d1d1d); } } @media (prefers-reduced-motion:reduce){ button.liq-glass-chrome,.liq-glass-chrome.liq-glass-btn{ transition:background .18s, border-color .18s; } } .liq-glass-card{ position:relative; background:linear-gradient(165deg, rgba(255,255,255,.075), rgba(255,255,255,.02) 55%, rgba(255,255,255,.008)), var(--liq-card-tint,rgba(20,23,33,.62)); backdrop-filter:blur(calc(16px * var(--liq-glass-strength,1))) saturate(1.15); -webkit-backdrop-filter:blur(calc(16px * var(--liq-glass-strength,1))) saturate(1.15); border:1px solid rgba(255,255,255,.09); border-radius:var(--radius,14px); box-shadow:0 14px 44px -18px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.13), inset 0 -1px 0 rgba(255,255,255,.03); } .liq-glass-card::before{ content:""; position:absolute; inset:0 0 auto 0; height:42%; pointer-events:none; border-radius:var(--radius,14px) var(--radius,14px) 60% 60%; background:linear-gradient(180deg, rgba(255,255,255,.05), transparent); } .liq-glass-card.liq-interactive:hover, button.liq-glass-card:hover, .liq-glass-card.is-clickable:hover{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 28%, transparent); } @media (prefers-reduced-transparency:reduce){ .liq-glass-card{ backdrop-filter:none; -webkit-backdrop-filter:none; background:linear-gradient(160deg, var(--surface,#1d1d1d), var(--surface-alt,#272727)); } .liq-glass-card::before{ display:none; } } .liq-glass--bevel{ --liq-bevel:1; box-shadow: inset 0 1.5px 0 rgba(255,255,255,calc(.5 * var(--liq-bevel,1))), inset 1px 0 0 rgba(255,255,255,calc(.14 * var(--liq-bevel,1))), inset 0 0 0 1px rgba(255,255,255,calc(.09 * var(--liq-bevel,1))), inset -1px 0 0 rgba(0,0,0,calc(.18 * var(--liq-bevel,1))), inset 0 -2px 1px rgba(0,0,0,calc(.32 * var(--liq-bevel,1))), 0 14px 44px -18px rgba(0,0,0,.55); } @media (prefers-reduced-transparency:reduce){ .liq-glass--bevel{ box-shadow:inset 0 1px 0 rgba(255,255,255,calc(.22 * var(--liq-bevel,1))), inset 0 -1px 0 rgba(0,0,0,calc(.22 * var(--liq-bevel,1))), 0 14px 44px -18px rgba(0,0,0,.55); } } .liq-glass--refract{ position:relative; overflow:hidden; border-radius:var(--radius,14px); border:1px solid rgba(255,255,255,.10); box-shadow:0 14px 44px -18px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.13); } .liq-glass--refract > .liq-refract-layer{ border-radius:inherit; } .liq-glass--refract::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit; background:linear-gradient(165deg, rgba(255,255,255,.06), transparent 45%), var(--liq-refract-tint,rgba(16,19,28,.30)); } @media (prefers-reduced-transparency:reduce){ .liq-glass--refract{ background:linear-gradient(160deg, var(--surface,#1d1d1d), var(--surface-alt,#272727)); } .liq-glass--refract::after{ display:none; } } input, select, textarea, button, optgroup{ font:inherit; } .liq-aktekopf{ display:flex; align-items:center; gap:16px; padding:4px 0 6px; transition:padding .18s ease, gap .18s ease; } .liq-aktekopf__wer{ min-width:0; } .liq-aktekopf__name{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-weight:620; font-size:clamp(24px,4vw,34px); line-height:1.05; letter-spacing:-.02em; margin:0; color:var(--ink,#e8ecf3); } .liq-aktekopf__rolle{ font-size:var(--text-12); letter-spacing:.12em; text-transform:uppercase; color:var(--muted,#8892a4); margin:7px 0 0; } .liq-aktekopf__pille{ display:inline-flex; align-items:center; gap:7px; margin-top:7px; padding:4px 6px 4px 12px; border-radius:999px; background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 48%,transparent); } .liq-aktekopf__pille-et{ font-size:var(--text-11); font-weight:650; letter-spacing:.06em; text-transform:uppercase; color:color-mix(in srgb,var(--accent,#4f8ef7) 72%,var(--ink,#e2e8f0)); } .liq-aktekopf__pille-w{ appearance:none; -webkit-appearance:none; border:0; background:none; color:var(--ink,#e2e8f0); font:inherit; font-size:var(--text-14); font-weight:650; padding:2px 22px 2px 2px; cursor:pointer; min-height:32px; background-image:linear-gradient(45deg,transparent 50%,currentColor 50%), linear-gradient(135deg,currentColor 50%,transparent 50%); background-position:calc(100% - 11px) 55%, calc(100% - 6px) 55%; background-size:5px 5px, 5px 5px; background-repeat:no-repeat; } .liq-aktekopf__pille-w:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; border-radius:8px; } .liq-aktekopf__pille-w:disabled{ cursor:default; opacity:.75; background-image:none; padding-right:2px; } .liq-aktekopf--klebt{ position:sticky; top:0; z-index:5; background:var(--bg,#0f1117); box-shadow:0 1px 0 color-mix(in srgb,var(--text,#fff) 10%,transparent); } .liq-aktekopf.is-kompakt{ padding:6px 0 6px; gap:10px; } .liq-aktekopf.is-kompakt .liq-aktekopf__name{ font-size:var(--text-16); line-height:1.2; } .liq-aktekopf.is-kompakt .liq-aktekopf__rolle{ font-size:var(--text-11); margin:0 0 0 10px; display:inline-block; } .liq-aktekopf.is-kompakt .liq-aktekopf__pille{ margin-top:0; padding:1px 5px 1px 9px; } .liq-aktekopf.is-kompakt .liq-aktekopf__pille-w{ min-height:24px; font-size:var(--text-13); } .liq-aktekopf.is-kompakt .liq-aktekopf__marken{ max-height:0; margin:0; overflow:hidden; } @media (prefers-reduced-motion:reduce){ .liq-aktekopf{ transition:none; } } .liq-aktekopf__marken{ display:flex; flex-wrap:wrap; gap:6px; margin:13px 0 4px; } .liq-sec-h__n{ font-variant-numeric:tabular-nums; color:var(--accent,#4f8ef7); opacity:.75; font-weight:700; margin-right:9px; } .liq-listeplus > .liq-row{ gap:8px; align-items:center; flex-wrap:nowrap; padding:2px 0; } .liq-listeplus__nr{ flex:none; width:18px; text-align:right; font-variant-numeric:tabular-nums; } .liq-listeplus__f{ flex:1 1 0; min-width:0; } .liq-listeplus__f--breit{ flex:2 1 0; } .liq-listeplus__weg{ flex:none; min-width:34px; padding:0 10px; } .liq-kennzahlen{ display:flex; flex-wrap:wrap; gap:10px; margin:4px 0 14px; } .liq-kennzahl{ flex:1 1 186px; padding:14px 16px; border-radius:var(--radius-md,10px); background:color-mix(in srgb, var(--text,#fff) 3.5%, transparent); border:1px solid var(--trennlinie,rgba(255,255,255,.09)); } .liq-kennzahl--akz{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 34%, transparent); } .liq-kennzahl__k{ font-size:var(--text-12); letter-spacing:.08em; text-transform:uppercase; color:var(--muted,#8892a4); margin:0 0 8px; } .liq-kennzahl__v{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-weight:620; font-size:27px; line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--ink,#e8ecf3); } .liq-kennzahl__n{ font-size:var(--text-12); color:var(--muted,#8892a4); margin-top:7px; } .liq-platzhalter{ border:2px dashed color-mix(in srgb, var(--accent,#4f8ef7) 34%, var(--trennlinie,rgba(255,255,255,.2))); border-radius:var(--radius-md,10px); padding:16px 18px; background:color-mix(in srgb, var(--text,#fff) 3%, transparent); cursor:not-allowed; user-select:none; } .liq-platzhalter__t{ font-weight:700; color:var(--ink,#e8ecf3); } .liq-platzhalter__n{ font-size:var(--text-12); color:var(--muted,#8892a4); margin-top:5px; } .liq-platzhalter__marke{ display:inline-block; margin-bottom:8px; font-size:var(--text-11,11px); font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 9px; border-radius:var(--radius-pill,999px); color:var(--warning,#f59e0b); background:color-mix(in srgb, var(--warning,#f59e0b) 16%, transparent); } .liq-leerwert--gesperrt{ color:var(--muted,#8892a4); font-style:italic; } .liq-kapkopf{ display:flex; align-items:baseline; gap:13px; margin:34px 0 11px; } .liq-kapkopf__n{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:var(--text-13,13px); font-weight:700; color:var(--accent,#4f8ef7); opacity:.8; font-variant-numeric:tabular-nums; min-width:18px; } .liq-kapkopf__t{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:19px; font-weight:600; letter-spacing:-.01em; margin:0; color:var(--ink,#e8ecf3); } .liq-kapkopf__z{ font-size:var(--text-12); color:var(--muted,#8892a4); font-weight:400; } .liq-kapkopf__l{ flex:1; height:1px; min-width:20px; background:linear-gradient(90deg, var(--trennlinie,rgba(255,255,255,.09)), transparent); } .liq-kapstapel .liq-kapkopf{ position:sticky; top:0; z-index:4; margin-top:14px; padding:10px 0 8px; background:var(--liq-kapstapel-grund, var(--bg,#0f1117)); } .liq-kapstapel .liq-sec-h{ position:sticky; top:var(--liq-kapkopf-h,46px); z-index:3; padding:6px 0 5px; background:var(--liq-kapstapel-grund, var(--bg,#0f1117)); } .liq-pane{ background:var(--surface,#1d1d1d); border:1px solid var(--border,rgba(255,255,255,.09)); border-radius:var(--radius,14px); } body:not([data-skin="classic"]) .liq-pane, body:not([data-skin="classic"]) .liq-sec{ background:linear-gradient(165deg, rgba(255,255,255,.06), rgba(255,255,255,.015)); backdrop-filter:blur(calc(20px * var(--liq-glass-strength,1))) saturate(170%); -webkit-backdrop-filter:blur(calc(20px * var(--liq-glass-strength,1))) saturate(170%); border-color:rgba(255,255,255,.1); } @media (prefers-reduced-transparency:reduce){ body:not([data-skin="classic"]) .liq-pane, body:not([data-skin="classic"]) .liq-sec{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface,#1d1d1d); } } body:not([data-skin="classic"]) .liq-sec .liq-sec, body:not([data-skin="classic"]) .liq-sec .liq-pane, body:not([data-skin="classic"]) .liq-sec .liq-card, body:not([data-skin="classic"]) .liq-pane .liq-sec, body:not([data-skin="classic"]) .liq-pane .liq-pane, body:not([data-skin="classic"]) .liq-pane .liq-card, body:not([data-skin="classic"]) .liq-card .liq-sec, body:not([data-skin="classic"]) .liq-card .liq-pane, body:not([data-skin="classic"]) .liq-card .liq-card, body:not([data-skin="classic"]) .liq-sheet .liq-sec, body:not([data-skin="classic"]) .liq-sheet .liq-pane, body:not([data-skin="classic"]) .liq-sheet .liq-card, body:not([data-skin="classic"]) .liq-modal .liq-sec, body:not([data-skin="classic"]) .liq-modal .liq-pane, body:not([data-skin="classic"]) .liq-modal .liq-card{ background:none; backdrop-filter:none; -webkit-backdrop-filter:none; border-color:transparent; box-shadow:none; } body:not([data-skin="classic"]) .liq-sec .liq-pane.liq-abgesetzt, body:not([data-skin="classic"]) .liq-pane .liq-pane.liq-abgesetzt, body:not([data-skin="classic"]) .liq-sec .liq-sec.liq-abgesetzt{ border-top-color:var(--trennlinie,rgba(255,255,255,.09)); border-radius:0; padding-left:0; padding-right:0; } .liq-pane--flach, body:not([data-skin="classic"]) .liq-pane--flach{ background:none; background-image:none; backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none; border:1px solid var(--border,rgba(255,255,255,.09)); } .liq-pane--stillgelegt{ border-style:dashed; background:color-mix(in srgb,var(--panel,#1a1d26) 60%,transparent); } .liq-pane--stillgelegt .liq-btnrow{ display:none; } .liq-sec{ border-radius:20px; padding:18px 18px 20px; scroll-margin-top:14px; background:var(--surface,#1d1d1d); border:1px solid var(--border-strong,rgba(255,255,255,.14)); } .liq-sec + .liq-sec{ margin-top:12px; } .liq-view > :is(.liq-sec, .liq-block, .liq-kennzahlen, .liq-btnrow, .liq-felder){ margin-bottom:0; } .liq-view > :is(.liq-sec, .liq-block, .liq-kennzahlen, .liq-btnrow, .liq-felder) + :is(.liq-sec, .liq-block, .liq-kennzahlen, .liq-btnrow, .liq-felder){ margin-top:12px; } .liq-sec-h{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-top:0; margin-bottom:3px; } .liq-sec-h h2{ margin:0; font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:18px; letter-spacing:-.25px; } h2.liq-sec-h, h3.liq-sec-h, h4.liq-sec-h{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); letter-spacing:-.25px; } h2.liq-sec-h{ font-size:18px; } h3.liq-sec-h, h4.liq-sec-h{ font-size:var(--text-15,15px); } h3.liq-sec-h, h4.liq-sec-h{ margin-top:44px; } :where(h3, h4).liq-sec-h:first-child{ margin-top:0; } h3.liq-sec-h--trenn, h4.liq-sec-h--trenn{ padding-top:15px; border-top:1px solid var(--trennlinie); } :where(h3, h4).liq-sec-h--trenn:first-child{ padding-top:0; border-top:0; } .liq-sec-h .vis{ margin-left:auto; font-size:var(--text-10); font-weight:600; color:var(--muted,#8892a4); border:1px solid var(--border,#333333); border-radius:6px; padding:4px 8px; white-space:nowrap; } .liq-sec-sub{ font-size:var(--text-12); color:var(--muted,#8892a4); line-height:1.55; margin:0 0 14px; max-width:70ch; } .liq-blockhead{ font-size:var(--text-10); text-transform:uppercase; letter-spacing:.07em; color:var(--muted,#8892a4); font-weight:700; margin:16px 0 8px; display:flex; align-items:center; gap:8px; } .liq-blockhead::after{ content:""; flex:1; height:1px; background:var(--border,#333333); } .liq-blockhead:first-child{ margin-top:0; } .liq-felder{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(300px,100%), 1fr)); gap:10px; align-items:start; } .liq-felder--dense{ grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); } .liq-pflicht{ flex-wrap:wrap; row-gap:6px; } .liq-pflicht > .liq-pflicht__bed{ flex:1 1 200px; min-width:0; } .liq-pflicht__stern{ margin-left:3px; color:var(--accent,#4f8ef7); font-weight:700; } .liq-pflicht__hinweis{ flex:1 1 100%; font-size:var(--text-13); line-height:1.35; color:var(--muted,#8892a4); } .liq-pflicht--leer{ border-color:color-mix(in srgb, var(--muted,#8892a4) 45%, transparent); } .liq-pflicht--leer .liq-pflicht__stern{ color:var(--muted,#8892a4); } @media (max-width:520px){ .liq-pflicht > i{ flex:1 1 100%; } .liq-pflicht > .liq-pflicht__bed{ flex:1 1 100%; min-height:var(--h-wahl,44px); } .liq-pflicht .lsel-trg{ min-height:var(--h-wahl,44px); width:100%; justify-content:space-between; } .liq-pflicht .lsel-seg{ min-height:var(--h-wahl,44px); width:100%; } } .liq-field--wide{ grid-column:span 2; } .liq-field--full{ grid-column:1 / -1; } .liq-felder__full{ grid-column:1 / -1; } .liq-felder > .liq-panel, .liq-felder > .liq-sluice, .liq-felder > .liq-chain, .liq-felder > .liq-abnahme, .liq-felder > .liq-conflict, .liq-felder > .liq-error{ grid-column:1 / -1; } @media (max-width:720px){ .liq-field--wide, .liq-field--full{ grid-column:auto; } } .liq-field--regler{ grid-column:1 / -1; align-items:flex-start; flex-wrap:wrap; row-gap:8px; } .liq-field--tage{ flex-direction:column; } .liq-field--tage > .liq-field__zeile{ width:100%; } .liq-field__tage{ width:100%; } .liq-field__tage .liq-wahlchip[data-wert="sa"]{ margin-left:10px; } .liq-fieldlegend{ grid-column:1 / -1; display:flex; align-items:center; gap:8px; margin:4px 0 2px; font-weight:700; font-size:var(--text-11); line-height:1.3; text-transform:uppercase; letter-spacing:.06em; color:var(--muted,#8892a4); } .liq-fieldlegend::after{ content:''; order:1; flex:1 1 auto; height:1px; background:var(--border,#333333); } .liq-fieldlegend__hint{ order:0; font-weight:500; text-transform:none; letter-spacing:0; color:var(--subtle,#5a6377); } .liq-fieldlegend__mark{ order:2; margin-left:8px; display:inline-flex; align-items:center; } .liq-fieldlegend--hide{ display:none; } .liq-field{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:10px; background:none; font-size:var(--text-13); min-height:44px; border:1px solid var(--border,#333333); transition:border-color .15s, background .15s; -webkit-tap-highlight-color:transparent; } .liq-field.klick{ cursor:text; } .liq-field.klick:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 5%,transparent); } .liq-field i{ font-style:normal; color:var(--muted,#8892a4); flex:0 0 44%; min-width:0; } .liq-field b{ font-weight:600; min-width:0; overflow-wrap:anywhere; flex:1; } .liq-field.klick{ cursor:text; } .liq-field.klick:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 5%,transparent); } .liq-field i{ font-style:normal; color:var(--muted,#8892a4); flex:0 0 44%; min-width:0; } .liq-field b{ font-weight:600; min-width:0; overflow-wrap:anywhere; flex:1; } .liq-field--gestapelt > i{ flex:none; color:var(--text,#e9eef6); } :is(.liq-field--vorschlag){ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 42%, transparent); background:color-mix(in srgb, var(--accent,#4f8ef7) 7%, transparent); box-shadow:inset 3px 0 0 color-mix(in srgb, var(--accent,#4f8ef7) 78%, transparent); } :is(.liq-field--vorschlag):hover{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 62%, transparent); } :is(.liq-field--vorschlag,.liq-field--ki) .liq-field__zeile > b{ color:var(--text,#e9eef6); } @media (prefers-reduced-transparency:reduce){ :is(.liq-field--vorschlag){ background:none; border-color:color-mix(in srgb, var(--accent,#4f8ef7) 70%, transparent); } } .liq-field--ki{ border-color:color-mix(in srgb, var(--ki,#f5a524) 42%, transparent); background-color:color-mix(in srgb, var(--ki,#f5a524) 7%, transparent); background-image:var(--ki-naht); background-repeat:no-repeat; background-size:3px 100%; background-position:left center; box-shadow:none; } .liq-field--ki:hover{ border-color:color-mix(in srgb, var(--ki,#f5a524) 62%, transparent); } .liq-field--ki .liq-field__zeile > b{ color:var(--text,#e9eef6); } @media (prefers-reduced-transparency:reduce){ .liq-field--ki{ background-color:transparent; border-color:color-mix(in srgb, var(--ki,#f5a524) 70%, transparent); } } .liq-field.leer b{ color:var(--subtle,#5a6377); font-weight:400; } .liq-field-src{ font-size:var(--text-10); color:var(--subtle,#5a6377); padding:3px 12px 0; display:flex; align-items:center; gap:5px; line-height:1.45; } .liq-field-src.ki{ color:var(--ki,#f5a524); font-weight:600; } .liq-field-src.frisch{ color:var(--success,#3ecf8e); } .liq-field-src svg{ width:9px; height:9px; flex:none; stroke:currentColor; fill:none; stroke-width:2; } @media (max-width:440px){ .liq-field{ flex-direction:column; align-items:flex-start; gap:2px; padding:8px 12px; } .liq-field i{ flex:none; font-size:var(--text-11); } .liq-field b{ flex:none; } } .liq-field--gestapelt{ flex-direction:column; align-items:stretch; gap:4px; padding:10px 12px; height:auto; } .liq-field--gestapelt > .liq-field__hint{ margin:0; } .liq-field--gestapelt > .liq-field__zeile{ display:flex; align-items:center; gap:8px; flex-direction:row; } .liq-schleusen{ display:grid; grid-template-columns:repeat(auto-fill,minmax(215px,1fr)); gap:9px; } @media (max-width:699px){ .liq-schleusen{ grid-template-columns:minmax(0,1fr); } } .liq-drop{ border:1.5px dashed var(--border,#333333); border-radius:14px; padding:12px 13px; background:color-mix(in srgb,var(--text,#e2e8f0) 2%,transparent); cursor:pointer; min-height:84px; transition:border-color .16s, background .16s; -webkit-tap-highlight-color:transparent; } .liq-drop:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 40%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 5%,transparent); } .liq-drop-h{ display:flex; align-items:center; gap:8px; font-size:var(--text-12); font-weight:650; } .liq-drop-h svg{ width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:1.7; flex:none; color:var(--muted,#8892a4); } .liq-drop-hint{ font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:3px; line-height:1.45; } .liq-drop.hat{ border-style:solid; border-color:color-mix(in srgb,var(--success,#3ecf8e) 32%,transparent); background:color-mix(in srgb,var(--success,#3ecf8e) 6%,transparent); } .liq-drop-file{ display:flex; align-items:center; gap:7px; font-size:var(--text-11); margin-top:7px; color:var(--muted,#8892a4); } .liq-drop-file svg{ width:12px; height:12px; stroke:var(--success,#3ecf8e); fill:none; stroke-width:2.2; flex:none; } .liq-drop-badge{ display:none; } .liq-drop.faellig, .liq-drop.ueberfaellig{ border-color:color-mix(in srgb,var(--warning,#f59e0b) 40%,transparent); } .liq-drop.faellig .liq-drop-badge, .liq-drop.ueberfaellig .liq-drop-badge{ display:inline-flex; align-items:center; gap:5px; font-size:var(--text-10); font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--warning,#f59e0b); margin-top:7px; border:1px solid color-mix(in srgb,var(--warning,#f59e0b) 35%,transparent); border-radius:6px; padding:3px 8px; } .lsel{ display:inline-flex; vertical-align:middle; max-width:100%; } .lsel > select{ display:none !important; } .lsel-seg{ display:inline-flex; align-items:center; gap:4px; padding:4px; border-radius:10px; max-width:100%; flex-wrap:wrap; background:rgba(255,255,255,.05); border:1px solid var(--border); } .lsel-seg button{ border:0; background:transparent; color:var(--text-muted); font:inherit; font-size:var(--text-12); font-weight:600; padding:6px 12px; border-radius:6px; cursor:pointer; transition:.13s; white-space:nowrap; } .lsel-seg button:hover{ color:var(--text); background:rgba(255,255,255,.07); } .lsel-seg button.on{ color:#fff; background:color-mix(in srgb,var(--accent) 86%,transparent); box-shadow:0 3px 12px color-mix(in srgb,var(--accent) 38%,transparent); } body:not([data-skin="classic"]) .lsel-seg{ backdrop-filter:blur(14px) saturate(155%); -webkit-backdrop-filter:blur(14px) saturate(155%); } .lsel-trg{ display:inline-flex; align-items:center; gap:8px; max-width:100%; color:var(--text); font:inherit; font-size:var(--text-13); font-weight:600; background:rgba(255,255,255,.05); border:1px solid var(--border); border-radius:10px; padding:7px 12px; cursor:pointer; transition:.13s; } .lsel-trg:hover{ border-color:rgba(255,255,255,.3); } .lsel-trg:focus-visible{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent); } .lsel-trg .lsel-lbl{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .lsel-trg .lsel-car{ margin-left:auto; width:9px; height:9px; flex:0 0 auto; border-right:2px solid var(--text-muted); border-bottom:2px solid var(--text-muted); transform:translateY(-2px) rotate(45deg); transition:.2s; } .lsel.open .lsel-trg .lsel-car{ transform:translateY(1px) rotate(-135deg); } body:not([data-skin="classic"]) .lsel-trg{ backdrop-filter:blur(12px) saturate(150%); -webkit-backdrop-filter:blur(12px) saturate(150%); } .lsel--sm .lsel-trg{ font-size:var(--text-11); padding:3px 8px; border-radius:6px; } .lsel--sm .lsel-seg button{ font-size:var(--text-11); padding:3px 9px; } .lsel--sm .lsel-trg .lsel-car{ width:7px; height:7px; } .lsel-menu{ position:fixed; z-index:99999; min-width:200px; max-width:340px; display:none; max-height:320px; overflow:auto; background:rgba(20,16,30,.92); border:1px solid var(--border); border-radius:14px; padding:6px; box-shadow:0 24px 64px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.16); backdrop-filter:blur(calc(26px * var(--liq-glass-strength,1))) saturate(170%); -webkit-backdrop-filter:blur(calc(26px * var(--liq-glass-strength,1))) saturate(170%); } .lsel-menu.open{ display:block; animation:lselpop .15s ease; } @keyframes lselpop{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } } .lsel-menu .lsel-search{ width:100%; box-sizing:border-box; background:rgba(255,255,255,.05); border:1px solid var(--border); border-radius:6px; padding:7px 10px; color:var(--text); font:inherit; font-size:var(--text-13); margin-bottom:5px; } .lsel-menu .lsel-search::placeholder{ color:var(--text-muted); } .lsel-menu .lsel-grp{ font-size:var(--text-10); font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); padding:7px 10px 3px; } .lsel-menu .lsel-opt{ display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:6px; cursor:pointer; font-size:var(--text-13); color:var(--text); } .lsel-menu .lsel-opt:hover, .lsel-menu .lsel-opt.hl{ background:rgba(255,255,255,.08); } .lsel-menu .lsel-opt.on{ background:color-mix(in srgb,var(--accent) 20%,transparent); } .lsel-menu .lsel-opt .lsel-ck{ width:14px; height:14px; flex:0 0 auto; margin-left:auto; color:var(--accent); opacity:0; stroke:var(--accent); } .lsel-menu .lsel-opt.on .lsel-ck{ opacity:1; } .lsel-menu .lsel-empty{ color:var(--text-muted); font-size:var(--text-12); padding:10px; text-align:center; } @media (prefers-reduced-transparency:reduce){ body:not([data-skin="classic"]) .lsel-seg, body:not([data-skin="classic"]) .lsel-trg{ backdrop-filter:none; -webkit-backdrop-filter:none; } .lsel-menu{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface,#1d1d1d); } } :root{ --liq-lift:-2px; --liq-hoverglow-strength:1.25; --liq-hover-glow:0 0 0 1px rgba(var(--acc-1, 79 142 247) / calc(.35 * var(--liq-hoverglow-strength,1))), 0 8px 22px -8px rgba(var(--acc-1, 79 142 247) / calc(.55 * var(--liq-hoverglow-strength,1))); --liq-press:scale(.97); } .liq-btn, .liq-btn-sec, :is(.liq-cta,.liq-handlungsknopf), .hub-tile, .liq-navbtn, .liq-navdot, .liq-pill[role="button"], .liq-pill.is-clickable, .liq-input, input[type=text].liq, input[type=date].liq, input[type=time].liq, input[type=number].liq, .liq textarea, .liq select{ transition:transform .25s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), box-shadow .3s var(--ease-soft,cubic-bezier(.22,.61,.36,1)), border-color .2s var(--ease-soft,ease), filter .2s ease; } .liq-btn:hover, .liq-btn-sec:hover, :is(.liq-cta,.liq-handlungsknopf):hover, .hub-tile:hover{ transform:translateY(var(--liq-lift)); box-shadow:var(--liq-hover-glow); } .liq-btn:active, .liq-btn-sec:active, :is(.liq-cta,.liq-handlungsknopf):active, .hub-tile:active, .liq-navbtn:active{ transform:var(--liq-press); } .liq-input:focus, input.liq:focus, .liq textarea:focus, .liq select:focus, .liq-input:focus-visible{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--acc-1) / .22); } .liq-btn:focus-visible, .liq-btn-sec:focus-visible, :is(.liq-cta,.liq-handlungsknopf):focus-visible, .hub-tile:focus-visible, .liq-navbtn:focus-visible, .liq-navdot:focus-visible{ outline:none; box-shadow:var(--liq-hover-glow); } .liq-static, .liq-static:hover, .liq-static:active{ transform:none !important; box-shadow:inherit; } @media (prefers-reduced-motion:reduce){ .liq-btn, .liq-btn-sec, :is(.liq-cta,.liq-handlungsknopf), .hub-tile, .liq-navbtn, .liq-navdot, .liq-input, input.liq, .liq textarea, .liq select{ transition:box-shadow .2s ease, border-color .2s ease; } .liq-btn:hover, .liq-btn-sec:hover, :is(.liq-cta,.liq-handlungsknopf):hover, .hub-tile:hover{ transform:none; } } body:not([data-skin="classic"]) .bi-nav, body:not([data-skin="classic"]) .liq-tab{ transition:transform .2s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), background .15s ease, box-shadow .3s var(--ease-soft,ease), color .15s ease; } body:not([data-skin="classic"]) .bi-nav:hover, body:not([data-skin="classic"]) .liq-tab:hover{ transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .bi-nav:focus-visible, .liq-tab:focus-visible, .hub-tile:focus-visible, .bi-nav[data-keynav-item]:focus, .liq-tab[data-keynav-item]:focus{ outline:none; box-shadow:var(--liq-hover-glow); transform:translateY(-1px); } @media (prefers-reduced-motion:reduce){ body:not([data-skin="classic"]) .bi-nav:hover, body:not([data-skin="classic"]) .liq-tab:hover{ transform:none; } } :root{ --liq-spring:cubic-bezier(.22,1.4,.36,1); } .liq-halo{ position:relative; display:inline-grid; place-items:center; } .liq-halo .liq-halo-v{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; font-weight:800; font-size:var(--liq-halo-fs,clamp(15px,2.4vw,21px)); line-height:1.1; color:var(--text,#e2e8f0); } .liq-halo .liq-halo-v small{ font-size:var(--liq-halo-fs-sub,8.5px); font-weight:700; color:var(--muted,#8892a4); text-transform:uppercase; letter-spacing:.06em; } .liq-halo .liq-halo-arc{ transition:stroke-dashoffset 1s var(--liq-spring); } .liq-nurdruck{ display:none; } @media print{ .liq-nurdruck{ display:block; } .liq-nodruck,.liq-btn,.liq-btn-sec,.liq-btn-text,.liq-wahlchip,.liq-seg{ display:none!important; } :root{ --text:#111; --ink:#111; --ink-soft:#3a4353; --muted:#555; --panel:#fff; --bg:#fff; --border:#999; --danger:#a11; --warning:#8a6100; --accent:#0b4ea2; --ok:#0a6b3d; --success:#0a6b3d; } html,body{ background:#fff!important; color:#111; } body::before,body::after,html::before{ display:none!important; content:none!important; } .liq-aurora,.liq-mesh,.liq-grain{ display:none!important; } .liq-pane{ border:1px solid #999; background:#fff; box-shadow:none; } .liq-hint,.liq-em,.liq-listrow__sub{ color:#444; } details>*:not(summary){ display:block!important; content-visibility:visible!important; } .liq-aufklapp,.liq-aufklapp__inhalt,.liq-aufklapp__body{ display:block!important; grid-template-rows:minmax(0,1fr)!important; visibility:visible!important; opacity:1!important; height:auto!important; max-height:none!important; overflow:visible!important; } .liq-verlauf::before{ background:#bbb; } .liq-verlauf__pkt::before{ background:#fff; box-shadow:0 0 0 2px #666; } .liq-verlauf__pkt--start::before{ box-shadow:0 0 0 2px #0b4ea2; } .liq-verlauf__pkt--bruch::before{ box-shadow:0 0 0 2px #a11; } .liq-verlauf__wann{ color:#444; } details,.liq-verlauf__pkt,.liq-verlauf__bruch,.liq-hint{ break-inside:avoid; page-break-inside:avoid; } summary,.liq-listrow__top{ break-after:avoid; page-break-after:avoid; } } .liq-druckkopf{ border-bottom:1.5px solid #333; padding-bottom:3mm; margin-bottom:6mm; } .liq-druckkopf b{ font-size:13pt; } .liq-druckkopf span{ display:block; font-size:9pt; color:#555; margin-top:1mm; } .liq-verlauf{ position:relative; margin:10px 0 0; padding-left:26px; } .liq-verlauf::before{ content:''; position:absolute; left:7px; top:6px; bottom:6px; width:2px; border-radius:2px; background:color-mix(in srgb,var(--text,#fff) 14%,transparent); } .liq-verlauf__pkt{ position:relative; padding:9px 0; min-height:44px; } .liq-verlauf__pkt::before{ content:''; position:absolute; left:-24px; top:15px; width:10px; height:10px; border-radius:50%; background:var(--panel,#1a1d26); box-shadow:0 0 0 2px color-mix(in srgb,var(--text,#fff) 30%,transparent); } .liq-verlauf__pkt--start::before{ box-shadow:0 0 0 2px var(--accent,#4f8ef7); } .liq-verlauf__pkt--bruch::before{ box-shadow:0 0 0 2px var(--danger,#e0736f); } .liq-verlauf__wann{ display:block; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-verlauf__was{ display:block; font-size:var(--text-13); font-weight:600; } .liq-verlauf__bruch{ margin:4px 0 4px -26px; } .liq-tally-wrap{ display:flex; flex-direction:column; gap:8px; } .liq-tally{ display:inline-flex; align-items:center; gap:8px; width:fit-content; font-size:var(--text-12); font-weight:600; padding:5px 12px; border-radius:999px; background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1px solid var(--border,#333333); color:var(--muted,#8892a4); } .liq-tally .ok{ color:var(--success,#3ecf8e); } .liq-tally .miss{ color:var(--warning,#f59e0b); } .liq-tally .neutral{ color:var(--ink-soft,#c2cad8); } .liq-vein{ height:6px; border-radius:999px; background:color-mix(in srgb,var(--text,#fff) 9%,transparent); overflow:hidden; } .liq-vein i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--accent,#4f8ef7),var(--accent-deep,#3a6fd0)); transition:width .7s var(--liq-spring); } .liq-vein.full i{ background:linear-gradient(90deg,var(--success,#3ecf8e),color-mix(in srgb,var(--success,#3ecf8e) 70%,#fff)); } .liq-beacon{ display:inline-flex; align-items:center; gap:9px; font-size:var(--text-13); font-weight:600; padding:7px 14px; border-radius:999px; transition:.25s; } .liq-beacon.clean{ background:color-mix(in srgb,var(--success,#3ecf8e) 12%,transparent); border:1px solid color-mix(in srgb,var(--success,#3ecf8e) 35%,transparent); color:color-mix(in srgb,var(--success,#3ecf8e) 70%,#fff); } .liq-beacon.open{ background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1px solid var(--border,#333333); color:var(--muted,#8892a4); cursor:pointer; } .liq-beacon.dirty{ background:color-mix(in srgb,var(--warning,#f59e0b) 12%,transparent); border:1px solid color-mix(in srgb,var(--warning,#f59e0b) 35%,transparent); color:color-mix(in srgb,var(--warning,#f59e0b) 60%,#fff); cursor:pointer; } .liq-beacon .hard{ color:var(--danger,#e55353); font-weight:800; } .liq-check{ display:inline-block; vertical-align:middle; flex-shrink:0; } .liq-beacon.dirty:hover,.liq-beacon.open:hover{ filter:brightness(1.15); } .liq-trail{ display:flex; align-items:center; flex-wrap:wrap; gap:7px; } .liq-t-st{ display:inline-flex; align-items:center; gap:7px; padding:6px 11px; border-radius:10px; border:1px solid var(--border-strong,#414141); background:color-mix(in srgb,var(--text,#fff) 4%,transparent); color:var(--muted,#8892a4); font-size:var(--text-12); cursor:pointer; transition:.25s var(--liq-spring); } .liq-t-st[onclick]:hover{ transform:translateY(-2px); border-color:color-mix(in srgb,var(--accent,#4f8ef7) 50%,transparent); } .liq-t-st.on{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); color:#fff; } .liq-t-st.done{ border-color:color-mix(in srgb,var(--success,#3ecf8e) 40%,transparent); color:color-mix(in srgb,var(--success,#3ecf8e) 70%,#fff); } .liq-t-num{ width:18px; height:18px; border-radius:50%; background:color-mix(in srgb,var(--text,#fff) 10%,transparent); display:grid; place-items:center; font-size:var(--text-10); font-weight:700; flex-shrink:0; } .liq-t-st.on .liq-t-num{ background:#fff; color:var(--accent-deep,#3a6fd0); } .liq-t-st.done .liq-t-num{ background:var(--success,#3ecf8e); color:#0c2a18; } .liq-t-who{ color:var(--muted,#8892a4); font-size:var(--text-10); } .liq-t-arr{ color:var(--subtle,#5a6377); font-size:var(--text-11); } .liq-t-bar{ height:5px; border-radius:999px; background:color-mix(in srgb,var(--text,#fff) 8%,transparent); overflow:hidden; margin-top:14px; } .liq-t-bar i{ display:block; height:100%; background:linear-gradient(90deg,var(--success,#3ecf8e),var(--accent,#4f8ef7)); transition:width .4s ease; } .liq-mirage{ animation:liqFade .2s ease; } @keyframes liqFade{ from{opacity:0} to{opacity:1} } .liq-mir-head{ display:flex; flex-direction:column; gap:8px; margin-bottom:16px; } .liq-mir-b{ border-radius:10px; background:linear-gradient(100deg,color-mix(in srgb,var(--text,#fff) 5%,transparent) 30%, color-mix(in srgb,var(--text,#fff) 13%,transparent) 50%,color-mix(in srgb,var(--text,#fff) 5%,transparent) 70%); background-size:220% 100%; animation:liqShimmer 1.3s ease-in-out infinite; } .liq-mir-bar{ height:46px; border-radius:10px; margin-bottom:14px; } .liq-mir-bar{ background:linear-gradient(100deg,color-mix(in srgb,var(--text,#fff) 5%,transparent) 30%, color-mix(in srgb,var(--text,#fff) 13%,transparent) 50%,color-mix(in srgb,var(--text,#fff) 5%,transparent) 70%); background-size:220% 100%; animation:liqShimmer 1.3s ease-in-out infinite; } .liq-mir-week{ display:grid; grid-template-columns:repeat(7,1fr); gap:8px; } .liq-mir-table{ display:flex; flex-direction:column; gap:10px; } .liq-mir-row{ display:flex; gap:14px; align-items:center; padding:10px 0; border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 4%,transparent); } .liq-mir-cards{ display:flex; gap:16px; flex-wrap:wrap; } .liq-mir-card{ flex:1; min-width:240px; display:flex; flex-direction:column; gap:10px; padding:18px; border:1px solid var(--border,#333333); border-radius:14px; background:color-mix(in srgb,var(--text,#fff) 2%,transparent); } @keyframes liqShimmer{ 0%{background-position:120% 0} 100%{background-position:-120% 0} } .liq-glint-ok{ border-color:color-mix(in srgb,var(--success,#3ecf8e) 60%,transparent)!important; background:color-mix(in srgb,var(--success,#3ecf8e) 9%,transparent); box-shadow:0 0 20px color-mix(in srgb,var(--success,#3ecf8e) 22%,transparent); transform:translateY(-1px); } .liq-glint-amber{ border-color:color-mix(in srgb,var(--warning,#f59e0b) 60%,transparent)!important; background:color-mix(in srgb,var(--warning,#f59e0b) 8%,transparent); } .liq-glint-block{ border-color:color-mix(in srgb,var(--danger,#e55353) 55%,transparent)!important; background:color-mix(in srgb,var(--danger,#e55353) 5%,transparent); opacity:.5; filter:saturate(.6); } .liq-whisper{ position:fixed; top:5.5rem; right:1.2rem; z-index:9999; max-width:360px; border-radius:14px; padding:14px 16px; cursor:pointer; font-size:var(--text-13); color:var(--text,#e2e8f0); background:var(--surface,#1d1d1d); border:1px solid var(--border,#333333); box-shadow:0 18px 50px rgba(0,0,0,.5); backdrop-filter:blur(14px) saturate(150%); -webkit-backdrop-filter:blur(14px) saturate(150%); opacity:0; transform:translateX(28px); transition:.4s var(--liq-spring); pointer-events:none; } .liq-whisper.show{ opacity:1; transform:none; pointer-events:auto; } .liq-whisper.hard{ border-color:var(--danger,#e55353); background:color-mix(in srgb,var(--danger,#e55353) 14%,var(--surface,#1d1d1d)); } .liq-whisper.soft{ border-color:var(--warning,#f59e0b); background:color-mix(in srgb,var(--warning,#f59e0b) 12%,var(--surface,#1d1d1d)); } .liq-whisper .liq-w-title{ font-weight:700; margin-bottom:5px; } .liq-whisper.hard .liq-w-title{ color:var(--danger,#e55353); } .liq-whisper.soft .liq-w-title{ color:var(--warning,#f59e0b); } .liq-whisper .liq-w-body{ color:var(--muted,#8892a4); font-size:var(--text-12); line-height:1.45; } .liq-sigil{ position:relative; width:42px; height:42px; border-radius:50%; display:grid; place-items:center; font-size:var(--text-14); font-weight:800; color:#fff; flex-shrink:0; } .liq-sigil-accent{ box-shadow:0 0 0 2px var(--bg,#07060c),0 0 0 4px var(--accent,#4f8ef7); } .liq-sigil-pink{ box-shadow:0 0 0 2px var(--bg,#07060c),0 0 0 4px #f472b6; } .liq-sigil--gruppe{ border-radius:34%; } .liq-sigil{ width:var(--sigil,42px); height:var(--sigil,42px); } .liq-listrow > .liq-sigil{ --sigil:32px; margin-inline:4px; flex:none; } :is(.liq-sigilring,.liq-avatarring){ position:relative; display:inline-grid; place-items:center; flex:none; --ring-dicke:3px; --ring-luft:2px; width:calc(var(--sigil,42px) + 2 * (var(--ring-dicke) + var(--ring-luft))); height:calc(var(--sigil,42px) + 2 * (var(--ring-dicke) + var(--ring-luft))); } :is(.liq-sigilring,.liq-avatarring) > svg{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); overflow:visible; } :is(.liq-sigilring,.liq-avatarring) > svg circle{ fill:none; stroke-width:var(--ring-dicke); } :is(.liq-sigilring__bahn,.liq-avatarring__bahn){ stroke:var(--border,#333333); } :is(.liq-sigilring__wert,.liq-avatarring__wert){ stroke:var(--akz,var(--accent,#4f8ef7)); stroke-linecap:round; } :is(.liq-sigilring--ok,.liq-avatarring--ok){ --akz:var(--success,#35ad76); } :is(.liq-sigilring--warn,.liq-avatarring--warn){ --akz:var(--warning,#f59e0b); } :is(.liq-sigilring--no,.liq-avatarring--no){ --akz:var(--danger,#e0736f); } .liq-sigil-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:50%; } .liq-ember{ position:absolute; top:-2px; right:-2px; width:13px; height:13px; border-radius:50%; border:2.5px solid var(--bg,#07060c); } .liq-ember.amber{ background:var(--warning,#f59e0b); } .liq-ember.red{ background:var(--danger,#e55353); } .liq-ember.green{ background:var(--success,#3ecf8e); } @keyframes liqSnap{ 0%{transform:scale(1.16)} 55%{transform:scale(.96)} 100%{transform:scale(1)} } @keyframes liqJolt{ 0%,100%{transform:translateX(0)} 20%{transform:translateX(-6px)} 40%{transform:translateX(6px)} 60%{transform:translateX(-4px)} 80%{transform:translateX(4px)} } .liq-snap{ animation:liqSnap .46s var(--liq-spring); } .liq-jolt{ animation:liqJolt .42s ease; } .liq-chip{ display:inline-flex; align-items:center; gap:6px; padding:4px 11px; border-radius:999px; font-size:var(--text-12); font-weight:600; background:rgba(255,255,255,.07); border:1px solid var(--border,#333333); color:var(--muted,#8892a4); white-space:nowrap; } .liq-chip{ position:relative; transition:transform .16s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)); } .liq-chip::after{ content:''; position:absolute; left:10px; top:50%; width:0; height:0; border-radius:50%; background:currentColor; transform:translateY(-50%); transition:width .18s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), height .18s; } .liq-chip.is-active{ padding-left:24px; } .liq-chip.is-active::after{ width:7px; height:7px; } .liq-chip:active{ transform:scale(.96); } @media (prefers-reduced-motion: reduce){ .liq-chip, .liq-chip::after{ animation:none !important; transition:none !important; } } .liq-chip svg{ width:12px; height:12px; opacity:.7; } .liq-chip--pick{ cursor:pointer; transition:transform .12s, background .15s, border-color .15s; } .liq-chip--pick:hover{ background:rgba(255,255,255,.11); color:var(--text,#e9eef6); transform:translateY(-1px); } .liq-chip--pick.is-on{ background:var(--accent-soft,rgba(79,142,247,.18)); border-color:color-mix(in srgb,var(--accent,#4f8ef7) 55%,var(--border,#333333)); color:#dbe7fb; } .liq-chip--na{ color:#cbb892; background:color-mix(in srgb,#f0c674 15%,transparent); border-color:color-mix(in srgb,#f0c674 26%,var(--border,#333333)); } .liq-chip--na.liq-chip--still{ color:color-mix(in srgb,#cbb892 70%,var(--muted,#8892a4)); background:color-mix(in srgb,#f0c674 7%,transparent); border-color:color-mix(in srgb,#f0c674 13%,var(--border,#333)); font-weight:500; } .liq-chip--zieh{ cursor:grab; user-select:none; touch-action:none; transition:transform .06s ease, box-shadow .06s ease, border-color .15s ease; } .liq-chip--zieh:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 55%,var(--border,#333333)); } .liq-chip--zieh:active{ cursor:grabbing; transform:scale(.97); } .liq-chip--zieh.is-ghost{ opacity:.4; } .liq-chip--zieh[aria-disabled="true"], .liq-chip--zieh.is-gesperrt{ cursor:not-allowed; opacity:.6; } @media (prefers-reduced-motion:reduce){ .liq-chip--zieh{ transition:none; } .liq-chip--zieh:active{ transform:none; } } @media (prefers-reduced-motion:reduce){ .liq-chip--pick:hover{ transform:none; } } @media (pointer:coarse){ .liq-chip--pick{ min-height:44px; box-sizing:border-box; } } .liq-gridrow{ display:grid; align-items:center; gap:8px; padding:9px 10px; grid-template-columns:var(--spalten, minmax(0,1fr)); min-width:0; border-top:1px solid color-mix(in srgb,var(--text,#fff) 6%,transparent); } .liq-gridrow:first-of-type{ border-top:0; } .liq-gridrow--kopf + .liq-gridrow{ border-top:0; } .liq-gridrow > *{ min-width:0; } .liq-gridrow--karte{ padding:8px 10px; border-radius:6px; background:color-mix(in srgb,var(--text,#fff) 4%,transparent); font-size:var(--text-12); } .liq-gridrow--kopf{ padding:0 10px 4px; font-size:var(--text-10); font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#8892a4); align-items:end; } @media (max-width:620px){ .liq-gridrow--kopf{ display:none; } } @media (max-width:620px){ .liq-gridrow{ grid-template-columns:var(--spalten-eng, var(--spalten, minmax(0,1fr))); } } .liq-rueckmarke{ background-image:linear-gradient(0deg, color-mix(in srgb,var(--accent,#4f8ef7) 13%,transparent), color-mix(in srgb,var(--accent,#4f8ef7) 13%,transparent)); box-shadow:inset 2px 0 0 var(--accent,#4f8ef7); } .liq-callout{ display:flex; gap:11px; align-items:flex-start; padding:13px 15px; border-radius:14px; background:color-mix(in srgb,var(--accent,#4f8ef7) 7%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 24%,var(--border,#333333)); } .liq-callout__ic{ width:19px; height:19px; flex-shrink:0; color:var(--accent,#4f8ef7); margin-top:1px; } .liq-callout__b{ font-size:var(--text-13); color:var(--text,#e9eef6); line-height:1.5; } .liq-callout__b b{ font-weight:600; } .liq-callout--warn{ background:rgba(255,255,255,.04); border-color:color-mix(in srgb,var(--text,#fff) 26%,transparent); box-shadow:inset 3px 0 0 #d98c4a; } .liq-callout--warn .liq-callout__ic{ color:#e0a05a; } @media (prefers-reduced-transparency:reduce){ .liq-callout{ background:var(--surface,#1d1d1d); } .liq-callout--warn{ background:var(--surface,#1d1d1d); } } .liq-shiftcard{ display:flex; flex-direction:column; gap:9px; min-width:260px; max-width:360px; background:var(--surface,#1d1d1d); border:1px solid var(--border,#333333); border-radius:14px; padding:13px 14px; } .liq-shiftcard__head{ display:flex; align-items:center; gap:8px; font-size:var(--text-13); font-weight:700; color:var(--text,#e9eef6); } .liq-shiftcard__ic{ width:17px; height:17px; color:var(--accent,#4f8ef7); flex-shrink:0; } .liq-shiftcard__by{ font-weight:400; opacity:.6; font-size:.82em; margin-left:auto; color:var(--muted,#8892a4); } .liq-shiftcard__rows{ display:flex; flex-direction:column; gap:7px; } .liq-shiftcard__row{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; background:rgba(255,255,255,.03); border:1px solid var(--border,#333333); } .liq-shiftcard__info{ flex:1; min-width:0; } .liq-shiftcard__label{ font-weight:700; font-size:var(--text-13); } .liq-shiftcard__meta{ font-size:.82rem; color:var(--muted,#8892a4); margin-top:1px; } .liq-shiftcard__claim{ flex:0 0 auto; padding:7px 14px; border:none; border-radius:10px; cursor:pointer; font:inherit; font-size:var(--text-12); font-weight:700; color:#fff; background:var(--accent,#4f8ef7); box-shadow:0 2px 10px color-mix(in srgb,var(--accent,#4f8ef7) 40%,transparent); transition:transform .12s; } .liq-shiftcard__claim:hover{ transform:translateY(-1px); } .liq-shiftcard__state{ flex:0 0 auto; font-size:.84rem; font-weight:600; display:inline-flex; align-items:center; gap:5px; } .liq-shiftcard__state svg{ width:13px; height:13px; } .liq-shiftcard__state--taken{ color:var(--accent,#4f8ef7); } .liq-shiftcard__state--pending{ color:#e0a05a; } .liq-shiftcard__state--expired{ color:var(--subtle,#5a6377); } @media (prefers-reduced-motion:reduce){ .liq-shiftcard__claim:hover{ transform:none; } } .liq-tristate{ display:inline-flex; padding:3px; gap:2px; border-radius:10px; background:rgba(0,0,0,.28); border:1px solid var(--border,#333333); } .liq-tristate button{ min-width:64px; height:28px; padding:0 10px; border:0; background:transparent; color:var(--muted,#8892a4); font:inherit; font-size:var(--text-11); font-weight:700; cursor:pointer; border-radius:6px; transition:color .15s,background .15s; white-space:nowrap; } .liq-tristate button.on[data-v="default"]{ color:#dfe6f2; background:rgba(255,255,255,.10); } .liq-tristate button.on[data-v="allow"]{ color:#fff; background:var(--accent,#4f8ef7); } .liq-tristate button.on[data-v="deny"]{ color:#fff; background:#d0574f; } .liq-tristate button:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-tristate.is-locked button{ opacity:.4; cursor:not-allowed; } .liq-orb{ position:relative; display:inline-flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0; box-sizing:border-box; width:var(--liq-orb-size,44px); height:var(--liq-orb-size,44px); transition:width .55s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)), border-radius .5s ease, background .3s ease, border-color .3s ease; } .liq-orb canvas{ position:absolute; inset:0; margin:auto; transition:opacity .28s ease, transform .4s ease; } .liq-orb__lbl{ position:absolute; inset:0; margin:auto; width:max-content; height:max-content; display:inline-flex; align-items:center; gap:7px; white-space:nowrap; opacity:0; transform:scale(.9); font-size:var(--text-13); font-weight:700; transition:opacity .3s ease .18s, transform .3s ease .18s; } .liq-orb__lbl svg{ width:15px; height:15px; } .liq-orb--done{ width:150px; height:46px; border-radius:10px; cursor:pointer; color:#3a2a12; background:#e6a860; box-shadow:0 3px 14px color-mix(in srgb,#e0a05a 45%,transparent); } .liq-orb--done canvas{ opacity:0; transform:scale(.4); } .liq-orb--done .liq-orb__lbl{ opacity:1; transform:scale(1); } .liq-orb--done:focus-visible{ outline:2px solid #b06a1a; outline-offset:2px; } .liq-orb--confirmed{ background:color-mix(in srgb,#36b37e 22%,transparent); color:#9fe0c0; box-shadow:none; } @media (prefers-reduced-motion:reduce){ .liq-orb, .liq-orb canvas, .liq-orb__lbl{ transition-duration:1ms; } } .liq-spine{ display:flex; flex-direction:column; overflow-y:auto; background:color-mix(in srgb,var(--bg-deep,#07060c) 60%,transparent); border-right:1px solid var(--border,#333333); backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%); } .liq-spine .liq-sp-sec{ padding:16px 20px 5px; font-size:var(--text-10); font-weight:700; text-transform:uppercase; letter-spacing:.9px; color:var(--subtle,#5a6377); border-top:1px solid color-mix(in srgb,var(--text,#fff) 6%,transparent); margin-top:6px; } .liq-spine .liq-sp-sec:first-child{ border-top:none; margin-top:2px; } .liq-spine .liq-sp-it{ display:flex; align-items:center; gap:10px; margin:0 8px; padding:10px 12px; border-radius:10px; cursor:pointer; color:var(--muted,#8892a4); font-size:var(--text-13); transition:background-color .15s, color .15s; } .liq-spine .liq-sp-it:hover{ background:rgba(255,255,255,.05); color:#fff; } .liq-spine .liq-sp-it.active{ background:var(--accent-soft,rgba(79,142,247,.18)); color:#fff; } .liq-spine .liq-sp-it.gated{ opacity:.62; cursor:default; } .liq-spine .liq-sp-it svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; flex-shrink:0; } .liq-spine .liq-sp-it .liq-sp-label{ flex:1 1 auto; text-align:left; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-spine .liq-sp-it .liq-sp-lock{ margin-left:auto; } .liq-spine .liq-sp-it .liq-sp-lock svg{ width:13px; height:13px; stroke:var(--warning,#f59e0b); } .liq-spine .liq-sp-it .liq-sp-badge{ margin-left:auto; flex-shrink:0; font-size:var(--text-10); font-weight:700; line-height:1; padding:3px 7px; border-radius:999px; color:#fff; background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); } .liq-spine .liq-sp-it.active .liq-sp-badge{ background:color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); } .liq-spine .liq-sp-it:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } @media (max-width:820px){ .liq-spine .liq-sp-it{ min-height:44px; } } .liq-spine .liq-sp-it:hover{ box-shadow:var(--liq-hover-glow); transform:translateY(-1px); } .liq-spine .liq-sp-it.active{ box-shadow:inset 2px 0 0 var(--accent,#4f8ef7), 0 0 18px -6px color-mix(in srgb,var(--accent,#4f8ef7) 70%, transparent); } @media (prefers-reduced-transparency:reduce){ .liq-spine .liq-sp-it:hover{ box-shadow:none; transform:none; } .liq-spine .liq-sp-it.active{ box-shadow:none; } } @media (prefers-reduced-motion:reduce){ .liq-mir-b,.liq-mir-bar{ animation:none; } .liq-halo-arc,.liq-vein i,.liq-t-bar i{ transition:none; } .liq-t-st[onclick]:hover{ transform:none; } .liq-snap,.liq-jolt,.liq-whisper{ animation:none; } } :root{ --liq-toast-bg:linear-gradient(150deg, rgba(255,255,255,.13), rgba(255,255,255,.045) 58%, rgba(255,255,255,.02)); --liq-toast-blur:blur(26px) saturate(185%); --liq-toast-border:1px solid rgba(255,255,255,.16); --liq-toast-shadow:0 20px 50px -22px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.30), inset 0 -1px 0 rgba(255,255,255,.05); --liq-toast-duration:6000ms; --liq-z-toast:10000; --liq-badge-bg:var(--danger,#e55353); --liq-badge-fg:#fff; } .liq-toast-stack{ position:fixed; top:5.5rem; right:1.2rem; z-index:var(--liq-z-toast); display:flex; flex-direction:column; gap:10px; max-width:360px; width:calc(100vw - 2.4rem); pointer-events:none; } .liq-toast{ position:relative; pointer-events:auto; display:flex; align-items:flex-start; gap:11px; border-radius:14px; padding:13px 14px; color:var(--ink,#e2e8f0); background:var(--liq-toast-bg); border:var(--liq-toast-border); box-shadow:var(--liq-toast-shadow); backdrop-filter:var(--liq-toast-blur); -webkit-backdrop-filter:var(--liq-toast-blur); opacity:0; transform:translateX(28px) scale(.98); transition:opacity .4s var(--liq-spring,cubic-bezier(.22,1.4,.36,1)), transform .4s var(--liq-spring,cubic-bezier(.22,1.4,.36,1)); } .liq-toast.show{ opacity:1; transform:none; } .liq-toast.leaving{ opacity:0; transform:translateX(28px) scale(.98); } .liq-toast.urgent{ border-color:color-mix(in srgb,var(--danger,#e55353) 55%,rgba(255,255,255,.16)); } .liq-toast.soft{ border-color:color-mix(in srgb,var(--warning,#f59e0b) 50%,rgba(255,255,255,.16)); } .liq-toast[data-clickable]{ cursor:pointer; } .liq-toast-ic{ flex:0 0 auto; width:30px; height:30px; border-radius:10px; display:grid; place-items:center; font-size:var(--text-14); background:color-mix(in srgb,var(--accent,#4f8ef7) 22%,rgba(255,255,255,.05)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#4f8ef7) 40%,transparent); } .liq-toast.urgent .liq-toast-ic{ background:color-mix(in srgb,var(--danger,#e55353) 22%,rgba(255,255,255,.05)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--danger,#e55353) 45%,transparent); } .liq-toast.soft .liq-toast-ic{ background:color-mix(in srgb,var(--warning,#f59e0b) 22%,rgba(255,255,255,.05)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--warning,#f59e0b) 45%,transparent); } .liq-toast-main{ flex:1; min-width:0; } .liq-toast-title{ font-weight:700; font-size:var(--text-13); line-height:1.3; } .liq-toast.urgent .liq-toast-title{ color:color-mix(in srgb,var(--danger,#e55353) 65%,#fff); } .liq-toast.soft .liq-toast-title{ color:color-mix(in srgb,var(--warning,#f59e0b) 60%,#fff); } .liq-toast-body{ color:var(--muted,#8892a4); font-size:var(--text-12); line-height:1.45; margin-top:3px; word-wrap:break-word; } .liq-toast-x{ flex:0 0 auto; background:none; border:none; color:var(--muted,#8892a4); cursor:pointer; font-size:16px; line-height:1; padding:2px 4px; border-radius:6px; transition:.15s; } .liq-toast-x:hover{ color:var(--ink,#e2e8f0); background:color-mix(in srgb,var(--ink,#fff) 8%,transparent); } @media (max-width:480px){ .liq-toast-stack{ left:1.2rem; right:1.2rem; max-width:none; } } .liq-nc-scrim{ position:fixed; inset:0; z-index:calc(var(--liq-z-toast) - 1); background:rgba(8,10,16,.5); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); opacity:0; transition:opacity .3s var(--ease-soft,ease); } .liq-nc-scrim.show{ opacity:1; } .liq-meldeleiste, .liq-nc{ position:fixed; top:0; right:0; bottom:0; z-index:var(--liq-z-toast); width:380px; max-width:92vw; display:flex; flex-direction:column; background:var(--liq-toast-bg); border-left:var(--liq-toast-border); box-shadow:var(--liq-toast-shadow); backdrop-filter:var(--liq-toast-blur); -webkit-backdrop-filter:var(--liq-toast-blur); transform:translateX(110%); transition:transform .4s var(--liq-spring,cubic-bezier(.22,1.4,.36,1)); } .liq-nc.show{ transform:none; } .liq-nc-head{ display:flex; align-items:center; gap:10px; padding:16px 18px 12px; border-bottom:1px solid color-mix(in srgb,var(--ink,#fff) 10%,transparent); flex:0 0 auto; } .liq-nc-head h3{ margin:0; font-size:var(--text-14); font-weight:700; flex:1; color:var(--ink,#e2e8f0); } .liq-nc-allread{ background:none; border:1px solid var(--border,#333333); color:var(--muted,#8892a4); font-size:var(--text-11); font-weight:600; padding:5px 11px; border-radius:999px; cursor:pointer; transition:.15s; } .liq-nc-allread:hover{ color:var(--ink,#e2e8f0); border-color:var(--accent,#4f8ef7); } .liq-nc-x{ background:none; border:none; color:var(--muted,#8892a4); cursor:pointer; font-size:20px; line-height:1; padding:2px 6px; border-radius:6px; } .liq-nc-x:hover{ color:var(--ink,#e2e8f0); background:color-mix(in srgb,var(--ink,#fff) 8%,transparent); } .liq-nc-list{ flex:1; overflow-y:auto; padding:8px 12px 18px; } .liq-nc-group-h{ padding:14px 6px 6px; font-size:var(--text-10); font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--subtle,#5a6377); } .liq-nc-item{ position:relative; display:flex; align-items:flex-start; gap:10px; padding:11px 12px; border-radius:10px; cursor:pointer; transition:background .15s; } .liq-nc-item:hover{ background:color-mix(in srgb,var(--ink,#fff) 6%,transparent); } .liq-nc-item.unread{ background:color-mix(in srgb,var(--accent,#4f8ef7) 10%,transparent); } .liq-nc-item.unread:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); } .liq-nc-dot{ flex:0 0 auto; width:8px; height:8px; border-radius:50%; margin-top:6px; background:transparent; } .liq-nc-item.unread .liq-nc-dot{ background:var(--accent,#4f8ef7); box-shadow:0 0 8px var(--accent,#4f8ef7); } .liq-nc-main{ flex:1; min-width:0; } .liq-nc-title{ font-size:var(--text-13); font-weight:600; color:var(--ink-soft,#c2cad8); line-height:1.35; } .liq-nc-item.unread .liq-nc-title{ color:var(--ink,#e2e8f0); font-weight:700; } .liq-nc-body{ font-size:var(--text-12); color:var(--muted,#8892a4); line-height:1.4; margin-top:2px; word-wrap:break-word; } .liq-nc-time{ font-size:var(--text-10); color:var(--subtle,#5a6377); margin-top:4px; } .liq-nc-empty{ text-align:center; color:var(--muted,#8892a4); font-size:var(--text-13); padding:42px 12px; } .liq-badge, .liq-navitem__num{ box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; font-size:var(--text-12); font-weight:700; line-height:1; font-variant-numeric:tabular-nums; } .liq-badge{ background:var(--liq-badge-bg); color:var(--liq-badge-fg); box-shadow:0 0 0 2px var(--bg,#07060c); } .liq-badge[hidden]{ display:none; } .liq-badge--info{ --liq-badge-bg:var(--accent,#4f8ef7); } .liq-badge--eck{ position:absolute; top:3px; right:2px; min-width:16px; height:16px; padding:0 4px; font-size:var(--text-11); } .liq-badge--loc{ --liq-badge-bg:transparent; background:color-mix(in srgb,var(--ink-soft,#c2cad8) 8%,transparent); color:var(--ink-soft,#c2cad8); border:1px solid color-mix(in srgb,var(--ink-soft,#c2cad8) 22%,transparent); box-shadow:none; min-width:0; padding:0 7px; font-size:var(--text-10); font-weight:700; letter-spacing:.02em; } .liq-modal-scrim{ position:fixed; inset:0; z-index:calc(var(--liq-z-toast,10000) - 1); background:rgba(8,6,14,.55); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); opacity:0; transition:opacity .25s var(--ease-soft,ease); } .liq-modal-scrim.show{ opacity:1; } .liq-modal-scrim:not(.show){ pointer-events:none; } .liq-modal{ position:fixed; left:50%; top:50%; z-index:var(--liq-z-toast,10000); transform:translate(-50%,-48%) scale(.94); opacity:0; max-height:90vh; overflow-y:auto; overscroll-behavior:contain; width:min(420px,calc(100vw - 32px)); border-radius:20px; padding:24px 24px 18px; box-sizing:border-box; background:var(--liq-toast-bg); backdrop-filter:var(--liq-toast-blur); -webkit-backdrop-filter:var(--liq-toast-blur); border:var(--liq-toast-border); box-shadow:var(--liq-toast-shadow); color:var(--ink,#e2e8f0); transition:opacity .32s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), transform .32s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)); } .liq-modal.show{ opacity:1; transform:translate(-50%,-50%) scale(1); } .liq-modal.urgent{ box-shadow:0 20px 50px -20px rgba(245,158,11,.5), inset 0 1px 0 rgba(255,255,255,.3), 0 0 0 1px rgba(245,158,11,.4); } .liq-modal-top{ display:flex; gap:13px; align-items:flex-start; } .liq-modal-ic{ width:38px; height:38px; flex:none; border-radius:10px; display:grid; place-items:center; font-weight:700; background:color-mix(in srgb, var(--accent,#4f8ef7) 22%, transparent); color:var(--accent,#4f8ef7); } .liq-modal.urgent .liq-modal-ic{ background:rgba(245,158,11,.22); color:var(--warning,#f59e0b); } .liq-modal-tx{ min-width:0; flex:1; } .liq-modal-title{ font-family:var(--d-font-display,inherit); font-size:17px; font-weight:600; margin:2px 0 4px; letter-spacing:-.2px; } .liq-modal-body{ font-size:var(--text-13); color:var(--ink-soft,#c2cad8); line-height:1.45; } .liq-modal-input{ width:100%; margin-top:12px; box-sizing:border-box; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:10px; padding:10px 12px; color:var(--ink,#e2e8f0); font:inherit; font-size:var(--text-14); } .liq-modal-input:focus{ outline:none; border-color:var(--accent,#4f8ef7); box-shadow:0 0 0 3px var(--accent-soft,rgba(79,142,247,.18)); } .liq-modal-acts{ display:flex; gap:10px; justify-content:flex-end; margin-top:20px; flex-wrap:wrap; } .liq-modal-btn{ border-radius:10px; padding:9px 18px; font:inherit; font-weight:600; font-size:var(--text-13); cursor:pointer; border:1px solid transparent; transition:background .15s, transform .12s var(--ease-liquid,ease); } .liq-modal-btn:active{ transform:scale(.97); } .liq-modal-btn.ghost{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.16); color:var(--ink,#e2e8f0); } .liq-modal-btn.ghost:hover{ background:rgba(255,255,255,.10); } .liq-modal-btn.primary{ background:var(--accent,#4f8ef7); color:#fff; } .liq-modal-btn.primary:hover{ background:var(--accent-deep,#3a6fd0); } .liq-modal-btn.danger{ background:var(--danger,#e55353); color:#fff; } .liq-qrc-scrim{ position:fixed; inset:0; z-index:calc(var(--liq-z-toast,10000) - 1); background:rgba(8,6,14,.62); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); display:grid; place-items:center; opacity:0; transition:opacity .25s var(--ease-soft,ease); } .liq-qrc-scrim.show{ opacity:1; } .liq-qrkarte, .liq-qrc{ position:relative; width:min(340px,calc(100vw - 32px)); box-sizing:border-box; border-radius:20px; padding:22px 22px 18px; text-align:center; background:var(--liq-toast-bg); backdrop-filter:var(--liq-toast-blur); -webkit-backdrop-filter:var(--liq-toast-blur); border:var(--liq-toast-border); box-shadow:var(--liq-toast-shadow); color:var(--ink,#e2e8f0); transition:opacity .32s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), transform .32s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)); } .liq-qrc-scrim .liq-qrc{ opacity:0; transform:translateY(8px) scale(.97); } .liq-qrc-scrim.show .liq-qrc{ opacity:1; transform:none; } .liq-qrc__close{ position:absolute; top:13px; right:14px; width:30px; height:30px; border-radius:10px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.06); color:var(--ink-soft,#c2cad8); cursor:pointer; display:grid; place-items:center; transition:color .15s, border-color .15s; } .liq-qrc__close:hover{ color:#fff; border-color:var(--accent,#4f8ef7); } .liq-qrc__close svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; } .liq-qrc__title{ font-family:var(--d-font-display,inherit); font-size:18px; font-weight:600; letter-spacing:-.2px; margin:2px 0 4px; } .liq-qrc__sub{ font-size:var(--text-12); color:var(--ink-soft,#c2cad8); line-height:1.5; margin-bottom:16px; } .liq-qrc__qr{ width:212px; height:212px; margin:0 auto; background:#fff; border-radius:14px; padding:12px; box-sizing:border-box; box-shadow:0 0 0 6px color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); display:grid; place-items:center; } .liq-qrc__qr svg{ width:100%; height:100%; display:block; shape-rendering:crispEdges; } .liq-qrc__qr.is-loading, .liq-qrc__qr.is-error{ color:#5b6478; font-size:var(--text-12); padding:18px; line-height:1.4; } .liq-qrc__foot{ margin-top:14px; font-size:var(--text-11); color:var(--ink-soft,#c2cad8); display:flex; align-items:center; justify-content:center; gap:7px; } .liq-qrc__foot b{ color:var(--ink,#e2e8f0); } .liq-qrc__foot svg{ width:13px; height:13px; fill:none; stroke:var(--accent,#4f8ef7); stroke-width:1.9; flex:none; } @media (max-width:600px){ .liq-qrc{ width:calc(100vw - 28px); } } .liq-receipt{ position:fixed; bottom:22px; left:50%; z-index:var(--liq-z-toast,10000); transform:translate(-50%,16px); opacity:0; display:flex; align-items:center; gap:10px; border-radius:999px; padding:11px 18px; max-width:calc(100vw - 32px); background:var(--liq-toast-bg); backdrop-filter:var(--liq-toast-blur); -webkit-backdrop-filter:var(--liq-toast-blur); border:var(--liq-toast-border); box-shadow:var(--liq-toast-shadow); color:var(--ink,#e2e8f0); transition:opacity .3s var(--ease-liquid,ease), transform .3s var(--ease-liquid,ease); } .liq-receipt.show{ opacity:1; transform:translate(-50%,0); } .liq-receipt.leaving{ opacity:0; transform:translate(-50%,16px); } .liq-receipt-ic{ width:24px; height:24px; flex:none; border-radius:50%; display:grid; place-items:center; font-size:var(--text-13); background:color-mix(in srgb, var(--success,#3ecf8e) 26%, transparent); color:var(--success,#3ecf8e); } .liq-receipt.urgent .liq-receipt-ic{ background:rgba(245,158,11,.24); color:var(--warning,#f59e0b); } .liq-receipt-t{ font-size:var(--text-13); font-weight:600; } .liq-inline{ display:flex; gap:12px; align-items:flex-start; position:relative; border-radius:14px; padding:13px 15px; margin:0 0 14px; background:linear-gradient(150deg, rgba(255,255,255,.10), rgba(255,255,255,.035) 60%, rgba(255,255,255,.015)); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); border:1px solid rgba(255,255,255,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.25); color:var(--ink,#e2e8f0); border-left:3px solid var(--accent,#4f8ef7); } .liq-inline.urgent{ border-left-color:var(--warning,#f59e0b); } .liq-inline.success{ border-left-color:var(--success,#3ecf8e); } .liq-inline.danger{ border-left-color:var(--danger,#e55353); } .liq-inline-ic{ width:30px; height:30px; flex:none; border-radius:10px; display:grid; place-items:center; font-weight:700; background:color-mix(in srgb, var(--accent,#4f8ef7) 20%, transparent); color:var(--accent,#4f8ef7); } .liq-inline.urgent .liq-inline-ic{ background:rgba(245,158,11,.20); color:var(--warning,#f59e0b); } .liq-inline.success .liq-inline-ic{ background:rgba(62,207,142,.20); color:var(--success,#3ecf8e); } .liq-inline-tx{ min-width:0; } .liq-inline-tx b{ display:block; font-size:var(--text-14); margin:0 0 2px; } .liq-inline-tx span{ font-size:var(--text-13); color:var(--ink-soft,#c2cad8); line-height:1.4; } .liq-inline-x{ position:absolute; top:8px; right:10px; border:0; background:none; color:var(--muted,#8892a4); font-size:17px; line-height:1; cursor:pointer; } @media (prefers-reduced-motion:reduce){ .liq-toast{ transition:opacity .2s ease; transform:none; } .liq-toast.show{ transform:none; } .liq-toast.leaving{ transform:none; } .liq-nc{ transition:opacity .2s ease; transform:none; opacity:0; } .liq-nc.show{ transform:none; opacity:1; } .liq-nc-scrim{ transition:opacity .2s ease; } .liq-modal{ transition:opacity .2s ease; transform:translate(-50%,-50%) scale(1); } .liq-modal.show{ transform:translate(-50%,-50%) scale(1); } .liq-receipt{ transition:opacity .2s ease; transform:translate(-50%,0); } .liq-receipt.leaving{ transform:translate(-50%,0); } } html.__nhEmbed, html.__nhEmbed body{ background:transparent !important; background-image:none !important; } html.__nhEmbed body::before{ display:none !important; content:none !important; } html.__nhEmbed #hubStage, html.__nhEmbed #hubBg, html.__nhEmbed #lqStage, html.__nhEmbed #lqBg, html.__nhEmbed #bgcanvas, html.__nhEmbed .stage, html.__nhEmbed .liq-aurora{ display:none !important; } html.__nhEmbed .sidebar-logo, html.__nhEmbed .d-sidebar-logo, html.__nhEmbed .bi-brand, html.__nhEmbed .topbar .brand, html.__nhEmbed .topbar .logo, html.__nhEmbed .btn-logout, html.__nhEmbed .logout, html.__nhEmbed .user-chip, html.__nhEmbed .user-menu, html.__nhEmbed .user-badge, html.__nhEmbed .meBox{ display:none !important; } html.__nhEmbed .liq-modhead__brand, html.__nhEmbed .liq-modhead__search, html.__nhEmbed .liq-modhead__account, html.__nhEmbed .liq-modhead__back, html.__nhEmbed .liq-modhead__crumb{ display:none !important; } html.__nhEmbed .liq-mtop{ display:none !important; } html.__nhEmbed .sidebar, html.__nhEmbed .bi-side, html.__nhEmbed .d-sidebar, html.__nhEmbed .pane.list{ background:rgba(255,255,255,.05) !important; backdrop-filter:blur(20px) saturate(160%) !important; -webkit-backdrop-filter:blur(20px) saturate(160%) !important; border-right:1px solid rgba(255,255,255,.10) !important; box-shadow:none !important; } .liq-pick{ --liq-pick:var(--accent); } .liq-stepper{ display:inline-flex; align-items:center; gap:8px; padding:4px 5px 4px 12px; border-radius:var(--radius-pill,999px); font-size:var(--text-12); font-weight:700; color:var(--text); background:color-mix(in srgb,var(--liq-pick,var(--accent)) 16%,transparent); border:1px solid color-mix(in srgb,var(--liq-pick,var(--accent)) 45%,transparent); } .liq-stepper .liq-step{ display:inline-flex; align-items:center; background:rgba(0,0,0,.28); border-radius:999px; } .liq-stepper .liq-step button{ width:23px; height:23px; border:0; background:transparent; color:inherit; font-size:var(--text-14); cursor:pointer; border-radius:50%; transition:background .15s; } .liq-stepper .liq-step button:hover{ background:rgba(255,255,255,.12); } .liq-stepper .liq-step b{ min-width:17px; text-align:center; font-variant-numeric:tabular-nums; } .liq-pip{ display:inline-flex; align-items:center; gap:7px; } .liq-pip .dot{ width:18px; height:18px; border-radius:50%; border:1.5px solid var(--border-strong,rgba(255,255,255,.18)); cursor:pointer; transition:transform .12s,box-shadow .2s,background .2s; } .liq-pip .dot:hover{ transform:scale(1.12); } .liq-pip .dot.on{ background:var(--liq-pick,var(--accent)); border-color:var(--liq-pick,var(--accent)); box-shadow:0 0 10px color-mix(in srgb,var(--liq-pick,var(--accent)) 60%,transparent); } .liq-pip .num{ font-size:var(--text-13); font-weight:800; font-variant-numeric:tabular-nums; color:var(--liq-pick,var(--accent)); } .liq-weeknav{ display:inline-flex; align-items:center; gap:4px; padding:4px; box-sizing:border-box; border-radius:var(--radius-pill,999px); background:color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 38%,transparent); } .liq-weeknav__btn{ width:44px; height:44px; flex:none; border:0; border-radius:50%; cursor:pointer; background:transparent; color:var(--text,#e9eef6); display:inline-flex; align-items:center; justify-content:center; transition:background .15s; } .liq-weeknav__btn:hover{ background:color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-weeknav__btn:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-weeknav__btn:disabled{ opacity:.32; cursor:default; background:transparent; } .liq-weeknav__btn svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; } .liq-weeknav__lbl{ min-height:44px; min-width:0; display:inline-flex; flex-direction:column; justify-content:center; align-items:center; padding:0 12px; text-align:center; gap:1px; line-height:1.15; } .liq-weeknav__kw{ font-size:var(--text-14); font-weight:700; color:var(--text,#e9eef6); font-variant-numeric:tabular-nums; white-space:nowrap; } .liq-weeknav__sub{ font-size:var(--text-11); font-weight:600; color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; white-space:nowrap; } .liq-weeknav__lbl[role=button]{ cursor:pointer; border-radius:var(--radius-pill,999px); transition:background .15s; } .liq-weeknav__lbl[role=button]:hover{ background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-weeknav__lbl[role=button]:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-weeknav--sm .liq-weeknav__sub{ display:none; } @media (prefers-reduced-motion:reduce){ .liq-weeknav__btn,.liq-weeknav__lbl[role=button]{ transition:none; } } @media (prefers-reduced-transparency:reduce){ .liq-weeknav{ background:var(--surface,#1d1d1d); border-color:var(--border,#333333); } } .liq-seg-count{ display:inline-flex; padding:3px; gap:2px; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid var(--border); } .liq-seg-count .opt{ min-width:28px; height:26px; display:inline-flex; align-items:center; justify-content:center; border-radius:6px; font-size:var(--text-12); font-weight:700; color:var(--muted); cursor:pointer; } .liq-seg-count .opt.on{ background:var(--liq-pick,var(--accent)); color:#fff; box-shadow:0 2px 10px color-mix(in srgb,var(--liq-pick,var(--accent)) 45%,transparent); } .liq-tapcount{ display:inline-flex; align-items:center; gap:9px; padding:8px 15px; border-radius:var(--radius-pill,999px); font-size:var(--text-12); font-weight:700; color:var(--text); cursor:pointer; transition:transform .12s; background:color-mix(in srgb,var(--liq-pick,var(--accent)) 16%,transparent); border:1px solid color-mix(in srgb,var(--liq-pick,var(--accent)) 45%,transparent); } .liq-tapcount:active{ transform:scale(.95); } .liq-tapcount .badge{ min-width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:var(--text-13); font-weight:800; font-variant-numeric:tabular-nums; background:var(--liq-pick,var(--accent)); color:#fff; } .liq-concentric{ --liq-r:18px; --liq-gap:10px; border-radius:var(--liq-r); } .liq-concentric .liq-inset{ border-radius:calc(var(--liq-r) - var(--liq-gap)); } .liq-specular{ position:relative; overflow:hidden; isolation:isolate; } .liq-specular::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:1; background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.45) 50%, transparent 60%); transform:translateX(-130%) skewX(-18deg); animation:liq-spec 4.2s ease-in-out infinite; } @keyframes liq-spec{ 0%,74%{ transform:translateX(-130%) skewX(-18deg); } 90%,100%{ transform:translateX(130%) skewX(-18deg); } } .liq-specular--slow::after{ background:linear-gradient(115deg, transparent 38%, rgba(255,255,255,.16) 50%, transparent 62%); animation-duration:9s; } @keyframes liq-spec-slow{ 0%,82%{ transform:translateX(-130%) skewX(-16deg); } 94%,100%{ transform:translateX(130%) skewX(-16deg); } } .liq-specular--slow::after{ animation-name:liq-spec-slow; } .liq-refract{ filter:url(#liquid-refract); } @media (prefers-reduced-transparency:reduce){ .nh-glass,.liq-card,:is(.liq-cta,.liq-handlungsknopf),.liq-toast,.liq-modal,.liq-whisper,.liq-qrc{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:var(--surface,#1d1d1d) !important; } .liq-qrc-scrim{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:rgba(8,6,14,.86) !important; } .liq-mesh{ background-image:none !important; } .liq-specular::after{ display:none !important; } .liq-refract{ filter:none !important; } } @media (prefers-reduced-motion:reduce){ .liq-specular::after{ animation:none; opacity:0; } .liq-mesh--drift{ animation:none; background-size:100% 100%; background-position:center; } } :root{ --liq-ctl-spring:cubic-bezier(.34,1.56,.64,1); } .liq-gswitch{ display:inline-flex; align-items:center; gap:11px; cursor:pointer; user-select:none; } .liq-gs-track{ position:relative; width:56px; height:31px; border-radius:999px; overflow:hidden; border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.32); transition:background .3s; } .liq-gswitch.on .liq-gs-track{ background:color-mix(in srgb,var(--accent,#4f8ef7) 60%,transparent); } .liq-gs-thumb{ position:absolute; top:3px; left:3px; width:25px; height:25px; border-radius:50%; background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(255,255,255,.6)); border:1px solid rgba(255,255,255,.6); box-shadow:0 2px 7px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.8); transition:left .42s var(--liq-ctl-spring); } .liq-gswitch.on .liq-gs-thumb{ left:28px; } .liq-gswitch .lbl{ font-size:var(--text-13); color:var(--ink,#e2e8f0); } @media (prefers-reduced-motion:reduce){ .liq-gs-thumb{ transition:none; } } .liq-gslider{ position:relative; height:34px; display:flex; align-items:center; } .liq-gsl-track{ position:absolute; left:0; right:0; height:10px; border-radius:999px; overflow:hidden; border:1px solid rgba(255,255,255,.14); } .liq-gsl-handle{ position:absolute; top:0; width:40px; height:34px; border-radius:14px; border:1px solid rgba(255,255,255,.45); box-shadow:0 4px 14px -4px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.5); background-repeat:no-repeat; cursor:grab; touch-action:none; transition:transform .15s var(--liq-ctl-spring); } .liq-gsl-handle:active{ cursor:grabbing; transform:scale(.96); } .liq-gtoggle{ position:relative; display:inline-flex; padding:4px; border-radius:14px; background:rgba(0,0,0,.28); border:1px solid var(--border,#333333); } .liq-gt-opt{ position:relative; z-index:2; min-width:74px; text-align:center; padding:8px 14px; font-size:var(--text-13); font-weight:600; color:var(--muted,#8892a4); cursor:pointer; border-radius:10px; transition:color .25s; } .liq-gt-opt.on{ color:#fff; } .liq-gt-sel{ position:absolute; z-index:1; top:4px; height:calc(100% - 8px); border-radius:10px; border:1px solid rgba(255,255,255,.4); box-shadow:0 4px 14px -6px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.4); background-repeat:no-repeat; transition:left .42s var(--liq-ctl-spring), width .42s var(--liq-ctl-spring); } @media (prefers-reduced-motion:reduce){ .liq-gt-sel{ transition:none; } } .liq-pillnav{ display:inline-flex; align-items:center; gap:6px; padding:6px; background:var(--liq-toast-bg,linear-gradient(150deg,rgba(255,255,255,.13),rgba(255,255,255,.045))); backdrop-filter:blur(20px) saturate(175%); -webkit-backdrop-filter:blur(20px) saturate(175%); border:1px solid rgba(255,255,255,.18); border-radius:999px; box-shadow:0 18px 44px -20px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.35); } .liq-pillnav a,.liq-pillnav button{ border:0; background:transparent; color:var(--ink-soft,#c2cad8); font:inherit; font-size:var(--text-13); font-weight:600; padding:8px 15px; border-radius:999px; cursor:pointer; text-decoration:none; transition:.2s var(--liq-ctl-spring); } .liq-pillnav a:hover,.liq-pillnav button:hover{ color:#fff; background:rgba(255,255,255,.08); } .liq-pillnav a.on,.liq-pillnav button.on{ color:#fff; background:color-mix(in srgb,var(--accent,#4f8ef7) 88%,transparent); } @media (prefers-reduced-transparency:reduce){ .liq-pillnav{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface,#1d1d1d); } } .liq-terminkarte, .liq-bk{ position:relative; border-radius:20px; padding:22px; overflow:hidden; min-height:248px; box-sizing:border-box; background:linear-gradient(160deg,color-mix(in srgb,var(--surface,#1d1d1d) 88%,transparent),color-mix(in srgb,var(--bg,#0f1117) 92%,transparent)); border:1px solid rgba(255,255,255,.10); box-shadow:inset 0 1px 1px rgba(255,255,255,.18), 0 24px 60px -20px rgba(2,6,23,.7); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); } .liq-bk-head{ display:flex; align-items:center; gap:12px; margin-bottom:4px; } .liq-bk-av{ width:40px; height:40px; border-radius:50%; flex:0 0 auto; display:flex; align-items:center; justify-content:center; font-weight:700; color:#fff; font-size:var(--text-14); background:linear-gradient(135deg,var(--accent,#4f8ef7),#3a6fd0); box-shadow:inset 0 1px 1px rgba(255,255,255,.5); } .liq-bk-who{ font-weight:650; font-size:var(--text-14); letter-spacing:.1px; } .liq-bk-sub{ color:var(--muted,#9aa6c2); font-size:var(--text-12); margin-top:1px; } .liq-bk-day{ color:var(--ink-soft,#aab6d4); font-size:var(--text-12); font-weight:600; text-transform:uppercase; letter-spacing:.6px; margin:18px 2px 10px; } .liq-bk-slots{ display:flex; flex-direction:column; gap:9px; } .liq-bk-slot{ display:flex; align-items:center; justify-content:space-between; cursor:pointer; padding:13px 16px; border-radius:14px; font-size:var(--text-14); font-weight:550; color:var(--ink,#e8ecf6); background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.08); transition:transform .22s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)),background .18s,border-color .18s,box-shadow .18s; } .liq-bk-slot .dur{ color:var(--subtle,#8b97b4); font-size:var(--text-12); font-weight:500; } .liq-bk-slot:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 14%,transparent); border-color:color-mix(in srgb,var(--accent,#4f8ef7) 45%,transparent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); transform:translateY(-1px); } .liq-bk-slot:active{ transform:scale(.985); } .liq-bk-slot[aria-disabled="true"]{ opacity:.4; cursor:default; } .liq-bk-slot.is-gone{ opacity:0; transform:translateY(8px) scale(.96); pointer-events:none; } .liq-bk-busy{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .2s; } .liq-bk-busy.show{ opacity:1; } .liq-bk-spin{ width:30px; height:30px; border-radius:50%; border:3px solid rgba(255,255,255,.2); border-top-color:var(--accent,#4f8ef7); animation:liq-bk-spin .8s linear infinite; } @keyframes liq-bk-spin{ to{ transform:rotate(360deg); } } .liq-bk-booked{ position:absolute; inset:0; padding:26px 24px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:linear-gradient(165deg,color-mix(in srgb,var(--ok,#19b6a8) 16%,transparent),color-mix(in srgb,var(--bg,#0f1117) 96%,transparent) 60%); border-radius:20px; opacity:0; transform:scale(.92); pointer-events:none; transition:opacity .42s ease,transform .5s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-bk-booked.show{ opacity:1; transform:scale(1); pointer-events:auto; } .liq-bk-ring{ width:66px; height:66px; flex:0 0 auto; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:16px; background:radial-gradient(circle at 38% 32%,rgba(54,224,164,.35),color-mix(in srgb,var(--ok,#19b6a8) 12%,transparent)); box-shadow:inset 0 1px 1px rgba(255,255,255,.5), 0 8px 22px -6px color-mix(in srgb,var(--ok,#19b6a8) 50%,transparent); } .liq-bk-ring svg{ width:34px; height:34px; stroke:#36e0a4; stroke-width:3; fill:none; stroke-linecap:round; stroke-linejoin:round; } .liq-bk-ring svg path{ transition:stroke-dashoffset .5s .12s cubic-bezier(.65,0,.35,1); } .liq-bk-title{ font-size:18px; font-weight:700; margin:0 0 6px; } .liq-bk-detail{ color:var(--ink-soft,#c4cde4); font-size:var(--text-13); line-height:1.5; max-width:250px; } .liq-bk-mail{ color:var(--subtle,#8b97b4); font-size:var(--text-12); margin-top:8px; } .liq-bk-pending{ display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-size:var(--text-11); color:#36e0a4; background:rgba(54,224,164,.12); border:1px solid rgba(54,224,164,.28); padding:4px 11px; border-radius:999px; font-weight:600; } .liq-bk-pending .dot{ width:6px; height:6px; border-radius:50%; background:#36e0a4; animation:liq-bk-pulse 1.4s infinite; } @keyframes liq-bk-pulse{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } } .liq-bk-again{ margin-top:22px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.06); color:var(--ink,#e8ecf6); font-size:var(--text-13); font-weight:600; padding:10px 20px; border-radius:10px; cursor:pointer; transition:transform .2s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)),background .18s; } .liq-bk-again:hover{ background:rgba(255,255,255,.12); transform:translateY(-1px); } @media (prefers-reduced-motion:reduce){ .liq-bk-slot,.liq-bk-booked,.liq-bk-ring svg path,.liq-bk-again,.liq-bk-spin{ transition:none!important; animation:none!important; } .liq-bk-ring svg path{ stroke-dashoffset:0; } } @media (prefers-reduced-transparency:reduce){ .liq-bk{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface,#1d1d1d); } } .liq-dropzone{position:relative;border:1.5px dashed color-mix(in srgb, var(--primary) 45%, var(--border));border-radius:20px; background:color-mix(in srgb, var(--primary) 6%, var(--surface));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px); padding:26px 18px;text-align:center;cursor:pointer;transition:border-color .18s,background .18s,transform .18s,box-shadow .18s;overflow:hidden;} .liq-dropzone:hover{border-color:var(--primary);background:color-mix(in srgb, var(--primary) 10%, var(--surface));} .liq-dropzone:focus-visible{outline:2px solid var(--primary);outline-offset:2px;} .liq-dropzone.drag, .liq-dropzone.liq-drag{border-color:var(--primary);background:color-mix(in srgb, var(--primary) 16%, var(--surface));transform:scale(1.01);box-shadow:0 8px 30px -8px color-mix(in srgb, var(--primary) 40%, transparent);} .liq-dz-ring{position:absolute;inset:0;border-radius:20px;pointer-events:none;opacity:0;background:radial-gradient(120px 120px at var(--mx,50%) var(--my,50%), color-mix(in srgb, var(--primary) 22%, transparent), transparent 70%);transition:opacity .2s;} .liq-dropzone.drag .liq-dz-ring, .liq-dropzone.liq-drag .liq-dz-ring{opacity:1;} .liq-dz-inner{position:relative;color:var(--text);display:flex;flex-direction:column;align-items:center;gap:4px;} .liq-dz-inner .bi-ic{color:var(--primary);} .liq-dz-title{font-weight:700;font-size:var(--text-14);margin-top:4px;} .liq-dz-sub{color:var(--muted);font-size:var(--text-12);} .liq-shimmer{ background:linear-gradient(100deg, rgb(var(--acc-1)) 0%, #8b6ee0 24%, #19b6a8 46%, #e0729b 66%, rgb(var(--acc-1)) 88%); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; animation:liq-shimmer-sweep 2.4s linear infinite; } @keyframes liq-shimmer-sweep{ 0%{ background-position:140% 0; } 100%{ background-position:-140% 0; } } .liq-thinking{ display:inline-flex; align-items:center; gap:8px; font-weight:600; } .liq-thinking-dots{ display:inline-flex; gap:3px; align-items:center; } .liq-thinking-dots i{ width:5px; height:5px; border-radius:50%; display:block; background:linear-gradient(120deg, rgb(var(--acc-1)), #8b6ee0); animation:liq-think-dot 1.2s ease-in-out infinite; } .liq-thinking-dots i:nth-child(2){ animation-delay:.18s; } .liq-thinking-dots i:nth-child(3){ animation-delay:.36s; } @keyframes liq-think-dot{ 0%,100%{ opacity:.28; transform:translateY(0); } 50%{ opacity:1; transform:translateY(-2px); } } .liq-think-aura{ position:relative; } .liq-think-aura::after{ content:''; position:absolute; inset:-1px; border-radius:inherit; padding:1.5px; background:linear-gradient(120deg, rgb(var(--acc-1)), #8b6ee0, #19b6a8, #e0729b, rgb(var(--acc-1))); background-size:300% 100%; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude; animation:liq-shimmer-sweep 2.4s linear infinite; pointer-events:none; } @media (prefers-reduced-motion:reduce){ .liq-shimmer{ animation:none; background:linear-gradient(100deg, rgb(var(--acc-1)), rgb(var(--acc-2))); -webkit-background-clip:text; background-clip:text; } .liq-thinking-dots i{ animation:none; opacity:.7; } .liq-think-aura::after{ animation:none; } } .liq-seal{ position:relative; display:inline-flex; align-items:center; justify-content:center; white-space:nowrap; font:inherit; font-weight:650; font-size:var(--text-14); letter-spacing:.1px; line-height:1; cursor:pointer; overflow:hidden; padding:11px 20px; border-radius:999px; color:var(--ink,#e8ecf6); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 38%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); box-shadow:inset 0 1px 1px rgba(255,255,255,.18), 0 6px 18px -8px color-mix(in srgb,var(--accent,#4f8ef7) 50%,transparent); backdrop-filter:blur(10px) saturate(150%); -webkit-backdrop-filter:blur(10px) saturate(150%); transition:background .26s, border-color .26s, color .2s, box-shadow .26s, transform .3s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-seal.tone-ok{ border-color:color-mix(in srgb,var(--ok,#19b6a8) 40%,transparent); background:color-mix(in srgb,var(--ok,#19b6a8) 16%,transparent); box-shadow:inset 0 1px 1px rgba(255,255,255,.18), 0 6px 18px -8px color-mix(in srgb,var(--ok,#19b6a8) 50%,transparent); } .liq-seal:hover:not(:disabled){ background:color-mix(in srgb,var(--accent,#4f8ef7) 24%,transparent); border-color:color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); transform:translateY(-1px); } .liq-seal:active:not(:disabled){ transform:scale(.97); } .liq-seal:disabled{ cursor:default; } .liq-seal:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } @media (pointer:coarse){ .liq-seal{ min-height:44px; } } .liq-seal-face{ display:inline-flex; align-items:center; gap:8px; } .liq-seal-ic{ display:inline-flex; } .liq-seal-ic svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; } .liq-seal-ic svg path{ transition:stroke-dashoffset .5s .06s cubic-bezier(.65,0,.35,1); } .liq-seal-spin{ width:15px; height:15px; flex:0 0 auto; border-radius:50%; border:2.4px solid rgba(255,255,255,.28); border-top-color:currentColor; animation:liq-seal-spin .7s linear infinite; } @keyframes liq-seal-spin{ to{ transform:rotate(360deg); } } .liq-seal.is-pending{ color:var(--ink-soft,#c4cde4); cursor:default; background:color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); border-color:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); } .liq-seal.is-done{ color:#bff3e6; border-color:color-mix(in srgb,var(--ok,#19b6a8) 55%,transparent); background:color-mix(in srgb,var(--ok,#19b6a8) 22%,transparent); box-shadow:inset 0 1px 1px rgba(255,255,255,.22), 0 8px 22px -8px color-mix(in srgb,var(--ok,#19b6a8) 55%,transparent); animation:liq-seal-pop .42s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-seal.is-done .liq-seal-ic svg{ stroke:#36e0a4; } .liq-seal.is-fail{ color:#ffc9c9; border-color:color-mix(in srgb,var(--danger,#e55353) 55%,transparent); background:color-mix(in srgb,var(--danger,#e55353) 18%,transparent); animation:liq-seal-shake .4s ease; } .liq-seal.is-fail .liq-seal-ic svg{ stroke:#ff8a8a; } @keyframes liq-seal-pop{ 0%{ transform:scale(.94); } 55%{ transform:scale(1.045); } 100%{ transform:scale(1); } } @keyframes liq-seal-shake{ 0%,100%{ transform:translateX(0); } 25%{ transform:translateX(-4px); } 75%{ transform:translateX(4px); } } @media (prefers-reduced-motion:reduce){ .liq-seal,.liq-seal-ic svg path{ transition:none!important; } .liq-seal-spin{ animation:none!important; } .liq-seal.is-done,.liq-seal.is-fail{ animation:none!important; } .liq-seal-ic svg path{ stroke-dashoffset:0!important; } } @media (prefers-reduced-transparency:reduce){ .liq-seal{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--accent,#4f8ef7); color:#fff; } .liq-seal.tone-ok,.liq-seal.is-done{ background:var(--ok,#19b6a8); color:#fff; } .liq-seal.is-fail{ background:var(--danger,#e55353); color:#fff; } .liq-seal.is-done .liq-seal-ic svg,.liq-seal.is-fail .liq-seal-ic svg{ stroke:#fff; } } .liq-empty{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:5px; padding:40px 24px; color:var(--muted,#8892a4); } .liq-empty-ic{ width:54px; height:54px; border-radius:14px; display:grid; place-items:center; margin-bottom:10px; background:color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); color:var(--accent,#4f8ef7); } .liq-empty-ic svg{ width:26px; height:26px; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; } .liq-empty-title{ font-size:var(--text-14); font-weight:650; color:var(--ink,#e8ecf6); } .liq-empty-body{ font-size:var(--text-13); max-width:36ch; line-height:1.5; } .liq-empty-action{ margin-top:15px; } .liq-empty--kompakt{ display:block; padding:14px 10px; font-size:var(--text-12); line-height:1.45; gap:0; } .liq-empty--zeile{ display:block; padding:0; font-size:var(--text-12); line-height:1.4; gap:0; text-align:left; } .liq-empty--kompakt .liq-empty-ic, .liq-empty--zeile .liq-empty-ic{ display:none; } .liq-empty--kompakt .liq-empty-title{ font-size:var(--text-13); margin-bottom:2px; } .liq-empty--zeile .liq-empty-title{ font-size:var(--text-12); font-weight:600; color:inherit; } .liq-empty--kompakt .liq-empty-body, .liq-empty--zeile .liq-empty-body{ font-size:inherit; max-width:none; } .liq-empty--kompakt .liq-empty-action{ margin-top:10px; } .liq-code{ display:inline-flex; gap:10px; } .liq-code input{ width:46px; height:56px; text-align:center; font-size:22px; font-weight:600; color:var(--ink,#e8ecf6); background:rgba(255,255,255,.05); border:1.5px solid var(--border,#333333); border-radius:10px; outline:none; caret-color:var(--liq-feld-strich,var(--accent,#4f8ef7)); transition:border-color .15s, box-shadow .15s, background .15s; } :root{ --liq-strich-beschluss:#C084FC; --liq-strich-protokoll:#bfae86; --liq-strich-anweisung:#22D3EE; } .liq-code input::-webkit-outer-spin-button,.liq-code input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; } .liq-code input:focus{ border-color:var(--accent,#4f8ef7); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent,#4f8ef7) 18%, transparent); } .liq-code input.filled{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 55%, transparent); background:color-mix(in srgb, var(--accent,#4f8ef7) 8%, transparent); } .liq-code.invalid input{ border-color:var(--danger,#e0729b); } .liq-code.invalid{ animation:liqJolt .42s; } @media (prefers-reduced-motion:reduce){ .liq-code.invalid{ animation:none; } } .liq-datumswaehler, .liq-dp{ width:300px; max-width:100%; border-radius:20px; padding:16px 16px 18px; box-sizing:border-box; background:linear-gradient(160deg, color-mix(in srgb, var(--surface,#1d1d1d) 88%, transparent), color-mix(in srgb, var(--bg,#0f1117) 92%, transparent)); border:1px solid rgba(255,255,255,.10); box-shadow:inset 0 1px 1px rgba(255,255,255,.16), 0 18px 48px -22px rgba(2,6,23,.65); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%); } .liq-dp-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; } .liq-dp-title{ font-weight:650; font-size:var(--text-14); color:var(--ink,#e8ecf6); display:flex; align-items:center; gap:4px; } .liq-dp-t{ font:inherit; font-weight:650; font-size:var(--text-14); color:var(--ink,#e8ecf6); background:transparent; border:1px solid transparent; border-radius:10px; padding:5px 9px; min-height:34px; cursor:pointer; transition:background .15s, border-color .15s; } .liq-dp-t:hover:not(:disabled){ background:color-mix(in srgb, var(--accent,#4f8ef7) 14%, transparent); border-color:color-mix(in srgb, var(--accent,#4f8ef7) 34%, transparent); } .liq-dp-t:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-dp-t.is-off{ cursor:default; padding-left:0; } .liq-dp-t[hidden]{ display:none; } .liq-dp-grid.is-wahl{ grid-template-columns:repeat(3,1fr); gap:6px; } .liq-dp-cell{ min-height:44px; border:1px solid rgba(255,255,255,.10); border-radius:10px; background:transparent; color:var(--ink,#e8ecf6); font:inherit; font-size:var(--text-13); font-weight:600; cursor:pointer; display:grid; place-items:center; transition:background .15s, color .15s, transform .15s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-dp-cell:hover:not(:disabled):not(.is-sel){ background:rgba(255,255,255,.07); } .liq-dp-cell:active:not(:disabled){ transform:scale(.92); } .liq-dp-cell:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-dp-cell.is-sel{ background:var(--accent,#4f8ef7); color:#fff; border-color:transparent; } .liq-dp-cell:disabled{ color:var(--subtle,#5a6377); opacity:.3; cursor:default; text-decoration:line-through; } @media (prefers-reduced-motion:reduce){ .liq-dp-cell,.liq-dp-t{ transition:none!important; } } .liq-dp-nav{ display:inline-flex; gap:6px; } .liq-dp-nav button{ width:32px; height:32px; border-radius:10px; border:1px solid var(--liq-glass-border,rgba(255,255,255,.12)); background:rgba(255,255,255,.05); color:var(--ink,#e8ecf6); cursor:pointer; display:grid; place-items:center; transition:background .18s, border-color .18s, transform .18s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-dp-nav button:hover:not(:disabled){ background:color-mix(in srgb, var(--accent,#4f8ef7) 16%, transparent); border-color:color-mix(in srgb, var(--accent,#4f8ef7) 45%, transparent); } .liq-dp-nav button:active:not(:disabled){ transform:scale(.9); } .liq-dp-nav button:disabled{ opacity:.32; cursor:default; } .liq-dp-nav svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-dp-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:3px; } .liq-dp-wd{ text-align:center; font-size:var(--text-11); font-weight:600; color:var(--muted,#8892a4); text-transform:uppercase; letter-spacing:.04em; padding:2px 0 8px; } .liq-dp-day{ aspect-ratio:1; border:0; background:transparent; color:var(--ink,#e8ecf6); font:inherit; font-size:var(--text-13); font-weight:500; border-radius:10px; cursor:pointer; position:relative; display:grid; place-items:center; transition:background .15s, color .15s, transform .15s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-dp-day:hover:not(:disabled):not(.is-sel){ background:rgba(255,255,255,.07); } .liq-dp-day:active:not(:disabled){ transform:scale(.88); } .liq-dp-day:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-dp-day.is-out{ color:var(--subtle,#5a6377); opacity:.55; } .liq-dp-day.is-today{ box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--accent,#4f8ef7) 55%, transparent); } .liq-dp-day.is-sel{ background:var(--accent,#4f8ef7); color:#fff; font-weight:650; } .liq-dp-day:disabled{ color:var(--subtle,#5a6377); opacity:.3; cursor:default; text-decoration:line-through; } .liq-dp-day.is-spanne{ background:color-mix(in srgb,var(--accent,#4f8ef7) 24%,transparent); color:var(--ink,#e8ecf6); border-radius:0; } .liq-dp-day.is-spanne:hover:not(:disabled){ background:color-mix(in srgb,var(--accent,#4f8ef7) 34%,transparent); } .liq-dp-day.is-anfang, .liq-dp-day.is-ende{ background:var(--accent,#4f8ef7); color:#fff; font-weight:650; } .liq-dp-day.is-anfang{ border-radius:10px 0 0 10px; } .liq-dp-day.is-ende{ border-radius:0 10px 10px 0; } .liq-dp-day.is-anfang.is-ende{ border-radius:10px; } .liq-dp-day.is-spanne .liq-dp-dot{ background:var(--accent,#4f8ef7); } .liq-dp-day.is-anfang .liq-dp-dot, .liq-dp-day.is-ende .liq-dp-dot{ background:#fff; } .liq-dp-day.is-spanne:disabled{ background:color-mix(in srgb,var(--accent,#4f8ef7) 10%,transparent); opacity:.45; text-decoration:line-through; } .liq-regelzeile{ display:flex; align-items:center; gap:11px; padding:10px 0; border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 6%,transparent); } .liq-regelzeile:last-child{ border-bottom:0; } .liq-regelzeile__txt{ min-width:0; flex:1; } .liq-regelzeile__n{ font-size:12px; font-weight:600; } .liq-regelzeile__e{ font-size:10.5px; color:var(--muted,#8892a4); margin-top:1px; line-height:1.5; } .liq-regelzeile__w{ flex:none; font-size:11px; font-weight:600; font-variant-numeric:tabular-nums; padding:3px 10px; border-radius:999px; background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-regelzeile--fehlt .liq-regelzeile__n, .liq-regelzeile--fehlt .liq-regelzeile__w{ opacity:.5; } .liq-regelzeile--fehlt .liq-regelzeile__w{ background:transparent; border:1px dashed color-mix(in srgb,var(--text,#fff) 18%,transparent); } [data-stumm] .liq-navitem__num, [data-stumm] .liq-sp-badge, [data-stumm].liq-navitem__num{ opacity:.55; background:transparent; border:1px dashed color-mix(in srgb,var(--text,#fff) 30%,transparent); } [data-stumm]{ position:relative; } [data-stumm]::after{ content:''; position:absolute; top:2px; right:2px; width:5px; height:5px; border-radius:50%; background:var(--muted,#8892a4); box-shadow:0 0 0 2px var(--surface,#1d1d1d); } @media (prefers-reduced-transparency:reduce){ [data-stumm] .liq-navitem__num, [data-stumm] .liq-sp-badge{ opacity:.75; } } .liq-ablauf{ border-radius:16px; padding:13px 14px; background:rgba(255,255,255,.04); border:1px solid var(--glass-bd,color-mix(in srgb,var(--text,#fff) 9%,transparent)); } .liq-ablauf__kopf{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:11px; } .liq-ablauf__titel{ font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted,#8892a4); } .liq-ablauf__band{ display:flex; flex-wrap:wrap; align-items:center; gap:5px; margin-bottom:12px; } .liq-ablauf__st{ display:inline-flex; align-items:center; gap:9px; padding:8px 13px; border-radius:12px; border:0; background:transparent; color:inherit; font:inherit; cursor:pointer; text-align:left; transition:transform .15s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)), background .15s; } .liq-ablauf__st:hover:not(:disabled){ transform:translateY(-1px); background:color-mix(in srgb,var(--text,#fff) 5%,transparent); } .liq-ablauf__st:active:not(:disabled){ transform:scale(.96); } .liq-ablauf__st:focus-visible{ outline:2px solid color-mix(in srgb,var(--accent,#4f8ef7) 60%,transparent); outline-offset:1px; } .liq-ablauf__num{ width:22px; height:22px; flex:none; border-radius:50%; display:grid; place-items:center; font-size:var(--text-11); font-weight:700; background:color-mix(in srgb,var(--text,#fff) 8%,transparent); font-variant-numeric:tabular-nums; } .liq-ablauf__txt{ display:flex; flex-direction:column; line-height:1.18; min-width:0; } .liq-ablauf__wer{ font-size:10px; color:var(--muted,#8892a4); letter-spacing:.02em; } .liq-ablauf__pfeil{ flex:none; display:inline-flex; color:var(--subtle,#5a6377); } .liq-ablauf__pfeil svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-ablauf__st--fertig{ color:#9fe3bd; } .liq-ablauf__st--fertig .liq-ablauf__num{ background:rgba(62,207,142,.92); color:#0c2a18; } .liq-ablauf__st--jetzt{ background:linear-gradient(135deg, rgba(79,142,247,.26), rgba(110,123,255,.17)); box-shadow:0 0 0 1px color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent), var(--liq-hover-glow,0 4px 18px -8px rgba(79,142,247,.5)); } .liq-ablauf__st--gesperrt{ opacity:.5; cursor:default; } .liq-ablauf__st--zu{ opacity:.4; cursor:default; } .liq-ablauf__st--gesperrt:hover, .liq-ablauf__st--zu:hover{ transform:none; background:transparent; } @media (prefers-reduced-motion:reduce){ .liq-ablauf__st{ transition:none!important; } } @media (prefers-reduced-transparency:reduce){ .liq-ablauf{ background:var(--surface,#1d1d1d); } .liq-ablauf__st--jetzt{ background:color-mix(in srgb,var(--accent,#4f8ef7) 22%,var(--surface,#1d1d1d)); } } .liq-dp-dot{ position:absolute; bottom:5px; left:50%; transform:translateX(-50%); width:4px; height:4px; border-radius:50%; background:var(--ok,#19b6a8); } .liq-dp-day.is-sel .liq-dp-dot{ background:#fff; } @media (prefers-reduced-motion:reduce){ .liq-dp-day,.liq-dp-nav button{ transition:none!important; } } @media (prefers-reduced-transparency:reduce){ .liq-dp{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface,#1d1d1d); } } .liq-wz-head{ margin-bottom:20px; } .liq-wz-pane{ position:relative; } .liq-wz-body{ animation:liq-wz-in .32s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-wz-body.back{ animation-name:liq-wz-in-back; } @keyframes liq-wz-in{ from{ opacity:0; transform:translateX(14px); } to{ opacity:1; transform:translateX(0); } } @keyframes liq-wz-in-back{ from{ opacity:0; transform:translateX(-14px); } to{ opacity:1; transform:translateX(0); } } .liq-wz-err{ display:flex; align-items:center; gap:7px; margin-top:12px; font-size:var(--text-13); color:var(--danger,#e0729b); background:color-mix(in srgb, var(--danger,#e0729b) 12%, transparent); border:1px solid color-mix(in srgb, var(--danger,#e0729b) 30%, transparent); border-radius:10px; padding:8px 12px; } .liq-wz-err.shake{ animation:liqJolt .42s; } .liq-wz-foot{ display:flex; align-items:center; gap:12px; margin-top:24px; } .liq-wz-foot .liq-wz-spacer{ flex:1; } .liq-wz-back{ border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); color:var(--ink,#e8ecf6); font:inherit; font-weight:600; font-size:var(--text-14); padding:11px 20px; border-radius:10px; cursor:pointer; transition:background .18s, transform .18s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-wz-back:hover{ background:rgba(255,255,255,.1); } .liq-wz-back:active{ transform:scale(.97); } @media (prefers-reduced-motion:reduce){ .liq-wz-body{ animation:none!important; } .liq-wz-err.shake{ animation:none; } } .liq-seg{ display:inline-flex; position:relative; padding:3px; gap:2px; border-radius:10px; background:rgba(0,0,0,.28); border:1px solid var(--border,#333333); } .liq-seg-ind{ position:absolute; top:3px; bottom:3px; border-radius:6px; background:var(--accent,#4f8ef7); z-index:0; transition:left .25s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)), width .25s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-seg button{ position:relative; z-index:1; min-width:50px; height:28px; padding:0 13px; border:0; background:transparent; color:var(--muted,#8892a4); font:inherit; font-size:var(--text-12); font-weight:600; cursor:pointer; border-radius:6px; transition:color .2s; white-space:nowrap; } .liq-seg button.on{ color:#fff; } .liq-seg:not(:has(.liq-seg-ind)) button.on{ background:var(--accent,#4f8ef7); border-radius:6px; box-shadow:0 2px 10px color-mix(in srgb,var(--accent,#4f8ef7) 35%,transparent); } .liq-seg button:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } @media (prefers-reduced-motion:reduce){ .liq-seg-ind{ transition:none; } } .liq-tip{ position:fixed; z-index:9999; max-width:240px; padding:7px 11px; border-radius:10px; font-size:var(--text-12); line-height:1.4; color:var(--ink,#e8ecf6); background:color-mix(in srgb, var(--bg,#0f1117) 84%, var(--text,#ffffff) 8%); backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2); border:1px solid var(--border,#333333); box-shadow:0 10px 30px -8px rgba(0,0,0,.55); opacity:0; transform:translateY(4px); transition:opacity .15s, transform .15s; pointer-events:none; } .liq-tip.show{ opacity:1; transform:translateY(0); } @media (prefers-reduced-motion:reduce){ .liq-tip{ transition:opacity .15s; transform:none; } } .liq-sigrp{ display:inline-flex; align-items:center; } .liq-sigrp .liq-sigil{ margin-left:-9px; box-shadow:0 0 0 2px var(--bg,#0f1117); } .liq-sigrp .liq-sigil:first-child{ margin-left:0; } .liq-sigrp-more{ margin-left:-9px; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--surface,#1d1d1d); color:var(--muted,#8892a4); font-size:var(--text-12); font-weight:700; box-shadow:0 0 0 2px var(--bg,#0f1117); border:1px solid var(--border,#333333); } .liq-invalid{ border-color:var(--danger,#e0729b)!important; } .liq-invalid.shake{ animation:liqJolt .42s; } .liq-field-err{ display:flex; align-items:center; gap:6px; margin-top:5px; font-size:var(--text-14); color:var(--danger,#e0729b); } @media (prefers-reduced-motion:reduce){ .liq-invalid.shake{ animation:none; } } .liq-seitenzahlen, .liq-pg{ display:inline-flex; align-items:center; gap:4px; } .liq-pg button{ min-width:34px; height:34px; padding:0 8px; border:1px solid var(--border,#333333); background:rgba(255,255,255,.04); color:var(--ink,#e8ecf6); font:inherit; font-size:var(--text-13); font-weight:600; border-radius:10px; cursor:pointer; transition:background .15s, border-color .15s, transform .15s var(--liq-ctl-spring,cubic-bezier(.34,1.56,.64,1)); } .liq-pg button:hover:not(:disabled):not(.on){ background:color-mix(in srgb, var(--accent,#4f8ef7) 14%, transparent); border-color:color-mix(in srgb, var(--accent,#4f8ef7) 40%, transparent); } .liq-pg button:active:not(:disabled){ transform:scale(.92); } .liq-pg button.on{ background:var(--accent,#4f8ef7); border-color:var(--accent,#4f8ef7); color:#fff; } .liq-pg button:disabled{ opacity:.35; cursor:default; } .liq-pg .liq-pg-gap{ min-width:24px; text-align:center; color:var(--muted,#8892a4); } .liq-pg svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vertical-align:middle; } @media (prefers-reduced-motion:reduce){ .liq-pg button{ transition:background .15s, border-color .15s; } } .liq-edge{ position:absolute; top:0; bottom:0; right:-5px; width:11px; z-index:50; cursor:col-resize; touch-action:none; display:flex; align-items:center; justify-content:center; background:transparent; border:0; padding:0; margin:0; } .liq-edge::before{ content:''; position:absolute; top:0; bottom:0; right:5px; width:1px; background:var(--border,#333333); transition:width .15s, background .15s, right .15s; } .liq-edge::after{ content:''; position:relative; right:0; width:4px; height:26px; border-radius:4px; background:var(--border-strong,#414141); opacity:0; transition:opacity .15s, background .15s; } .liq-edge:hover::before, .liq-edge.is-drag::before, .liq-edge:focus-visible::before{ width:2px; background:var(--accent,#4f8ef7); } .liq-edge:hover::after, .liq-edge.is-drag::after, .liq-edge:focus-visible::after{ opacity:1; background:var(--accent,#4f8ef7); } .liq-edge:focus-visible{ outline:none; } .liq-edge.is-collapsed::before{ background:var(--accent,#4f8ef7); opacity:.5; } .liq-edge.is-fixed{ position:fixed; top:auto; bottom:auto; right:auto; } .liq-edge-collapsed-rail{ overflow:hidden!important; } .liq-edge-collapsed-rail :is(a,button,li,.item,.nav-item,span,b,small,label,.label,.txt,.name,.lbl){ font-size:0!important; justify-content:center!important; text-align:center!important; } .liq-edge-collapsed-rail :is(svg,img,.liq-ic){ font-size:initial!important; } @media (prefers-reduced-motion:reduce){ .liq-edge::before,.liq-edge::after{ transition:none; } } @property --liq-beam-a { syntax:''; initial-value:0deg; inherits:false; } .liq-beam{ position:relative; } .liq-beam--rotate::after{ content:''; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none; padding:var(--liq-beam-w,1.5px); background:conic-gradient(from var(--liq-beam-a,0deg), transparent 0 68%, color-mix(in srgb, var(--liq-beam-c, var(--accent,#4f8ef7)) 55%, transparent) 82%, var(--liq-beam-c, var(--accent,#4f8ef7)) 90%, transparent 100%); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude; animation:liqBeamRotate var(--liq-beam-dur,2.6s) linear infinite; } .liq-beam--pulse::after{ content:''; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none; border:var(--liq-beam-w,1.5px) solid var(--liq-beam-c, var(--accent,#4f8ef7)); opacity:.2; animation:liqBeamPulse var(--liq-beam-dur,3.4s) ease-in-out infinite; } @keyframes liqBeamRotate{ to{ --liq-beam-a:360deg; } } @keyframes liqBeamPulse{ 0%,100%{ opacity:.16; box-shadow:0 0 0 0 transparent; } 50%{ opacity:.5; box-shadow:0 0 14px -3px var(--liq-beam-c, var(--accent,#4f8ef7)); } } @media (prefers-reduced-motion:reduce){ .liq-beam--rotate::after{ animation:none; background:none; border:var(--liq-beam-w,1.5px) solid color-mix(in srgb, var(--liq-beam-c, var(--accent,#4f8ef7)) 45%, transparent); } .liq-beam--pulse::after{ animation:none; opacity:.3; box-shadow:none; } } .liq-spot{ position:fixed; inset:0; z-index:9000; } .liq-spot-hole{ position:absolute; pointer-events:none; box-shadow:0 0 0 9999px rgba(6,5,12,.74); border:2px solid rgba(var(--acc-1) / .9); border-radius:14px; transition:left .6s cubic-bezier(.22,1,.36,1), top .6s cubic-bezier(.22,1,.36,1), width .6s cubic-bezier(.22,1,.36,1), height .6s cubic-bezier(.22,1,.36,1), opacity .3s ease; } .liq-spot-hole::after{ content:""; position:absolute; inset:-6px; border-radius:20px; border:2px solid rgba(var(--acc-1) / .35); animation:liq-spot-halo 2s ease-out infinite; } .liq-spot.is-rm .liq-spot-hole{ transition:opacity .2s ease; } .liq-spot.is-rm .liq-spot-hole::after{ animation:none; } @keyframes liq-spot-halo{ 0%{ transform:scale(1); opacity:.6; } 100%{ transform:scale(1.18); opacity:0; } } .liq-spot-card{ position:absolute; max-width:min(320px,86vw); } .liq-spot-card.centered{ left:50%; top:50%; transform:translate(-50%,-50%); } .liq-coach{ background:var(--glass,rgba(20,23,33,.72)); border:1px solid var(--liq-glass-border,rgba(255,255,255,.12)); border-radius:14px; padding:14px 16px; box-shadow:0 18px 50px -18px rgba(0,0,0,.7); -webkit-backdrop-filter:blur(16px) saturate(1.15); backdrop-filter:blur(16px) saturate(1.15); color:var(--ink,#e2e8f0); max-width:320px; } .liq-coach-top{ display:flex; align-items:center; gap:8px; margin-bottom:8px; } .liq-coach-dots{ display:flex; gap:5px; } .liq-coach-dot{ width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.18); transition:background-color .3s ease, box-shadow .3s ease; } .liq-coach-dot.on{ background:rgb(var(--acc-1)); box-shadow:0 0 0 3px rgba(var(--acc-1) / .2); } .liq-coach-dot.done{ background:var(--success,#3ecf8e); } .liq-coach-count{ margin-left:auto; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-coach-title{ font-weight:700; font-size:var(--text-14); margin-bottom:3px; } .liq-coach-body{ font-size:var(--text-13); color:var(--ink-soft,#c2cad8); line-height:1.5; } .liq-coach-hint{ font-size:var(--text-12); color:var(--muted,#8892a4); margin-top:6px; border-left:2px solid rgba(var(--acc-1) / .4); padding-left:8px; } .liq-coach-acts{ display:flex; gap:8px; margin-top:12px; justify-content:flex-end; } .liq-coach-btn{ font:inherit; font-size:var(--text-13); font-weight:600; min-height:38px; padding:8px 16px; border-radius:10px; cursor:pointer; } .liq-coach-btn.primary{ border:none; color:#fff; background:var(--accent-gradient,linear-gradient(135deg,#4f8ef7,#3a6fd0)); } .liq-coach-btn.ghost{ background:transparent; color:var(--ink,#e2e8f0); border:1px solid rgba(255,255,255,.14); } .liq-coach-btn:active{ transform:scale(.97); } .liq-pulse{ position:fixed; z-index:8900; width:16px; height:16px; margin:-8px 0 0 -8px; border-radius:50%; background:rgb(var(--acc-1)); box-shadow:0 0 12px rgba(var(--acc-1) / .9); pointer-events:none; } .liq-pulse::before, .liq-pulse::after{ content:""; position:absolute; inset:0; border-radius:50%; border:2px solid rgb(var(--acc-1)); animation:liq-ripple 2.1s ease-out infinite; } .liq-pulse::after{ animation-delay:1.05s; } @keyframes liq-ripple{ 0%{ transform:scale(1); opacity:.8; } 100%{ transform:scale(3.4); opacity:0; } } @media (prefers-reduced-motion:reduce){ .liq-pulse::before, .liq-pulse::after{ animation:none; opacity:0; } } .liq-quest{ padding:0; overflow:hidden; } .liq-quest-head{ width:100%; display:flex; align-items:center; gap:10px; padding:13px 15px; background:transparent; border:none; cursor:pointer; color:var(--ink,#e2e8f0); font:inherit; } .liq-quest-ttl{ font-weight:700; font-size:var(--text-14); } .liq-quest-meta{ margin-left:auto; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-quest-chev svg{ width:18px; height:18px; fill:none; stroke:var(--muted,#8892a4); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:transform .25s ease; } .liq-quest.is-min .liq-quest-chev svg{ transform:rotate(-90deg); } .liq-quest-bar{ height:3px; background:rgba(255,255,255,.08); } .liq-quest-bar i{ display:block; height:100%; background:var(--accent-gradient,linear-gradient(135deg,#4f8ef7,#3a6fd0)); transition:width .5s cubic-bezier(.22,1,.36,1); } .liq-quest-panel{ max-height:340px; overflow:auto; transition:max-height .3s ease; } .liq-quest.is-min .liq-quest-panel{ max-height:0; } .liq-quest-list{ list-style:none; margin:0; padding:6px; } .liq-quest-it{ display:flex; align-items:center; gap:11px; padding:10px; border-radius:10px; cursor:pointer; } .liq-quest-it:hover{ background:rgba(255,255,255,.05); } .liq-quest-it:focus-visible{ outline:2px solid rgb(var(--acc-1)); outline-offset:2px; } .liq-quest-box{ flex:0 0 auto; width:22px; height:22px; border-radius:6px; border:1.5px solid rgba(255,255,255,.22); display:grid; place-items:center; } .liq-quest-box svg{ width:13px; height:13px; fill:none; stroke:#06210f; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; } .liq-quest-it.done .liq-quest-box{ background:var(--success,#3ecf8e); border-color:transparent; } .liq-quest-label{ font-size:var(--text-13); } .liq-quest-it.done .liq-quest-label{ color:var(--muted,#8892a4); text-decoration:line-through; } .liq-jit{ position:fixed; z-index:9100; max-width:min(300px,86vw); padding:12px 14px; border-radius:14px; background:var(--glass,rgba(20,23,33,.72)); border:1px solid var(--liq-glass-border,rgba(255,255,255,.12)); box-shadow:0 16px 44px -16px rgba(0,0,0,.7); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); color:var(--ink,#e2e8f0); opacity:0; transform:translateY(6px); transition:opacity .22s ease, transform .22s ease; } .liq-jit.show{ opacity:1; transform:translateY(0); } .liq-jit-ttl{ font-weight:700; font-size:var(--text-14); margin-bottom:3px; } .liq-jit-tx{ font-size:var(--text-13); color:var(--ink-soft,#c2cad8); line-height:1.5; } .liq-jit-acts{ display:flex; align-items:center; gap:8px; margin-top:10px; } .liq-jit-ok{ font:inherit; font-size:var(--text-13); font-weight:600; min-height:34px; padding:6px 14px; border-radius:10px; border:none; color:#fff; background:var(--accent-gradient,linear-gradient(135deg,#4f8ef7,#3a6fd0)); cursor:pointer; } .liq-jit-x{ margin-left:auto; order:2; width:30px; height:30px; border-radius:6px; border:1px solid var(--liq-glass-border,rgba(255,255,255,.12)); background:transparent; cursor:pointer; display:grid; place-items:center; } .liq-jit-x svg{ width:14px; height:14px; fill:none; stroke:var(--muted,#8892a4); stroke-width:2; stroke-linecap:round; } .liq-spark-host{ position:fixed; inset:0; z-index:9200; pointer-events:none; } .liq-spark{ position:absolute; width:7px; height:7px; border-radius:4px; } @media (prefers-reduced-motion:reduce){ .liq-spot-hole{ transition:opacity .2s ease; } .liq-spot-hole::after{ animation:none; } .liq-coach-dot{ transition:none; } .liq-quest-chev svg, .liq-quest-bar i, .liq-quest-panel{ transition:none; } .liq-jit{ transition:none; opacity:1; transform:none; } } .liq-joy{ border:0; cursor:pointer; color:#fff; font-weight:650; background:linear-gradient(135deg,#ffb347,#ff7eb3 55%,#7f7bff); box-shadow:0 6px 20px rgba(255,126,179,.32); transition:transform .12s, box-shadow .16s, filter .16s; } .liq-joy:hover{ transform:translateY(-1px); box-shadow:0 9px 26px rgba(255,126,179,.42); filter:brightness(1.04); } .liq-joy:active{ transform:translateY(0) scale(.98); } .liq-joy-spark{ flex-shrink:0; transform-origin:center; animation:liqJoySpark 3.4s ease-in-out infinite; } .liq-joy:hover .liq-joy-spark{ animation-duration:1.4s; } @keyframes liqJoySpark{ 0%,100%{ transform:rotate(0) scale(1); opacity:.92 } 50%{ transform:rotate(45deg) scale(1.12); opacity:1 } } @media (prefers-reduced-motion:reduce){ .liq-joy-spark{ animation:none; } } .liq-tnum{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; } @keyframes liqEnter{ from{ transform:translateY(8px); filter:blur(8px); opacity:0; } } .liq-enter{ animation:liqEnter 720ms cubic-bezier(.25,.46,.45,.94) both; animation-delay:calc(var(--liq-enter-d,90ms) * var(--stagger,0)); } @keyframes liqExit{ to{ opacity:0; filter:blur(4px); } } .liq-exit{ animation:liqExit 320ms cubic-bezier(.4,0,.2,1) both; } @media (prefers-reduced-motion:reduce){ .liq-enter{ animation:none; } .liq-exit{ animation:none; } } .liq-hairline{ border:0; box-shadow:0 0 0 1px rgba(255,255,255,.07), 0 1px 2px -1px rgba(0,0,0,.5), 0 4px 12px -4px rgba(0,0,0,.45); transition:box-shadow .15s; } .liq-hairline.is-hi, .liq-hairline:hover{ box-shadow:0 0 0 1px rgba(255,255,255,.11), 0 2px 4px -1px rgba(0,0,0,.55), 0 6px 16px -4px rgba(0,0,0,.5); } body[data-skin="classic"] .liq-hairline{ box-shadow:0 0 0 1px rgba(0,0,0,.06), 0 1px 2px -1px rgba(0,0,0,.06), 0 2px 4px 0 rgba(0,0,0,.04); } body[data-skin="classic"] .liq-hairline.is-hi, body[data-skin="classic"] .liq-hairline:hover{ box-shadow:0 0 0 1px rgba(0,0,0,.08), 0 1px 2px -1px rgba(0,0,0,.08), 0 2px 4px 0 rgba(0,0,0,.06); } @media (prefers-reduced-motion:reduce){ .liq-hairline{ transition:none; } } .liq-img-edge{ outline:1px solid rgba(255,255,255,.12); outline-offset:-1px; } body[data-skin="classic"] .liq-img-edge{ outline-color:rgba(0,0,0,.10); } .liq-icon-swap{ position:relative; display:inline-flex; align-items:center; justify-content:center; } .liq-icon-swap > *{ transition:opacity .22s, transform .22s, filter .22s; } .liq-icon-swap > .is-hidden{ opacity:0; transform:scale(.6); filter:blur(3px); position:absolute; inset:0; pointer-events:none; } @media (prefers-reduced-motion:reduce){ .liq-icon-swap > *{ transition:opacity .15s; } .liq-icon-swap > .is-hidden{ transform:none; filter:none; } } .liq-iris.is-playing{ animation:liqIris var(--liq-iris-dur,.7s) cubic-bezier(.22,.61,.36,1) both; } @keyframes liqIris{ from{ clip-path:circle(0% at 50% 50%); } to{ clip-path:circle(75% at 50% 50%); } } @media (prefers-reduced-motion:reduce){ .liq-iris.is-playing{ animation:none; clip-path:none; } } .liq-cropframe{ position:relative; } .liq-crop-corner{ position:absolute; width:var(--liq-crop-size,22px); height:var(--liq-crop-size,22px); border:2px solid var(--liq-crop-color,var(--accent,#4f8ef7)); opacity:0; pointer-events:none; } .liq-crop-corner.tl{ top:-6px; left:-6px; border-right:0; border-bottom:0; border-radius:6px 0 0 0; } .liq-crop-corner.tr{ top:-6px; right:-6px; border-left:0; border-bottom:0; border-radius:0 8px 0 0; } .liq-crop-corner.bl{ bottom:-6px; left:-6px; border-right:0; border-top:0; border-radius:0 0 0 8px; } .liq-crop-corner.br{ bottom:-6px; right:-6px; border-left:0; border-top:0; border-radius:0 0 8px 0; } .liq-cropframe.is-playing .liq-crop-corner{ animation:liqCrop .5s cubic-bezier(.34,1.56,.64,1) both; } .liq-cropframe.is-playing .tr{ animation-delay:.06s; } .liq-cropframe.is-playing .bl{ animation-delay:.12s; } .liq-cropframe.is-playing .br{ animation-delay:.18s; } @keyframes liqCrop{ from{ opacity:0; transform:scale(1.6); } to{ opacity:1; transform:scale(1); } } @media (prefers-reduced-motion:reduce){ .liq-cropframe.is-playing .liq-crop-corner{ animation:none; opacity:1; transform:none; } } .liq-baseline{ height:2px; border-radius:4px; transform:scaleX(0); transform-origin:center; background:linear-gradient(90deg, transparent, rgb(var(--acc-1,79 142 247)), rgb(var(--acc-2,58 111 208)), transparent); } .liq-baseline.is-playing{ animation:liqBaseline var(--liq-baseline-dur,.7s) cubic-bezier(.22,.61,.36,1) both; } @keyframes liqBaseline{ to{ transform:scaleX(1); } } @media (prefers-reduced-motion:reduce){ .liq-baseline{ transform:scaleX(1); } .liq-baseline.is-playing{ animation:none; transform:scaleX(1); } } .liq-glow-vessel{ --gv-glow:var(--acc-1,79 142 247); position:relative; width:var(--gv-w,72px); height:var(--gv-h,104px); border-radius:999px; overflow:hidden; background:linear-gradient(180deg,#10141c,#0b0e14); border:1px solid var(--border,#333333); box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 16px 36px -22px #000; display:flex; align-items:flex-end; justify-content:center; } .liq-glow-vessel::after{ content:""; width:88%; height:42%; margin-bottom:-12%; border-radius:50%; filter:blur(11px); background:radial-gradient(circle at 50% 60%, rgb(var(--gv-glow)), transparent 70%); animation:liqGvBreathe 3.2s ease-in-out infinite; } .liq-glow-vessel.is-urgent{ --gv-glow:240 162 59; } .liq-glow-vessel .liq-gv-glyph{ position:absolute; top:48%; left:50%; transform:translate(-50%,-50%); width:34%; opacity:.5; color:var(--ink-soft,#c2cad8); } @keyframes liqGvBreathe{ 0%,100%{ transform:scale(.9); opacity:.7 } 50%{ transform:scale(1.08); opacity:1 } } @media (prefers-reduced-motion:reduce){ .liq-glow-vessel::after{ animation:none; opacity:.92 } } .liq-seal-toggle{ position:relative; width:60px; height:34px; border-radius:20px; cursor:pointer; padding:0; flex:0 0 auto; background:linear-gradient(180deg,#11151d,#0c0f15); border:1px solid var(--border,#333333); box-shadow:inset 0 2px 6px rgba(0,0,0,.5); } .liq-seal-toggle:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-seal-toggle .liq-st-knob{ position:absolute; top:4px; left:4px; width:26px; height:26px; border-radius:50%; background:radial-gradient(circle at 40% 35%,#2a3344,#161b24); border:1px solid rgba(255,255,255,.1); transition:left .42s cubic-bezier(.5,1.6,.4,1), box-shadow .4s, background .4s; display:flex; align-items:center; justify-content:center; } .liq-seal-toggle.is-on .liq-st-knob{ left:30px; background:radial-gradient(circle at 40% 35%,#cfe0ff,rgb(var(--acc-1,79 142 247))); box-shadow:0 0 16px 1px rgba(var(--acc-1,79 142 247) / .55); } .liq-seal-toggle.is-pending .liq-st-knob{ background:radial-gradient(circle at 40% 35%,#bcd4ff,#5f86ff); } .liq-seal-toggle.is-done .liq-st-knob{ background:radial-gradient(circle at 40% 35%,#aef0c8,#6ee7a8); box-shadow:0 0 16px 1px rgba(110,231,168,.5); } .liq-seal-toggle .liq-st-spin{ width:14px; height:14px; border-radius:50%; display:none; border:2px solid rgba(11,14,20,.25); border-top-color:#0b0e14; animation:liqStSpin .8s linear infinite; } .liq-seal-toggle.is-pending .liq-st-spin{ display:block; } .liq-seal-toggle .liq-st-chk{ display:none; } .liq-seal-toggle.is-done .liq-st-chk{ display:block; } .liq-seal-toggle .liq-st-chk svg{ width:15px; height:15px; fill:none; stroke:#0b0e14; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; } @keyframes liqStSpin{ to{ transform:rotate(360deg) } } @media (prefers-reduced-motion:reduce){ .liq-seal-toggle .liq-st-knob{ transition:left .01s } .liq-seal-toggle .liq-st-spin{ animation:none } } .liq-toast-stack.is-stacked .liq-toast{ transition:transform .5s cubic-bezier(.5,1.4,.4,1), opacity .42s; will-change:transform; } .liq-toast-stack.is-stacked:not(.is-expanded) .liq-toast{ position:absolute; left:0; right:0; } .liq-toast-stack.is-stacked:not(.is-expanded) .liq-toast:nth-last-child(1){ transform:translateY(0) scale(1); z-index:3; opacity:1; } .liq-toast-stack.is-stacked:not(.is-expanded) .liq-toast:nth-last-child(2){ transform:translateY(9px) scale(.95); z-index:2; opacity:.85; } .liq-toast-stack.is-stacked:not(.is-expanded) .liq-toast:nth-last-child(3){ transform:translateY(18px) scale(.9); z-index:1; opacity:.62; } .liq-toast-stack.is-stacked:not(.is-expanded) .liq-toast:nth-last-child(n+4){ transform:translateY(22px) scale(.88); opacity:0; pointer-events:none; } .liq-toast.is-swiping{ transition:none; } @media (prefers-reduced-motion:reduce){ .liq-toast-stack.is-stacked .liq-toast{ transition:opacity .2s; } } .liq-gauge{position:relative;display:inline-flex;align-items:center;justify-content:center; width:var(--lg-size,180px);height:var(--lg-size,180px);--lg-tier:var(--accent,#4f8ef7);--lg-glow:var(--accent-soft,rgba(79,142,247,.5)); --lg-font:ui-sans-serif,-apple-system,'Helvetica Neue','Segoe UI',Roboto,Arial,sans-serif} .liq-gauge svg{width:100%;height:100%;display:block;overflow:visible} .liq-gauge-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;pointer-events:none;text-align:center} .liq-gauge--arc .liq-gauge-label{transform:translate(calc(var(--lg-size,180px)*.05),calc(var(--lg-size,180px)*-.05))} .liq-gauge--ticks .liq-gauge-label{transform:translateX(calc(var(--lg-size,180px)*.035))} .liq-gauge--arc .liq-gauge-tier{transform:translateX(calc(var(--lg-size,180px)*-.05))} .liq-gauge--ticks .liq-gauge-tier{transform:translateX(calc(var(--lg-size,180px)*-.035))} .liq-gauge-num{font-family:var(--lg-font);font-size:calc(var(--lg-size,180px)*.235);font-weight:700;line-height:1;letter-spacing:-.03em; font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:.06em;color:var(--ink,#e9edf0)} .liq-gauge-num .liq-gauge-suf{font-size:.42em;font-weight:600;color:var(--ink-soft,#aeb6bd)} .liq-gauge-tier{font-family:var(--lg-font);font-size:calc(var(--lg-size,180px)*.082);font-weight:600;color:var(--lg-tier);letter-spacing:.02em; transition:color .4s var(--ease-out,cubic-bezier(.22,.61,.36,1))} .liq-gauge-tick{stroke-linecap:round;stroke:rgba(255,255,255,.12);transition:stroke .25s var(--ease-out,ease),filter .25s} .liq-gauge-tick.is-on{stroke:var(--lg-tier);filter:drop-shadow(0 0 5px var(--lg-glow))} .liq-gauge.is-anim .liq-gauge-tick.is-on{filter:drop-shadow(0 0 8px var(--lg-glow)) blur(.6px)} .liq-gauge-track{fill:none;stroke:rgba(255,255,255,.10);stroke-linecap:round} .liq-gauge-arc{fill:none;stroke-linecap:round;filter:drop-shadow(0 0 6px var(--lg-glow))} .liq-gauge-dot{fill:#fff;filter:drop-shadow(0 0 7px var(--lg-glow))} .liq-gauge.is-anim .liq-gauge-arc{filter:drop-shadow(0 0 10px var(--lg-glow))} @media (prefers-reduced-motion:reduce){ .liq-gauge-tier{transition:none} .liq-gauge.is-anim .liq-gauge-tick.is-on,.liq-gauge.is-anim .liq-gauge-arc{filter:drop-shadow(0 0 5px var(--lg-glow))} } @media (prefers-reduced-transparency:reduce){ .liq-gauge-tick.is-on,.liq-gauge-arc,.liq-gauge-dot{filter:none} } .liq-rankrow{ display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:12px; padding:11px 8px; border-bottom:1px solid var(--hair,rgba(255,255,255,.06)); } .liq-rankrow:last-child{ border-bottom:0; } .liq-rankrow__rank{ width:28px; height:28px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:var(--text-13); font-variant-numeric:tabular-nums; color:var(--muted,#8892a4); background:color-mix(in srgb, var(--text,#fff) 6%, transparent); } .liq-rankrow--top .liq-rankrow__rank{ color:#cfe0ff; background:color-mix(in srgb, var(--accent,#4f8ef7) 22%, transparent); border:1px solid color-mix(in srgb, var(--accent,#4f8ef7) 34%, transparent); } .liq-rankrow__body{ min-width:0; } .liq-rankrow__name{ font-size:var(--text-14); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .liq-rankrow__sub{ font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:1px; } .liq-rankrow__bar{ height:8px; border-radius:999px; margin-top:8px; overflow:hidden; background:color-mix(in srgb, var(--text,#fff) 8%, transparent); } .liq-rankrow__fill{ display:flex; height:100%; width:0; transition:width .9s var(--ease-out,cubic-bezier(.22,.61,.36,1)); } .liq-rankrow__seg{ height:100%; background:var(--seg, var(--accent,#4f8ef7)); } .liq-rankrow__fill > .liq-rankrow__seg:first-child{ border-radius:999px 0 0 99px; } .liq-rankrow__fill > .liq-rankrow__seg:last-child{ border-radius:0 99px 99px 0; } .liq-rankrow__fill.is-single, .liq-rankrow__fill.is-single .liq-rankrow__seg{ border-radius:999px; } .liq-rankrow__end{ text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:2px; } .liq-rankrow__val{ font-size:var(--text-14); font-weight:750; font-variant-numeric:tabular-nums; } .liq-rankrow__delta{ display:inline-flex; align-items:center; gap:3px; font-size:var(--text-11); font-weight:600; color:var(--muted,#8892a4); } .liq-rankrow__delta svg{ width:11px; height:11px; fill:none; stroke:currentColor; stroke-width:2.4; } .liq-rankrow__delta.is-up{ color:var(--success,#3ecf8e); } .liq-rankrow__delta.is-down{ color:var(--danger,#e0736f); } @media (prefers-reduced-motion:reduce){ .liq-rankrow__fill{ transition:none; } } .liq-pipeline{ display:block; } .liq-pl-bars .liq-pl-row{ display:grid; grid-template-columns:132px minmax(0,1fr) 66px; align-items:center; gap:12px; margin-bottom:10px; } .liq-pl-lbl{ font-size:var(--text-12); font-weight:600; } .liq-pl-lbl small{ display:block; color:var(--muted,#8892a4); font-weight:400; font-size:var(--text-10); } .liq-pl-track{ height:24px; border-radius:6px; overflow:hidden; background:color-mix(in srgb, var(--text,#fff) 7%, transparent); } .liq-pl-fill{ height:100%; width:0; border-radius:6px; background:var(--seg, var(--accent,#4f8ef7)); transition:width .8s var(--ease-out,cubic-bezier(.22,.61,.36,1)); } .liq-pl-num{ text-align:right; font-weight:750; font-variant-numeric:tabular-nums; font-size:var(--text-14); } .liq-pl-funnel{ max-width:400px; margin:0 auto; } .liq-pl-fband{ height:58px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; margin-bottom:3px; text-align:center; opacity:0; transition:opacity .5s ease; } .liq-pl-fband.is-in{ opacity:1; } .liq-pl-fband .liq-pl-fbl{ font-size:var(--text-12); font-weight:600; } .liq-pl-fband .liq-pl-fbn{ font-size:17px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1.1; } .liq-pl-fband .liq-pl-fbc{ font-size:var(--text-10); opacity:.85; margin-top:1px; } .liq-pl-buckets{ display:flex; gap:10px; align-items:flex-end; justify-content:space-between; } .liq-pl-bk{ flex:1 1 0; min-width:0; text-align:center; } .liq-pl-bk__can{ position:relative; height:158px; border-radius:10px 10px 14px 14px; overflow:hidden; background:color-mix(in srgb, var(--text,#fff) 5%, transparent); border:1px solid var(--hair,rgba(255,255,255,.1)); } .liq-pl-bk__fluid{ position:absolute; left:0; right:0; bottom:0; height:0; background:var(--seg, var(--accent,#4f8ef7)); transition:height .9s var(--ease-out,cubic-bezier(.22,.61,.36,1)); } .liq-pl-bk__num{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; z-index:2; font-size:19px; font-weight:800; font-variant-numeric:tabular-nums; color:#fff; text-shadow:0 1px 4px rgba(4,6,12,.6); } .liq-pl-bk__pct{ position:absolute; left:0; right:0; top:8px; z-index:2; text-align:center; font-size:var(--text-11); font-weight:700; color:var(--ink-soft,#c2cad8); } .liq-pl-bk__lbl{ font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:7px; line-height:1.3; } @media (prefers-reduced-motion:reduce){ .liq-pl-fill, .liq-pl-bk__fluid{ transition:none; } .liq-pl-fband{ transition:none; opacity:1; } } .liq-ctxchip{ display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; font-size:var(--text-12); font-weight:600; letter-spacing:.01em; color:var(--ink-soft,#c2cad8); background:color-mix(in srgb, var(--ink-soft,#c2cad8) 8%, transparent); border:1px solid color-mix(in srgb, var(--ink-soft,#c2cad8) 16%, transparent); } .liq-ctxchip__ico{ width:15px; height:15px; flex:0 0 auto; opacity:.85; display:inline-flex; } .liq-ctxchip__ico svg{ width:100%; height:100%; display:block; fill:none; stroke:currentColor; stroke-width:1.7; } .liq-ctxchip b{ color:var(--text,#e9eef6); font-weight:700; } .liq-ctxchip__dev{ opacity:.78; } .liq-ctxchip__sep{ opacity:.5; } .liq-waterfall{ position:relative; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; } .liq-waterfall__inner{ position:relative; min-width:460px; } .liq-waterfall__plot{ position:relative; height:250px; display:flex; align-items:flex-end; gap:0; } .liq-waterfall__col{ flex:1 1 0; min-width:0; position:relative; height:100%; } .liq-wf-bar{ position:absolute; left:16%; right:16%; border-radius:6px; height:0; transition:height .8s var(--ease-out,cubic-bezier(.22,.61,.36,1)), bottom .8s var(--ease-out,cubic-bezier(.22,.61,.36,1)); } .liq-wf-bar--start{ background:linear-gradient(180deg,#6aa0ff,#4f8ef7); } .liq-wf-bar--end{ background:linear-gradient(180deg,#4ad999,#3ecf8e); } .liq-wf-bar--minus{ background:linear-gradient(180deg,#ec8b86,#e0736f); } .liq-wf-bar--plus{ background:linear-gradient(180deg,#7be0b0,#3ecf8e); } .liq-wf-val{ position:absolute; left:0; right:0; text-align:center; font-size:var(--text-12); font-weight:750; font-variant-numeric:tabular-nums; color:var(--text,#e9eef6); white-space:nowrap; opacity:0; transition:bottom .8s var(--ease-out,cubic-bezier(.22,.61,.36,1)), opacity .35s ease; } .liq-wf-val.is-in{ opacity:1; } .liq-wf-conn{ position:absolute; height:0; border-top:1.5px dashed color-mix(in srgb,var(--text,#fff) 26%,transparent); opacity:0; transition:bottom .8s var(--ease-out,cubic-bezier(.22,.61,.36,1)), opacity .35s ease; } .liq-wf-conn.is-in{ opacity:1; } .liq-waterfall__labels{ display:flex; margin-top:12px; } .liq-wf-lbl{ flex:1 1 0; min-width:0; text-align:center; font-size:var(--text-11); color:var(--muted,#8892a4); line-height:1.3; padding:0 3px; } .liq-wf-lbl b{ display:block; color:var(--ink-soft,#c2cad8); font-size:var(--text-11); font-weight:650; } @media (prefers-reduced-motion:reduce){ .liq-wf-bar, .liq-wf-val, .liq-wf-conn{ transition:none; } .liq-wf-val, .liq-wf-conn{ opacity:1; } } .liq-kbd{ display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 6px; font-size:var(--text-11); font-weight:650; font-family:var(--d-font-body,system-ui); color:var(--ink-soft,#c2cad8); background:color-mix(in srgb,var(--text,#fff) 9%,transparent); border:1px solid var(--hair,rgba(255,255,255,.16)); border-bottom-width:2px; border-radius:6px; line-height:1; } .liq-command-scrim{ position:fixed; inset:0; z-index:1200; display:flex; align-items:flex-start; justify-content:center; padding-top:12vh; background:rgba(6,8,14,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); opacity:0; transition:opacity .18s ease; } .liq-command-scrim.is-show{ opacity:1; } .liq-command{ width:min(560px,92vw); max-height:70vh; display:flex; flex-direction:column; overflow:hidden; border-radius:14px; border:1px solid var(--hair,rgba(255,255,255,.14)); background:color-mix(in srgb,var(--surface,#1d1d1d) 92%,transparent); -webkit-backdrop-filter:blur(30px) saturate(1.3); backdrop-filter:blur(30px) saturate(1.3); box-shadow:0 24px 70px rgba(0,0,0,.5); transform:translateY(-8px) scale(.99); transition:transform .18s ease; } .liq-command-scrim.is-show .liq-command{ transform:none; } .liq-command__search{ display:flex; align-items:center; gap:11px; padding:15px 16px; border-bottom:1px solid var(--hair,rgba(255,255,255,.09)); } .liq-command__search svg{ width:18px; height:18px; fill:none; stroke:var(--muted,#8892a4); stroke-width:2; flex:none; } .liq-command__input:focus-visible{ box-shadow:0 0 0 2px var(--accent,#4f8ef7); border-radius:6px; } .liq-command__input{ flex:1; background:none; border:0; outline:none; color:var(--text,#e9eef6); font:inherit; font-size:16px; } .liq-command__input::placeholder{ color:var(--muted,#8892a4); } .liq-command__list{ overflow-y:auto; overscroll-behavior:contain; padding:6px; } .liq-command__group{ padding:8px 12px 4px; font-size:var(--text-10); font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#8892a4); } .liq-command__row{ display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:10px; cursor:pointer; } .liq-command__row.is-active{ background:color-mix(in srgb,var(--accent,#4f8ef7) 20%,transparent); } .liq-command__ic{ width:30px; height:30px; flex:none; border-radius:10px; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb,var(--text,#fff) 7%,transparent); color:var(--ink-soft,#c2cad8); } .liq-command__ic svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; } .liq-command__row.is-active .liq-command__ic{ background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); color:#dbe7fb; } .liq-command__body{ flex:1; min-width:0; } .liq-command__t{ font-size:var(--text-14); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .liq-command__t mark{ background:none; color:var(--accent,#4f8ef7); font-weight:750; } .liq-command__s{ font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:1px; } .liq-command__tag{ font-size:var(--text-10); font-weight:700; color:var(--muted,#8892a4); flex:none; } .liq-command__empty{ padding:26px 16px; text-align:center; color:var(--muted,#8892a4); font-size:var(--text-13); } .liq-command__foot{ display:flex; align-items:center; gap:16px; padding:9px 14px; border-top:1px solid var(--hair,rgba(255,255,255,.09)); font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-command__foot .liq-command__k{ display:inline-flex; align-items:center; gap:5px; } @media (prefers-reduced-motion:reduce){ .liq-command-scrim, .liq-command{ transition:none; } } .liq-table{ border:1px solid var(--hair,rgba(255,255,255,.1)); border-radius:14px; overflow:hidden; background:color-mix(in srgb,var(--text,#fff) 2%,transparent); } .liq-table__bar{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-bottom:1px solid var(--hair,rgba(255,255,255,.09)); flex-wrap:wrap; } .liq-table__search{ flex:1; min-width:180px; display:flex; align-items:center; gap:9px; padding:9px 12px; border-radius:10px; background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1px solid var(--hair,rgba(255,255,255,.12)); } .liq-table__search svg{ width:16px; height:16px; fill:none; stroke:var(--muted,#8892a4); stroke-width:2; flex:none; } .liq-table__search input:focus-visible{ box-shadow:0 0 0 2px var(--accent,#4f8ef7); border-radius:6px; } .liq-table__search input{ flex:1; background:none; border:0; outline:none; color:var(--text,#e9eef6); font:inherit; font-size:var(--text-14); } .liq-table__search input::placeholder{ color:var(--muted,#8892a4); } .liq-table__count{ font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-table__sel{ display:none; align-items:center; gap:12px; padding:10px 14px; font-size:var(--text-13); background:color-mix(in srgb,var(--accent,#4f8ef7) 14%,transparent); border-bottom:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 26%,transparent); } .liq-table__sel.is-on{ display:flex; } .liq-table__sel b{ color:#dbe7fb; } .liq-table__sel .liq-table__selsp{ flex:1; } .liq-table__sel button{ font:inherit; font-size:var(--text-12); font-weight:600; cursor:pointer; padding:6px 12px; border-radius:6px; color:var(--ink-soft,#c2cad8); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); border:1px solid var(--hair,rgba(255,255,255,.16)); } .liq-table__scroll{ overflow-x:auto; overscroll-behavior-x:contain; } .liq-table table{ width:100%; min-width:620px; border-collapse:collapse; font-size:var(--text-13); } .liq-table thead th{ text-align:left; padding:11px 14px; font-size:var(--text-11); font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--muted,#8892a4); border-bottom:1px solid var(--hair,rgba(255,255,255,.09)); white-space:nowrap; user-select:none; } .liq-table thead th.is-sortable{ cursor:pointer; } .liq-table thead th.is-sortable:hover{ color:var(--ink-soft,#c2cad8); } .liq-table th .liq-table__arr{ display:inline-block; width:0; height:0; margin-left:5px; vertical-align:middle; opacity:0; } .liq-table th.is-sorted .liq-table__arr{ opacity:1; } .liq-table th .liq-table__arr.is-up{ border-left:4px solid transparent; border-right:4px solid transparent; border-bottom:5px solid currentColor; } .liq-table th .liq-table__arr.is-down{ border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid currentColor; } .liq-table th.is-num, .liq-table td.is-num{ text-align:right; font-variant-numeric:tabular-nums; } .liq-table tbody td{ padding:11px 14px; border-bottom:1px solid var(--hair,rgba(255,255,255,.05)); } .liq-table--offen{ border:0; border-radius:0; background:none; overflow-x:auto; overscroll-behavior-x:contain; } .liq-table--offen table{ min-width:0; } .liq-table--offen thead th{ padding:0 0 9px; } .liq-table--offen tbody td{ padding:11px 0; } .liq-table--offen thead th + th, .liq-table--offen tbody td + td{ padding-left:18px; } .liq-table--offen tbody tr:last-child td{ border-bottom:0; } @media (pointer:coarse){ .liq-table--offen td > .liq-btn-text{ min-height:44px; display:inline-flex; align-items:center; } } @media (max-width:620px){ .liq-table--offen thead{ display:none; } .liq-table--offen tbody tr{ display:block; padding:11px 0; border-bottom:1px solid var(--hair,rgba(255,255,255,.07)); } .liq-table--offen tbody tr:last-child{ border-bottom:0; } .liq-table--offen tbody td{ display:block; padding:2px 0; border-bottom:0; } .liq-table--offen tbody td.is-num{ text-align:left; } } .liq-table tbody tr:last-child td{ border-bottom:0; } .liq-table tbody tr.is-sel{ background:color-mix(in srgb,var(--accent,#4f8ef7) 10%,transparent); } .liq-table tbody tr.is-clickable:hover{ background:color-mix(in srgb,var(--text,#fff) 3%,transparent); } .liq-table th.liq-table__selcol, .liq-table td.liq-table__selcol{ width:42px; text-align:center; padding-left:14px; padding-right:0; } .liq-table__chk{ width:18px; height:18px; border-radius:6px; border:1.6px solid var(--hair,rgba(255,255,255,.3)); cursor:pointer; display:inline-block; vertical-align:middle; position:relative; } .liq-table__chk.is-on{ background:var(--accent,#4f8ef7); border-color:var(--accent,#4f8ef7); } .liq-table__chk.is-on::after{ content:''; position:absolute; left:5px; top:1.5px; width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); } .liq-table__empty{ padding:36px 16px; text-align:center; color:var(--muted,#8892a4); } .liq-table__foot{ display:flex; align-items:center; gap:12px; padding:11px 14px; border-top:1px solid var(--hair,rgba(255,255,255,.09)); font-size:var(--text-12); color:var(--muted,#8892a4); flex-wrap:wrap; } .liq-table__foot .liq-table__footsp{ flex:1; } .liq-table__pg{ font:inherit; font-size:var(--text-13); cursor:pointer; padding:6px 12px; border-radius:6px; color:var(--ink-soft,#c2cad8); background:color-mix(in srgb,var(--text,#fff) 6%,transparent); border:1px solid var(--hair,rgba(255,255,255,.14)); } .liq-table__pg:disabled{ opacity:.4; cursor:default; } .liq-kanban{ display:flex; gap:14px; overflow-x:auto; overscroll-behavior-x:contain; padding-bottom:8px; align-items:flex-start; } .liq-kb-col{ flex:0 0 260px; min-width:260px; box-sizing:border-box; display:flex; flex-direction:column; border-radius:14px; max-height:70vh; background:color-mix(in srgb,var(--text,#fff) 3%,transparent); border:1px solid var(--hair,rgba(255,255,255,.09)); } .liq-kb-col.is-over{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 8%,transparent); } .liq-kb-col__head{ display:flex; align-items:center; gap:9px; padding:12px 14px; border-bottom:1px solid var(--hair,rgba(255,255,255,.08)); } .liq-kb-col__dot{ width:9px; height:9px; border-radius:50%; flex:none; } .liq-kb-col__t{ font-size:var(--text-13); font-weight:700; } .liq-kb-col__n{ margin-left:auto; font-size:var(--text-11); font-weight:700; color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); padding:2px 8px; border-radius:999px; } .liq-kb-col__body{ padding:10px; display:flex; flex-direction:column; gap:9px; overflow-y:auto; overscroll-behavior:contain; min-height:60px; flex:1; } .liq-kb-col__empty{ color:var(--muted,#8892a4); font-size:var(--text-12); text-align:center; padding:14px 8px; border:1px dashed var(--hair,rgba(255,255,255,.12)); border-radius:10px; } .liq-kb-card{ background:color-mix(in srgb,var(--surface,#1d1d1d) 80%,transparent); border:1px solid var(--hair,rgba(255,255,255,.1)); border-radius:10px; padding:11px 12px; cursor:grab; touch-action:none; transition:transform .1s, box-shadow .15s; } .liq-kb-card:active{ cursor:grabbing; } .liq-kb-card.is-ghost{ position:fixed; z-index:1200; width:236px; pointer-events:none; box-shadow:0 16px 40px rgba(0,0,0,.5); transform:rotate(2deg); opacity:.96; cursor:grabbing; } .liq-kb-card.is-placeholder{ opacity:.25; } .liq-kb-card__top{ display:flex; align-items:flex-start; gap:8px; } .liq-kb-card__prio{ width:8px; height:8px; border-radius:50%; margin-top:5px; flex:none; } .liq-kb-card__t{ font-size:var(--text-13); font-weight:600; line-height:1.35; flex:1; } .liq-kb-card__meta{ display:flex; align-items:center; gap:8px; margin-top:9px; } .liq-kb-card__tag{ font-size:var(--text-10); font-weight:700; color:var(--ink-soft,#c2cad8); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); padding:2px 8px; border-radius:6px; } .liq-kb-card__av{ margin-left:auto; width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:var(--text-10); font-weight:700; color:#dbe7fb; background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); } .liq-otp{ display:flex; gap:9px; justify-content:center; direction:ltr; } .liq-otp__g{ display:flex; gap:9px; } .liq-otp__sep{ align-self:center; color:var(--muted,#8892a4); font-weight:700; } .liq-otp__c{ width:46px; height:56px; border-radius:10px; font:inherit; font-size:22px; font-weight:700; text-align:center; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1.5px solid var(--hair,rgba(255,255,255,.16)); outline:none; caret-color:var(--accent,#4f8ef7); transition:border-color .15s, background .15s, transform .1s; -moz-appearance:textfield; } .liq-otp__c::-webkit-outer-spin-button, .liq-otp__c::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; } .liq-otp__c:focus{ border-color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); } .liq-otp__c.is-filled{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 45%,transparent); } .liq-otp.is-error .liq-otp__c{ border-color:var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 10%,transparent); } .liq-otp.is-ok .liq-otp__c{ border-color:var(--success,#3ecf8e); background:color-mix(in srgb,var(--success,#3ecf8e) 12%,transparent); } .liq-otp.is-busy .liq-otp__c{ opacity:.6; } @keyframes liqOtpShake{ 0%,100%{ transform:translateX(0); } 20%{ transform:translateX(-6px); } 40%{ transform:translateX(6px); } 60%{ transform:translateX(-4px); } 80%{ transform:translateX(4px); } } .liq-otp.is-error{ animation:liqOtpShake .32s ease; } .liq-otp--anzeige .liq-otp__c{ display:flex; align-items:center; justify-content:center; cursor:default; user-select:all; -webkit-user-select:all; border-color:color-mix(in srgb,var(--accent,#4f8ef7) 32%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 10%,transparent); } @media (prefers-contrast:more){ .liq-otp--anzeige .liq-otp__c{ border-color:var(--text,#e9eef6); } } .liq-otp__msg{ margin-top:14px; font-size:var(--text-12); min-height:18px; text-align:center; } .liq-otp__msg.is-err{ color:var(--danger,#e0736f); } .liq-otp__msg.is-ok{ color:var(--success,#3ecf8e); } .liq-otp__msg.is-hint{ color:var(--muted,#8892a4); } .liq-otp__c{ transition:transform .18s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), border-color .18s ease, background .18s ease; } .liq-otp__c.is-gesetzt{ animation:liqOtpSetz .3s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)); } @keyframes liqOtpSetz{ 0%{ transform:scale(1) } 45%{ transform:scale(1.14) } 100%{ transform:scale(1) } } .liq-otp.is-ok .liq-otp__c{ animation:liqOtpWelle .5s var(--ease-soft,ease) both; } .liq-otp.is-ok .liq-otp__c:nth-child(2){ animation-delay:.06s } .liq-otp.is-ok .liq-otp__c:nth-child(3){ animation-delay:.12s } .liq-otp.is-ok .liq-otp__c:nth-child(4){ animation-delay:.18s } @keyframes liqOtpWelle{ 0%{ transform:translateY(0) } 40%{ transform:translateY(-5px) } 100%{ transform:translateY(0) } } .liq-otp--anzeige .liq-otp__c{ animation:liqOtpAtmen 1.6s var(--ease-soft,ease) 1; } @keyframes liqOtpAtmen{ 0%{ box-shadow:0 0 0 0 color-mix(in srgb,var(--accent,#4f8ef7) 40%,transparent) } 60%{ box-shadow:0 0 0 8px color-mix(in srgb,var(--accent,#4f8ef7) 0%,transparent) } 100%{ box-shadow:0 0 0 0 color-mix(in srgb,var(--accent,#4f8ef7) 0%,transparent) } } @media (prefers-reduced-motion: reduce){ .liq-otp__c, .liq-otp.is-ok .liq-otp__c, .liq-otp--anzeige .liq-otp__c{ animation:none !important; transition:none !important; } } @media (prefers-reduced-motion:reduce){ .liq-otp.is-error{ animation:none; } .liq-otp__c{ transition:none; } } .liq-heatmap{ overflow-x:auto; overscroll-behavior-x:contain; padding-bottom:4px; border-radius:14px; } .liq-heatmap__grid{ display:grid; gap:3px; min-width:330px; } .liq-heatmap__col{ font-size:var(--text-11); color:var(--ink-soft,#c2cad8); text-align:center; padding-bottom:4px; font-weight:600; } .liq-heatmap__row{ font-size:var(--text-10); color:var(--muted,#8892a4); display:flex; align-items:center; justify-content:flex-end; padding-right:9px; white-space:nowrap; font-variant-numeric:tabular-nums; } .liq-heatmap__c{ height:34px; border-radius:6px; cursor:pointer; position:relative; outline:2px solid transparent; outline-offset:1px; transition:transform .1s, outline-color .12s; } .liq-heatmap__c:hover{ transform:scale(1.14); z-index:2; } .liq-heatmap__c.is-sel{ outline-color:#fff; z-index:3; } .liq-heatmap__c.is-dim{ opacity:.22; } .liq-heatmap__c.is-mark{ outline-color:var(--success,#3ecf8e); } .liq-heatmap__c.is-zu{ cursor:default; background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 3px,transparent 3px 6px) !important; } .liq-heatmap__c.is-zu:hover{ transform:none; } .liq-heatmap__scale{ display:flex; align-items:center; gap:9px; margin-top:14px; font-size:var(--text-11); color:var(--muted,#8892a4); flex-wrap:wrap; } .liq-heatmap__bar{ display:flex; height:10px; border-radius:999px; overflow:hidden; width:190px; } .liq-heatmap__bar i{ flex:1; } .liq-stagetime{ display:block; } .liq-stagetime__band{ display:flex; height:46px; border-radius:10px; overflow:hidden; } .liq-stagetime__seg{ position:relative; cursor:pointer; display:flex; align-items:center; justify-content:center; border-right:2px solid var(--bg,#0f1117); transition:filter .15s; min-width:26px; } .liq-stagetime__seg:last-child{ border-right:0; } .liq-stagetime__seg:hover{ filter:brightness(1.25); } .liq-stagetime__seg.is-sel{ outline:2px solid #fff; outline-offset:-2px; z-index:2; } .liq-stagetime__seg.is-eng::after{ content:''; position:absolute; inset:0; border:2px solid var(--danger,#e0736f); border-radius:4px; } .liq-stagetime__seg.is-unmeasured{ border-right:2px dashed rgba(255,255,255,.45); } .liq-stagetime__v{ font-size:var(--text-12); font-weight:750; color:#fff; font-variant-numeric:tabular-nums; text-shadow:0 1px 3px rgba(4,6,12,.5); } .liq-stagetime__labels{ display:flex; margin-top:8px; } .liq-stagetime__lbl{ text-align:center; font-size:var(--text-11); color:var(--muted,#8892a4); line-height:1.3; padding:0 3px; min-width:0; overflow:hidden; } .liq-stagetime__lbl b{ display:block; color:var(--ink-soft,#c2cad8); font-size:var(--text-11); font-weight:650; } @media(max-width:560px){ .liq-stagetime__labels{ flex-direction:column; gap:2px; margin-top:10px; } .liq-stagetime__lbl{ width:auto !important; display:flex; align-items:baseline; gap:8px; text-align:left; padding:3px 0; border-bottom:1px solid var(--hair,rgba(255,255,255,.05)); } .liq-stagetime__lbl b{ display:inline; flex:1; } } @media (prefers-reduced-motion:reduce){ .liq-stagetime__seg{ transition:none; } } .liq-movers{ display:block; } .liq-movers__grp{ font-size:var(--text-11); font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--muted,#8892a4); margin:22px 0 8px; } .liq-movers__grp span{ font-weight:500; text-transform:none; letter-spacing:0; color:var(--subtle,#5a6377); margin-left:8px; } .liq-movers__row{ display:grid; grid-template-columns:minmax(0,1fr) 132px 96px; gap:12px; align-items:center; cursor:pointer; padding:11px 6px; border-bottom:1px solid var(--hair,rgba(255,255,255,.06)); border-radius:6px; } .liq-movers__row:last-child{ border-bottom:0; } .liq-movers__row:hover{ background:color-mix(in srgb,var(--text,#fff) 3%,transparent); } .liq-movers__row.is-sel{ background:color-mix(in srgb,var(--accent,#4f8ef7) 10%,transparent); } .liq-movers__lead{ display:flex; align-items:center; gap:11px; min-width:0; } .liq-movers__chk{ width:17px; height:17px; border-radius:6px; flex:none; cursor:pointer; position:relative; border:1.6px solid var(--hair,rgba(255,255,255,.3)); } .liq-movers__chk.is-on{ background:var(--accent,#4f8ef7); border-color:var(--accent,#4f8ef7); } .liq-movers__chk.is-on::after{ content:''; position:absolute; left:4.5px; top:1px; width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); } .liq-movers__n{ font-size:var(--text-13); font-weight:600; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .liq-movers__n small{ display:block; color:var(--muted,#8892a4); font-weight:400; font-size:var(--text-11); } .liq-movers__badge{ display:inline-flex; align-items:center; gap:5px; font-size:var(--text-10); font-weight:700; padding:2px 7px; border-radius:999px; margin-left:7px; color:#cfe0ff; background:color-mix(in srgb,var(--accent,#4f8ef7) 20%,transparent); } .liq-movers__spark{ height:26px; } .liq-movers__spark svg{ width:100%; height:100%; display:block; overflow:visible; } .liq-movers__d{ text-align:right; font-size:var(--text-14); font-weight:750; font-variant-numeric:tabular-nums; } .liq-movers__d small{ display:block; font-weight:500; font-size:var(--text-10); color:var(--muted,#8892a4); } .liq-movers__d.is-up{ color:var(--success,#3ecf8e); } .liq-movers__d.is-down{ color:var(--danger,#e0736f); } .liq-movers__d.is-still{ color:#f0c9a0; } .liq-movers__leer{ color:var(--muted,#8892a4); font-size:var(--text-12); padding:8px 6px; } .liq-movers__selbar{ display:none; align-items:center; gap:12px; padding:11px 14px; border-radius:10px; margin:12px 0; font-size:var(--text-13); background:color-mix(in srgb,var(--accent,#4f8ef7) 14%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 26%,transparent); } .liq-movers__selbar.is-on{ display:flex; } .liq-movers__selbar b{ color:#dbe7fb; } .liq-movers__selbar .liq-movers__sp{ flex:1; } @media(max-width:560px){ .liq-movers__row{ grid-template-columns:minmax(0,1fr) 80px; } .liq-movers__spark{ display:none; } } @media (prefers-reduced-motion:reduce){ .liq-heatmap__c{ transition:none; } .liq-heatmap__c:hover{ transform:none; } } .liq-nurvorleser, .liq-vh{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; } .liq-donutwrap{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; } .liq-donut-fig{ position:relative; flex:0 0 auto; display:inline-flex; } .liq-donut{ --liq-donut-size:120px; --liq-donut-hole:58%; position:relative; flex:0 0 auto; width:var(--liq-donut-size); height:var(--liq-donut-size); border-radius:50%; background:conic-gradient(from -90deg, var(--liq-donut-stops, #444 0)); } .liq-donut.is-donut{ -webkit-mask:radial-gradient(farthest-side, transparent var(--liq-donut-hole), #000 calc(var(--liq-donut-hole) + .5%)); mask:radial-gradient(farthest-side, transparent var(--liq-donut-hole), #000 calc(var(--liq-donut-hole) + .5%)); } .liq-donut-center{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; pointer-events:none; } .liq-donut-center b{ font-size:21px; font-weight:700; font-variant-numeric:tabular-nums; line-height:1; font-family:ui-sans-serif,-apple-system,'Helvetica Neue','Segoe UI',Roboto,Arial,sans-serif; } .liq-donut-center span{ font-size:var(--text-11); color:var(--subtle,#9aa3b2); margin-top:3px; } .liq-donut-legend{ display:flex; flex-direction:column; gap:7px; font-size:var(--text-13); } .liq-donut-legend i{ display:inline-block; width:10px; height:10px; border-radius:4px; margin-right:8px; vertical-align:-1px; box-shadow:0 0 7px -1px var(--lg-dot,transparent); } .liq-donut-legend .v{ color:var(--subtle,#9aa3b2); margin-left:6px; font-variant-numeric:tabular-nums; } @media (prefers-reduced-transparency:reduce){ .liq-donut-legend i{ box-shadow:none; } } .liq-trace{ display:block; overflow:visible; max-width:100%; height:auto; margin-inline:auto; } .liq-trace-path{ fill:none; stroke:rgba(var(--acc-1, 79 142 247) / .35); stroke-width:1.5; } .liq-trace-flow{ fill:none; stroke:rgb(var(--acc-1, 79 142 247)); stroke-width:1.6; stroke-dasharray:5 9; stroke-linecap:round; opacity:.9; } .liq-trace-dot{ fill:#fff; filter:drop-shadow(0 0 6px rgb(var(--acc-1, 79 142 247))); } .liq-trace-head{ filter:drop-shadow(0 0 9px rgb(var(--acc-1, 79 142 247))) drop-shadow(0 0 3px #fff); } .liq-trace-node{ fill:var(--surface,#1d1d1d); stroke:rgba(var(--acc-1, 79 142 247) / .7); stroke-width:1.5; } .liq-trace-node.is-live{ stroke:rgb(var(--acc-1, 79 142 247)); filter:drop-shadow(0 0 5px rgba(var(--acc-1, 79 142 247) / .8)); } .liq-trace-pulse{ fill:none; stroke:rgb(var(--acc-1, 79 142 247)); stroke-width:1.5; opacity:0; } @media (prefers-reduced-motion:reduce){ .liq-trace-flow{ animation:none; } .liq-trace-pulse{ display:none; } } @media (prefers-reduced-transparency:reduce){ .liq-trace-dot,.liq-trace-head{ filter:none; } .liq-trace-node.is-live{ filter:none; } } .liq-chart{ width:100%; border-collapse:collapse; font-size:var(--text-13); } .liq-chart caption{ text-align:left; font-size:var(--text-12); color:var(--subtle,#9aa3b2); padding-bottom:8px; letter-spacing:.02em; } .liq-chart th[scope="row"]{ text-align:left; font-weight:500; white-space:nowrap; padding:4px 14px 4px 0; color:var(--ink,#e8ecf3); } .liq-chart td.liq-chart-bar{ width:100%; padding:4px 0; } .liq-chart td.liq-chart-bar > span{ display:block; position:relative; height:18px; border-radius:6px; background:rgba(255,255,255,.05); overflow:hidden; } .liq-chart td.liq-chart-bar > span::before{ content:""; position:absolute; inset:0 auto 0 0; width:calc(var(--val,0) * 100%); border-radius:6px; background:linear-gradient(90deg, rgba(var(--bar-rgb, var(--acc-1, 79 142 247)) / .55), rgb(var(--bar-rgb, var(--acc-1, 79 142 247)))); box-shadow:0 0 10px -2px rgb(var(--bar-rgb, var(--acc-1, 79 142 247))); transition:width .6s cubic-bezier(.22,1,.36,1); } .liq-chart td.liq-chart-val{ text-align:right; white-space:nowrap; padding:4px 0 4px 12px; color:var(--ink,#e8ecf3); font-variant-numeric:tabular-nums; font-weight:600; } .liq-chart tr.is-hot td.liq-chart-bar > span::before{ --bar-rgb:var(--warn-rgb, 248 113 113); } @media (prefers-reduced-motion:reduce){ .liq-chart td.liq-chart-bar > span::before{ transition:none; } } @media (prefers-reduced-transparency:reduce){ .liq-chart td.liq-chart-bar > span::before{ box-shadow:none; } } .liq-pal-scrim{ position:fixed; inset:0; z-index:2147483600; display:flex; align-items:flex-start; justify-content:center; padding-top:14vh; background:rgba(8,10,16,.5); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; transition:opacity .16s ease; } .liq-pal-scrim.is-open{ opacity:1; } .liq-pal{ width:min(560px, 92vw); max-height:62vh; display:flex; flex-direction:column; overflow:hidden; border-radius:14px; background:var(--glass-bg, rgba(26,29,39,.82)); backdrop-filter:blur(22px) saturate(1.3); -webkit-backdrop-filter:blur(22px) saturate(1.3); border:1px solid rgba(255,255,255,.1); box-shadow:0 24px 70px -24px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.08); transform:translateY(-8px) scale(.985); transition:transform .18s cubic-bezier(.22,1,.36,1); } .liq-pal-scrim.is-open .liq-pal{ transform:none; } .liq-pal-in{ display:flex; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid rgba(255,255,255,.07); } .liq-pal-in svg{ flex:0 0 auto; opacity:.6; } .liq-pal-in input{ flex:1; background:transparent; border:0; outline:0; color:var(--ink,#e8ecf3); font-size:var(--text-14); } .liq-pal-in input::placeholder{ color:var(--subtle,#9aa3b2); } .liq-pal-list{ overflow-y:auto; overscroll-behavior:contain; height:var(--liq-pal-h, auto); max-height:46vh; transition:height .2s cubic-bezier(.22,1,.36,1); padding:6px; } .liq-pal-grp{ font-size:var(--text-10); text-transform:uppercase; letter-spacing:.07em; color:var(--subtle,#9aa3b2); padding:9px 12px 4px; } .liq-pal-item{ display:flex; align-items:center; gap:11px; padding:9px 12px; border-radius:10px; cursor:pointer; color:var(--ink,#e8ecf3); } .liq-pal-item[aria-selected="true"]{ background:rgba(var(--acc-1, 79 142 247) / .16); box-shadow:inset 0 0 0 1px rgba(var(--acc-1, 79 142 247) / .3); } .liq-pal-item .liq-pal-hint{ margin-left:auto; font-size:var(--text-11); color:var(--subtle,#9aa3b2); } .liq-pal-empty{ padding:26px 12px; text-align:center; color:var(--subtle,#9aa3b2); font-size:var(--text-13); } @media (prefers-reduced-motion:reduce){ .liq-pal-scrim,.liq-pal,.liq-pal-list{ transition:none; } } @media (prefers-reduced-transparency:reduce){ .liq-pal-scrim{ backdrop-filter:none; background:rgba(8,10,16,.82); } .liq-pal{ backdrop-filter:none; background:var(--surface,#1d1d1d); } } .liq-decode{ font-variant-numeric:tabular-nums; } .liq-borderbeam{ position:relative; } .liq-borderbeam::after{ content:""; position:absolute; left:0; top:0; width:var(--beam-len,54px); height:var(--beam-w,3px); border-radius:999px; background:linear-gradient(90deg, transparent, rgb(var(--acc-1,79 142 247)) 50%, transparent); offset-path:inset(0 round var(--beam-radius,16px)); offset-distance:0%; offset-rotate:auto; filter:drop-shadow(0 0 6px rgb(var(--acc-1,79 142 247))); animation:liq-beam-move var(--beam-dur,3s) linear infinite; pointer-events:none; } @keyframes liq-beam-move{ to{ offset-distance:100%; } } .liq-float{ position:relative; } .liq-float > input, .liq-float > textarea{ width:100%; padding:19px 14px 7px; background:rgba(255,255,255,.04); border:1px solid var(--border, rgba(255,255,255,.12)); border-radius:10px; color:var(--ink,#e8ecf3); font-size:var(--text-14); outline:none; transition:border-color .18s; } .liq-float > label{ position:absolute; left:14px; top:15px; color:var(--subtle,#9aa3b2); font-size:var(--text-14); pointer-events:none; transition:top .18s, font-size .18s, color .18s; } .liq-float > input:focus, .liq-float > textarea:focus{ border-color:var(--accent,#4f8ef7); } .liq-float > input:focus + label, .liq-float > input:not(:placeholder-shown) + label, .liq-float > textarea:focus + label, .liq-float > textarea:not(:placeholder-shown) + label{ top:6px; font-size:var(--text-11); color:var(--accent,#4f8ef7); } .liq-eprogress{ height:var(--ep-h,11px); border-radius:999px; background:rgba(255,255,255,.06); overflow:hidden; } .liq-eprogress > i{ display:block; height:100%; width:0; border-radius:999px; background:linear-gradient(90deg, rgba(var(--acc-1,79 142 247) / .55), rgb(var(--acc-1,79 142 247))); box-shadow:0 0 10px -2px rgb(var(--acc-1,79 142 247)); transition:width .9s cubic-bezier(.34,1.56,.64,1); } .liq-eq{ display:inline-flex; align-items:flex-end; gap:var(--eq-gap,5px); height:var(--eq-h,46px); } .liq-eq > i{ width:var(--eq-w,6px); border-radius:4px; background:linear-gradient(180deg, rgb(var(--acc-1,79 142 247)), rgba(var(--acc-1,79 142 247) / .5)); box-shadow:0 0 8px -2px rgb(var(--acc-1,79 142 247)); animation:liq-eq-b 1.1s ease-in-out infinite; } @keyframes liq-eq-b{ 0%,100%{ height:22%; } 50%{ height:100%; } } @media (prefers-reduced-motion:reduce){ .liq-borderbeam::after{ animation:none; opacity:0; } .liq-eprogress > i{ transition:none; } .liq-eq > i{ animation:none; height:55%; } } @media (prefers-reduced-transparency:reduce){ .liq-borderbeam::after,.liq-eq > i,.liq-eprogress > i{ box-shadow:none; filter:none; } } .liq-prompthero{ width:100%; max-width:640px; margin-inline:auto; } .liq-ph-kicker{ font-size:var(--text-12); letter-spacing:.14em; text-transform:uppercase; color:var(--subtle,#9aa3b2); text-align:center; margin-bottom:10px; } .liq-ph-title{ font-size:clamp(24px,5vw,36px); font-weight:750; letter-spacing:-.02em; text-align:center; margin:0 0 22px; line-height:1.12; color:var(--ink,#e8ecf3); } .liq-ph-g{ background:linear-gradient(96deg, color-mix(in srgb, var(--accent,#4f8ef7) 55%, #fff), var(--accent,#4f8ef7)); -webkit-background-clip:text; background-clip:text; color:transparent; } .liq-ph-chips{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-bottom:14px; } .liq-ph-chip{ display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px; cursor:pointer; font-size:var(--text-13); color:var(--ink,#e8ecf3); background:rgba(255,255,255,.04); border:1px solid var(--border,rgba(255,255,255,.10)); transition:background .16s, border-color .16s, transform .12s; } .liq-ph-chip:hover{ background:rgba(var(--acc-1,79 142 247) / .12); border-color:rgba(var(--acc-1,79 142 247) / .4); } .liq-ph-chip:active{ transform:scale(.97); } .liq-ph-chip.is-active{ background:rgba(var(--acc-1,79 142 247) / .16); border-color:rgba(var(--acc-1,79 142 247) / .5); color:#fff; } .liq-ph-chip svg{ width:14px; height:14px; opacity:.85; flex:0 0 auto; } .liq-ph-box{ position:relative; border-radius:20px; border:1px solid var(--border,rgba(255,255,255,.10)); background:var(--glass-bg,rgba(26,29,39,.7)); backdrop-filter:blur(20px) saturate(1.25); -webkit-backdrop-filter:blur(20px) saturate(1.25); box-shadow:0 20px 60px -28px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06); transition:border-color .18s, box-shadow .18s; padding:16px 16px 14px; } .liq-ph-box:focus-within{ border-color:rgba(var(--acc-1,79 142 247) / .55); box-shadow:0 20px 60px -24px rgba(0,0,0,.7), 0 0 0 3px rgba(var(--acc-1,79 142 247) / .14), inset 0 1px 0 rgba(255,255,255,.08); } .liq-ph-input{ width:100%; min-height:62px; max-height:200px; resize:none; border:0; outline:0; background:transparent; color:var(--ink,#e8ecf3); font:inherit; font-size:var(--text-14); line-height:1.5; } .liq-ph-input::placeholder{ color:var(--muted,#6b7588); } .liq-ph-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; } .liq-ph-hint{ font-size:var(--text-11); color:var(--muted,#6b7588); } .liq-ph-send{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 16px 9px 18px; border-radius:10px; border:0; cursor:pointer; font-size:var(--text-13); font-weight:600; color:#06121f; background:linear-gradient(180deg, color-mix(in srgb, var(--accent,#4f8ef7) 78%, #fff), var(--accent,#4f8ef7)); box-shadow:0 6px 18px -8px rgba(var(--acc-1,79 142 247) / .9); transition:transform .12s, box-shadow .16s; } .liq-ph-send:hover{ box-shadow:0 9px 24px -8px rgba(var(--acc-1,79 142 247) / 1); } .liq-ph-send:active{ transform:translateY(1px) scale(.99); } .liq-ph-send svg{ width:16px; height:16px; } @media (prefers-reduced-motion:reduce){ .liq-ph-chip,.liq-ph-box,.liq-ph-send{ transition:none; } } @media (prefers-reduced-transparency:reduce){ .liq-ph-box{ backdrop-filter:none; background:var(--surface,#1d1d1d); } } .liq-reveal{ opacity:0; transform:translateY(var(--liq-reveal-dy,26px)); transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1); } .liq-reveal.in{ opacity:1; transform:none; } .liq-reveal[data-d="1"]{ transition-delay:.08s } .liq-reveal[data-d="2"]{ transition-delay:.16s } .liq-reveal[data-d="3"]{ transition-delay:.24s } .liq-reveal[data-d="4"]{ transition-delay:.32s } .liq-reveal[data-d="5"]{ transition-delay:.40s } .liq-reveal[data-d="6"]{ transition-delay:.48s } @media (prefers-reduced-motion:reduce){ .liq-reveal{ opacity:1; transform:none; transition:none; } } .liq-section-intro{ max-width:920px; margin-inline:auto; text-align:center; } .liq-abschnittskopf-ueberzeile, .liq-si-kicker{ font-size:var(--text-12); letter-spacing:.16em; text-transform:uppercase; color:var(--subtle,#9aa3b2); margin-bottom:16px; } .liq-abschnittskopf-titel, .liq-si-title{ font-size:clamp(30px,8vw,62px); font-weight:760; letter-spacing:-.03em; line-height:1.04; margin:0 0 18px; text-wrap:balance; color:var(--ink,#e8ecf3); } .liq-abschnittskopf-verlauf, .liq-si-g{ background:linear-gradient(96deg, color-mix(in srgb, var(--accent,#4f8ef7) 55%, #fff), var(--accent,#4f8ef7)); -webkit-background-clip:text; background-clip:text; color:transparent; } .liq-abschnittskopf-unterzeile, .liq-si-sub{ font-size:clamp(15px,2.4vw,19px); color:var(--subtle,#9aa3b2); max-width:560px; margin-inline:auto; line-height:1.55; } .liq-wdock{ display:flex; gap:14px; align-items:stretch; overflow-x:auto; overscroll-behavior-x:contain; background:linear-gradient(165deg,rgba(255,255,255,.05),rgba(255,255,255,.015)); border:1px solid var(--hair,rgba(255,255,255,.06)); border-radius:20px; padding:16px; box-shadow:0 30px 70px -30px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.05); backdrop-filter:blur(26px) saturate(1.4); -webkit-backdrop-filter:blur(26px) saturate(1.4); } .liq-wtile{ flex:0 0 auto; min-width:140px; position:relative; overflow:hidden; border-radius:20px; background:var(--liq-wtile-bg,linear-gradient(165deg,rgba(20,22,27,.9),rgba(12,13,16,.92))); border:1px solid var(--hair,rgba(255,255,255,.06)); padding:15px 16px; box-shadow:inset 0 1px 0 rgba(255,255,255,.04); } .liq-wtile::before{ content:""; position:absolute; inset:0 0 60% 0; pointer-events:none; background:linear-gradient(180deg,rgba(255,255,255,.05),transparent); } .liq-wtile-t{ font-size:var(--text-11); letter-spacing:.05em; text-transform:uppercase; color:var(--subtle,#7b848c); font-weight:600; } @property --liq-ring-p{ syntax:''; inherits:true; initial-value:0; } .liq-ring{ position:relative; width:var(--liq-ring-size,96px); height:var(--liq-ring-size,96px); display:grid; place-items:center; } .liq-ring i{ position:absolute; inset:0; border-radius:50%; background:conic-gradient(var(--liq-ring-c,var(--accent,#4f8ef7)) calc(var(--liq-ring-p,0)*1%), rgba(255,255,255,.07) 0); -webkit-mask:radial-gradient(farthest-side,transparent 60%,#000 61%); mask:radial-gradient(farthest-side,transparent 60%,#000 61%); transition:--liq-ring-p .9s var(--ease-spring,cubic-bezier(.22,.61,.36,1)); } .liq-ring b{ position:relative; font-size:calc(var(--liq-ring-size,96px)*.23); font-weight:740; font-variant-numeric:tabular-nums; color:var(--ink,#eef1f4); } .liq-miniplayer{ display:flex; gap:12px; align-items:center; min-width:236px; } .liq-mp-cover{ width:52px; height:52px; border-radius:10px; flex:0 0 auto; position:relative; overflow:hidden; background-size:cover; background-position:center; background-image:var(--accent-gradient,linear-gradient(135deg,#4f8ef7,#34d399)); } .liq-mp-cover::after{ content:""; position:absolute; inset:0; background:radial-gradient(120% 80% at 20% 10%,rgba(255,255,255,.5),transparent 50%); } .liq-mp-meta{ min-width:0; flex:1; } .liq-mp-tt{ font-size:var(--text-13); font-weight:650; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink,#eef1f4); } .liq-mp-ar{ font-size:var(--text-12); color:var(--subtle,#7b848c); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .liq-mp-bar{ height:4px; border-radius:4px; background:rgba(255,255,255,.1); margin-top:8px; overflow:hidden; } .liq-mp-bar i{ display:block; height:100%; width:0; border-radius:4px; background:var(--accent,#4f8ef7); transition:width .3s var(--ease-spring,cubic-bezier(.22,.61,.36,1)); } .liq-mp-ctrls{ display:flex; gap:6px; flex:0 0 auto; } .liq-mp-ctrls button{ appearance:none; border:1px solid var(--hair,rgba(255,255,255,.06)); background:rgba(255,255,255,.04); color:var(--ink,#eef1f4); width:30px; height:30px; border-radius:50%; display:grid; place-items:center; cursor:pointer; } .liq-mp-ctrls button.is-play{ background:var(--accent,#4f8ef7); border-color:transparent; } .liq-mp-ctrls svg{ width:14px; height:14px; } @media (prefers-reduced-transparency:reduce){ .liq-wdock{ backdrop-filter:none; -webkit-backdrop-filter:none; background:#15171b; } } @media (prefers-reduced-motion:reduce){ .liq-ring i{ transition:none; } .liq-mp-bar i{ transition:none; } } .liq-draw-dot{ fill:var(--success,#3ecf8e); filter:drop-shadow(0 0 6px color-mix(in srgb, var(--success,#3ecf8e) 80%, transparent)); } .liq-bloom-scrim{ position:fixed; inset:0; z-index:calc(var(--liq-z-toast,10000) - 1); background:rgba(6,6,12,.42); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; transition:opacity .26s var(--ease-soft,ease); } .liq-bloom-scrim.show{ opacity:1; } .liq-bloom{ position:fixed; z-index:var(--liq-z-toast,10000); min-width:220px; max-width:min(340px,calc(100vw - 24px)); border-radius:20px; padding:8px; box-sizing:border-box; background:var(--liq-toast-bg); backdrop-filter:var(--liq-toast-blur); -webkit-backdrop-filter:var(--liq-toast-blur); border:var(--liq-toast-border); box-shadow:var(--liq-toast-shadow,0 24px 70px rgba(0,0,0,.5)); color:var(--ink,#e2e8f0); opacity:0; transform:scale(.6) translateY(6px); transform-origin:top left; transition:opacity .2s ease, transform .38s var(--liq-spring,cubic-bezier(.22,1.4,.36,1)); } .liq-bloom.show{ opacity:1; transform:scale(1) translateY(0); } .liq-bloom-h{ font-size:var(--text-11); letter-spacing:.08em; text-transform:uppercase; color:var(--muted,#8892a4); padding:8px 12px 4px; } .liq-bloom-body{ padding:6px 8px; } .liq-bloom-sep{ height:1px; background:var(--border,rgba(255,255,255,.08)); margin:6px 8px; } .liq-bloom-item{ display:flex; align-items:center; gap:12px; width:100%; padding:11px 12px; border:0; border-radius:14px; background:transparent; color:var(--ink-soft,#c2cad8); font:inherit; font-size:var(--text-14); text-align:left; text-decoration:none; cursor:pointer; -webkit-tap-highlight-color:transparent; opacity:0; transform:translateY(8px); transition:background .16s ease, color .16s ease; } .liq-bloom.show .liq-bloom-item{ opacity:1; transform:none; transition:background .16s ease, color .16s ease, opacity .3s var(--liq-spring,cubic-bezier(.22,1.4,.36,1)) var(--d,0ms), transform .3s var(--liq-spring,cubic-bezier(.22,1.4,.36,1)) var(--d,0ms); } .liq-bloom-item:hover,.liq-bloom-item:focus-visible{ background:rgba(255,255,255,.07); color:var(--ink,#e2e8f0); outline:none; } .liq-bloom-item:focus-visible{ box-shadow:0 0 0 2px var(--accent-soft,rgba(79,142,247,.4)) inset; } .liq-bloom-item.is-danger{ color:var(--danger,#e55353); } .liq-bloom-item.is-danger:hover,.liq-bloom-item.is-danger:focus-visible{ background:rgba(229,83,83,.12); color:var(--danger,#e55353); } .liq-bloom-ic{ flex:0 0 auto; width:26px; height:26px; display:grid; place-items:center; border-radius:6px; background:rgba(255,255,255,.06); color:var(--accent,#4f8ef7); } .liq-bloom-ic svg{ width:15px; height:15px; } .liq-bloom-tx{ flex:1 1 auto; min-width:0; } @media (prefers-reduced-motion:reduce){ .liq-bloom{ transition:opacity .01ms; transform:none; } .liq-bloom.show .liq-bloom-item{ transition:background .16s ease,color .16s ease; } .liq-bloom-item{ opacity:1; transform:none; } } :root{ --spring-snappy:cubic-bezier(.22,1.12,.3,1); --spring-snappy-ms:340ms; --spring-gentle:cubic-bezier(.2,.7,.2,1); --spring-gentle-ms:520ms; --spring-bouncy:cubic-bezier(.16,1.36,.3,1); --spring-bouncy-ms:620ms; --spring-stiff:cubic-bezier(.3,.9,.25,1); --spring-stiff-ms:220ms; --spring-molasses:cubic-bezier(.4,.5,.2,1); --spring-molasses-ms:900ms; } .liq-spring-snappy{ transition-timing-function:var(--spring-snappy); transition-duration:var(--spring-snappy-ms); } .liq-spring-gentle{ transition-timing-function:var(--spring-gentle); transition-duration:var(--spring-gentle-ms); } .liq-spring-bouncy{ transition-timing-function:var(--spring-bouncy); transition-duration:var(--spring-bouncy-ms); } .liq-spring-stiff{ transition-timing-function:var(--spring-stiff); transition-duration:var(--spring-stiff-ms); } .liq-spring-molasses{ transition-timing-function:var(--spring-molasses); transition-duration:var(--spring-molasses-ms); } .liq-spring-check{ transition:transform var(--spring-bouncy-ms) var(--spring-bouncy), background-color var(--spring-snappy-ms) var(--spring-snappy); } .liq-spring-check[data-on="true"]{ transform:scale(1.04); } @media (prefers-reduced-motion: reduce){ [class^="liq-spring-"],[class*=" liq-spring-"]{ transition-duration:.01ms !important; } } .uplot{ font-family:var(--liq-font, 'Onest', system-ui, sans-serif); } .u-title{ font-size:var(--text-13); font-weight:600; color:var(--text,#e8ecf4); } .u-legend{ font-size:var(--text-12); color:var(--text-dim,#9aa4b8); } .u-legend .u-marker{ border-radius:4px; } .u-legend th{ font-weight:600; } .u-legend .u-value{ color:var(--text,#e8ecf4); font-variant-numeric:tabular-nums; } .u-select{ background:color-mix(in srgb, var(--accent,#4f8ef7) 16%, transparent); } .u-cursor-x, .u-cursor-y{ border-right:1px dashed rgba(154,164,184,.5); } .u-over:focus-visible, .uplot:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--accent,#4f8ef7); border-radius:8px; } @media (prefers-reduced-transparency: reduce){ .u-legend{ background:var(--surface,#12141c); } } .liq-micro{ position:relative; } .liq-micro-sparkle, .liq-micro-slideArrow{ overflow:visible; } .liq-micro:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--bg,#0f1117), 0 0 0 4px var(--accent,#4f8ef7); } .liq-micro-slideArrow svg:last-of-type, .liq-micro-slideArrow .liq-micro-lbl{ transition:transform var(--spring-snappy-ms,340ms) var(--spring-snappy,cubic-bezier(.22,1.12,.3,1)); } .liq-micro-slideArrow:hover svg:last-of-type, .liq-micro-slideArrow:focus-visible svg:last-of-type{ transform:translateX(5px); } .liq-micro-slideArrow:hover .liq-micro-lbl, .liq-micro-slideArrow:focus-visible .liq-micro-lbl{ transform:translateX(-3px); } .liq-micro-spark{ position:absolute; left:50%; top:50%; width:var(--ms,12px); height:var(--ms,12px); margin:calc(var(--ms,12px) / -2) 0 0 calc(var(--ms,12px) / -2); pointer-events:none; filter:drop-shadow(0 0 5px color-mix(in srgb, var(--accent,#4f8ef7) 70%, transparent)); animation:liqMicroSpark .72s cubic-bezier(.2,.7,.2,1) forwards; } .liq-micro-spark svg{ width:100%; height:100%; fill:var(--accent,#4f8ef7); stroke:none; } @keyframes liqMicroSpark{ 0%{ opacity:1; transform:translate(0,0) scale(1.15) rotate(0); } 70%{ opacity:1; } 100%{ opacity:0; transform:translate(var(--mx,0),var(--my,0)) scale(0) rotate(var(--mr,180deg)); } } .liq-micro-pop{ animation:liqMicroPop .38s ease; } @keyframes liqMicroPop{ 35%{ transform:scale(1.07); } 100%{ transform:scale(1); } } .liq-micro-ic{ position:relative; display:inline-block; width:17px; height:17px; } .liq-micro-a, .liq-micro-b{ position:absolute; inset:0; transition:opacity .25s, transform .25s var(--spring-bouncy,cubic-bezier(.16,1.36,.3,1)); } .liq-micro-a svg, .liq-micro-b svg{ width:17px; height:17px; } .liq-micro-b{ opacity:0; transform:scale(.6) rotate(-30deg); } .liq-micro-iconMorph[aria-pressed="true"] .liq-micro-a{ opacity:0; transform:scale(.6) rotate(30deg); } .liq-micro-iconMorph[aria-pressed="true"] .liq-micro-b{ opacity:1; transform:none; color:var(--accent,#4f8ef7); } .liq-micro-iconMorph[aria-pressed="true"] .liq-micro-b svg{ stroke:var(--accent,#4f8ef7); } .liq-micro-colorMorph svg{ transition:fill .3s, stroke .3s, transform .3s var(--spring-bouncy,cubic-bezier(.16,1.36,.3,1)); } .liq-micro-colorMorph[aria-pressed="true"]{ border-color:var(--accent,#4f8ef7); color:var(--accent,#4f8ef7); } .liq-micro-colorMorph[aria-pressed="true"] svg{ fill:var(--accent,#4f8ef7); stroke:var(--accent,#4f8ef7); transform:scale(1.12); } .liq-micro-pulse::after{ content:""; position:absolute; inset:0; border-radius:inherit; border:1px solid var(--accent,#4f8ef7); opacity:0; pointer-events:none; animation:liqMicroPulse 2s ease-out infinite; } @keyframes liqMicroPulse{ 0%{ opacity:.5; transform:scale(1); } 100%{ opacity:0; transform:scale(1.35); } } .liq-micro-rotate svg{ transition:transform .5s var(--spring-snappy,cubic-bezier(.22,1.12,.3,1)); } .liq-micro-rotate:hover svg, .liq-micro-rotate:focus-visible svg{ transform:rotate(90deg); } .liq-micro-shake:hover, .liq-micro-shake:focus-visible{ animation:liqMicroShake .42s ease; } @keyframes liqMicroShake{ 10%,90%{ transform:translateX(-1px); } 20%,80%{ transform:translateX(2px); } 30%,50%,70%{ transform:translateX(-4px); } 40%,60%{ transform:translateX(4px); } } .liq-micro-ring:hover svg, .liq-micro-ring:focus-visible svg{ animation:liqMicroRing .6s ease; transform-origin:top center; } @keyframes liqMicroRing{ 0%,100%{ transform:rotate(0); } 20%{ transform:rotate(14deg); } 40%{ transform:rotate(-12deg); } 60%{ transform:rotate(8deg); } 80%{ transform:rotate(-5deg); } } .liq-micro-badge{ position:absolute; top:6px; right:10px; width:8px; height:8px; border-radius:50%; background:var(--accent,#4f8ef7); box-shadow:0 0 0 2px var(--surface,#12141c); } @media (prefers-reduced-motion: reduce){ .liq-micro-slideArrow svg:last-of-type, .liq-micro-slideArrow .liq-micro-lbl, .liq-micro-rotate svg, .liq-micro-colorMorph svg, .liq-micro-a, .liq-micro-b{ transition:none !important; } .liq-micro-pulse::after, .liq-micro-shake:hover, .liq-micro-shake:focus-visible, .liq-micro-ring:hover svg, .liq-micro-ring:focus-visible svg, .liq-micro-spark, .liq-micro-pop{ animation:none !important; } } .liq-odo{ display:inline-flex; align-items:center; font-variant-numeric:tabular-nums; font-weight:600; line-height:1; --liq-odo-h:40px; --liq-odo-fs:34px; } .liq-odo-col{ position:relative; display:inline-block; overflow:hidden; height:var(--liq-odo-h,40px); -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 78%,transparent 100%); mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 78%,transparent 100%); } .liq-odo-strip{ display:flex; flex-direction:column; transition:transform .62s cubic-bezier(.2,.85,.15,1); } .liq-odo-strip > span{ height:var(--liq-odo-h,40px); display:flex; align-items:center; justify-content:center; font-size:var(--liq-odo-fs,34px); } .liq-odo-sep{ font-size:var(--liq-odo-fs,34px); padding:0 .02em; opacity:.9; align-self:center; } @media (prefers-reduced-motion:reduce){ .liq-odo-strip{ transition:none; } } .liq-num-sheen{ --num:var(--accent,#4f8ef7); background:linear-gradient(177deg, color-mix(in srgb,var(--num) 62%,#fff) 0%, var(--num) 46%, color-mix(in srgb,var(--num) 78%,#000) 100%); -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:0 1px 0 color-mix(in srgb,#000 22%,transparent); } .liq-num-sheen.liq-odo{ background:none; text-shadow:none; } .liq-num-sheen.liq-odo .liq-odo-strip > span, .liq-num-sheen.liq-odo .liq-odo-sep{ background:linear-gradient(177deg, color-mix(in srgb,var(--num) 62%,#fff) 0%, var(--num) 46%, color-mix(in srgb,var(--num) 78%,#000) 100%); -webkit-background-clip:text; background-clip:text; color:transparent; } @media (prefers-reduced-transparency:reduce){ .liq-num-sheen, .liq-num-sheen.liq-odo .liq-odo-strip > span, .liq-num-sheen.liq-odo .liq-odo-sep{ background:none; color:var(--num); } } .liq-skel{ position:relative; overflow:hidden; border-radius:6px; background:var(--surface2); border:1px solid var(--border); } .liq-skel + .liq-skel{ margin-top:10px; } .liq-skel::after{ content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,var(--accent-soft),transparent); animation:liqSkelSweep 1.35s ease-in-out infinite; } .liq-skel-line{ height:12px; } .liq-skel-title{ height:18px; width:52%; } .liq-skel-block{ height:64px; } @keyframes liqSkelSweep{ 100%{ transform:translateX(100%); } } .liq-auslassung{ border-radius:6px; background:color-mix(in srgb,var(--text,#e9eef6) 5%,transparent); border:1px dashed color-mix(in srgb,var(--text,#e9eef6) 12%,transparent); height:12px; } .liq-auslassung + .liq-auslassung{ margin-top:8px; } .liq-auslassung--kurz{ width:38%; } .liq-auslassung--lang{ width:82%; } .liq-auslassung--block{ height:56px; } .liq-auslassung__wort{ font-size:var(--text-11,11px); color:var(--muted,#8892a4); letter-spacing:.04em; text-transform:uppercase; } @media (prefers-reduced-transparency: reduce) { .liq-auslassung{ background:var(--surface2,#1a1d26); } } .liq-einladung{ display:flex; gap:12px; align-items:flex-start; margin:0 0 16px; padding:14px 16px; border-radius:var(--radius,10px); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 34%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 7%,transparent); } .liq-einladung__ico{ flex:none; width:20px; height:20px; margin-top:1px; fill:none; stroke:var(--accent,#4f8ef7); stroke-width:2; } .liq-einladung__body{ min-width:0; flex:1; } .liq-einladung__spaeter{ margin-top:9px; } .liq-bestaetigt{ display:flex; gap:11px; align-items:center; flex-wrap:wrap; margin:22px 0 0; padding:11px 14px; border-radius:var(--radius,10px); border:1px solid color-mix(in srgb,var(--text,#e9eef6) 10%,transparent); font-size:var(--text-13,13px); color:var(--muted,#8892a4); line-height:1.45; opacity:.86; } .liq-bestaetigt b{ color:var(--text,#e9eef6); font-weight:600; } .liq-bestaetigt__hk{ flex:none; width:17px; height:17px; fill:none; stroke:var(--success,#3fb950); stroke-width:2.2; } .liq-bestaetigt--vertagt .liq-bestaetigt__hk{ stroke:var(--muted,#8892a4); } @media (prefers-reduced-transparency: reduce) { .liq-einladung{ background:var(--surface2,#1a1d26); } } @media (prefers-reduced-motion:reduce){ .liq-skel::after{ animation:none; opacity:.35; transform:none; } } .liq-morph-panel{ transform-origin:top left; z-index:20; } .liq-morph-panel[hidden]{ display:none; } .liq-morph-panel > *{ opacity:0; transition:opacity .18s ease; } .liq-morph-panel.shown > *{ opacity:1; } .liq-bento{ display:grid; gap:12px; grid-auto-rows:minmax(84px,auto); grid-template-columns:repeat(var(--bento-spalten,4),minmax(0,1fr)); } .liq-bento-wide{ grid-column:span 2; } .liq-bento-tall{ grid-row:span 2; } .liq-bento-hero{ grid-column:span 2; grid-row:span 2; } @media (max-width:560px){ .liq-bento{ grid-template-columns:repeat(var(--bento-spalten-eng,2),minmax(0,1fr)); } .liq-bento-hero,.liq-bento-wide{ grid-column:span 2; } } @media (max-width:560px){ .liq-bento[style*="--bento-spalten-eng:1"] .liq-bento-wide, .liq-bento[style*="--bento-spalten-eng:1"] .liq-bento-hero{ grid-column:auto; } } .liq-kebab-btn{ display:inline-flex; padding:8px; border-radius:999px; cursor:pointer; color:var(--muted); background:var(--surface2); border:1px solid var(--border); } .liq-kebab-btn:hover{ border-color:var(--accent); color:var(--text); } .liq-kebab-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; } .liq-hpanel{ position:fixed; z-index:70; width:min(380px, calc(100vw - 20px)); border-radius:20px; overflow:hidden; display:none; transform-origin:top right; opacity:0; transform:translateY(-10px) scale(.98); background:color-mix(in srgb,var(--surface,#1d1d1d) 96%,transparent); -webkit-backdrop-filter:blur(24px) saturate(1.3); backdrop-filter:blur(24px) saturate(1.3); border:1px solid var(--border,rgba(255,255,255,.09)); box-shadow:0 30px 70px -22px rgba(0,0,0,.75); transition:transform .3s var(--ease-liquid,cubic-bezier(.22,1,.36,1)), opacity .2s; } .liq-hpanel.open{ display:block; opacity:1; transform:none; } .liq-hpanel::before{ content:''; position:absolute; top:-7px; left:var(--liq-hpanel-arrow,340px); width:14px; height:14px; transform:rotate(45deg); background:inherit; border-left:1px solid var(--border,rgba(255,255,255,.09)); border-top:1px solid var(--border,rgba(255,255,255,.09)); } .liq-hpanel__hd{ display:flex; align-items:center; gap:8px; height:46px; padding:0 16px; border-bottom:1px solid var(--border,rgba(255,255,255,.09)); } .liq-hpanel__hd b{ font-size:var(--text-14); font-weight:700; } .liq-hpanel__hd .liq-hpanel__cnt{ font-size:var(--text-12); color:var(--accent,#4f8ef7); font-weight:700; } .liq-hpanel__hd .liq-hpanel__act{ margin-left:auto; width:30px; height:30px; border:0; background:none; color:var(--muted); border-radius:6px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; } .liq-hpanel__hd .liq-hpanel__act svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; } .liq-hpanel__hd .liq-hpanel__act:hover{ color:var(--text,#e9eef6); } .liq-hitem{ display:flex; gap:12px; align-items:flex-start; padding:12px 16px; cursor:pointer; position:relative; border-bottom:1px solid color-mix(in srgb,var(--border,rgba(255,255,255,.09)) 55%,transparent); transition:background .14s; } .liq-hitem:hover{ background:color-mix(in srgb,var(--text,#e9eef6) 5%,transparent); } .liq-hitem:last-of-type{ border-bottom:0; } .liq-hitem__m{ flex:1; min-width:0; } .liq-hitem__r1{ display:flex; align-items:baseline; gap:8px; } .liq-hitem__who{ font-weight:700; font-size:var(--text-13); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .liq-hitem__when{ font-size:var(--text-11); color:var(--muted); margin-left:auto; flex:none; } .liq-hitem__tx{ font-size:var(--text-13); color:var(--muted); line-height:1.35; margin-top:2px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .liq-hitem__ch{ display:inline-flex; align-items:center; gap:5px; font-size:var(--text-11); color:var(--accent,#4f8ef7); margin-top:5px; font-weight:600; } .liq-hitem__ch svg{ width:12px; height:12px; stroke:var(--muted); fill:none; stroke-width:2; } .liq-hitem.masked .liq-hitem__tx{ font-style:italic; color:var(--muted); letter-spacing:.5px; } .liq-hitem.unread::after{ content:''; position:absolute; top:16px; right:14px; width:8px; height:8px; border-radius:50%; background:var(--accent,#4f8ef7); } .liq-htype{ flex:none; width:36px; height:36px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; background:color-mix(in srgb,var(--accent,#4f8ef7) 15%,transparent); } .liq-htype svg{ width:18px; height:18px; stroke:var(--accent,#4f8ef7); fill:none; stroke-width:2; } .liq-htype.amber{ background:color-mix(in srgb,var(--warning,#f59e0b) 16%,transparent); } .liq-htype.amber svg{ stroke:var(--warning,#f59e0b); } .liq-htype.green{ background:color-mix(in srgb,var(--success,#3ecf8e) 16%,transparent); } .liq-htype.green svg{ stroke:var(--success,#3ecf8e); } .liq-hpanel__ft{ padding:11px 16px; } .liq-hpanel__ft .liq-btn{ width:100%; } @media (prefers-reduced-motion:reduce){ .liq-hpanel{ transition:none; } } @media (prefers-reduced-transparency:reduce){ .liq-hpanel{ -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--surface,#1d1d1d); } } .liq-rail{ display:flex; flex-direction:column; gap:5px; min-height:0; transition:width .32s var(--ease-liquid,cubic-bezier(.22,1,.36,1)); } .liq-optrow{ display:flex; align-items:flex-start; gap:12px; width:100%; box-sizing:border-box; min-height:44px; padding:12px 14px; border-radius:14px; cursor:pointer; text-align:left; font:inherit; color:var(--text,#e9eef6); border:1px solid var(--border,#2a2e3d); background:color-mix(in srgb, var(--surface,#1d1d1d) 55%, transparent); margin-bottom:8px; } .liq-optrow:hover{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 40%, transparent); } .liq-optrow__box{ flex:none; width:20px; height:20px; margin-top:1px; border-radius:6px; border:1.5px solid var(--border-strong,#414141); display:grid; place-items:center; background:color-mix(in srgb, var(--text,#fff) 4%, transparent); } .liq-optrow__box svg{ width:13px; height:13px; opacity:0; stroke:#fff; stroke-width:3; fill:none; stroke-linecap:round; stroke-linejoin:round; } .liq-optrow.is-on{ border-color:var(--accent,#4f8ef7); background:color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); } .liq-optrow.is-on .liq-optrow__box{ background:var(--accent,#4f8ef7); border-color:var(--accent,#4f8ef7); } .liq-optrow.is-on .liq-optrow__box svg{ opacity:1; } .liq-optrow__main{ flex:1 1 auto; min-width:0; } .liq-optrow__t{ display:flex; align-items:center; gap:8px; font-size:var(--text-14); font-weight:650; } .liq-optrow__d{ display:block; font-size:var(--text-12); line-height:1.5; color:var(--muted,#8892a4); margin-top:3px; } .liq-optrow--risk{ border-left:3px solid var(--danger,#e55353); } .liq-optrow--risk.is-on{ border-color:var(--danger,#e55353); border-left-width:3px; background:color-mix(in srgb, var(--danger,#e55353) 10%, transparent); } .liq-optrow--risk.is-on .liq-optrow__box{ background:var(--danger,#e55353); border-color:var(--danger,#e55353); } .liq-optrow__tag{ flex:none; font-size:var(--text-10); font-weight:800; letter-spacing:.05em; padding:2px 7px; border-radius:999px; color:var(--danger,#e55353); background:color-mix(in srgb, var(--danger,#e55353) 16%, transparent); } .liq-optrow:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-rail__sec{ font-size:var(--text-10); letter-spacing:.1em; text-transform:uppercase; font-weight:800; color:var(--muted,#8892a4); margin:14px 12px 5px; } .liq-rail__sec:first-child{ margin-top:4px; } .liq-rail.is-collapsed .liq-rail__sec{ height:1px; margin:10px 8px; overflow:hidden; color:transparent; background:color-mix(in srgb, var(--text,#fff) 10%, transparent); } .liq-navitem__tag{ flex:none; margin-left:auto; font-size:var(--text-10); font-weight:800; letter-spacing:.06em; padding:2px 6px; border-radius:999px; color:var(--warning); background:color-mix(in srgb, var(--warning) 16%, transparent); } .liq-navitem__num{ flex:none; margin-left:auto; color:#fff; background:var(--accent,#4f8ef7); } .liq-navitem__num--alert{ background:var(--danger,#e0736f); } .liq-rail.is-collapsed .liq-navitem__tag{ display:none; } .liq-rail.is-collapsed .liq-navitem__num{ position:absolute; top:3px; right:5px; min-width:16px; height:16px; font-size:var(--text-11); padding:0 4px; margin:0; } .liq-rail.is-collapsed .liq-navitem{ position:relative; } .liq-hubbar{ display:flex; align-items:center; gap:14px; padding:0 18px; border-bottom:1px solid var(--border); background:color-mix(in srgb, var(--surface,#1d1d1d) 82%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); z-index:30; min-height:52px; } .liq-hubbar__lead{ display:flex; align-items:center; gap:10px; flex:none; } .liq-hubbar__zahlen{ display:flex; align-items:stretch; gap:2px; flex:0 1 auto; min-width:0; margin-left:6px; overflow:hidden; } .liq-hubbar__zahl{ position:relative; display:flex; flex-direction:column; justify-content:center; gap:1px; padding:2px 10px; min-width:0; flex:0 0 auto; border-radius:10px; border:0; background:none; color:inherit; font:inherit; cursor:pointer; text-align:left; white-space:nowrap; transition:background .16s ease; } .liq-hubbar__zahl::after{ content:''; position:absolute; left:0; right:0; top:50%; height:44px; transform:translateY(-50%); } .liq-hubbar__zahl:hover{ background:color-mix(in srgb, var(--text,#fff) 7%, transparent); } .liq-hubbar__zahl:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-hubbar__zahl-kopf{ font-size:9.5px; letter-spacing:.07em; text-transform:uppercase; font-weight:700; color:var(--muted,#8892a4); line-height:1; overflow:hidden; text-overflow:ellipsis; } .liq-hubbar__zahl-wert{ font-size:16px; font-weight:650; line-height:1.05; font-variant-numeric:tabular-nums; color:var(--text,#e9eef6); } .liq-hubbar__zahl-neben{ font-size:10.5px; color:var(--muted,#8892a4); line-height:1; font-variant-numeric:tabular-nums; } .liq-hubbar__zahl--ungemessen .liq-hubbar__zahl-wert{ color:var(--muted,#8892a4); font-weight:500; } .liq-hubbar__zahl--ungemessen{ cursor:default; } .liq-hubbar__zahl--ungemessen:hover{ background:none; } .liq-hubbar__zahl-marke{ position:relative; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; margin-left:6px; flex:none; border:0; padding:0; cursor:pointer; border-radius:6px; background:none; color:var(--muted,#8892a4); transition:color .16s ease, background .16s ease; } .liq-hubbar__zahl-marke:hover{ color:var(--text,#e9eef6); background:color-mix(in srgb, var(--text,#fff) 9%, transparent); } .liq-hubbar__zahl-marke:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-hubbar__zahl-marke.is-an{ color:var(--accent,#4f8ef7); background:color-mix(in srgb, var(--accent,#4f8ef7) 16%, transparent); } .liq-hubbar__zahl-marke::after{ content:''; position:absolute; width:44px; height:44px; left:50%; top:50%; transform:translate(-50%,-50%); } .liq-hubbar__zahl.is-ulm{ background:color-mix(in srgb, var(--accent,#4f8ef7) 13%, transparent); } .liq-hubbar__zahl.is-bc{ background:color-mix(in srgb, var(--warn,#f0b23c) 13%, transparent); } .liq-hubbar__zahl.is-ulm:hover{ background:color-mix(in srgb, var(--accent,#4f8ef7) 20%, transparent); } .liq-hubbar__zahl.is-bc:hover{ background:color-mix(in srgb, var(--warn,#f0b23c) 20%, transparent); } @media (max-width:820px){ .liq-hubbar__zahlen{ gap:0; margin-left:2px; } .liq-hubbar__zahl{ padding:2px 7px; } .liq-hubbar__zahl:nth-of-type(n+3){ display:none; } .liq-hubbar__zahl-neben{ display:none; } } @media (max-width:480px){ .liq-hubbar__zahlen{ display:none; } } .liq-hubbar__brand{ font-family:var(--d-font-display,inherit); font-weight:600; font-size:18px; letter-spacing:-.3px; } @media (max-width:820px){ .liq-hubbar__brand{ position:relative; } .liq-hubbar__brand::after{ content:""; position:absolute; inset:calc(-1 * var(--liq-hit-y, 9px)) calc(-1 * var(--liq-hit-x, 7px)); } } .liq-hubbar__brand b{ color:var(--accent,#4f8ef7); } .liq-hubbar__badge{ display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px; margin-left:8px; border-radius:999px; font-size:var(--text-11); font-weight:800; color:#fff; background:var(--accent,#4f8ef7); vertical-align:middle; } .liq-hubbar__badge--alert{ background:var(--danger,#e0736f); } .liq-hubbar__badge[hidden]{ display:none; } .liq-glowhover{ transition:box-shadow .22s var(--ease-soft,ease), transform .18s var(--ease-soft,ease); } .liq-glowhover:hover{ box-shadow:var(--liq-hover-glow); transform:translateY(-1px); } .liq-glowhover:focus-visible{ box-shadow:var(--liq-hover-glow); outline:none; } @media (prefers-reduced-motion:reduce){ .liq-glowhover{ transition:box-shadow .22s ease; } .liq-glowhover:hover{ transform:none; } } .liq-marke{ display:inline-flex; align-items:center; background:none; border:0; padding:0; font-family:'Bricolage Grotesque',sans-serif; font-weight:400; font-size:var(--text-16); color:var(--text,#e9eef6); cursor:pointer; white-space:nowrap; } .liq-marke > b{ font-weight:700; } .liq-marke__punkt{ display:inline-block; flex:none; width:9px; height:9px; margin-right:7px; border-radius:50%; background:var(--accent-gradient,var(--accent,#4f8ef7)); box-shadow:0 0 10px -1px color-mix(in srgb, var(--accent,#4f8ef7) 70%, transparent); } .liq-marke:hover{ color:#fff; text-shadow:0 0 18px color-mix(in srgb, var(--accent,#4f8ef7) 55%, transparent); } .liq-marke:hover .liq-marke__punkt{ box-shadow:0 0 16px 1px color-mix(in srgb, var(--accent,#4f8ef7) 85%, transparent); transform:scale(1.15); } .liq-marke__punkt{ transition:box-shadow .22s var(--ease-soft,ease), transform .22s var(--ease-soft,ease); } .liq-marke{ transition:color .18s var(--ease-soft,ease), text-shadow .22s var(--ease-soft,ease); } @media (prefers-reduced-motion:reduce){ .liq-marke:hover .liq-marke__punkt{ transform:none; } } .liq-marke:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:3px; border-radius:6px; } @media (prefers-reduced-transparency:reduce){ .liq-marke__punkt{ box-shadow:none; } } @media (max-width:820px){ .liq-hubbar__brand .liq-marke__punkt{ width:30px; height:30px; margin-right:0; } } .liq-hubbar__modul{ display:flex; align-items:baseline; gap:6px; min-width:0; flex:0 1 auto; font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:var(--text-16); color:var(--text,#e9eef6); } .liq-hubbar__modul-trenn{ flex:none; opacity:.32; font-weight:400; } .liq-hubbar__modul-basis{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-hubbar__modul-zusatz{ flex:none; font-weight:500; font-size:var(--text-13); color:var(--muted,#8892a4); } .liq-hubbar__punkt{ flex:none; align-self:center; width:8px; height:8px; border-radius:50%; background:var(--muted,#8892a4); transition:background .25s ease, box-shadow .25s ease; } .liq-hubbar__punkt[hidden]{ display:none; } .liq-hubbar__punkt.ist-live{ background:#2ecc71; box-shadow:0 0 9px rgba(46,204,113,.55); } .liq-hubbar__punkt.ist-zaeh{ background:#f0c674; } .liq-hubbar__punkt.ist-weg{ background:#e06060; box-shadow:0 0 9px rgba(224,96,96,.5); } @media (prefers-reduced-motion: reduce){ .liq-hubbar__punkt{ transition:none; } } .liq-hubbar__search--symbol{ flex:none; width:44px; max-width:44px; margin:0; } .liq-hubbar__search--symbol > input{ display:none; } .liq-hubbar__search--symbol::after{ content:''; position:absolute; inset:0; } @media (max-width:820px){ .liq-hubbar__search{ flex:none; width:44px; max-width:44px; margin:0; } .liq-hubbar__search > input{ display:none; } .liq-hubbar__search.is-offen{ flex:1 1 auto; width:auto; max-width:420px; } .liq-hubbar__search.is-offen > input{ display:block; } .liq-hubbar__search.is-offen ~ .liq-hubbar__modul, .liq-hubbar__modul:has(~ .liq-hubbar__search.is-offen){ display:none; } .liq-hubbar__modul{ flex:1 1 auto; } .liq-hubbar__brand-text{ display:none; } } @media (max-width:400px){ .liq-hubbar__modul-trenn{ display:none; } } .liq-hubbar__search{ flex:1; max-width:420px; margin:0 auto; position:relative; display:flex; min-width:0; } .liq-hubbar__actions{ display:flex; align-items:center; gap:12px; flex:none; margin-left:auto; } @media (max-width:820px){ .liq-hubbar{ gap:8px; padding:0 12px; } } @media (prefers-reduced-transparency: reduce){ .liq-hubbar{ background:var(--surface,#1d1d1d); backdrop-filter:none; -webkit-backdrop-filter:none; } } @media (prefers-reduced-motion: reduce){ .liq-hubbar, .liq-hubbar *{ transition:none; } } .liq-navgroup{ display:flex; position:relative; flex-direction:column; gap:2px; } .liq-navgroup__gleiter{ position:absolute; left:var(--gleiter-rand,0); right:var(--gleiter-rand,0); top:0; height:44px; border-radius:10px; background:color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); border-left:2px solid var(--accent,#4f8ef7); opacity:0; pointer-events:none; z-index:0; transition:transform .34s cubic-bezier(.22,1,.36,1), height .2s ease, opacity .2s ease; } .liq-navgroup__gleiter.is-an{ opacity:1; } .liq-navgroup > .liq-navitem{ position:relative; z-index:1; } @media (prefers-reduced-motion:reduce){ .liq-navgroup__gleiter{ transition:opacity .2s ease; } } .liq-navgroup__btn{ text-decoration:none; display:flex; align-items:center; gap:12px; width:100%; box-sizing:border-box; min-width:0; padding:10px 11px; border:1px solid transparent; border-radius:10px; background:none; color:var(--ink-soft,#c2cad8); font:inherit; font-size:var(--text-13); text-align:left; cursor:pointer; } .liq-navgroup__btn{ transition:transform .2s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), box-shadow .3s var(--ease-soft,ease), background .15s ease, color .15s ease; } .liq-navgroup__btn:hover{ background:color-mix(in srgb, var(--text,#fff) 6%, transparent); color:var(--text,#e9eef6); transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .liq-navgroup__btn:focus-visible{ outline:none; color:var(--text,#e9eef6); transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .liq-navgroup__btn:active{ transform:var(--liq-press,scale(.98)); } .liq-navgroup.is-open > .liq-navgroup__btn{ color:var(--text,#e9eef6); } @media (prefers-reduced-motion:reduce){ .liq-navgroup__btn:hover, .liq-navgroup__btn:focus-visible{ transform:none; } } .liq-navgroup__chev{ margin-left:auto; flex:none; width:14px; height:14px; transition:transform .22s var(--ease-liquid,ease); } .liq-navgroup.is-open > .liq-navgroup__btn .liq-navgroup__chev{ transform:rotate(90deg); } .liq-navsub{ display:none; flex-direction:column; gap:2px; padding-left:22px; margin:2px 0 4px; border-left:1px solid color-mix(in srgb, var(--text,#fff) 20%, transparent); } .liq-navgroup.is-open > .liq-navsub{ display:flex; } .liq-navsub .liq-navitem{ font-size:var(--text-13); padding:8px 10px; } .liq-rail .liq-navitem{ color:var(--muted,#8892a4); } .liq-rail .liq-navgroup.is-open > .liq-navgroup__btn{ color:var(--text,#e9eef6); font-weight:650; } .liq-rail .liq-navsub .liq-navitem{ color:var(--ink-soft,#c2cad8); } .liq-navgroup.is-open .liq-navsub .liq-navsub{ display:flex; flex-direction:column; gap:1px; padding-left:13px; margin:2px 0 5px; border-left:1px solid color-mix(in srgb,var(--text,#fff) 11%,transparent); } .liq-navgroup.is-open .liq-navsub .liq-navsub .liq-navitem{ font-size:var(--text-12); padding:6px 9px; min-height:0; color:var(--muted,#8892a4); font-weight:500; } .liq-navgroup.is-open .liq-navsub .liq-navsub .liq-navitem:hover{ color:var(--text,#e9eef6); } .liq-navgroup.is-open .liq-navsub .liq-navsub .liq-navitem.is-active, .liq-navgroup.is-open .liq-navsub .liq-navsub .liq-navitem.on{ background:none; color:var(--text,#e9eef6); font-weight:650; box-shadow:inset 2px 0 0 var(--accent,#4f8ef7); } .liq-rail.is-collapsed .liq-navsub .liq-navsub{ display:none !important; } .liq-rail .liq-navitem:hover, .liq-rail .liq-navitem:focus-visible{ color:var(--text,#e9eef6); } .liq-rail .liq-navitem.on, .liq-rail .liq-navitem.is-active{ color:#cfe0fd; } .liq-rail.is-collapsed .liq-navitem{ color:var(--ink-soft,#c2cad8); } .liq-navcap{ display:flex; align-items:center; gap:8px; margin:8px 0 2px; padding:0 10px; font-weight:700; font-size:var(--text-11); line-height:1.3; text-transform:uppercase; letter-spacing:.06em; color:var(--subtle,#5a6377); user-select:none; -webkit-user-select:none; } .liq-navsub > .liq-navcap:first-child{ margin-top:2px; } .liq-rail.is-collapsed .liq-navcap{ display:none; } .liq-rail.is-collapsed .liq-navsub{ display:none !important; } .liq-rail.is-collapsed .liq-navgroup__chev, .liq-rail.is-collapsed .liq-navgroup__btn span:not(.liq-navitem__ic):not(.liq-navitem__num){ display:none; } .liq-rail.is-collapsed .liq-navgroup__btn{ justify-content:center; } @media (prefers-reduced-motion:reduce){ .liq-navgroup__chev{ transition:none; } } @media (min-width:721px){ .liq-rail--panel{ padding:10px 9px; border-radius:14px; background:color-mix(in srgb, var(--surface,#1d1d1d) 55%, transparent); border:1px solid color-mix(in srgb, var(--text,#fff) 7%, transparent); -webkit-backdrop-filter:blur(16px) saturate(1.25); backdrop-filter:blur(16px) saturate(1.25); } } @media (prefers-reduced-transparency:reduce){ .liq-rail--panel{ background:var(--surface,#1d1d1d); -webkit-backdrop-filter:none; backdrop-filter:none; } } .liq-navitem{ display:flex; align-items:center; gap:12px; width:100%; padding:10px 11px; border-radius:10px; box-sizing:border-box; min-width:0; text-decoration:none; background:none; border:1px solid transparent; color:var(--ink-soft,#c2cad8); font:inherit; font-size:var(--text-13); text-align:left; cursor:pointer; white-space:nowrap; transition:transform .2s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), box-shadow .3s var(--ease-soft,ease), background .15s ease, color .15s ease; } .liq-navitem:hover{ background:rgba(255,255,255,.05); color:var(--text,#e9eef6); transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .liq-navitem:focus-visible{ outline:none; color:var(--text,#e9eef6); transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .liq-navitem:active{ transform:var(--liq-press,scale(.97)); } .liq-navitem.on{ background:var(--accent-soft,rgba(79,142,247,.18)); color:#cfe0fd; font-weight:600; box-shadow:inset 2px 0 0 var(--accent,#4f8ef7); } .liq-navitem__ic{ flex:0 0 auto; width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; } .liq-navitem__ic svg{ width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; display:block; } .liq-navitem__label{ flex:1; min-width:0; opacity:1; max-width:220px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; text-overflow:ellipsis; overflow-wrap:anywhere; line-height:1.25; transition:opacity .18s ease, max-width .3s var(--ease-liquid,cubic-bezier(.22,1,.36,1)), transform .3s var(--ease-liquid,cubic-bezier(.22,1,.36,1)); } .liq-rail:not(.is-collapsed) .liq-navitem__ic{ display:none; } @media (min-width:721px){ .liq-rail.is-collapsed .liq-navitem{ justify-content:center; gap:0; padding:11px 0; } .liq-rail.is-collapsed .liq-navitem__label{ opacity:0; max-width:0; flex:0 0 auto; transform:translateX(-6px); -webkit-line-clamp:1; line-clamp:1; } .liq-rail.is-collapsed .liq-navitem.on{ box-shadow:none; background:rgba(255,255,255,.14); } } @media (prefers-reduced-motion:reduce){ .liq-rail, .liq-navitem, .liq-navitem__label{ transition:box-shadow .2s ease, background .15s ease, color .15s ease; } .liq-navitem:hover, .liq-navitem:focus-visible{ transform:none; } } .liq-rail__toggle{ display:flex; align-items:center; gap:10px; width:100%; padding:10px 11px; border-radius:10px; border:1px solid var(--border,rgba(255,255,255,.09)); background:color-mix(in srgb,var(--surface,#1d1d1d) 60%,transparent); color:var(--ink-soft,#c2cad8); font:inherit; font-size:var(--text-13); font-weight:600; cursor:pointer; white-space:nowrap; transition:box-shadow .3s var(--ease-soft,ease), border-color .2s ease, transform .2s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)); } .liq-rail__toggle:hover{ border-color:var(--accent,#4f8ef7); color:var(--text,#e9eef6); box-shadow:var(--liq-hover-glow); transform:translateY(-1px); } .liq-rail__toggle:focus-visible{ outline:none; border-color:var(--accent,#4f8ef7); box-shadow:var(--liq-hover-glow); } .liq-rail__chev{ flex:0 0 auto; width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; transition:transform .3s ease; } .liq-rail__chev svg{ width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; } .liq-rail__toggle .liq-rail__lbl{ flex:1; text-align:left; overflow:hidden; text-overflow:ellipsis; } @media (min-width:721px){ .liq-rail.is-collapsed .liq-rail__toggle{ justify-content:center; padding:11px 0; } .liq-rail.is-collapsed .liq-rail__toggle .liq-rail__lbl{ display:none; } .liq-rail.is-collapsed .liq-rail__chev{ transform:rotate(180deg); } } @media (prefers-reduced-motion:reduce){ .liq-rail__toggle{ transition:box-shadow .2s ease, border-color .2s ease; } .liq-rail__toggle:hover{ transform:none; } .liq-rail__chev{ transition:none; } } .liq-rail-scrim{ position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:79; opacity:0; pointer-events:none; transition:opacity .3s ease; } .liq-rail-scrim.is-open{ opacity:1; pointer-events:auto; } @media (min-width:721px){ .liq-rail-scrim{ display:none; } } @media (max-width:720px){ .liq-rail--drawer{ position:fixed; top:0; left:0; bottom:0; width:min(280px,82vw); z-index:80; transform:translateX(-100%); overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; box-shadow:24px 0 60px -24px rgba(0,0,0,.7); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); background:color-mix(in srgb,var(--surface,#1d1d1d) 96%,transparent); transition:transform .3s var(--ease-liquid,cubic-bezier(.22,1,.36,1)); } .liq-rail--drawer.is-open{ transform:none; } .liq-navitem{ min-height:44px; } .liq-rail__toggle{ min-height:44px; } .liq-navgroup__btn{ min-height:44px; } .liq-rail .liq-navitem{ justify-content:flex-start; gap:12px; padding:10px 11px; box-sizing:border-box; width:100%; min-width:0; } .liq-rail .liq-navitem__ic{ display:none; } .liq-rail .liq-navitem__label{ opacity:1; max-width:none; transform:none; flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-rail__toggle{ display:none; } } @media (prefers-reduced-motion:reduce){ .liq-rail{ transition:none; } .liq-rail-scrim{ transition:none; } } @media (max-width:720px){ .liq-stepper .liq-step button, .liq-seg button, .liq-seg-count .opt, .lsel-seg button{ position:relative; } .liq-stepper .liq-step button::after, .liq-seg button::after, .liq-seg-count .opt::after, .lsel-seg button::after{ content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:max(100%,44px); height:44px; border-radius:inherit; } } .liq-rail__back{ display:flex; align-items:center; gap:5px; width:100%; min-height:44px; padding:0 12px; margin-bottom:6px; border:0; border-radius:10px; cursor:pointer; font:inherit; font-size:var(--text-12); text-align:left; text-decoration:none; background:transparent; color:var(--text-muted,#8892a4); border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-rail__back:hover .liq-rail__up{ color:var(--text,#e9eef6); } .liq-rail__up{ flex:0 0 auto; font-weight:600; color:var(--text-muted,#8892a4); } .liq-rail__sep{ flex:none; width:13px; height:13px; opacity:.45; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-rail__hier{ flex:1 1 auto; min-width:0; font-weight:650; color:var(--text,#e9eef6); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-rail.is-collapsed .liq-rail__back{ justify-content:center; padding:0; } .liq-rail.is-collapsed .liq-rail__sep, .liq-rail.is-collapsed .liq-rail__hier{ display:none; } .liq-navitem[disabled], .liq-navitem[aria-disabled="true"]{ opacity:.45; cursor:not-allowed; } .liq-navitem[disabled]:hover, .liq-navitem[aria-disabled="true"]:hover{ background:transparent; color:inherit; transform:none; box-shadow:none; } .liq-navitem.on, .liq-navitem.is-active{ box-shadow: inset 2px 0 0 var(--accent,#4f8ef7), 0 0 18px -6px color-mix(in srgb,var(--accent,#4f8ef7) 70%, transparent); } @media (prefers-reduced-transparency:reduce){ .liq-navitem.on, .liq-navitem.is-active{ box-shadow: inset 2px 0 0 var(--accent,#4f8ef7); } } .liq-rail__foot{ margin-top:auto; padding-top:8px; border-top:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-rail__toggle--foot{ width:100%; min-height:44px; display:flex; align-items:center; gap:10px; padding:0 12px; border:0; border-radius:10px; cursor:pointer; background:transparent; font:inherit; font-size:var(--text-12); font-weight:600; color:var(--text-muted,#8892a4); } .liq-rail__toggle--foot:hover{ color:var(--text,#e9eef6); background:rgba(255,255,255,.05); } .liq-rail__toggle--foot svg{ width:17px; height:17px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-rail.is-collapsed .liq-rail__toggle--foot{ justify-content:center; padding:0; } .liq-rail.is-collapsed .liq-rail__toggle--foot .liq-rail__lbl{ display:none; } .liq-rail.is-collapsed .liq-rail__toggle--foot svg{ transform:scaleX(-1); } .liq-datefield{ display:flex; align-items:center; gap:8px; width:100%; min-height:44px; padding:0 12px; border-radius:10px; font:inherit; font-size:var(--text-14); cursor:pointer; text-align:left; box-sizing:border-box; color:var(--text,#e9eef6); background:color-mix(in srgb, var(--text,#fff) 5%, transparent); border:1px solid color-mix(in srgb, var(--text,#fff) 12%, transparent); } .liq-datefield:hover{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 45%, transparent); } .liq-datefield:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-datefield__val{ flex:1 1 auto; min-width:0; } .liq-datefield__val.is-leer{ color:var(--muted,#8892a4); } .liq-datefield__ic{ width:17px; height:17px; flex:none; fill:none; stroke:var(--muted,#8892a4); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-datefield-pop{ position:fixed; z-index:400; display:none; } .liq-datefield-pop.is-open{ display:block; } .liq-datefield-scrim{ position:fixed; inset:0; z-index:399; display:none; } .liq-datefield-scrim.is-open{ display:block; } .liq-sluice{ border-radius:14px; padding:0 18px 24px; text-align:center; cursor:pointer; overflow:hidden; display:flex; flex-direction:column; align-items:center; gap:5px; min-height:44px; border:1.5px dashed color-mix(in srgb, var(--accent,#4f8ef7) 45%, transparent); background:color-mix(in srgb, var(--accent,#4f8ef7) 7%, transparent); transition:background .2s; } .liq-sluice:hover{ background:color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); } .liq-sluice.is-over{ background:color-mix(in srgb, var(--accent,#4f8ef7) 16%, transparent); border-style:solid; } .liq-sluice__ic{ width:26px; height:26px; fill:none; stroke:var(--accent,#4f8ef7); stroke-width:1.7; margin-bottom:5px; } .liq-sluice__kopf{ align-self:stretch; margin:0 -18px 10px; padding:9px 18px; font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:var(--text-13); font-weight:650; letter-spacing:-.1px; text-align:left; color:var(--text,#e9eef6); background:color-mix(in srgb, var(--accent,#4f8ef7) 14%, transparent); } .liq-sluice__t{ font-size:var(--text-14); font-weight:650; color:var(--text,#e9eef6); } .liq-sluice__hint{ font-size:var(--text-12); color:var(--muted,#8892a4); max-width:44ch; } .liq-sluice__seen{ display:none; margin-top:12px; padding:13px 15px; border-radius:14px; text-align:left; background:color-mix(in srgb, var(--text,#fff) 5%, transparent); border:1px solid color-mix(in srgb, var(--accent,#4f8ef7) 32%, transparent); } .liq-sluice__seen.is-open{ display:block; } .liq-sluice__seenk{ font-size:var(--text-10); letter-spacing:.08em; text-transform:uppercase; font-weight:800; color:var(--muted,#8892a4); margin-bottom:9px; } .liq-sluice__row{ display:flex; align-items:center; gap:10px; padding:7px 0; font-size:var(--text-13); flex-wrap:wrap; border-top:1px solid color-mix(in srgb, var(--text,#fff) 8%, transparent); } .liq-sluice__row:first-of-type{ border-top:0; } .liq-sluice__rl{ flex:0 0 92px; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-sluice.is-filled{ border-style:solid; text-align:left; align-items:stretch; cursor:default; padding:14px 16px; border-color:color-mix(in srgb,var(--success,#35ad76) 40%,transparent); background:color-mix(in srgb,var(--success,#35ad76) 6%,transparent); } .liq-sluice.is-filled.is-local{ border-color:color-mix(in srgb,var(--warning,#f59e0b) 40%,transparent); background:color-mix(in srgb,var(--warning,#f59e0b) 6%,transparent); } .liq-sluice__doc{ display:flex; align-items:center; gap:9px; font-size:var(--text-14); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-sluice__acts{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; } .liq-sluice__acts a, .liq-sluice__acts button{ display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:0 12px; border-radius:10px; font:inherit; font-size:var(--text-12); font-weight:600; cursor:pointer; text-decoration:none; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 7%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 11%,transparent); } .liq-sluice__acts a:hover, .liq-sluice__acts button:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 15%,transparent); } .liq-sluice__badge{ display:inline-flex; align-items:center; gap:5px; align-self:flex-start; margin-top:10px; font-size:var(--text-11); font-weight:700; padding:3px 10px; border-radius:999px; } .liq-sluice__badge--elo{ color:var(--success,#35ad76); background:color-mix(in srgb,var(--success,#35ad76) 14%,transparent); } .liq-sluice__badge--local{ color:var(--warning,#f59e0b); background:color-mix(in srgb,var(--warning,#f59e0b) 14%,transparent); } .liq-sluice__badge--missing{ color:var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 14%,transparent); } .liq-sluice__prog{ height:3px; border-radius:999px; margin-top:10px; overflow:hidden; display:none; background:color-mix(in srgb,var(--text,#fff) 10%,transparent); } .liq-sluice.is-uploading .liq-sluice__prog{ display:block; } .liq-sluice__prog i{ display:block; height:100%; width:0; background:var(--accent,#4f8ef7); transition:width .2s ease; } .liq-sluice__err{ display:none; margin-top:8px; font-size:var(--text-12); color:var(--danger,#e0736f); } .liq-sluice.is-error .liq-sluice__err{ display:block; } .liq-sluice[hidden], .liq-sluice-stage[hidden]{ display:none; } .liq-sluice-stage{ border-radius:14px; padding:20px 18px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:5px; border:1.5px dashed color-mix(in srgb,var(--ki,#f5a524) 48%,var(--border,#333333)); background:color-mix(in srgb,var(--ki,#f5a524) 7%,transparent); } .liq-sluice-stage.is-done{ border-style:solid; border-width:1px; border-color:color-mix(in srgb,var(--ki,#f5a524) 42%,var(--border,#333333)); background:color-mix(in srgb,var(--ki,#f5a524) 5%,transparent); } .liq-sluice-stage__orb{ display:flex; justify-content:center; margin-top:14px; } .liq-sluice__t--ki{ color:var(--ki-text); } .liq-sluice-stage.is-error{ border-style:solid; border-width:1.5px; border-color:color-mix(in srgb,var(--danger,#e0736f) 55%,transparent); background:color-mix(in srgb,var(--danger,#e0736f) 9%,transparent); } .liq-sluice-stage.is-error .liq-sluice__t--ki{ color:var(--danger,#e0736f); } .liq-sluice-stage__err{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-top:6px; background:color-mix(in srgb,var(--danger,#e0736f) 18%,transparent); } .liq-sluice-stage__err svg{ width:24px; height:24px; fill:none; stroke:var(--danger,#e0736f); stroke-width:2.4; } .liq-sluice-stage__acts{ display:flex; gap:8px; width:100%; margin-top:14px; } .liq-sluice-stage__acts > *{ flex:1; } .liq-sluice-stage.is-error .liq-sluice-stage__acts > .liq-btn:not(.liq-btn-sec){ background:var(--danger,#e0736f); } @media (prefers-reduced-transparency:reduce){ .liq-sluice-stage, .liq-sluice-stage.is-done{ background:var(--surface,#1d1d1d); } .liq-sluice-stage.is-error{ background:color-mix(in srgb,var(--danger,#e0736f) 16%,var(--surface,#1d1d1d)); } } .liq-chain{ position:relative; margin-top:16px; } .liq-chain__link{ position:relative; margin:0 0 20px 22px; padding:1px 0 1px 2px; background:none; border:0; border-radius:0; } .liq-chain__link::before{ content:''; position:absolute; left:-22px; top:1px; width:11px; height:11px; border-radius:50%; background:var(--success,#35ad76); border:2px solid var(--bg,#0f1117); } .liq-chain__link::after{ content:''; position:absolute; left:-15.5px; top:14px; bottom:-20px; width:2px; background:color-mix(in srgb, var(--text,#fff) 13%, transparent); } .liq-chain__link:last-child::after{ content:none; } .liq-chain__link.is-origin::before{ background:var(--accent,#4f8ef7); } .liq-chain__link--kommt{ color:var(--muted,#8892a4); } .liq-chain__link--kommt::before{ background:var(--bg,#0f1117); border-color:color-mix(in srgb,var(--text,#fff) 30%,transparent); } @media (prefers-contrast:more){ .liq-chain__link--kommt::before{ border-color:var(--text,#e9eef6); } } .liq-chain__link.is-open{ color:var(--muted,#8892a4); } .liq-chain__link.is-open::before{ background:var(--bg,#0f1117); border-color:color-mix(in srgb, var(--warning,#f59e0b) 70%, transparent); } @media (prefers-contrast:more){ .liq-chain__link.is-open::before{ border-color:var(--text,#e9eef6); } } .liq-chain__k{ font-size:var(--text-10); letter-spacing:.07em; text-transform:uppercase; font-weight:800; color:var(--muted,#8892a4); } .liq-chain__d{ font-size:var(--text-14); font-weight:650; margin-top:3px; } .liq-chain__m{ font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:3px; } .liq-chain__gap{ position:relative; margin:0 0 10px 22px; padding:5px 0; font-size:var(--text-11); font-weight:700; color:var(--danger,#e0736f); } .liq-chain__gap::before{ content:''; position:absolute; left:-15.5px; top:0; bottom:0; width:2px; background:repeating-linear-gradient(var(--danger,#e0736f) 0 4px, transparent 4px 8px); } .liq-chain__beleg{ display:inline-flex; align-items:center; gap:4px; font-size:var(--text-11); font-weight:700; margin-top:5px; } .liq-chain__beleg--ok{ color:var(--success,#35ad76); } .liq-chain__beleg--fehlt{ color:var(--danger,#e0736f); } .liq-chain__due{ margin-top:8px; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-chain__due b{ color:var(--text,#e9eef6); } .liq-chain__edit{ position:absolute; top:9px; right:9px; min-height:32px; padding:0 11px; border-radius:999px; font:inherit; font-size:var(--text-11); font-weight:650; cursor:pointer; color:var(--muted,#8892a4); background:none; border:1px solid color-mix(in srgb, var(--text,#fff) 14%, transparent); } .liq-chain__edit:hover{ color:var(--text,#e9eef6); } .liq-chain__edit::after{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:max(100%,44px); height:44px; border-radius:inherit; } .liq-chain__editpanel{ display:none; margin-top:11px; padding-top:11px; border-top:1px solid color-mix(in srgb, var(--text,#fff) 9%, transparent); } .liq-chain__link.is-editing .liq-chain__editpanel{ display:block; } .liq-chain__link.is-editing{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 42%, transparent); } .liq-chain__editacts{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; } .liq-chain__au{ margin-top:10px; font-size:var(--text-11); line-height:1.55; color:var(--muted,#8892a4); } .liq-panel{ border:1px solid color-mix(in srgb, var(--text,#fff) 9%, transparent); border-radius:14px; padding:14px; background:color-mix(in srgb, var(--text,#fff) 3%, transparent); } .liq-panel__body{ padding:14px; } .liq-panel__body--dicht{ padding-top:2px; } .liq-panel__head{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:space-between; margin-bottom:12px; } .liq-panel__t{ font-size:var(--text-13); font-weight:650; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-panel__badge{ display:inline-flex; align-items:center; gap:5px; flex:none; font-size:var(--text-11); font-weight:700; color:var(--muted,#8892a4); } .liq-panel__badge svg,.liq-panel__badge .licon{ width:12px; height:12px; } .liq-panel__badge--ok{ color:color-mix(in srgb, var(--success,#35ad76) 84%, var(--text,#fff)); } .liq-panel__badge--warn{ color:color-mix(in srgb, var(--warning,#f59e0b) 88%, var(--text,#fff)); } .liq-panel__badge--no{ color:color-mix(in srgb, var(--danger,#e0736f) 88%, var(--text,#fff)); } .liq-reaktion{ position:absolute; top:-17px; right:-6px; display:flex; gap:4px; z-index:2; } .liq-reaktion__k{ position:relative; display:grid; place-items:center; flex:none; width:27px; height:27px; border-radius:50%; border:0; padding:0; cursor:pointer; font-size:13.5px; line-height:1; background:rgba(143,163,200,.176); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 1px 6px rgba(0,0,0,.4); transition:transform .16s var(--ease-spring,ease); } .liq-reaktion__k.is-meine{ background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); } .liq-reaktion__k::before, .liq-reaktion__k::after{ content:""; position:absolute; border-radius:50%; background:rgba(143,163,200,.176); } .liq-reaktion__k.is-meine::before, .liq-reaktion__k.is-meine::after{ background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); } .liq-reaktion__k::before{ width:6px; height:6px; bottom:-3px; } .liq-reaktion__k::after { width:3px; height:3px; bottom:-8px; } .liq-reaktion__n{ position:absolute; right:-9px; bottom:-2px; width:16px; height:16px; border-radius:50%; display:grid; place-items:center; font-size:9.5px; font-weight:650; font-variant-numeric:tabular-nums; color:var(--ink,#e2e8f0); background:rgba(143,163,200,.224); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); } .liq-reaktion__k:hover{ transform:translateY(-1px); } .liq-reaktion__k:active{ transform:scale(.94); } .is-eigen > .liq-reaktion{ right:auto; left:-6px; } .liq-reaktion__k::before{ left:2px; } .liq-reaktion__k::after{ left:-1px; } .is-eigen .liq-reaktion__k::before{ left:auto; right:2px; } .is-eigen .liq-reaktion__k::after { left:auto; right:-1px; } .liq-hat-reaktion{ padding-top:12px; margin-top:18px; } @media (prefers-reduced-motion: reduce){ .liq-reaktion__k{ transition:none; } .liq-reaktion__k:hover, .liq-reaktion__k:active{ transform:none; } } .liq-aufklapp{ font:inherit; display:block; border-radius:10px; } .liq-aufklapp + .liq-aufklapp{ border-top:1px solid color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-aufklapp__menge{ flex:none; font-size:var(--text-11); font-variant-numeric:tabular-nums; color:var(--muted,#8892a4); padding:1px 7px; border-radius:999px; background:color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-aufklapp__menge--leer{ background:none; padding-inline:2px; opacity:.72; } .liq-aufklapp__ausloeser{ display:block; width:100%; box-sizing:border-box; background:none; border:0; padding:0; margin:0; font:inherit; color:inherit; text-align:left; cursor:pointer; -webkit-tap-highlight-color:transparent; } .liq-aufklapp__ausloeser:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; border-radius:10px; } .liq-aufklapp__inhalt{ display:grid; grid-template-rows:minmax(0, 0fr); transition:grid-template-rows .26s var(--ease-soft,ease); } .liq-aufklapp__inhalt > *{ min-height:0; overflow:hidden; } .liq-aufklapp.is-offen > .liq-aufklapp__inhalt{ grid-template-rows:minmax(0, 1fr); } .liq-aufklapp[open] > .liq-aufklapp__inhalt{ grid-template-rows:minmax(0, 1fr); } .liq-aufklapp{ --liq-aufklapp-einzug:12px; } .liq-aufklapp:has(> .liq-aufklapp__ausloeser .liq-listrow__av){ --liq-aufklapp-einzug:calc(12px + 40px + 12px); } .liq-aufklapp__body{ padding:10px 14px 14px; margin:0 8px 8px var(--liq-aufklapp-einzug,12px); border-radius:0; background:none; } .liq-aufklapp:not(.is-offen):not([open]) > .liq-aufklapp__inhalt > .liq-aufklapp__body{ padding-block:0; margin-bottom:0; } .liq-aufklapp__body{ transition:padding .18s ease, margin .18s ease; } @media (prefers-reduced-motion: reduce){ .liq-aufklapp__body{ transition:none; } } .liq-aufklapp.is-offen{ background:none; } .liq-aufklapp.is-offen .liq-listrow__chev{ transform:rotate(90deg); } .liq-listrow__chev{ transition:transform .22s var(--ease-soft,ease); } @media (prefers-reduced-motion:reduce){ .liq-aufklapp__inhalt{ transition:none; } .liq-listrow__chev{ transition:none; } } .liq-field--herkunft{ position:relative; flex-direction:column; align-items:stretch; } .liq-field__zeile{ display:flex; align-items:center; gap:10px; min-width:0; flex:1 1 auto; } .liq-field--herkunft > .liq-field__zeile{ flex:0 0 auto; } .liq-field__zeile > i{ font-style:normal; color:var(--muted,#8892a4); flex:0 0 44%; min-width:0; padding-right:10px; box-sizing:border-box; } .liq-field__zeile > b{ font-weight:600; flex:1; min-width:0; overflow-wrap:anywhere; font-size:var(--text-14); } @media (max-width:520px){ .liq-field__zeile{ flex-direction:column; align-items:flex-start; gap:2px; } .liq-field__zeile > i{ flex:none; } } .liq-field__herkunft{ font-size:var(--text-10); color:var(--muted,#8892a4); padding-top:7px; margin-top:8px; border-top:1px dashed color-mix(in srgb, var(--text,#fff) 9%, transparent); display:flex; align-items:center; gap:6px; flex-wrap:wrap; } .liq-field__herkunft.is-ki{ color:var(--ki,#f5a524); font-weight:600; } .liq-field--herkunft.is-offen{ border-left:2px solid color-mix(in srgb,var(--text,#fff) 16%,transparent); padding-left:11px; border-radius:0 10px 10px 0; } .liq-field__herkunft.is-offen{ color:var(--muted,#8892a4); } .liq-field__herkunft.is-offen .liq-field__wer{ font-weight:600; color:var(--ink-soft,#c2cad8); } .liq-field__hktext{ min-width:0; flex:0 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-field__korr{ margin-left:auto; min-height:32px; padding:0 11px; border-radius:999px; cursor:pointer; font:inherit; font-size:var(--text-11); font-weight:650; color:var(--accent,#4f8ef7); background:none; border:1px solid color-mix(in srgb, var(--accent,#4f8ef7) 45%, transparent); position:relative; } .liq-field__korr::after{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:max(100%,44px); height:44px; border-radius:10px; } .liq-field__edit{ display:none; margin-top:11px; } .liq-field.is-editing .liq-field__edit{ display:block; } .liq-field--herkunft.is-editing .liq-field__herkunft{ display:none; } .liq-field.is-empty > b, .liq-field.is-empty .liq-field__val{ color:var(--subtle,#5a6377); } .liq-field--ro{ cursor:default; } .liq-field--ro .liq-field__pen{ display:none; } .liq-field--nahtlos{ transition:border-color .18s ease, background-color .18s ease; } .liq-field--nahtlos.is-offen{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 7%,transparent); } .liq-field--nahtlos.is-offen:has(.liq-field__unten){ border-radius:10px 10px 0 0; } .liq-field__inline{ flex:1 1 auto; min-width:5rem; font:inherit; font-weight:600; color:var(--text,#e9eef6); background:transparent; border:0; padding:0; margin:0; outline:none; box-shadow:none; } .liq-field__inline::placeholder{ color:var(--subtle,#5a6377); font-weight:400; } .liq-field__hint{ flex:none; font-size:var(--text-10); color:var(--muted,#8892a4); white-space:nowrap; opacity:0; transition:opacity .18s ease .06s; } .liq-field--nahtlos.is-offen .liq-field__hint{ opacity:1; } .liq-laedt{ flex:1 1 auto; display:flex; align-items:center; justify-content:center; min-height:var(--h-bedien,36px); padding:24px 16px; color:var(--muted,#8892a4); font-size:var(--text-13,13px); text-align:center; } .liq-laedt[hidden]{ display:none; } .liq-laedt__punkt{ width:5px; height:5px; border-radius:50%; margin-left:8px; background:currentColor; animation:liq-laedt-puls 1.3s ease-in-out infinite; } @keyframes liq-laedt-puls{ 0%,100%{ opacity:.25 } 50%{ opacity:.9 } } @media (prefers-reduced-motion: reduce){ .liq-laedt__punkt{ animation:none; opacity:.6; } } .liq-feldwirt{ min-height:var(--h-bedien,44px); box-sizing:border-box; } .liq-feldwirt > .liq-kv{ min-height:var(--h-bedien,44px); box-sizing:border-box; padding:0 12px; display:flex; align-items:center; } .liq-feldwirt > .liq-kv > .liq-kv__k{ flex:0 0 44%; } .liq-feldwirt > .liq-field{ box-sizing:border-box; } .liq-feldwirt > .liq-field.liq-field--nahtlos{ min-height:var(--h-bedien,36px); } @media (min-width: 441px) { .liq-field--nahtlos.is-offen{ display:flex; flex-direction:row; align-items:center; gap:8px; } .liq-field--nahtlos.is-offen > .liq-field__zeile{ flex:1 1 auto; min-width:0; } .liq-field--nahtlos.is-offen > .liq-field__sichern{ flex:none; height:22px; min-width:38px; padding:0 10px; } } .liq-field{ position:relative; } .liq-field__sichern{ position:absolute; right:12px; top:50%; transform:translateY(-50%); flex:none; min-width:44px; height:30px; padding:0 14px; border-radius:6px; cursor:pointer; border:0; font:inherit; font-size:var(--text-12); font-weight:700; letter-spacing:.02em; color:#fff; background:var(--accent,#4f8ef7); display:inline-flex; align-items:center; justify-content:center; opacity:0; transition:opacity .16s ease .04s, filter .15s ease; } .liq-field--nahtlos.is-offen .liq-field__sichern{ opacity:1; } .liq-field--nahtlos.is-offen > .liq-field__zeile > b{ padding-right:52px; } .liq-field__sichern:hover{ filter:brightness(1.08); } .liq-field__sichern:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } @media (prefers-reduced-motion: reduce){ .liq-field__sichern{ transition:none; } } .liq-field__zahl{ display:inline-flex; flex:none; align-items:center; gap:6px; } .liq-field__zahlbtn{ flex:none; width:30px; height:30px; border-radius:6px; cursor:pointer; border:1px solid color-mix(in srgb,var(--text,#fff) 16%,transparent); background:color-mix(in srgb,var(--text,#fff) 6%,transparent); color:var(--text,#e9eef6); font:inherit; font-size:var(--text-14); font-weight:700; line-height:1; display:inline-flex; align-items:center; justify-content:center; opacity:0; transition:opacity .16s ease .04s, background-color .15s ease; } .liq-field--nahtlos.is-offen .liq-field__zahlbtn{ opacity:1; } .liq-field__zahlbtn:hover{ background:color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-field__zahlbtn:disabled{ opacity:.35; cursor:not-allowed; } .liq-field--nahtlos.is-offen .liq-field__zahlbtn:disabled{ opacity:.35; } .liq-field__zahlbtn:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-field__wahl{ display:inline-flex; flex:none; gap:2px; padding:2px; border-radius:10px; background:color-mix(in srgb,var(--text,#fff) 7%,transparent); opacity:0; transition:opacity .16s ease .04s; } .liq-field--nahtlos.is-offen .liq-field__wahl{ opacity:1; } .liq-field__wahlopt{ min-width:38px; height:26px; padding:0 10px; border:0; border-radius:6px; cursor:pointer; font:inherit; font-size:var(--text-12); font-weight:650; color:var(--muted,#8892a4); background:transparent; display:inline-flex; align-items:center; justify-content:center; } .liq-field__wahlopt:hover{ color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-field__wahlopt.is-an{ color:#fff; background:var(--accent,#4f8ef7); } .liq-field__wahlopt:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } @media (prefers-reduced-motion: reduce){ .liq-field__zahlbtn, .liq-field__wahl{ transition:none; } } .liq-field--nahtlos{ position:relative; min-width:0; } .liq-field__frei{ flex:1 1 100%; margin-top:6px; font-size:var(--text-11,11.5px); line-height:1.4; color:var(--ink-soft,#c2cad8); } .liq-field__frei[hidden]{ display:none; } .liq-field__unten{ position:absolute; left:0; right:0; top:calc(100% - 1px); z-index:40; border-radius:0 0 12px 12px; box-sizing:border-box; background:color-mix(in srgb,var(--accent,#4f8ef7) 7%,var(--surface,#1d1d1d)); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); border-top:0; overflow:hidden; height:0; transition:height .2s cubic-bezier(.2,.75,.3,1); } @media (prefers-reduced-motion: reduce){ .liq-field__unten{ transition:none; } } @media (prefers-reduced-transparency: reduce){ .liq-field__unten{ background:var(--surface,#1d1d1d); } } @media (prefers-reduced-motion: reduce){ .liq-field__unten{ transition:none; transform:none; } } .liq-field__unten > *{ margin:8px; } .liq-field__unten--frei{ position:fixed; left:auto; right:auto; top:auto; z-index:1200; } .liq-field__liste{ display:flex; flex-direction:column; gap:2px; max-height:264px; overflow-y:auto; min-height:0; overscroll-behavior:contain; } .liq-field__listopt{ display:flex; align-items:center; gap:9px; min-height:40px; padding:0 11px; border:0; border-radius:6px; cursor:pointer; text-align:left; width:100%; font:inherit; font-size:var(--text-13); color:var(--text,#e9eef6); background:transparent; } .liq-field__listopt:hover{ background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-field__listopt.is-an{ background:color-mix(in srgb,var(--accent,#4f8ef7) 20%,transparent); font-weight:650; } .liq-field__listopt:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } .liq-field__listopt{ padding-left:13px; } @media (max-width:440px){ .liq-field--nahtlos{ display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; column-gap:10px; row-gap:2px; min-height:var(--liq-feldzeile-mobil, 64px); align-content:center; } .liq-field--nahtlos > i{ flex:0 0 100%; } .liq-field--nahtlos .liq-field__val, .liq-field--nahtlos .liq-field__inline{ flex:1 1 4rem; min-width:4rem; min-height:30px; display:flex; align-items:center; } .liq-field--nahtlos .liq-field__sichern, .liq-field--nahtlos .liq-field__zahl, .liq-field--nahtlos .liq-field__wahl{ flex:none; } } @media (prefers-reduced-motion: reduce){ .liq-field--nahtlos, .liq-field__hint{ transition:none; } } .liq-field__pop{ display:flex; gap:6px; align-items:center; padding:7px 8px; box-sizing:border-box; border-radius:10px; background:color-mix(in srgb,var(--surface,#1d1d1d) 92%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); box-shadow:0 8px 26px rgba(4,8,20,.32); } .liq-field__pop[hidden]{ display:none; } .liq-field__pop .liq-field__in{ flex:1; min-width:0; font:inherit; font-size:var(--text-13); font-weight:500; padding:8px 10px; border-radius:10px; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 14%,transparent); } .liq-field__pop .liq-field__in:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-field__pop .liq-field__einheit{ align-self:center; padding:0 2px 0 6px; font-size:var(--text-12); color:var(--muted,#8892a4); white-space:nowrap; } .liq-field__commit{ min-height:38px; padding:0 14px; border-radius:10px; flex:none; cursor:pointer; font:inherit; font-size:var(--text-12); font-weight:650; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--accent,#4f8ef7) 18%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 42%,transparent); } .liq-field__commit:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 28%,transparent); } .liq-field__commit:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-field__pop--pick{ flex-direction:column; align-items:stretch; gap:3px; padding:8px; } .liq-field__opt{ display:flex; align-items:center; text-align:left; width:100%; min-height:44px; padding:0 12px; border:0; border-radius:10px; cursor:pointer; font:inherit; font-size:var(--text-13); font-weight:600; color:var(--text,#e9eef6); background:transparent; } .liq-field__opt:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); } .liq-field__opt.is-sel{ background:var(--accent,#4f8ef7); color:#fff; font-weight:650; } .liq-field__opt:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } .liq-field__step{ width:40px; height:40px; flex:none; border-radius:10px; cursor:pointer; font:inherit; font-size:17px; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 6%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 14%,transparent); } .liq-field__step:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 45%,transparent); } .liq-field__stepv{ flex:1; min-width:0; text-align:center; font:inherit; font-size:var(--text-13); font-weight:650; font-variant-numeric:tabular-nums; color:var(--text,#e9eef6); } .liq-field__pop--date{ flex-direction:column; align-items:stretch; width:min(300px,100%); } .liq-field__leaf{ min-height:300px; } .liq-field__leaf .liq-dp{ width:100%; } .liq-field__calf{ display:flex; gap:6px; padding-top:8px; } .liq-field__calf .liq-field__commit{ flex:1; } @media (prefers-reduced-transparency:reduce){ .liq-field__pop{ background:var(--surface,#1d1d1d); } } .liq-field--herkunft.is-ki{ border-radius:10px; padding:9px 12px; border:1px dashed color-mix(in srgb, var(--ki,#f5a524) 46%, transparent); background-color:color-mix(in srgb, var(--ki,#f5a524) 6%, transparent); box-shadow:0 0 0 1px color-mix(in srgb, var(--ki,#f5a524) 34%, transparent), 0 0 16px -5px color-mix(in srgb, var(--ki,#f5a524) 48%, transparent); } @media (prefers-reduced-transparency: reduce){ .liq-field--herkunft.is-ki{ box-shadow:0 0 0 1px color-mix(in srgb, var(--ki,#f5a524) 55%, transparent); } } .liq-field__ok{ min-height:32px; padding:0 13px; border-radius:999px; cursor:pointer; border:0; font:inherit; font-size:var(--text-12); font-weight:700; color:#fff; display:inline-flex; align-items:center; gap:5px; background:var(--success,#35ad76); } .liq-field__ok:hover{ filter:brightness(1.06); } .liq-field__ok svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:3; } .liq-field__herkunft .liq-field__acts{ margin-left:auto; display:inline-flex; gap:7px; align-items:center; } .liq-abnahme{ border-radius:14px; overflow:hidden; border:1px solid color-mix(in srgb,var(--text,#fff) 9%,transparent); background:color-mix(in srgb,var(--surface,#1d1d1d) 70%,transparent); } .liq-abnahme__head{ display:flex; align-items:center; gap:12px; padding:15px 17px 14px; border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-abnahme__head .t{ font-weight:640; font-size:var(--text-14); line-height:1.35; } .liq-abnahme__head .s{ font-size:var(--text-11); color:var(--muted,#8892a4); line-height:1.45; margin-top:2px; } .liq-abnahme__bulk{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:12px 17px; background:color-mix(in srgb,var(--accent,#4f8ef7) 9%,transparent); border-bottom:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 22%,transparent); } .liq-abnahme__bulk .bx{ font-size:var(--text-12); font-weight:640; flex:1; min-width:0; line-height:1.4; } .liq-abnahme__bulk .bx small{ display:block; font-weight:500; color:var(--muted,#8892a4); font-size:var(--text-11); line-height:1.45; margin-top:3px; } .liq-abnahme__row{ display:flex; align-items:center; gap:13px; padding:11px 17px; min-height:56px; box-sizing:border-box; border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 5%,transparent); } .liq-abnahme__row:last-child{ border-bottom:0; } .liq-abnahme__check{ width:22px; height:22px; flex:none; border-radius:6px; cursor:pointer; position:relative; border:1.5px solid color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); display:inline-flex; align-items:center; justify-content:center; color:#fff; } .liq-abnahme__check::after{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:44px; height:44px; } .liq-abnahme__check.is-on{ background:var(--accent,#4f8ef7); border-color:transparent; } .liq-abnahme__check svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; opacity:0; } .liq-abnahme__check.is-on svg{ opacity:1; } .liq-abnahme__check:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-abnahme__f{ flex:1; min-width:0; } .liq-abnahme__f .lab{ font-size:var(--text-11); color:var(--muted,#8892a4); line-height:1.4; margin-bottom:2px; } .liq-abnahme__f .val{ font-size:var(--text-14); font-weight:600; line-height:1.4; display:flex; align-items:center; gap:9px; flex-wrap:wrap; } .liq-abnahme__hk{ font-size:var(--text-10); color:var(--ki,#f5a524); font-weight:600; display:inline-flex; align-items:center; gap:4px; white-space:nowrap; } .liq-abnahme__hk::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--ki,#f5a524); flex:none; } .liq-abnahme__hk--mensch{ color:var(--muted,#8892a4); } .liq-abnahme__hk--mensch::before{ background:color-mix(in srgb,var(--text,#fff) 35%,transparent); } .liq-abnahme__lock{ display:inline-flex; align-items:center; gap:4px; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-abnahme__lock svg{ width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:2; } .liq-abnahme__row--frage{ background:color-mix(in srgb,var(--accent,#4f8ef7) 6%,transparent); } .liq-abnahme__frage{ font-size:var(--text-10); font-weight:650; color:var(--accent,#7fb0ff); display:inline-flex; align-items:center; gap:5px; } .liq-abnahme__row--pruefung{ background:color-mix(in srgb,var(--danger,#e55353) 7%,transparent); box-shadow:inset 3px 0 0 color-mix(in srgb,var(--danger,#e55353) 62%,transparent); } .liq-abnahme__pruef{ font-size:var(--text-10); font-weight:650; color:var(--danger,#e0736f); display:inline-flex; align-items:center; gap:5px; white-space:nowrap; } .liq-abnahme__pruef svg{ width:11px; height:11px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; flex:none; } .liq-abnahme__check.is-gesperrt{ cursor:not-allowed; border-color:color-mix(in srgb,var(--danger,#e55353) 45%,transparent); border-style:dashed; background:transparent; pointer-events:none; } .liq-abnahme__row--pruefung .liq-abnahme__check{ cursor:not-allowed; } .liq-abnahme__check.is-gesperrt svg{ opacity:0; } .liq-abnahme__nach{ min-height:32px; padding:0 12px; border-radius:999px; cursor:pointer; border:0; font:inherit; font-size:var(--text-12); font-weight:650; flex:none; display:inline-flex; align-items:center; gap:5px; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--danger,#e55353) 20%,transparent); } .liq-abnahme__nach:hover{ background:color-mix(in srgb,var(--danger,#e55353) 30%,transparent); } .liq-abnahme__nach svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2.2; } .liq-abnahme__nach:focus-visible{ outline:2px solid var(--danger,#e55353); outline-offset:2px; } @media (prefers-reduced-transparency:reduce){ .liq-abnahme{ background:var(--surface,#1d1d1d); } .liq-abnahme__bulk{ background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,var(--surface,#1d1d1d)); } .liq-abnahme__row--pruefung{ background:color-mix(in srgb,var(--danger,#e55353) 15%,var(--surface,#1d1d1d)); } .liq-abnahme__nach{ background:color-mix(in srgb,var(--danger,#e55353) 34%,var(--surface,#1d1d1d)); } } .liq-maske{ display:inline-flex; align-items:center; gap:9px; flex-wrap:wrap; } .liq-maske__wert{ font-variant-numeric:tabular-nums; letter-spacing:.02em; } .liq-maske__wert--zu{ color:var(--muted,#8892a4); } .liq-maske__auf{ min-height:30px; padding:0 12px; border-radius:999px; cursor:pointer; border:0; font:inherit; font-family:inherit; font-size:var(--text-12); font-weight:650; flex:none; display:inline-flex; align-items:center; gap:6px; color:var(--text,#e9eef6); background:color-mix(in srgb,var(--accent,#4f8ef7) 18%,transparent); } .liq-maske__auf:hover{ background:color-mix(in srgb,var(--accent,#4f8ef7) 28%,transparent); } .liq-maske__auf:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-maske__auf svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2.1; } .liq-maske__vermerkt{ display:inline-flex; align-items:center; gap:6px; flex:none; font-size:var(--text-11); font-weight:600; color:var(--ki,#f5a524); white-space:nowrap; } .liq-maske__vermerkt svg{ width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:2.2; } .liq-maske__frist{ position:relative; width:34px; height:3px; border-radius:999px; flex:none; background:color-mix(in srgb,var(--text,#fff) 13%,transparent); overflow:hidden; } .liq-maske__frist::after{ content:''; position:absolute; inset:0 auto 0 0; width:calc(var(--rest,1) * 100%); background:var(--warning,#f59e0b); transition:width .5s linear; } @media (prefers-reduced-motion: reduce){ .liq-maske__frist::after{ transition:none; } } .liq-paket{ display:flex; flex-direction:column; min-height:0; gap:0; border-radius:14px; overflow:clip; border:1px solid color-mix(in srgb,var(--text,#fff) 10%,transparent); background:color-mix(in srgb,var(--surface,#1d1d1d) 55%,transparent); } .liq-paket__head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:17px 18px 16px; background:color-mix(in srgb,var(--surface,#1d1d1d) 92%,transparent); border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 9%,transparent); } .liq-paket__head .t{ font-weight:650; font-size:var(--text-15,15px); line-height:1.3; } .liq-paket__head .s{ font-size:var(--text-11); color:var(--muted,#8892a4); line-height:1.45; margin-top:3px; } .liq-paket__zahl{ margin-left:auto; display:flex; align-items:center; gap:9px; flex:none; } .liq-paket__zahl .n{ font-size:var(--text-12); font-weight:650; font-variant-numeric:tabular-nums; } .liq-paket__bar{ width:96px; height:5px; border-radius:999px; flex:none; overflow:hidden; background:color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-paket__bar i{ display:block; height:100%; border-radius:999px; background:var(--success,#3ecf8e); width:var(--wert, 0%); transition:width .3s ease; } .liq-paket__stapel{ display:flex; flex-direction:column; gap:14px; padding:16px 18px 18px; min-height:0; } .liq-abnahme--erledigt{ opacity:.55; } .liq-abnahme--erledigt .liq-abnahme__head{ border-bottom:0; } .liq-abnahme--erledigt > :not(.liq-abnahme__head){ display:none; } .liq-abnahme__fertig{ margin-left:auto; font-size:var(--text-11); font-weight:650; flex:none; color:var(--success,#3ecf8e); display:inline-flex; align-items:center; gap:5px; } .liq-abnahme__fertig svg{ width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; } @media (prefers-reduced-transparency:reduce){ .liq-paket{ background:var(--surface,#1d1d1d); } } .liq-conflict{ border-radius:14px; padding:13px; display:flex; flex-direction:column; gap:9px; border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 7%,transparent); } .liq-conflict__h{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; } .liq-conflict__h .t{ font-weight:600; font-size:var(--text-14); } .liq-conflict__cand{ display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:10px; cursor:pointer; background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1.5px solid transparent; text-align:left; width:100%; font:inherit; color:var(--text,#e9eef6); } .liq-conflict__cand:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 40%,transparent); } .liq-conflict__cand.is-on{ border-color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 14%,transparent); } .liq-conflict__cand:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-conflict__radio{ width:20px; height:20px; flex:none; border-radius:50%; border:2px solid color-mix(in srgb,var(--text,#fff) 30%,transparent); } .liq-conflict__cand.is-on .liq-conflict__radio{ border-color:var(--accent,#4f8ef7); box-shadow:inset 0 0 0 4px var(--accent,#4f8ef7); } .liq-conflict__v{ flex:1; min-width:0; } .liq-conflict__v .val{ display:block; font-size:var(--text-14); font-weight:650; } .liq-conflict__v .src{ display:block; font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:2px; } .liq-conflict__foot{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:2px; } .liq-conflict__note{ font-size:var(--text-11); color:var(--muted,#8892a4); flex:1; min-width:160px; } @media (prefers-reduced-transparency:reduce){ .liq-conflict{ background:var(--surface,#1d1d1d); } } .liq-conflict--gefahr{ border-color:color-mix(in srgb,var(--danger,#e0736f) 45%,transparent); background:color-mix(in srgb,var(--danger,#e0736f) 7%,transparent); } .liq-conflict--gefahr .liq-conflict__h .t{ color:var(--danger,#e0736f); } .liq-conflict--gefahr .liq-conflict__cand{ background:color-mix(in srgb,var(--surface,#1d1d1d) 78%,transparent); } @media (prefers-reduced-transparency:reduce){ .liq-conflict--gefahr{ background:var(--surface,#1d1d1d); border-width:2px; } .liq-conflict--gefahr .liq-conflict__cand{ background:color-mix(in srgb,var(--text,#fff) 6%,var(--surface,#1d1d1d)); } } .liq-statuspill{ display:inline-flex; align-items:center; gap:6px; font-size:var(--text-11); font-weight:700; padding:4px 11px; border-radius:999px; } .liq-statuspill::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--punkt,currentColor); flex:none; } .liq-statuspill--ok{ color:var(--success,#35ad76); background:color-mix(in srgb,var(--success,#35ad76) 15%,transparent); } .liq-statuspill--off{ color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-statuspill--warn{ color:var(--warning,#f59e0b); background:color-mix(in srgb,var(--warning,#f59e0b) 16%,transparent); } .liq-statuspill--info{ color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 15%,transparent); } .liq-statuspill--no{ color:var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 14%,transparent); } .liq-rolepill{ display:inline-flex; align-items:center; gap:6px; font-size:var(--text-11); font-weight:700; line-height:1; padding:4px 10px 4px 8px; border-radius:999px; white-space:nowrap; color:var(--rp-c,var(--accent,#4f8ef7)); background:color-mix(in srgb,var(--rp-c,var(--accent,#4f8ef7)) 15%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rp-c,var(--accent,#4f8ef7)) 34%,transparent); } .liq-rolepill::before{ content:''; width:7px; height:7px; border-radius:50%; background:currentColor; flex:none; } .liq-rolepill--inhaber{ --rp-c:var(--role-inhaber,#e0b64d); } .liq-rolepill--leitung{ --rp-c:var(--role-leitung,#f472b6); } .liq-rolepill--arzt{ --rp-c:var(--accent,#4f8ef7); } .liq-rolepill--mtr{ --rp-c:var(--success,#3ecf8e); } .liq-rolepill--stamm{ --rp-c:#9dc1f9; } .liq-rolepill--student{ --rp-c:var(--warning,#f59e0b); } .liq-rolepill--neutral, .liq-rolepill--extern{ --rp-c:var(--muted,#8892a4); background:color-mix(in srgb,var(--muted,#8892a4) 8%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--muted,#8892a4) 20%,transparent); } .liq-rolepill.is-solid{ color:#0f1117; background:var(--rp-c,var(--accent,#4f8ef7)); box-shadow:none; } .liq-rolepill.is-solid::before{ background:color-mix(in srgb,#0f1117 55%,transparent); } .liq-guidedflow{ border-radius:14px; padding:16px; background:color-mix(in srgb, var(--surface,#1d1d1d) 80%, transparent); border:1px solid color-mix(in srgb, var(--text,#fff) 9%, transparent); } .liq-guidedflow__prog{ height:4px; border-radius:999px; overflow:hidden; margin-bottom:14px; background:color-mix(in srgb, var(--text,#fff) 10%, transparent); } .liq-guidedflow__prog i{ display:block; height:100%; background:var(--accent,#4f8ef7); border-radius:999px; } .liq-guidedflow__t{ font-size:16px; font-weight:650; margin:0 0 2px; } .liq-guidedflow__q{ font-size:var(--text-12); color:var(--muted,#8892a4); margin:0 0 12px; } .liq-guidedflow__weiter{ width:100%; min-height:50px; margin-top:11px; border-radius:10px; border:0; display:inline-flex; align-items:center; justify-content:center; text-align:center; cursor:pointer; font:inherit; font-size:var(--text-14); font-weight:700; color:#fff; background:var(--accent-gradient,var(--accent,#4f8ef7)); } .liq-guidedflow__aktionen{ position:sticky; bottom:0; z-index:2; display:flex; flex-direction:column; padding-bottom:max(6px, env(safe-area-inset-bottom)); background:linear-gradient(to bottom, transparent, var(--bg,#0d1117) 34%); } .liq-guidedflow__spring{ display:flex; align-items:center; justify-content:center; width:100%; min-height:44px; margin-top:2px; padding:8px 14px; border-radius:10px; border:1px solid var(--border,#333333); background:none; cursor:pointer; font:inherit; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-guidedflow__spring:hover{ color:var(--text,#e9eef6); border-color:var(--accent,#4f8ef7); } .liq-guidedflow__spring:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-guidedflow__zurueck{ display:flex; align-items:center; justify-content:center; width:100%; min-height:50px; margin-top:8px; border-radius:10px; gap:.5rem; font:inherit; font-size:var(--text-14); font-weight:600; cursor:pointer; background:none; border:1px solid color-mix(in srgb, var(--text,#fff) 14%, transparent); color:var(--muted,#8892a4); transition:color .15s ease, border-color .15s ease; } .liq-guidedflow__zurueck:hover{ color:var(--text,#e9eef6); border-color:color-mix(in srgb, var(--text,#fff) 28%, transparent); } .liq-guidedflow__zurueck:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-guidedflow--danger .liq-guidedflow__prog i{ background:var(--danger,#e55353); } .liq-guidedflow--danger .liq-guidedflow__weiter{ background:var(--danger,#e55353); } .liq-weekrow{ display:flex; align-items:center; gap:12px; min-height:52px; padding:6px 12px; border-radius:10px; background:color-mix(in srgb, var(--text,#fff) 4%, transparent); border:1px solid color-mix(in srgb, var(--text,#fff) 8%, transparent); } .liq-weekrow.is-off{ opacity:.5; } .liq-weekrow__tag{ flex:0 0 42px; font-size:var(--text-13); font-weight:650; } .liq-weekrow__sw{ flex:none; width:42px; height:24px; border-radius:999px; cursor:pointer; position:relative; background:color-mix(in srgb, var(--text,#fff) 14%, transparent); } .liq-weekrow__sw::after{ content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:transform .2s; } .liq-weekrow:not(.is-off) .liq-weekrow__sw{ background:var(--accent,#4f8ef7); } .liq-weekrow:not(.is-off) .liq-weekrow__sw::after{ transform:translateX(18px); } .liq-weekrow__step{ margin-left:auto; flex:none; display:inline-flex; align-items:center; gap:8px; } .liq-weekrow.is-off .liq-weekrow__step{ visibility:hidden; } .liq-weekrow__btn{ width:34px; height:34px; border-radius:10px; border:0; cursor:pointer; font:inherit; font-size:17px; font-weight:700; color:var(--text,#e9eef6); position:relative; background:color-mix(in srgb, var(--text,#fff) 10%, transparent); } .liq-weekrow__btn::after{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:44px; height:44px; } .liq-weekrow__val{ min-width:44px; text-align:center; font-weight:650; font-variant-numeric:tabular-nums; } .liq-weeksum{ display:flex; align-items:center; gap:10px; margin-top:11px; padding:11px 13px; border-radius:10px; font-size:var(--text-13); background:color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); border:1px solid color-mix(in srgb, var(--accent,#4f8ef7) 30%, transparent); } .liq-weeksum b{ font-family:'Bricolage Grotesque',sans-serif; font-size:19px; font-weight:600; } .liq-autimeline{ padding:13px 14px; border-radius:14px; background:color-mix(in srgb, var(--text,#fff) 4%, transparent); border:1px solid color-mix(in srgb, var(--text,#fff) 9%, transparent); } .liq-autimeline__bar{ position:relative; height:30px; border-radius:6px; margin:6px 0; background:color-mix(in srgb, var(--text,#fff) 6%, transparent); } .liq-autimeline__seg{ position:absolute; top:0; bottom:0; border-radius:6px; background:color-mix(in srgb, var(--danger,#e0736f) 60%, transparent); } .liq-autimeline__seg.is-now{ background:var(--danger,#e0736f); } .liq-autimeline__mon{ display:flex; justify-content:space-between; font-size:var(--text-10); color:var(--muted,#8892a4); margin-top:2px; } .liq-autimeline__schwelle{ margin-top:10px; font-size:var(--text-12); } .liq-autimeline__schwelle b{ font-family:'Bricolage Grotesque',sans-serif; font-size:16px; } .liq-navitem__dot{ margin-left:auto; flex:none; width:8px; height:8px; border-radius:50%; background:var(--warning,#f59e0b); } .liq-navitem__dot--ok{ background:var(--success,#35ad76); } .liq-navitem__dot--no{ background:var(--danger,#e0736f); } .liq-navitem__lock{ margin-left:auto; flex:none; width:14px; height:14px; opacity:.6; fill:none; stroke:currentColor; stroke-width:2; } .liq-rail__head{ display:flex; align-items:center; gap:11px; padding:12px 12px 14px; margin-bottom:4px; border-bottom:1px solid color-mix(in srgb, var(--text,#fff) 8%, transparent); } .liq-rail__ava{ flex:none; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; font-size:var(--text-13); font-weight:800; color:#fff; background:color-mix(in srgb, var(--accent,#4f8ef7) 55%, transparent); } .liq-rail__hmeta{ flex:1 1 auto; min-width:0; } .liq-rail__hname{ font-size:var(--text-14); font-weight:650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-rail__hsub{ font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:1px; } .liq-rail__hbar{ height:4px; border-radius:999px; margin-top:6px; overflow:hidden; background:color-mix(in srgb, var(--text,#fff) 10%, transparent); } .liq-rail__hbar i{ display:block; height:100%; background:var(--accent,#4f8ef7); border-radius:999px; } .liq-rail.is-collapsed .liq-rail__hmeta{ display:none; } .liq-listrow{ display:flex; align-items:center; gap:12px; width:100%; box-sizing:border-box; min-width:0; padding:10px 12px; border-radius:10px; border:1px solid transparent; background:none; cursor:pointer; text-align:left; text-decoration:none; color:var(--ink-soft,#c2cad8); font:inherit; transition:transform .2s var(--ease-liquid,cubic-bezier(.34,1.56,.64,1)), box-shadow .3s var(--ease-soft,ease), background .15s ease, color .15s ease; } @media (hover: hover){ .liq-listrow:hover{ background:rgba(255,255,255,.05); color:var(--text,#e9eef6); transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } } .liq-listrow:focus-visible{ outline:none; color:var(--text,#e9eef6); transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .liq-listrow:active{ transform:var(--liq-press,scale(.98)); } .liq-listrow.is-active{ background:var(--accent-soft,rgba(79,142,247,.18)); color:#cfe0fd; box-shadow:inset 2px 0 0 var(--accent,#4f8ef7), 0 0 18px -6px color-mix(in srgb,var(--accent,#4f8ef7) 70%, transparent); } @media (prefers-reduced-transparency:reduce){ .liq-listrow.is-active{ box-shadow:inset 2px 0 0 var(--accent,#4f8ef7); } } .liq-listrow__av{ position:relative; flex:none; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; font-size:var(--text-13); font-weight:800; color:#fff; background:color-mix(in srgb,var(--accent,#4f8ef7) 55%, transparent); } .liq-listrow__av svg{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-listrow__pres{ position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border-radius:50%; background:var(--success,#35ad76); box-shadow:0 0 0 2px var(--surface,#1d1d1d); } .liq-listrow__pres--away{ background:var(--warning,#f59e0b); } .liq-listrow__pres--off{ background:color-mix(in srgb,var(--muted,#8892a4) 80%, transparent); } @media (pointer:coarse){ .liq-listrow{ min-height:44px; } } .liq-listrow--kompakt{ padding:4px 8px; gap:9px; } .liq-listrow--kompakt .liq-listrow__body{ gap:0; } .liq-listrow--kompakt .liq-listrow__title{ font-size:var(--text-13); line-height:1.25; } .liq-listrow--kompakt .liq-listrow__sub{ font-size:var(--text-11); line-height:1.25; } .liq-listrow--kompakt .liq-listrow__av, .liq-listrow--kompakt .liq-avatar{ width:24px; height:24px; font-size:var(--text-10); } .liq-stepdots{ display:inline-flex; align-items:center; gap:5px; flex:none; } .liq-stepdots__dot{ width:7px; height:7px; border-radius:50%; flex:none; background:color-mix(in srgb,var(--text,#fff) 16%,transparent); } .liq-stepdots__dot.is-ok{ background:var(--accent,#4f8ef7); } .liq-stepdots__dot.is-skip{ background:color-mix(in srgb,var(--warning,#f59e0b) 80%,transparent); } .liq-stepdots__dot.is-teil{ background:linear-gradient(90deg, var(--accent,#4f8ef7) 0 50%, color-mix(in srgb,var(--text,#fff) 16%,transparent) 50% 100%); } @media (pointer:coarse){ .liq-stepdots{ gap:6px; } .liq-stepdots__dot{ width:8px; height:8px; } } @media (prefers-contrast:more){ .liq-stepdots__dot{ box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text,#fff) 45%,transparent); } } .liq-listrow__body{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:1px; } .liq-listrow__top{ display:flex; align-items:center; gap:7px; min-width:0; } .liq-listrow__title{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--text-14); font-weight:600; } .liq-listen-eng .liq-listrow__title, .liq-listrow.liq-listen-eng .liq-listrow__title{ flex:0 1 auto; } @media (max-width:560px){ .liq-listrow--endeumbruch{ flex-wrap:wrap; } .liq-listrow--endeumbruch .liq-listrow__body{ flex:1 1 0; min-width:0; } .liq-listrow--endeumbruch .liq-listrow__end{ order:3; width:100%; flex-direction:row; align-items:center; justify-content:flex-start; padding-top:4px; } .liq-listrow--endeumbruch .liq-listrow__end > *{ width:100%; justify-content:flex-start; } .liq-listrow--endeumbruch .liq-listrow__end .liq-wahlchip{ flex:1 1 0; justify-content:center; } } .liq-listrow__lock{ flex:none; width:13px; height:13px; opacity:.55; fill:none; stroke:currentColor; stroke-width:2; } .liq-listrow__time{ flex:none; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-listrow__sub{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-listrow--umbruch .liq-listrow__title, .liq-listrow--umbruch .liq-listrow__sub{ white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; } .liq-listrow--umbruch{ align-items:flex-start; } .liq-listrow__quelle{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--text-11,11px); letter-spacing:.04em; text-transform:uppercase; color:var(--muted,#8892a4); } .liq-strecke{ display:flex; align-items:stretch; } .liq-strecke__stn{ flex:1 1 0; min-width:74px; position:relative; padding:26px 6px 0; text-align:center; } .liq-strecke__stn::before{ content:''; position:absolute; top:9px; left:0; right:0; height:2px; background:color-mix(in srgb,var(--ink,#fff) 13%,transparent); } .liq-strecke__stn:first-child::before{ left:50%; } .liq-strecke__stn:last-child::before{ right:50%; } .liq-strecke__stn::after{ content:''; position:absolute; top:4px; left:50%; transform:translateX(-50%); width:12px; height:12px; border-radius:50%; box-sizing:border-box; border:2px solid color-mix(in srgb,var(--ink,#fff) 26%,transparent); background:var(--bg-deep,#0b0d13); } .liq-strecke__l{ font-size:var(--text-11,11.5px); color:var(--ink-soft,#c2cad8); line-height:1.35; } .liq-strecke__stn--ok::after{ background:var(--success,#3ecf8e); border-color:var(--success,#3ecf8e); } .liq-strecke__stn--ok::before{ background:color-mix(in srgb,var(--success,#3ecf8e) 55%,transparent); } .liq-strecke__stn--stopp::after{ background:var(--danger,#e55353); border-color:var(--danger,#e55353); box-shadow:0 0 0 4px color-mix(in srgb,var(--danger,#e55353) 22%,transparent); } .liq-strecke__stn--stopp .liq-strecke__l{ color:var(--danger,#e55353); font-weight:600; } .liq-strecke__stn--danach::before{ background:none; background-image:repeating-linear-gradient(90deg, color-mix(in srgb,var(--ink,#fff) 20%,transparent) 0 4px, transparent 4px 8px); } .liq-strecke__stn--danach .liq-strecke__l{ color:var(--subtle,#5a6377); } .liq-strecke__stn--warte::after{ background:var(--warning,#f59e0b); border-color:var(--warning,#f59e0b); } .liq-strecke__stn--warte::before{ background:color-mix(in srgb,var(--warning,#f59e0b) 45%,transparent); } .liq-strecke__stn--unbek .liq-strecke__l{ color:var(--subtle,#5a6377); } @media (max-width:560px){ .liq-strecke{ flex-direction:column; } .liq-strecke__stn{ flex:none; min-width:0; padding:0 0 0 26px; text-align:left; min-height:34px; display:flex; align-items:center; } .liq-strecke__stn::before{ top:0; bottom:0; left:5px; right:auto; width:2px; height:auto; } .liq-strecke__stn:first-child::before{ top:50%; } .liq-strecke__stn:last-child::before{ bottom:50%; right:auto; } .liq-strecke__stn::after{ top:50%; left:5px; transform:translate(-50%,-50%); } .liq-strecke__stn--danach::before{ background-image:repeating-linear-gradient(180deg, color-mix(in srgb,var(--ink,#fff) 20%,transparent) 0 4px, transparent 4px 8px); } } .liq-sperre{ display:flex; align-items:center; gap:9px; margin-top:15px; padding-top:13px; border-top:1px solid var(--trennlinie,rgba(255,255,255,.07)); font-size:var(--text-12,12.5px); color:var(--muted,#8892a4); } .liq-sperre svg{ width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; } .liq-sperre--offen{ color:var(--danger,#e55353); font-weight:600; } .liq-strecke-frisch{ margin-top:11px; font-size:var(--text-11,11.5px); color:var(--subtle,#5a6377); } .liq-listrow__end{ flex:none; display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:5px; } .liq-listrow__end--reihe{ flex-direction:row; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:10px; } .liq-listrow__chev{ flex:none; width:16px; height:16px; opacity:.5; fill:none; stroke:currentColor; stroke-width:2; } .liq-listrow.is-unread .liq-listrow__title{ font-weight:750; color:var(--text,#e9eef6); } .liq-listrow.is-unread .liq-listrow__sub{ color:var(--text,#e9eef6); } @media (prefers-reduced-motion:reduce){ .liq-listrow:hover, .liq-listrow:focus-visible{ transform:none; } } .liq-error{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; padding:30px 20px; border-radius:14px; background:color-mix(in srgb,var(--danger,#e0736f) 6%,transparent); border:1px solid color-mix(in srgb,var(--danger,#e0736f) 22%,transparent); } .liq-error__ic{ width:32px; height:32px; fill:none; stroke:var(--danger,#e0736f); stroke-width:1.7; } .liq-error__t{ font-size:var(--text-14); font-weight:650; color:var(--text,#e9eef6); } .liq-error__m{ font-size:var(--text-12); color:var(--muted,#8892a4); max-width:44ch; line-height:1.5; } .liq-error__retry{ margin-top:5px; min-height:40px; padding:0 18px; border-radius:10px; border:0; cursor:pointer; font:inherit; font-size:var(--text-13); font-weight:650; color:#fff; background:var(--danger,#e0736f); } .liq-error__retry:hover{ filter:brightness(1.06); } .liq-betaband{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; box-sizing:border-box; min-height:26px; padding:4px 12px; cursor:pointer; font-size:var(--text-11); font-weight:700; letter-spacing:.03em; font-variant-numeric:tabular-nums; color:var(--warning,#f59e0b); background:color-mix(in srgb,var(--warning,#f59e0b) 12%,transparent); border-bottom:1px solid color-mix(in srgb,var(--warning,#f59e0b) 28%,transparent); } .liq-betaband__tag{ font-weight:800; padding:1px 7px; border-radius:6px; background:color-mix(in srgb,var(--warning,#f59e0b) 22%,transparent); } .liq-guardstrip{ display:flex; align-items:center; gap:11px; width:100%; box-sizing:border-box; padding:8px 14px; font-size:var(--text-12); color:var(--text,#e9eef6); background:color-mix(in srgb,var(--warning,#f59e0b) 13%,transparent); border-bottom:1px solid color-mix(in srgb,var(--warning,#f59e0b) 32%,transparent); } .liq-guardstrip__dot{ flex:none; width:9px; height:9px; border-radius:50%; background:var(--warning,#f59e0b); animation:liqGuardPulse 1.8s ease-in-out infinite; } @keyframes liqGuardPulse{ 0%,100%{ box-shadow:0 0 0 0 color-mix(in srgb,var(--warning,#f59e0b) 60%,transparent); } 50%{ box-shadow:0 0 0 6px transparent; } } @media (prefers-reduced-motion:reduce){ .liq-guardstrip__dot{ animation:none; } } .liq-guardstrip__txt{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-guardstrip__who{ font-weight:650; } .liq-guardstrip__count{ flex:none; font-variant-numeric:tabular-nums; font-weight:700; } .liq-guardstrip__stop{ flex:none; min-height:32px; padding:0 13px; border-radius:6px; border:0; cursor:pointer; font:inherit; font-size:var(--text-12); font-weight:700; color:#fff; background:var(--danger,#e0736f); } .liq-guardstrip__stop:hover{ filter:brightness(1.06); } .liq-deciderow{ display:flex; gap:10px; flex-wrap:wrap; } .liq-deciderow__act{ flex:1 1 0; min-width:132px; min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 16px; border-radius:10px; cursor:pointer; font:inherit; font-size:var(--text-14); font-weight:650; color:var(--text,#e9eef6); border:1px solid color-mix(in srgb,var(--text,#fff) 14%,transparent); background:color-mix(in srgb,var(--text,#fff) 5%,transparent); } .liq-deciderow__act svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; } .liq-deciderow__act:hover{ transform:translateY(-1px); box-shadow:var(--liq-hover-glow); } .liq-deciderow__act--yes{ border-color:transparent; color:#fff; background:var(--accent-gradient,var(--accent,#4f8ef7)); } .liq-deciderow__act--no{ color:var(--danger,#e0736f); border-color:color-mix(in srgb,var(--danger,#e0736f) 40%,transparent); } .liq-deciderow__hint{ flex-basis:100%; font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:1px; } @media (prefers-reduced-motion:reduce){ .liq-deciderow__act:hover{ transform:none; } } .liq-deciderow__act--locked, .liq-deciderow__act:disabled, .liq-deciderow__act[disabled]{ opacity:.45; cursor:not-allowed; } .liq-deciderow__act--locked:hover, .liq-deciderow__act:disabled:hover, .liq-deciderow__act[disabled]:hover{ transform:none; box-shadow:none; } @media (prefers-reduced-transparency:reduce){ .liq-deciderow__act--locked, .liq-deciderow__act:disabled, .liq-deciderow__act[disabled]{ opacity:1; border-style:dashed; color:var(--muted,#8892a4); background:var(--surface,#1d1d1d); } } .liq-deciderow__act.is-active{ box-shadow:0 0 0 2px color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); } .liq-deciderow__act--yes.is-active{ box-shadow:0 0 0 2px color-mix(in srgb,#fff 65%,transparent); } .liq-deciderow__state{ flex-basis:100%; margin-top:8px; padding:8px 12px; border-radius:10px; font-size:var(--text-12); font-weight:600; color:var(--success,#35ad76); background:color-mix(in srgb,var(--success,#35ad76) 12%,transparent); display:flex; align-items:center; gap:7px; } .liq-deciderow__state svg{ width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:2.4; } .liq-acclvl{ display:inline-flex; align-items:center; gap:5px; font-size:var(--text-11); font-weight:700; padding:2px 9px; border-radius:999px; white-space:nowrap; } .liq-acclvl--none{ color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-acclvl--read{ color:#8bb4f7; background:color-mix(in srgb,var(--accent,#4f8ef7) 15%,transparent); } .liq-acclvl--write{ color:var(--success,#35ad76); background:color-mix(in srgb,var(--success,#35ad76) 15%,transparent); } .liq-acclvl--admin{ color:var(--warning,#f59e0b); background:color-mix(in srgb,var(--warning,#f59e0b) 16%,transparent); } .liq-acclvl__pd{ font-size:var(--text-10); font-weight:800; padding:0 4px; border-radius:4px; letter-spacing:.03em; background:color-mix(in srgb,var(--danger,#e0736f) 20%,transparent); color:var(--danger,#e0736f); } .liq-acclvl--abweichung{ box-shadow:0 0 0 1.5px color-mix(in srgb,var(--text,#fff) 45%,transparent); } .liq-persondrawer{ display:none; padding:4px 14px 14px 64px; } .liq-persondrawer.is-open{ display:block; } .liq-persondrawer__grp{ font-size:var(--text-10); text-transform:uppercase; letter-spacing:.07em; font-weight:700; color:var(--muted,#8892a4); margin:9px 0 5px; } .liq-persondrawer__row{ display:flex; align-items:center; gap:10px; padding:7px 0; font-size:var(--text-13); border-top:1px solid color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-persondrawer__row:first-of-type{ border-top:0; } .liq-persondrawer__mod{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-rolecard{ border-radius:14px; padding:15px 16px; background:color-mix(in srgb,var(--surface,#1d1d1d) 60%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 9%,transparent); } .liq-rolecard__h{ display:flex; align-items:center; gap:9px; } .liq-rolecard__name{ font-size:var(--text-14); font-weight:650; } .liq-rolecard__count{ margin-left:auto; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-rolecard__sub{ font-size:var(--text-12); color:var(--muted,#8892a4); margin:2px 0 11px; } .liq-rolecard__grant{ display:flex; align-items:center; gap:10px; padding:7px 0; font-size:var(--text-13); border-top:1px solid color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-rolecard__grant:first-of-type{ border-top:0; } .liq-rolecard__mod{ flex:1 1 auto; min-width:0; } .liq-listfilter{ display:flex; flex-direction:column; gap:10px; margin-bottom:10px; } .liq-listfilter__row{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; } .liq-listfilter__search{ flex:1 1 220px; min-width:160px; position:relative; display:flex; align-items:center; } .liq-listfilter__search svg{ position:absolute; left:13px; width:16px; height:16px; fill:none; stroke:var(--muted,#8892a4); stroke-width:2; pointer-events:none; } .liq-listfilter__search input{ width:100%; box-sizing:border-box; min-height:44px; padding:0 14px 0 38px; border-radius:10px; font:inherit; font-size:var(--text-14); color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-listfilter__search input:focus{ outline:none; border-color:var(--accent,#4f8ef7); } .liq-listfilter__chips{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; } .liq-listfilter__clabel{ font-size:var(--text-11); font-weight:700; color:var(--muted,#8892a4); text-transform:uppercase; letter-spacing:.05em; margin-right:2px; } @media (pointer:coarse){ .liq-listfilter__chip{ min-height:44px; padding:0 15px; } } .liq-listfilter__chip{ min-height:32px; padding:0 13px; border-radius:999px; cursor:pointer; font:inherit; font-size:var(--text-12); font-weight:600; color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 5%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 11%,transparent); transition:background .15s, color .15s; } .liq-listfilter__chip:hover{ color:var(--text,#e9eef6); } .liq-listfilter__chip.on, .liq-listfilter__chip.is-on, .liq-listfilter__chip[aria-pressed="true"]{ color:#cfe0fd; border-color:transparent; background:var(--accent-soft,rgba(79,142,247,.18)); } .liq-listfilter__empty{ padding:8px 2px; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-msglist{ display:flex; flex-direction:column; gap:6px; } .liq-msg{ max-width:78%; padding:9px 13px; border-radius:14px; font-size:var(--text-14); line-height:1.4; position:relative; overflow-wrap:anywhere; } .liq-msg--in{ align-self:flex-start; border-bottom-left-radius:5px; background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-msg--out{ align-self:flex-end; border-bottom-right-radius:5px; background:var(--accent,#4f8ef7); color:#fff; } .liq-msg__name{ display:block; font-size:var(--text-11); font-weight:700; margin-bottom:2px; color:var(--accent,#4f8ef7); } .liq-msg--out .liq-msg__name{ color:rgba(255,255,255,.85); } .liq-msg__meta{ display:block; font-size:var(--text-10); margin-top:3px; opacity:.65; text-align:right; } .liq-preview{ border-radius:14px; padding:12px 14px; max-width:320px; background:color-mix(in srgb,var(--surface,#1d1d1d) 94%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 10%,transparent); box-shadow:0 14px 44px -14px rgba(0,0,0,.6); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); } @media (prefers-reduced-transparency:reduce){ .liq-preview{ background:var(--surface,#1d1d1d); -webkit-backdrop-filter:none; backdrop-filter:none; } } .liq-preview__h{ display:flex; align-items:center; gap:9px; margin-bottom:7px; } .liq-preview__av{ width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-size:var(--text-11); font-weight:800; color:#fff; flex:none; } .liq-preview__t{ font-size:var(--text-13); font-weight:650; flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-preview__time{ flex:none; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-preview__body{ font-size:var(--text-12); color:var(--muted,#8892a4); line-height:1.5; } .liq-blatt{ border-radius:14px; padding:20px 22px; max-width:560px; background:color-mix(in srgb,var(--surface,#1d1d1d) 65%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 9%,transparent); } .liq-blatt__k{ font-size:var(--text-11); text-transform:uppercase; letter-spacing:.07em; font-weight:800; color:var(--accent,#4f8ef7); } .liq-blatt__t{ font-family:'Bricolage Grotesque',sans-serif; font-size:20px; font-weight:600; margin:4px 0 3px; } .liq-blatt__meta{ font-size:var(--text-12); color:var(--muted,#8892a4); display:flex; gap:14px; flex-wrap:wrap; margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-blatt__body{ font-size:var(--text-14); line-height:1.6; color:var(--ink-soft,#c2cad8); } .liq-blatt__foot{ margin-top:16px; padding-top:14px; border-top:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-blatt__result{ display:flex; align-items:center; gap:9px; padding:11px 14px; border-radius:10px; font-size:var(--text-13); font-weight:650; } .liq-blatt__result svg{ width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:2.2; } .liq-blatt__result--ok{ color:var(--success,#35ad76); background:color-mix(in srgb,var(--success,#35ad76) 15%,transparent); } .liq-blatt__result--patt{ color:var(--patt,#8b95ad); background:color-mix(in srgb,var(--patt,#8b95ad) 16%,transparent); } .liq-blatt__result--no{ color:var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 14%,transparent); } @media (prefers-reduced-transparency:reduce){ .liq-blatt__result{ background:var(--surface,#1d1d1d); box-shadow:inset 0 0 0 1px currentColor; } } .liq-blatt__badge{ display:inline-flex; align-items:center; gap:5px; padding:2px 9px; border-radius:999px; font-size:var(--text-11); font-weight:700; color:var(--patt,#8b95ad); background:color-mix(in srgb,var(--patt,#8b95ad) 15%,transparent); } .liq-sec-h.liq-sprungkopf{ position:sticky; top:0; z-index:3; margin-bottom:0; background:var(--bg,#0f1117); } .liq-sprungkopf__ausloeser{ display:inline-flex; align-items:center; gap:7px; min-height:44px; padding:9px 8px 9px 2px; margin-left:-2px; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; border-radius:6px; max-width:100%; } .liq-sprungkopf__ausloeser:hover{ background:color-mix(in srgb,var(--text,#fff) 5%,transparent); } .liq-sprungkopf__t{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-sprungkopf__ausloeser:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-sprungkopf__pfeil{ margin-left:auto; flex:none; width:14px; height:14px; opacity:.5; transition:transform .16s, opacity .16s; } .liq-sprungkopf__ausloeser:hover .liq-sprungkopf__pfeil{ opacity:.9; } .liq-sprungkopf__ausloeser[aria-expanded="true"] .liq-sprungkopf__pfeil{ transform:rotate(180deg); opacity:.9; } .liq-sprungkopf__pfeil svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; } .liq-sprungliste{ display:flex; flex-direction:column; } .liq-sprungliste__it{ display:flex; align-items:center; gap:10px; min-height:44px; padding:10px 10px; border:0; background:none; color:var(--muted,#8892a4); font:inherit; text-align:left; cursor:pointer; border-radius:10px; } .liq-sprungliste__it:hover{ background:color-mix(in srgb,var(--text,#fff) 6%,transparent); color:var(--text,#e9eef6); } .liq-sprungliste__it[aria-current="true"]{ background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); color:var(--text,#e9eef6); font-weight:650; } .liq-sprungliste__it:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } @media (prefers-reduced-motion:reduce){ .liq-sprungkopf__pfeil{ transition:none; } } .liq-sheet{ border-radius:20px 20px 0 0; padding:8px 18px 20px; background:color-mix(in srgb,var(--surface,#1d1d1d) 97%,transparent); border-top:1px solid color-mix(in srgb,var(--text,#fff) 10%,transparent); box-shadow:0 -16px 44px -16px rgba(0,0,0,.55); } .liq-sheet__grip{ width:38px; height:4px; border-radius:999px; margin:0 auto 12px; background:color-mix(in srgb,var(--text,#fff) 22%,transparent); } .liq-sheet__t{ font-size:16px; font-weight:650; margin-bottom:8px; } .liq-mhero{ padding:6px 2px 16px; } .liq-mhero__t{ font-family:'Bricolage Grotesque',sans-serif; font-size:26px; font-weight:600; line-height:1.12; } .liq-mhero__sub{ font-size:var(--text-13); color:var(--muted,#8892a4); margin-top:4px; } .liq-mhero__stats{ display:flex; gap:20px; margin-top:14px; } .liq-mhero__stat b{ font-family:'Bricolage Grotesque',sans-serif; font-size:22px; font-weight:600; display:block; } .liq-mhero__stat span{ font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-msec{ margin-bottom:18px; } .liq-msec__h{ display:flex; align-items:center; justify-content:space-between; margin:0 2px 8px; } .liq-msec__t{ font-size:var(--text-13); font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted,#8892a4); } .liq-msec__more{ font-size:var(--text-12); color:var(--accent,#4f8ef7); font-weight:600; cursor:pointer; } .liq-btn--sm{ padding:7px 15px; font-size:var(--text-13); gap:.4rem; } .liq-btn--mini{ padding:5px 11px; font-size:var(--text-12); gap:.3rem; border-radius:6px; } body:not([data-skin="classic"]) .liq-btn--mini{ border-radius:var(--radius-pill); } .liq-btn--sm,.liq-btn--mini{ position:relative; } @media (pointer:coarse){ .liq-btn--sm::after,.liq-btn--mini::after{ content:''; position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); height:44px; } } .liq-btn.liq-btn--danger,body:not([data-skin="classic"]) .liq-btn--danger{ background:var(--danger,#e55353); color:#fff; } .liq-btn--danger:hover{ filter:brightness(1.08); } .liq-btn.liq-btn--absage,body:not([data-skin="classic"]) .liq-btn--absage{ background:none; color:var(--danger,#e0736f); border:none; box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--danger,#e0736f) 55%,var(--border,#333333)); } .liq-btn--absage:hover{ background:color-mix(in srgb,var(--danger,#e0736f) 12%,transparent); box-shadow:inset 0 0 0 1px var(--danger,#e0736f); } .liq-btn-ghost{ display:inline-flex; align-items:center; gap:.5rem; padding:10px 20px; border-radius:10px; background:transparent; border:1px solid var(--border,#333333); color:var(--text,#e9eef6); font-size:var(--text-14); font-weight:600; cursor:pointer; transition:background .15s, border-color .15s; } body:not([data-skin="classic"]) .liq-btn-ghost{ border-radius:var(--radius-pill); } .liq-btn-ghost:hover{ background:rgba(255,255,255,.06); border-color:color-mix(in srgb,var(--accent,#4f8ef7) 40%,var(--border,#333333)); } .liq-btn-ghost.liq-btn--sm{ padding:7px 15px; font-size:var(--text-13); } .liq-btn-ghost.liq-btn--mini{ padding:5px 11px; font-size:var(--text-12); } .liq-modal-close{ position:absolute; top:12px; right:12px; width:32px; height:32px; display:grid; place-items:center; border:none; border-radius:10px; background:transparent; cursor:pointer; color:var(--ink-soft,#c2cad8); transition:background .15s, color .15s; } .liq-modal-close:hover{ background:rgba(255,255,255,.09); color:var(--ink,#e2e8f0); } .liq-modal-close:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-modal-close svg{ width:16px; height:16px; } @media (pointer:coarse){ .liq-modal-close{ width:44px; height:44px; top:8px; right:8px; } } .liq-modal:has(> .liq-modal-close) .liq-modal-top{ padding-right:34px; } .liq-fieldrow{ display:flex; align-items:baseline; gap:12px; padding:9px 0; border-bottom:1px solid var(--border,#333333); } .liq-fieldrow:last-child{ border-bottom:none; } .liq-fieldrow__lbl{ flex:0 0 clamp(120px,26%,220px); font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-fieldrow__val{ flex:1 1 auto; min-width:0; font-size:var(--text-14); color:var(--text,#e9eef6); overflow-wrap:anywhere; } .liq-fieldrow__val:empty::before{ content:'offen'; color:var(--muted,#8892a4); font-style:italic; } .liq-fieldrow__suffix{ flex:none; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-fieldrow__saved{ flex:none; font-size:var(--text-11); font-weight:600; color:var(--success,#4ade80); opacity:0; transition:opacity .3s; } .liq-fieldrow__saved.is-on{ opacity:1; } @media (max-width:560px){ .liq-fieldrow{ display:grid; grid-template-columns:1fr auto; gap:2px 10px; } .liq-fieldrow__lbl{ grid-column:1/-1; flex:none; } } .liq-chipbar{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; } .liq-chipbar--roll{ flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; padding-bottom:2px; } .liq-chipbar--roll::-webkit-scrollbar{ display:none; } .liq-chipbar--roll > *{ flex:none; } .liq-icon{ width:16px; height:16px; flex:none; display:inline-block; vertical-align:-.15em; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } .liq-icon--sm{ width:13px; height:13px; } .liq-icon--lg{ width:20px; height:20px; } .liq-icon--solid{ fill:currentColor; stroke:none; } .liq-stand{ display:inline-flex; align-items:center; gap:9px; min-width:0; } .liq-stand__segs{ display:inline-flex; gap:3px; flex:none; } .liq-stand__seg{ width:16px; height:6px; border-radius:4px; background:var(--border,#333333); box-shadow:inset 0 0 0 1px rgba(255,255,255,.05); } .liq-stand__seg.is-ok{ background:var(--accent,#4f8ef7); box-shadow:none; } .liq-stand__seg.is-faellig{ background:var(--danger,#e0736f); box-shadow:none; } .liq-stand__zahl{ font-size:var(--text-12); font-weight:600; color:var(--text,#e9eef6); flex:none; font-variant-numeric:tabular-nums; } .liq-stand__fehlt{ font-size:var(--text-12); color:var(--muted,#8892a4); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-stand__fehlt b{ color:#e9b4b0; font-weight:600; } .liq-stand.is-fertig .liq-stand__fehlt{ color:var(--success,#4ade80); } .liq-stand--liste{ display:block; } .liq-stand--liste .liq-stand__segs{ display:grid; gap:4px; margin-top:6px; } .liq-stand--liste .liq-stand__seg{ width:auto; height:auto; background:none; box-shadow:none; display:flex; align-items:center; gap:8px; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-stand--liste .liq-stand__seg::before{ content:''; width:14px; height:6px; border-radius:4px; flex:none; background:var(--border,#333333); } .liq-stand--liste .liq-stand__seg.is-ok{ color:var(--text,#e9eef6); } .liq-stand--liste .liq-stand__seg.is-ok::before{ background:var(--accent,#4f8ef7); } .liq-stand--liste .liq-stand__seg.is-faellig{ color:#e9b4b0; } .liq-stand--liste .liq-stand__seg.is-faellig::before{ background:var(--danger,#e0736f); } @media (max-width:560px){ .liq-stand__fehlt{ white-space:normal; } } .liq-avatar{ display:inline-grid; place-items:center; flex:none; width:var(--avatar,34px); height:var(--avatar,34px); border-radius:50%; overflow:hidden; font-size:var(--text-12); font-weight:700; letter-spacing:.02em; color:#dbe7fb; background:color-mix(in srgb,var(--accent,#4f8ef7) 22%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-avatar--sm{ --avatar:26px; font-size:var(--text-10); } .liq-avatar--lg{ --avatar:46px; font-size:16px; } .liq-avatar img{ width:100%; height:100%; object-fit:cover; display:block; } .liq-avatar--gruppe{ border-radius:34%; } .liq-avatar--still{ color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-search{ position:relative; display:flex; align-items:center; min-width:0; } .liq-search > svg{ position:absolute; left:11px; width:15px; height:15px; pointer-events:none; fill:none; stroke:var(--muted,#8892a4); stroke-width:1.8; stroke-linecap:round; } .liq-search > input{ width:100%; box-sizing:border-box; min-height:38px; padding:8px 12px 8px 34px; border-radius:10px; border:1px solid var(--border,#333333); background:var(--bg,#0f1117); color:var(--text,#e9eef6); font:inherit; font-size:var(--text-13); } .liq-search > input::placeholder{ color:var(--muted,#8892a4); } .liq-search > input:focus{ outline:none; border-color:var(--accent,#4f8ef7); box-shadow:0 0 0 3px var(--accent-soft,rgba(79,142,247,.18)); } @media (pointer:coarse){ .liq-search > input{ min-height:44px; } } input.liq-search{ display:block; width:100%; box-sizing:border-box; min-height:38px; padding:8px 12px; border-radius:10px; border:1px solid var(--border,#333333); background:var(--bg,#0f1117); color:var(--text,#e9eef6); font:inherit; font-size:var(--text-13); } input.liq-search::placeholder{ color:var(--muted,#8892a4); } input.liq-search:focus{ outline:none; border-color:var(--accent,#4f8ef7); box-shadow:0 0 0 3px var(--accent-soft,rgba(79,142,247,.18)); } @media (pointer:coarse){ input.liq-search{ min-height:44px; } } .liq-iconbtn{ display:inline-grid; place-items:center; flex:none; width:32px; height:32px; border-radius:10px; border:1px solid transparent; background:transparent; cursor:pointer; color:var(--muted,#8892a4); transition:background .15s, color .15s, border-color .15s; } .liq-iconbtn:hover{ background:color-mix(in srgb,var(--text,#fff) 8%,transparent); color:var(--text,#e9eef6); } .liq-iconbtn:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-iconbtn svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } .liq-iconbtn--danger:hover{ color:#e9b4b0; background:color-mix(in srgb,var(--danger,#e0736f) 14%,transparent); } .liq-iconbtn--rahmen{ border-color:var(--border,#333333); } @media (pointer:coarse){ .liq-iconbtn{ width:44px; height:44px; } } .liq-hint{ display:block; font-size:var(--text-12); line-height:1.55; color:var(--muted,#8892a4); margin:6px 0 0; max-width:76ch; } .liq-hint--inline{ display:inline; margin:0; } .liq-hint--warn{ color:#e2c08d; border-left:2px solid var(--warning,#f59e0b); padding-left:9px; } .liq-hint--warn b{ color:var(--ki-text,#f0c48a); } .liq-hint--gefahr{ color:#e9b4b0; border-left:2px solid var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 12%,transparent); padding:7px 11px; border-radius:0 8px 8px 0; max-width:none; } .liq-hint--ok{ color:var(--success,#4ade80); } .liq-hint b,.liq-hint strong{ color:var(--text,#e9eef6); font-weight:600; } .liq-hint a{ color:var(--accent,#4f8ef7); } .liq-input + .liq-hint,.liq-btn + .liq-hint,.liq-optrow + .liq-hint{ margin-top:5px; } .liq-optgroup{ margin:0 0 14px; } .liq-optgroup__h{ display:flex; align-items:baseline; gap:8px; font-size:var(--text-11); font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#8892a4); margin:0 2px 7px; } .liq-optgroup__n{ margin-left:auto; font-weight:600; letter-spacing:0; text-transform:none; font-size:var(--text-11); } .liq-optrow--kompakt{ min-height:0; padding:8px 11px; margin-bottom:5px; border-radius:10px; } .liq-optrow--kompakt .liq-optrow__t{ font-size:var(--text-13); font-weight:600; } .liq-optrow--kompakt .liq-optrow__box{ width:17px; height:17px; margin-top:0; } .liq-optrow--kompakt .liq-optrow__box svg{ width:11px; height:11px; } @media (pointer:coarse){ .liq-optrow--kompakt{ min-height:44px; padding:10px 12px; } } .liq-optgroup--einzel .liq-optrow__box{ border-radius:50%; } .liq-optrow[aria-disabled="true"],.liq-optrow:disabled{ opacity:.45; cursor:not-allowed; } .liq-optrow[aria-disabled="true"]:hover{ border-color:var(--border,#2a2e3d); } .liq-tilegrid{ display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr)); } .liq-tile{ position:relative; display:flex; flex-direction:column; gap:6px; min-height:96px; box-sizing:border-box; padding:13px 14px; border-radius:14px; text-align:left; font:inherit; color:var(--text,#e9eef6); cursor:pointer; border:1px solid var(--border,#333333); background:color-mix(in srgb,var(--surface,#161922) 70%,transparent); transition:border-color .15s, background .15s; } .liq-tile:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 45%,var(--border,#333333)); } .liq-tile[aria-pressed="true"], .liq-tile.is-an, .liq-tile.is-gewaehlt{ border-color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); } .liq-tile[aria-pressed="true"]::after, .liq-tile.is-an::after, .liq-tile.is-gewaehlt::after{ content:''; position:absolute; top:10px; right:10px; width:18px; height:18px; border-radius:50%; background:var(--accent,#4f8ef7); -webkit-mask:url("data:image/svg+xml;utf8,") center/12px no-repeat, linear-gradient(#000,#000); -webkit-mask-composite:xor; mask:url("data:image/svg+xml;utf8,") center/12px no-repeat, linear-gradient(#000,#000); mask-composite:exclude; } .liq-tile[aria-pressed="true"] .liq-tile__t, .liq-tile.is-an .liq-tile__t{ color:var(--text,#e9eef6); } @media (prefers-reduced-transparency:reduce){ .liq-tile[aria-pressed="true"], .liq-tile.is-an{ background:none; border-width:2px; } } .liq-tile:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-tile__t{ font-size:var(--text-13); font-weight:600; line-height:1.35; } .liq-tile__sub{ font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-tile__st{ margin-top:auto; display:inline-flex; align-items:center; gap:6px; font-size:var(--text-11); font-weight:600; } .liq-tile__st::before{ content:''; width:7px; height:7px; border-radius:50%; flex:none; background:currentColor; } .liq-tile--da{ border-color:color-mix(in srgb,var(--success,#4ade80) 34%,var(--border,#333333)); } .liq-tile--da .liq-tile__st{ color:var(--success,#4ade80); } .liq-tile--fehlt .liq-tile__st{ color:var(--muted,#8892a4); } .liq-tile--fehlt{ border-style:dashed; } .liq-tile--alt{ border-color:color-mix(in srgb,var(--danger,#e0736f) 40%,var(--border,#333333)); background:color-mix(in srgb,var(--danger,#e0736f) 6%,transparent); } .liq-tile--alt .liq-tile__st{ color:#e9b4b0; } .liq-tile--pruef .liq-tile__st{ color:var(--accent,#4f8ef7); } .liq-tile--pruef{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 38%,var(--border,#333333)); } .liq-titlerow{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin:22px 2px 9px; } .liq-titlerow:first-child{ margin-top:0; } .liq-titlerow__t{ margin:0; font-size:var(--text-11); font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#8892a4); } .liq-titlerow--gross .liq-titlerow__t{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:16px; font-weight:600; letter-spacing:-.2px; text-transform:none; color:var(--text,#e9eef6); } .liq-titlerow__n{ font-size:var(--text-11); color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; } .liq-titlerow__act{ margin-left:auto; } .liq-kv{ display:flex; align-items:baseline; gap:10px; padding:4px 0; font-size:var(--text-13); } .liq-kv--wide{ flex-direction:column; align-items:stretch; gap:4px; } .liq-kv--wide > .liq-kv__k{ flex:none; } .liq-kv__k{ flex:0 0 clamp(96px,38%,180px); color:var(--muted,#8892a4); font-size:var(--text-12); } .liq-kv__v{ flex:1 1 auto; min-width:0; overflow-wrap:anywhere; } .liq-kv__v:empty::before{ content:'–'; color:var(--muted,#8892a4); } .liq-kv--bald .liq-kv__v{ color:var(--frist-bald,#e2c08d); } .liq-kv--faellig .liq-kv__v{ color:var(--frist-faellig,#e9b4b0); font-weight:600; } .liq-kv--ok .liq-kv__v{ color:var(--success,#4ade80); } @media (max-width:480px){ .liq-kv{ display:grid; grid-template-columns:1fr; gap:1px; padding:6px 0; } .liq-kv__k{ flex:none; } } .liq-drawer-scrim{ position:fixed; inset:0; z-index:calc(var(--liq-z-toast,10000) - 3); background:rgba(8,6,14,.42); opacity:0; pointer-events:none; transition:opacity .25s var(--ease-soft,ease); } .liq-drawer-scrim.is-open{ opacity:1; pointer-events:auto; } .liq-drawer{ position:fixed; top:0; right:0; bottom:0; z-index:calc(var(--liq-z-toast,10000) - 2); width:min(420px,100vw); box-sizing:border-box; display:flex; flex-direction:column; min-height:0; background:var(--surface,#161922); border-left:1px solid var(--border,#333333); box-shadow:-18px 0 44px -24px rgba(0,0,0,.7); transform:translateX(100%); transition:transform .3s var(--ease-liquid,cubic-bezier(.22,1,.36,1)); } .liq-drawer.is-open{ transform:none; } .liq-drawer--links{ right:auto; left:0; border-left:none; border-right:1px solid var(--border,#333333); transform:translateX(-100%); box-shadow:18px 0 44px -24px rgba(0,0,0,.7); } .liq-drawer--links.is-open{ transform:none; } .liq-drawer__kopf{ display:flex; align-items:center; gap:10px; flex:none; padding:15px 16px calc(15px + env(safe-area-inset-top,0px)); border-bottom:1px solid var(--border,#333333); } .liq-drawer__t{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:16px; font-weight:600; letter-spacing:-.2px; min-width:0; } .liq-drawer__zu{ margin-left:auto; position:relative; display:inline-grid; place-items:center; flex:none; min-width:32px; min-height:32px; } .liq-drawer__zu::after{ content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); min-width:44px; min-height:44px; width:100%; height:100%; } .liq-drawer__kopf--stapel{ display:block; position:relative; padding:calc(19px + env(safe-area-inset-top,0px)) 20px 15px; } .liq-drawer__kopf--stapel .liq-drawer__zu{ position:absolute; margin:0; top:calc(13px + env(safe-area-inset-top,0px)); right:13px; } .liq-drawer__rubrik{ display:flex; align-items:center; gap:5px; font-size:var(--text-11); font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#8892a4); } .liq-drawer__rubrik svg{ width:14px; height:14px; flex:none; } .liq-drawer__kopf--stapel .liq-drawer__t{ display:block; margin:6px 0 3px; font-size:18px; } .liq-drawer__sub{ font-size:var(--text-12); color:var(--muted,#8892a4); line-height:1.4; } .liq-drawer__kopf--stapel .liq-chip{ margin-top:7px; } .liq-drawer__body{ flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:14px 16px calc(20px + env(safe-area-inset-bottom,0px)); } @media (max-width:560px){ .liq-drawer,.liq-drawer--links{ top:auto; left:0; right:0; width:auto; max-height:82vh; border:1px solid var(--border,#333333); border-radius:20px 20px 0 0; transform:translateY(100%); box-shadow:0 -18px 44px -24px rgba(0,0,0,.7); } .liq-drawer.is-open,.liq-drawer--links.is-open{ transform:none; } } @media (prefers-reduced-motion:reduce){ .liq-drawer,.liq-drawer-scrim{ transition:none; } } .liq-entcard{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:4px 13px; box-sizing:border-box; padding:14px 15px; border-radius:14px; border:1px solid var(--border,#333333); background:color-mix(in srgb,var(--surface,#161922) 72%,transparent); } .liq-entcard__sig{ grid-row:1 / span 2; align-self:start; } .liq-entcard__t{ font-size:var(--text-14); font-weight:650; line-height:1.3; min-width:0; } .liq-entcard__sub{ font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-entcard__end{ grid-column:3; grid-row:1; align-self:center; margin-left:auto; } .liq-entcard:has(> .liq-entcard__end){ grid-template-columns:auto minmax(0,1fr) auto; } .liq-entcard__body{ grid-column:2 / -1; margin-top:9px; min-width:0; } .liq-entcard__acts{ grid-column:2 / -1; display:flex; gap:8px; flex-wrap:wrap; margin-top:11px; } .liq-entcard--stumm{ opacity:.72; } .liq-entcard--ok{ background:color-mix(in srgb,var(--success,#35ad76) 11%,var(--surface,#1d1d1d)); border-color:color-mix(in srgb,var(--success,#35ad76) 32%,transparent); } .liq-entcard--warn{ background:color-mix(in srgb,var(--warning,#f59e0b) 11%,var(--surface,#1d1d1d)); border-color:color-mix(in srgb,var(--warning,#f59e0b) 30%,transparent); } .liq-entcard--stumm .liq-entcard__t{ color:var(--muted,#8892a4); } @media (max-width:480px){ .liq-entcard__body,.liq-entcard__acts{ grid-column:1 / -1; } } .liq-kv__nb{ flex:none; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-kv--num .liq-kv__v{ font-variant-numeric:tabular-nums; text-align:right; } .liq-kv--num .liq-kv__nb{ font-variant-numeric:tabular-nums; min-width:6ch; text-align:right; } .liq-hint--flash{ opacity:0; transition:opacity .25s var(--ease-soft,ease); min-height:1.55em; } .liq-hint--flash.is-on{ opacity:1; } @media (prefers-reduced-motion:reduce){ .liq-hint--flash{ transition:none; } } .liq-authcard{ width:min(380px,100%); box-sizing:border-box; margin:0 auto; background:var(--surface,#161922); border:1px solid var(--border,#333333); border-radius:14px; padding:34px 30px; box-shadow:0 20px 60px rgba(0,0,0,.45); } .liq-authcard__marke{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:26px; font-weight:700; letter-spacing:-.3px; text-align:center; color:var(--text,#e9eef6); margin:0 0 3px; } .liq-authcard__sub{ font-size:var(--text-13); color:var(--muted,#8892a4); text-align:center; margin:0 0 22px; line-height:1.45; } .liq-authcard .liq-input, .liq-authcard select{ width:100%; box-sizing:border-box; } .liq-authcard .liq-seg{ margin-bottom:18px; } .liq-label{ display:block; font-size:var(--text-12); font-weight:600; color:var(--muted,#8892a4); margin:14px 0 6px; } .liq-label:first-child{ margin-top:0; } .liq-felder .liq-label, .liq-frow .liq-label, .liq-bento .liq-label{ margin-top:0; } .liq-fgroup{ display:flex; flex-direction:column; gap:5px; } .liq-fgroup .liq-label{ margin-top:0; margin-bottom:0; } .liq-label--pflicht::after{ content:" *"; color:var(--accent,#4f8ef7); font-weight:700; } .liq-btn--full{ width:100%; justify-content:center; padding:12px 20px; margin-top:20px; } @media (pointer:coarse){ .liq-btn--full{ min-height:44px; } } .liq-btn, .liq-btn-sec, .liq-btn-ghost{ position:relative; } @media (pointer:coarse){ .liq-btn::after, .liq-btn-sec::after, .liq-btn-ghost::after{ content:''; position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); height:44px; } } .liq-btn-sec:not(.liq-btn--sm):not(.liq-btn--mini){ display:inline-flex; align-items:center; gap:.5rem; padding:10px 20px; border-radius:10px; font-size:var(--text-14); font-weight:600; font-family:inherit; cursor:pointer; } .liq-btn-sec.liq-btn--sm, .liq-btn-sec.liq-btn--mini{ display:inline-flex; align-items:center; font-family:inherit; cursor:pointer; } body:not([data-skin="classic"]) .liq-btn-sec{ border-radius:var(--radius-pill); } .liq-btn-sec:hover{ background:color-mix(in srgb,var(--text,#fff) 10%,var(--surface2,#1d1d1d)); } .liq-kv__dot{ flex:none; width:7px; height:7px; border-radius:50%; align-self:center; background:var(--muted,#8892a4); } .liq-kv--ok .liq-kv__dot{ background:var(--success,#4ade80); } .liq-kv--bald .liq-kv__dot{ background:var(--frist-bald,#e2c08d); } .liq-kv--faellig .liq-kv__dot{ background:var(--danger,#e0736f); } .liq-kv--na .liq-kv__dot{ background:transparent; border:1px solid var(--muted,#8892a4); } .liq-kv--na .liq-kv__v{ color:var(--muted,#8892a4); } .liq-kv--summe{ margin-top:6px; padding-top:9px; font-weight:650; border-top:1px solid color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-kv--summe .liq-kv__k{ color:var(--text,#e9eef6); font-weight:650; } .liq-kv--summe .liq-kv__v{ font-variant-numeric:tabular-nums; } .liq-btnrow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:12px; } .liq-pane + .liq-row, .liq-pane + .liq-btnrow, .liq-card + .liq-row, .liq-card + .liq-btnrow, .liq-table + .liq-row, .liq-table + .liq-btnrow{ margin-top:12px; } .liq-btnrow--rechts{ justify-content:flex-end; } .liq-btnrow--verteilt{ justify-content:space-between; } .liq-btnrow--trenn{ margin-top:15px; padding-top:13px; border-top:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } @media (max-width:520px){ .liq-btnrow--verteilt{ justify-content:flex-start; } } .liq-btn-text{ display:inline-flex; align-items:center; gap:5px; position:relative; padding:2px 0; border:0; background:none; font:inherit; font-size:var(--text-13); font-weight:600; color:var(--accent,#4f8ef7); cursor:pointer; text-align:left; } .liq-btn.liq-btn-text, body:not([data-skin="classic"]) .liq-btn.liq-btn-text{ background:none; color:var(--accent,#4f8ef7); border:0; padding:2px 0; } .liq-btn.liq-btn-text.liq-btn-text--still{ color:var(--muted,#8892a4); } .liq-btn-text:hover{ filter:brightness(1.25); } @media (pointer:coarse){ .liq-btn-text::after{ content:''; position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); height:44px; } } .liq-btn-text:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:3px; border-radius:4px; } .liq-btn-text--still{ color:var(--muted,#8892a4); } .liq-btn-text--gefahr{ color:#e9b4b0; } .liq-btn-abbruch{ color:#e8c37a; background:color-mix(in srgb,var(--warning,#f59e0b) 14%,transparent); border:1px solid color-mix(in srgb,var(--warning,#f59e0b) 34%,var(--border,#333333)); } .liq-btn-abbruch:hover{ background:color-mix(in srgb,var(--warning,#f59e0b) 22%,transparent); } .liq-btnrow:not(:has(.liq-btn--danger)):not(:has(.liq-btn-text--gefahr)) .liq-btn-abbruch{ color:#eeb4b0; background:color-mix(in srgb,var(--danger,#e0736f) 15%,transparent); border-color:color-mix(in srgb,var(--danger,#e0736f) 38%,var(--border,#333333)); } .liq-btnrow:not(:has(.liq-btn--danger)):not(:has(.liq-btn-text--gefahr)) .liq-btn-abbruch:hover{ background:color-mix(in srgb,var(--danger,#e0736f) 23%,transparent); } @media (pointer:coarse){ .liq-btn-text::after{ content:''; position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); height:44px; } } .liq-prose{ font-size:var(--text-13); line-height:1.6; color:var(--text,#e9eef6); } .liq-prose > :first-child{ margin-top:0; } .liq-prose > :last-child{ margin-bottom:0; } .liq-prose > h2{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:16px; font-weight:600; letter-spacing:-.2px; margin:18px 0 7px; } .liq-prose > h3{ font-size:var(--text-13); font-weight:650; margin:15px 0 5px; } .liq-prose > p{ margin:0 0 10px; max-width:74ch; } .liq-prose > ul, .liq-prose > ol{ margin:0 0 10px; padding-left:20px; } .liq-prose > ul li, .liq-prose > ol li{ margin-bottom:4px; } .liq-prose b, .liq-prose strong{ font-weight:650; color:var(--text,#e9eef6); } .liq-prose a{ color:var(--accent,#4f8ef7); } .liq-prose code{ font-family:ui-monospace,Menlo,monospace; font-size:.92em; background:color-mix(in srgb,var(--text,#fff) 7%,transparent); padding:1px 5px; border-radius:6px; } .liq-prose--still{ color:var(--muted,#8892a4); } .liq-prose--eng{ font-size:var(--text-12); line-height:1.5; } .liq-view{ display:flex; flex-direction:column; min-height:0; min-width:0; flex:1 1 auto; } .liq-view[hidden]{ display:none; } .liq-view--scroll{ overflow-y:auto; overscroll-behavior:contain; padding-bottom:calc(16px + env(safe-area-inset-bottom, 0px)); } .liq-view--scroll > *{ flex-shrink:0; } .liq-view--pad{ padding:34px 40px 60px; } @media (max-width:720px){ .liq-view--pad{ padding:20px 16px 48px; } } .liq-rueckweg{ display:inline-flex; align-items:center; gap:7px; min-height:32px; padding:0 11px 0 9px; border-radius:999px; font:inherit; font-size:var(--text-13,13px); font-weight:600; color:var(--muted,#8892a4); text-decoration:none; cursor:pointer; border:1px solid transparent; background:transparent; transition:color .16s ease, background .16s ease, border-color .16s ease; } .liq-rueckweg svg{ width:17px; height:17px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:transform .18s var(--ease-liquid,cubic-bezier(.34,1.3,.64,1)); } .liq-rueckweg:hover{ color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 6%,transparent); border-color:color-mix(in srgb,var(--text,#fff) 10%,transparent); } .liq-rueckweg:hover svg{ transform:translateX(-3px); } .liq-rueckweg:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-rueckweg:active{ transform:var(--liq-press,scale(.98)); } @media (prefers-reduced-motion:reduce){ .liq-rueckweg, .liq-rueckweg svg{ transition:none; } .liq-rueckweg:hover svg{ transform:none; } } .liq-rueckweg--flucht{ margin-left:31px; margin-top:22px; } @media (max-width:720px){ .liq-rueckweg--flucht{ margin-left:7px; margin-top:14px; } } .liq-legend{ display:flex; align-items:center; flex-wrap:wrap; gap:7px 14px; margin-top:10px; font-size:var(--text-11); color:var(--muted,#8892a4); } .liq-legend__item{ display:inline-flex; align-items:center; gap:6px; min-width:0; } .liq-legend__sw{ flex:none; width:11px; height:11px; border-radius:4px; background:var(--sw,var(--accent,#4f8ef7)); } .liq-legend__sw--rund{ border-radius:50%; } .liq-legend__sw--linie{ height:3px; width:16px; border-radius:4px; } .liq-legend__sw--schraff{ background:repeating-linear-gradient(45deg, color-mix(in srgb,var(--text,#fff) 22%,transparent) 0 2px, transparent 2px 4px); } .liq-legend--rechts{ justify-content:flex-end; } @media (max-width:600px){ .liq-legend--roll{ flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scrollbar-width:none; } .liq-legend--roll::-webkit-scrollbar{ display:none; } .liq-legend--roll .liq-legend__item{ flex:none; } } .liq-marks{ display:flex; align-items:flex-start; margin-top:8px; min-width:0; } .liq-marks__mark{ display:flex; flex-direction:column; align-items:center; gap:4px; flex:none; } .liq-marks__dot{ width:12px; height:12px; border-radius:50%; box-sizing:border-box; border:2px solid var(--border,#333333); background:var(--surface,#161922); } .liq-marks__lbl{ font-size:var(--text-10); line-height:1.3; color:var(--muted,#8892a4); white-space:nowrap; } .liq-marks__line{ flex:1 1 auto; min-width:8px; height:2px; margin:5px 2px 0; background:var(--border,#333333); } .liq-marks__mark.is-passed .liq-marks__dot{ background:var(--warning,#f59e0b); border-color:var(--warning,#f59e0b); } .liq-marks__mark.is-passed .liq-marks__lbl{ color:var(--text,#e9eef6); font-weight:700; } .liq-marks__mark.is-due .liq-marks__dot{ background:var(--danger,#e0736f); border-color:var(--danger,#e0736f); } .liq-marks__mark.is-due .liq-marks__lbl{ color:#e9b4b0; font-weight:700; } .liq-marks__line.is-passed{ background:color-mix(in srgb,var(--warning,#f59e0b) 55%,transparent); } .liq-marks--eng .liq-marks__lbl{ display:none; } .liq-marks--senkrecht{ flex-direction:column; align-items:flex-start; margin-top:0; } .liq-marks--senkrecht .liq-marks__mark{ flex-direction:row; align-items:center; gap:10px; min-height:44px; padding:0 4px; cursor:pointer; } .liq-marks--senkrecht .liq-marks__lbl{ white-space:normal; } .liq-marks--senkrecht .liq-marks__line{ width:2px; height:auto; min-height:10px; min-width:0; margin:0 0 0 9px; flex:1 1 auto; } .liq-marks--senkrecht .liq-marks__mark.is-passed .liq-marks__dot, .liq-marks--senkrecht .liq-marks__mark.is-due .liq-marks__dot{ background:var(--surface,#161922); border-color:var(--border,#333333); } .liq-marks--senkrecht .liq-marks__mark.is-passed .liq-marks__lbl, .liq-marks--senkrecht .liq-marks__mark.is-due .liq-marks__lbl{ color:var(--muted,#8892a4); font-weight:400; } .liq-marks--senkrecht .liq-marks__line.is-passed{ background:color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-marks--senkrecht .liq-marks__mark.is-hier .liq-marks__dot{ background:var(--accent,#4f8ef7); border-color:var(--accent,#4f8ef7); } .liq-marks--senkrecht .liq-marks__mark.is-hier .liq-marks__lbl{ color:var(--text,#e9eef6); font-weight:650; } .liq-marks--senkrecht .liq-marks__mark:hover .liq-marks__lbl{ color:var(--text,#e9eef6); } .liq-marks--senkrecht .liq-marks__mark:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; border-radius:6px; } @media (max-width:820px){ .liq-marks--senkrecht{ display:none; } } .liq-randnav{ display:grid; grid-template-columns:var(--liq-randnav-spalte,170px) minmax(0,1fr); gap:var(--liq-randnav-abstand,26px); align-items:start; } .liq-randnav__nav{ position:sticky; top:var(--liq-randnav-oben,16px); align-self:start; max-height:calc(100vh - var(--liq-randnav-oben,16px) - 16px); overflow-y:auto; min-height:0; overscroll-behavior:contain; } .liq-randnav__inhalt{ min-width:0; } @media (max-width:820px){ .liq-randnav{ grid-template-columns:minmax(0,1fr); } .liq-randnav__nav{ position:static; max-height:none; } } .liq-addrow{ display:flex; align-items:center; justify-content:center; gap:7px; width:100%; box-sizing:border-box; min-height:44px; padding:13px 14px; border-radius:var(--radius,12px); border:2px dashed var(--border,#333333); background:transparent; color:var(--muted,#8892a4); font:inherit; font-size:var(--text-13); font-weight:600; text-align:center; cursor:pointer; transition:border-color .15s, color .15s, background .15s; } .liq-addrow:hover{ border-color:var(--accent,#4f8ef7); color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 6%,transparent); } .liq-addrow:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-addrow:active{ transform:var(--liq-press,scale(.99)); } .liq-addrow svg{ width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; } .liq-addrow--eng{ width:auto; min-height:32px; padding:6px 12px; border-width:1px; font-size:var(--text-12); border-radius:10px; } @media (pointer:coarse){ .liq-addrow--eng{ min-height:44px; } } @media (prefers-reduced-motion:reduce){ .liq-addrow:active{ transform:none; } } .liq-modal--blatt{ position:static; left:auto; top:auto; transform:none; opacity:1; width:min(var(--blatt-breite,540px),96vw); max-width:96vw; max-height:90vh; overflow-y:auto; padding:0; border-radius:14px; background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow-lg); transition:none; } .liq-modal__kopf{ position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px; border-bottom:1px solid var(--border,#333333); background:color-mix(in srgb,var(--surface,#161922) 92%,transparent); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); } .liq-modal__kopf h2{ margin:0; font-family:var(--d-font-display,inherit); font-size:17px; font-weight:600; letter-spacing:-.2px; } .liq-modal__body{ padding:18px 22px; } .liq-modal__fuss{ position:sticky; bottom:0; z-index:2; padding:14px 22px; border-top:1px solid var(--border,#333333); background:color-mix(in srgb,var(--surface,#161922) 92%,transparent); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); } @media (prefers-reduced-transparency:reduce){ .liq-modal__kopf, .liq-modal__fuss{ background:var(--surface,#161922); backdrop-filter:none; -webkit-backdrop-filter:none; } } .liq-kibar{ display:flex; align-items:center; gap:11px; min-height:50px; box-sizing:border-box; padding:9px calc(12px + env(safe-area-inset-right,0)) 9px calc(14px + env(safe-area-inset-left,0)); color:#ffe9e9; font-size:var(--text-13); line-height:1.25; background:linear-gradient(180deg,color-mix(in srgb,var(--danger,#e55353) 26%,transparent), color-mix(in srgb,var(--danger,#e55353) 15%,transparent)); border-bottom:1px solid color-mix(in srgb,var(--danger,#e55353) 45%,transparent); -webkit-backdrop-filter:blur(14px) saturate(1.2); backdrop-filter:blur(14px) saturate(1.2); box-shadow:0 1px 0 color-mix(in srgb,#fff 6%,transparent) inset; } .liq-kibar__dot{ width:9px; height:9px; flex:none; border-radius:50%; background:var(--danger,#e55353); box-shadow:0 0 0 0 color-mix(in srgb,var(--danger,#e55353) 70%,transparent); animation:kipulse 1.9s ease-out infinite; } @keyframes kipulse{ 0%{ box-shadow:0 0 0 0 color-mix(in srgb,var(--danger,#e55353) 60%,transparent); } 70%{ box-shadow:0 0 0 7px transparent; } 100%{ box-shadow:0 0 0 0 transparent; } } .liq-kibar__t{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-kibar__t b{ font-weight:700; color:#fff; } .liq-kibar__who{ color:#ffd0d0; opacity:.85; } .liq-kibar__z{ flex:none; font-variant-numeric:tabular-nums; font-weight:650; color:#fff; padding:2px 9px; border-radius:999px; background:color-mix(in srgb,#000 22%,transparent); } .liq-kibar__end{ flex:none; min-height:32px; padding:0 14px; border:0; border-radius:999px; cursor:pointer; font:inherit; font-weight:700; font-size:var(--text-13); color:var(--danger,#b42318); background:#fff; } .liq-kibar__end:hover{ background:#ffecec; } .liq-kibar__end:focus-visible{ outline:2px solid #fff; outline-offset:2px; } @media (prefers-reduced-motion:reduce){ .liq-kibar__dot{ animation:none; } } @media (prefers-reduced-transparency:reduce){ .liq-kibar{ -webkit-backdrop-filter:none; backdrop-filter:none; background:#5b1c1c; } } @media (max-width:560px){ .liq-kibar__who{ display:none; } .liq-kibar__end{ padding:0 11px; } .liq-kibar__t{ white-space:normal; overflow:visible; text-overflow:clip; line-height:1.3; } .liq-kibar{ align-items:flex-start; padding-top:11px; padding-bottom:11px; } .liq-kibar__dot{ margin-top:5px; } .liq-kibar__end{ align-self:center; } } @media (pointer:coarse){ .liq-kibar__end{ min-height:44px; } } .liq-kv--zeile .liq-kv__k{ flex:1 1 auto; min-width:0; font-size:var(--text-13); color:var(--text,#e9eef6); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-kv--zeile .liq-kv__v{ flex:none; text-align:right; max-width:60%; overflow-wrap:anywhere; } .liq-kv--zeile{ padding:10px 0; gap:12px; border-bottom:1px solid color-mix(in srgb,var(--text,#fff) 6%,transparent); } .liq-kv--zeile:last-child{ border-bottom:0; } .liq-kv--zeile .liq-kv__k small{ display:block; font-size:var(--text-12); color:var(--muted,#8892a4); white-space:normal; } .liq-kv--zeile .liq-kv__k a{ color:var(--accent,#4f8ef7); text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px; overflow-wrap:anywhere; } .liq-kv--zeile .liq-kv__k a:visited{ color:var(--accent,#4f8ef7); } .liq-kv--zeile .liq-kv__k a:hover{ text-decoration-thickness:2px; } .liq-kv--zeile .liq-kv__k a:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; border-radius:4px; } @media (max-width:480px){ .liq-kv--zeile{ display:flex; grid-template-columns:none; gap:12px; padding:10px 0; } .liq-kv--zeile .liq-kv__k{ flex:1 1 auto; } .liq-kv--zeile .liq-kv__v{ flex:none; text-align:right; } } .liq-em{ font-weight:600; color:inherit; font-size:var(--text-13); } .liq-em--stark{ font-weight:700; } .liq-em--ok{ color:var(--success,#4ade80); } .liq-em--akz{ color:var(--accent,#4f8ef7); } .liq-em--info{ color:var(--info,#7cc4f8); } .liq-em--warn{ color:#e2c08d; } .liq-em--gefahr{ color:#e9b4b0; } .liq-em--still{ color:var(--muted,#8892a4); font-weight:500; } .liq-em--num{ font-variant-numeric:tabular-nums; } .liq-row{ display:flex; align-items:center; gap:8px; min-width:0; } .liq-row--eng{ gap:5px; } .liq-row--weit{ gap:14px; } .liq-row--rechts{ margin-left:auto; } .liq-row--verteilt{ justify-content:space-between; } .liq-row--umbruch{ flex-wrap:wrap; } .liq-row--oben{ align-items:flex-start; } .liq-row--spalte{ flex-direction:column; align-items:stretch; } .liq-row--trenn{ margin-top:12px; padding-top:11px; border-top:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-card--kante, body:not([data-skin="classic"]) .liq-card--kante{ border-left:4px solid var(--akz,var(--accent,#4f8ef7)); } .liq-card--kante.liq-card--akzent, body:not([data-skin="classic"]) .liq-card--kante.liq-card--akzent{ border-top-width:1px; } .liq-tag{ display:inline-flex; align-items:center; gap:4px; flex:none; padding:2px 7px; border-radius:6px; font-size:var(--text-10); font-weight:700; text-transform:uppercase; letter-spacing:.04em; line-height:1.5; color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-tag--ok{ color:var(--success,#4ade80); background:color-mix(in srgb,var(--success,#4ade80) 14%,transparent); } .liq-tag--akz{ color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 14%,transparent); } .liq-tag--warn{ color:#e2c08d; background:color-mix(in srgb,var(--warning,#f59e0b) 14%,transparent); } .liq-tag--gefahr{ color:#e9b4b0; background:color-mix(in srgb,var(--danger,#e0736f) 14%,transparent); } .liq-tag--uebung{ font-weight:800; letter-spacing:.09em; font-size:var(--liq-art-groesse); color:#0c0e14; background:var(--liq-uebung,#f59e0b); } .liq-tag--unklar{ font-weight:800; letter-spacing:.09em; font-size:var(--liq-art-groesse); color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 16%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text,#fff) 26%,transparent); } .liq-verlaufsmarke{ align-self:center; max-width:min(90%,52ch); margin:10px auto; padding:4px 11px; border-radius:999px; background:color-mix(in srgb,var(--text,#fff) 5%,transparent); color:var(--muted,#8892a4); font-size:var(--text-11); font-weight:600; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .liq-verlaufsmarke--lang{ white-space:normal; } .liq-verlaufsmarke--linie{ align-self:stretch; max-width:none; display:flex; align-items:center; gap:11px; margin:22px 4px 12px; padding:0; border-radius:0; background:none; font-size:10.5px; font-weight:650; letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; } .liq-verlaufsmarke--linie::before,.liq-verlaufsmarke--linie::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,transparent,currentColor,transparent); opacity:.42; } .liq-verlaufsmarke--linie > span{ flex:0 0 auto; } .liq-timeline{ position:relative; } .liq-timeline__eintrag{ position:relative; padding:6px 0 14px 26px; display:flex; flex-direction:column; align-items:flex-start; min-width:0; } .liq-timeline__eintrag:last-child::after{ bottom:auto; height:0; } .liq-timeline__eintrag::before{ content:''; position:absolute; left:0; top:11px; width:10px; height:10px; border-radius:50%; background:var(--zeit-linie,var(--accent,#4f8ef7)); box-shadow:0 0 10px -2px var(--zeit-linie,var(--accent,#4f8ef7)); z-index:1; } .liq-timeline__eintrag::after{ content:''; position:absolute; left:4px; top:23px; bottom:0; width:2px; border-radius:4px; background:color-mix(in srgb,var(--zeit-linie,var(--accent,#4f8ef7)) 30%,transparent); } .liq-timeline__eintrag--offen::before{ background:var(--surface,#1d1d1d); box-shadow:none; border:2px solid var(--zeit-linie,var(--accent,#4f8ef7)); box-sizing:border-box; } .liq-timeline__t{ display:block; font-size:var(--text-13); font-weight:600; color:var(--text,#e9eef6); } .liq-timeline__s{ display:block; font-size:var(--text-11); color:var(--muted,#8892a4); margin-top:2px; } @media (prefers-reduced-transparency:reduce){ .liq-timeline__eintrag::before{ box-shadow:none; } } .liq-tabs{ display:flex; align-items:stretch; gap:18px; border-bottom:1px solid var(--border,#333333); overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; } .liq-tabs::-webkit-scrollbar{ display:none; } .liq-tab{ appearance:none; background:none; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; padding:9px 1px; color:var(--muted,#8892a4); font-family:inherit; font-size:var(--text-13); font-weight:600; white-space:nowrap; cursor:pointer; transition:color .15s ease, border-color .15s ease; } .liq-tab:hover{ color:var(--text,#e9eef6); } .liq-tab:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; border-radius:4px; } .liq-tab.on, .liq-tab[aria-selected="true"]{ color:var(--text,#e9eef6); border-bottom-color:var(--accent,#4f8ef7); } .liq-tab__num{ margin-left:6px; font-size:var(--text-11); font-weight:700; opacity:.75; } @media (pointer:coarse){ .liq-tab{ min-height:44px; box-sizing:border-box; } } @media (prefers-reduced-motion:reduce){ .liq-tab{ transition:none; } } .liq-tag--griff{ padding-right:3px; } .liq-tag__rm{ display:inline-flex; align-items:center; justify-content:center; flex:none; width:16px; height:16px; margin-left:2px; border:0; padding:0; background:none; cursor:pointer; color:inherit; opacity:.65; border-radius:50%; position:relative; } .liq-tag__rm:hover{ opacity:1; background:color-mix(in srgb,currentcolor 16%,transparent); } .liq-tag__rm:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; opacity:1; } .liq-tag__rm svg{ width:11px; height:11px; stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; } @media (pointer:coarse){ .liq-tag--griff{ min-height:44px; box-sizing:border-box; padding:4px 4px 4px 11px; gap:2px; } .liq-tag__rm{ width:44px; height:44px; margin:-4px -4px -4px 0; } .liq-tag__rm svg{ width:15px; height:15px; } .liq-chipbar{ gap:10px; } } @media (prefers-reduced-motion:reduce){ .liq-tag__rm{ transition:none; } } @media (pointer:coarse){ .liq-input, input[type=text].liq, input[type=time].liq, input[type=number].liq, input[type=date].liq, .liq textarea, .liq select, .liq-modal-input, .liq-table__search input, .liq-pal-in input, .liq-float > input, .liq-float > textarea, .liq-ph-input, .liq-listfilter__search input, input.liq-search, .liq-search > input{ font-size:16px; } } .liq-wahlzeile{ display:flex; flex-wrap:wrap; gap:9px; } .liq-wahlchip{ min-height:44px; box-sizing:border-box; padding:11px 15px; display:inline-flex; align-items:center; gap:7px; border:1.6px solid var(--border,#333333); border-radius:999px; background:color-mix(in srgb,var(--panel,#1a1d26) 70%,transparent); color:var(--muted,#8892a4); font:inherit; font-size:var(--text-13); text-align:left; cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent; transition:border-color .16s ease, background .16s ease, color .16s ease; } .liq-wahlchip:hover{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 45%,var(--border,#333333)); color:var(--text,#e9eef6); } .liq-wahlchip:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-wahlchip[aria-pressed="true"]{ border-color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 16%,transparent); color:var(--text,#e9eef6); font-weight:600; } .liq-wahlchip[aria-pressed="true"]::before{ content:''; width:14px; height:14px; flex:none; border-radius:50%; background:var(--accent,#4f8ef7); -webkit-mask:url("data:image/svg+xml;utf8,") center/10px no-repeat, linear-gradient(#000,#000); -webkit-mask-composite:xor; mask:url("data:image/svg+xml;utf8,") center/10px no-repeat, linear-gradient(#000,#000); mask-composite:exclude; } .liq-wahlchip[disabled]{ opacity:.45; cursor:not-allowed; } .liq-wahlchip--gesperrt[disabled]{ opacity:1; cursor:default; color:var(--muted,#8892a4); border-style:dashed; background:color-mix(in srgb,var(--panel,#1a1d26) 40%,transparent); } .liq-wahlchip--breit{ border-radius:14px; width:100%; } .liq-wahlchip__sub{ display:block; font-weight:400; font-size:var(--text-11); color:var(--muted,#8892a4); } @media (prefers-reduced-transparency:reduce){ .liq-wahlchip{ background:none; } .liq-wahlchip[aria-pressed="true"]{ background:none; border-width:2.4px; } } @media (prefers-reduced-motion:reduce){ .liq-wahlchip{ transition:none; } } .liq-daysep{ display:flex; align-items:center; gap:12px; margin:18px 0; color:var(--muted,#8892a4); font-size:var(--text-11); font-weight:700; letter-spacing:.06em; text-transform:uppercase; } .liq-daysep::before,.liq-daysep::after{ content:''; flex:1 1 auto; height:1px; background:color-mix(in srgb,var(--text,#fff) 9%,transparent); } .liq-avatar--squircle{ border-radius:34%; } .liq-sliderrow{ display:block; margin:0 0 14px; } .liq-sliderrow__kopf{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:0 0 7px; } .liq-sliderrow__lbl{ font-size:var(--text-13,13px); color:var(--ink-soft,#c2cad8); } .liq-sliderrow__lbl small{ display:block; font-size:var(--text-11,11px); color:var(--muted,#8892a4); } .liq-sliderrow__wert{ font-family:var(--d-font-display,'Bricolage Grotesque',sans-serif); font-size:var(--text-16,16px); font-weight:650; font-variant-numeric:tabular-nums; color:var(--ink,#e2e8f0); white-space:nowrap; } .liq-sliderrow input[type=range]{ display:block; width:100%; margin:0; height:22px; accent-color:var(--accent,#4f8ef7); background:transparent; cursor:pointer; } .liq-sliderrow input[type=range]:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:3px; border-radius:4px; } .liq-sliderrow__enden{ display:flex; justify-content:space-between; margin-top:3px; font-size:var(--text-11,11px); color:var(--subtle,#5a6377); } .liq-wahlchip--fremd{ border-style:dashed; border-color:color-mix(in srgb,var(--text,#fff) 26%,transparent); color:var(--muted,#8892a4); } .liq-wahlchip--fremd[aria-pressed="true"]{ border-style:dashed; border-color:color-mix(in srgb,var(--text,#fff) 42%,transparent); color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-field__opt--fremd{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; color:var(--muted,#8892a4); } .liq-field__listopt--fremd{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; color:var(--muted,#8892a4); } .liq-field__fremdmark{ font-size:var(--text-10); font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--muted,#8892a4); border:1px dashed color-mix(in srgb,var(--text,#fff) 26%,transparent); border-radius:6px; padding:1px 6px; } .liq-lauf{ display:inline-flex; align-items:center; gap:11px; min-height:32px; } .liq-lauf__txt{ font-size:var(--text-14); } .liq-lauf__uhr{ font-size:var(--text-13,13px); color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; letter-spacing:.01em; } .liq-lauf--fertig .liq-lauf__uhr{ color:var(--muted,#8892a4); } .liq-lauf--langsam .liq-lauf__uhr{ color:var(--warn,#f59e0b); } .liq-lauf--langsam .liq-lauf__txt{ color:var(--text,#e9eef6); } .liq-stationen{ display:flex; align-items:center; flex-wrap:wrap; gap:0 0; } .liq-stationen__st{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; font-size:var(--text-11,11.5px); font-weight:600; color:var(--muted,#8892a4); } .liq-stationen__pt{ width:9px; height:9px; border-radius:50%; flex:none; background:color-mix(in srgb,var(--text,#fff) 16%,transparent); } .liq-stationen__lk{ width:26px; height:1px; margin:0 8px; flex:none; background:color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-stationen__st.is-durch{ color:color-mix(in srgb,var(--text,#e9eef6) 78%,transparent); } .liq-stationen__st.is-durch .liq-stationen__pt{ background:var(--accent,#4f8ef7); } .liq-stationen__st.is-hier{ color:var(--text,#e9eef6); } .liq-stationen__st.is-hier .liq-stationen__pt{ background:var(--accent,#4f8ef7); box-shadow:0 0 0 4px color-mix(in srgb,var(--accent,#4f8ef7) 22%,transparent); } @media (prefers-reduced-transparency:reduce){ .liq-stationen__st.is-hier .liq-stationen__pt{ box-shadow:0 0 0 2px var(--accent,#4f8ef7); } } .liq-stimmen{ display:grid; gap:12px; } @media (min-width:700px){ .liq-stimmen{ grid-template-columns:1fr 1fr; } } .liq-stimmen__s{ border-radius:10px; padding:13px 15px; min-width:0; background:color-mix(in srgb,var(--text,#fff) 4%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-stimmen__wer{ display:flex; align-items:center; gap:7px; margin-bottom:7px; font-size:var(--text-10,10.5px); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#8892a4); } .liq-stimmen__txt{ font-size:var(--text-13,13px); line-height:1.55; } .liq-stimmen__s--antwort{ border-color:color-mix(in srgb,var(--accent,#4f8ef7) 26%,transparent); background:color-mix(in srgb,var(--accent,#4f8ef7) 7%,transparent); } .liq-vertraulich{ border-radius:10px; padding:13px 15px; background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--text,#fff) 3%,transparent) 0 9px, transparent 9px 18px); border:1px dashed color-mix(in srgb,var(--text,#fff) 20%,transparent); } .liq-vertraulich__kopf{ display:flex; align-items:center; gap:8px; margin-bottom:6px; font-size:var(--text-11,11.5px); font-weight:700; color:var(--muted,#8892a4); } .liq-vertraulich__kopf svg{ width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-vertraulich__txt{ font-size:var(--text-13,13px); line-height:1.55; } .liq-vertraulich__satz{ font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); line-height:1.5; margin-top:8px; } @media (prefers-reduced-transparency:reduce){ .liq-vertraulich{ background:color-mix(in srgb,var(--text,#fff) 4%,transparent); } } .liq-chip:not(.liq-chip--pick), .liq-statuspill{ min-height:var(--h-marke); box-sizing:border-box; } .liq-btn, .liq-btn-sec, .liq-btn-text, .liq-tab, .liq-field__ok, .liq-rueckweg{ min-height:var(--h-bedien); box-sizing:border-box; } @media (pointer:coarse){ .liq-input, input[type=text].liq, input[type=time].liq, input[type=number].liq, input[type=date].liq, .liq textarea, .liq select, .liq-qrc__close, .liq-btn-abbruch{ min-height:44px; box-sizing:border-box; } .liq-checkrow{ min-height:44px; } } .liq-personwahl{ display:flex; flex-wrap:nowrap; align-items:center; gap:11px; width:100%; min-height:44px; padding:7px 10px; border:0; border-radius:11px; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; transition:background-color .14s ease; } .liq-personwahl:hover{ background:color-mix(in srgb,var(--text,#fff) 6%,transparent); } .liq-personwahl:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:-2px; } .liq-personwahl__hk{ flex:none; width:20px; height:20px; border-radius:6px; border:1.5px solid var(--border,#333333); display:grid; place-items:center; transition:background-color .14s ease, border-color .14s ease; } .liq-personwahl__hk svg{ width:13px; height:13px; opacity:0; fill:none; stroke:#fff; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; transition:opacity .14s ease; } .liq-personwahl.is-gewaehlt .liq-personwahl__hk{ background:var(--accent,#4f8ef7); border-color:transparent; } .liq-personwahl.is-gewaehlt .liq-personwahl__hk svg{ opacity:1; } .liq-personwahl__av{ flex:none; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-size:var(--text-11); font-weight:650; letter-spacing:.02em; background:color-mix(in srgb,var(--text,#fff) 9%,transparent); color:var(--ink-soft,#c2cad8); } .liq-personwahl__nm{ display:flex; flex-direction:column; gap:1px; min-width:0; } .liq-personwahl__nm > b{ display:block; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-personwahl__nm > span{ font-size:var(--text-11); color:var(--muted,#8892a4); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-personwahl[aria-disabled="true"]{ cursor:not-allowed; } .liq-personwahl[aria-disabled="true"] .liq-personwahl__hk, .liq-personwahl[aria-disabled="true"] .liq-personwahl__av, .liq-personwahl[aria-disabled="true"] .liq-personwahl__nm > b{ opacity:.42; } .liq-personwahl[aria-disabled="true"]:hover{ background:none; } .liq-personwahl[aria-disabled="true"] .liq-personwahl__nm > span{ opacity:1; color:var(--ki-text,#f0c48a); } .liq-checkrow{ display:flex; align-items:center; gap:9px; cursor:pointer; user-select:none; font-size:var(--text-12); color:var(--ink-soft,#c2cad8); text-align:left; } .liq-zusage{ display:flex; gap:13px; align-items:flex-start; width:100%; text-align:left; padding:13px; border-radius:14px; cursor:pointer; font:inherit; color:inherit; background:none; border:1.5px solid var(--border,#333333); min-height:44px; transition:border-color .16s ease, background-color .16s ease; } .liq-zusage:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:3px; } .liq-zusage__siegel{ flex:none; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:2px solid var(--border,#333333); transition:border-color .2s ease, background-color .2s ease; } .liq-zusage__siegel svg{ width:22px; height:22px; fill:none; stroke:var(--muted,#8892a4); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; transition:stroke .2s ease; } .liq-zusage__titel{ font-weight:600; display:block; } .liq-zusage__folge{ display:block; margin-top:3px; font-size:var(--text-12); color:var(--muted,#8892a4); } .liq-zusage[aria-checked="false"]{ border-color:var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 10%,transparent); } .liq-zusage[aria-checked="false"] .liq-zusage__siegel{ border-color:var(--danger,#e0736f); background:color-mix(in srgb,var(--danger,#e0736f) 15%,transparent); } .liq-zusage[aria-checked="false"] .liq-zusage__siegel svg{ stroke:var(--danger,#e0736f); } .liq-zusage[aria-checked="true"]{ border-color:var(--ok,#3ecf8e); background:color-mix(in srgb,var(--ok,#3ecf8e) 11%,transparent); } .liq-zusage[aria-checked="true"] .liq-zusage__siegel{ border-color:var(--ok,#3ecf8e); background:color-mix(in srgb,var(--ok,#3ecf8e) 16%,transparent); } .liq-zusage[aria-checked="true"] .liq-zusage__siegel svg{ stroke:var(--ok,#3ecf8e); } .liq-btn-abbruch:not(.liq-btn):not(.liq-btn-sec){ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:7px 15px; border-radius:var(--radius-pill,999px); font:inherit; font-size:var(--text-13); font-weight:600; cursor:pointer; } .liq-wahlchip{ min-height:var(--h-wahl); box-sizing:border-box; } @media (pointer:coarse){ .liq-btn, .liq-btn-sec, .liq-btn-text, .liq-tab, .liq-field__ok, .liq-rueckweg, .liq-wahlchip{ min-height:var(--h-wahl); } } .liq-card{ border:0; box-shadow:var(--schatten-3); } .liq-tab{ padding-block:8px; } .liq-hakenzeile{ display:flex; align-items:flex-start; gap:10px; padding:9px 0; font-size:var(--text-13,13px); line-height:1.5; min-width:0; border-top:1px solid color-mix(in srgb,var(--text,#fff) 6%,transparent); } .liq-hakenzeile:first-of-type{ border-top:0; } .liq-hakenzeile__hk{ width:19px; height:19px; flex:none; margin-top:1px; border-radius:6px; box-sizing:border-box; cursor:pointer; background:none; border:1.5px solid color-mix(in srgb,var(--text,#fff) 24%,transparent); display:grid; place-items:center; padding:0; } .liq-hakenzeile__hk svg{ width:13px; height:13px; opacity:0; fill:none; stroke:#fff; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; transition:opacity .14s ease; } .liq-hakenzeile.is-erledigt .liq-hakenzeile__hk{ background:var(--success,#35ad76); border-color:transparent; } .liq-hakenzeile.is-erledigt .liq-hakenzeile__hk svg{ opacity:1; } .liq-hakenzeile.is-erledigt{ color:var(--muted,#8892a4); } .liq-hakenzeile__hk:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } @media (pointer:coarse){ .liq-hakenzeile__hk{ position:relative; } .liq-hakenzeile__hk::after{ content:''; position:absolute; inset:-12px; } } .liq-hakenzeile__mk{ width:19px; height:19px; flex:none; margin-top:1px; display:grid; place-items:center; color:currentColor; } .liq-hakenzeile__mk svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } .liq-woche{ display:grid; grid-template-columns:34px minmax(0,1fr); gap:6px 12px; align-items:center; width:100%; } .liq-woche__t{ font-size:var(--text-12,12px); font-weight:650; color:var(--muted,#8892a4); cursor:pointer; user-select:none; background:none; border:0; padding:0 2px; font-family:inherit; text-align:left; border-radius:6px; transition:color .15s; } .liq-woche__t:hover{ color:var(--text,#e9eef6); } .liq-woche__t:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:3px; } .liq-woche__t.is-an{ color:var(--text,#e9eef6); } .liq-woche__bahn{ position:relative; height:30px; border-radius:6px; background:color-mix(in srgb,var(--text,#fff) 4%,transparent); } .liq-woche__blk{ position:absolute; top:3px; bottom:3px; border-radius:6px; box-sizing:border-box; background:color-mix(in srgb,var(--accent,#4f8ef7) 34%,transparent); border:1px solid color-mix(in srgb,var(--accent,#4f8ef7) 55%,transparent); display:flex; align-items:center; justify-content:space-between; padding:0 7px; font-size:var(--text-10,10.5px); font-variant-numeric:tabular-nums; color:#dce8ff; } .liq-woche__griff{ position:absolute; top:0; bottom:0; width:8px; cursor:ew-resize; } .liq-woche__griff--l{ left:-4px; } .liq-woche__griff--r{ right:-4px; } .liq-woche__griff--l::after{ content:''; position:absolute; inset:-8px 0 -8px -12px; } .liq-woche__griff--r::after{ content:''; position:absolute; inset:-8px -12px -8px 0; } .liq-woche__zahl{ font:inherit; cursor:text; padding:2px 3px; border-radius:4px; } .liq-woche__zahl:hover{ background:color-mix(in srgb,var(--text,#fff) 12%,transparent); } .liq-woche__frei{ height:30px; display:flex; align-items:center; padding-left:10px; width:100%; box-sizing:border-box; border:0; border-radius:6px; cursor:pointer; font:inherit; text-align:left; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); background:color-mix(in srgb, var(--text,#fff) 2.5%, transparent); transition:background .15s, color .15s; } .liq-woche__frei:hover{ background:color-mix(in srgb, var(--accent,#4f8ef7) 12%, transparent); color:var(--text,#e9eef6); } .liq-woche__frei:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-woche__skala{ grid-column:2; display:flex; justify-content:space-between; padding-top:2px; font-size:var(--text-10,10px); color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; } .liq-woche__summe{ grid-column:1 / -1; display:flex; justify-content:space-between; margin-top:8px; padding-top:9px; font-size:var(--text-12,12px); border-top:1px solid var(--trennlinie); } .liq-woche__summe b{ font-variant-numeric:tabular-nums; } @media (max-width:520px){ .liq-woche{ grid-template-columns:28px minmax(0,1fr); gap:5px 8px; } .liq-woche__blk{ font-size:9.5px; padding:0 4px; } } .liq-dok{ display:flex; flex-direction:column; gap:10px; min-height:0; height:100%; } .liq-dok__rahmen{ flex:1 1 auto; min-height:240px; border-radius:10px; overflow:hidden; background:color-mix(in srgb,var(--text,#fff) 4%,transparent); box-shadow:0 0 0 1px var(--ring-farbe); } .liq-dok__rahmen iframe, .liq-dok__rahmen img{ display:block; width:100%; height:100%; border:0; object-fit:contain; background:#fff; } .liq-dok__meta{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; flex:none; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); } .liq-dok__fehler{ flex:1 1 auto; display:grid; place-items:center; text-align:center; padding:24px; border-radius:10px; font-size:var(--text-12,12px); color:var(--muted,#8892a4); background:color-mix(in srgb,var(--text,#fff) 4%,transparent); } .liq-stichpunkte{ display:flex; flex-direction:column; gap:2px; } .liq-stichpunkte__p{ display:flex; align-items:flex-start; gap:10px; padding:7px 10px; border-radius:10px; transition:background .12s; } .liq-stichpunkte__p:focus-within{ background:color-mix(in srgb,var(--text,#fff) 4%,transparent); } .liq-stichpunkte__pt{ width:5px; height:5px; flex:none; margin-top:9px; border-radius:50%; background:color-mix(in srgb,var(--text,#fff) 34%,transparent); } .liq-stichpunkte__p:focus-within .liq-stichpunkte__pt{ background:var(--accent,#4f8ef7); } .liq-stichpunkte__t:focus-visible{ box-shadow:0 0 0 2px var(--accent,#4f8ef7); border-radius:5px; } :root{ --liq-schreib-spalte: 34em; --liq-schreib-durchschuss: 1.75; --liq-schreib-tinte: #f2f0ec; } .liq-stichpunkte__t{ flex:1 1 auto; min-width:0; border:0; background:none; outline:none; color:var(--liq-schreib-tinte,#f2f0ec); font:inherit; font-size:var(--text-14,14px); line-height:var(--liq-schreib-durchschuss,1.75); max-width:var(--liq-schreib-spalte,34em); caret-color:var(--accent,#4f8ef7); resize:none; overflow:hidden; padding:0; } .liq-stichpunkte__t::placeholder{ color:var(--muted,#8892a4); } .liq-stichpunkte__weg{ font:inherit; flex:none; width:26px; height:26px; margin-top:2px; border:0; padding:0; border-radius:6px; cursor:pointer; background:none; color:var(--muted,#8892a4); opacity:0; transition:opacity .12s, color .12s; } .liq-stichpunkte__p:hover .liq-stichpunkte__weg, .liq-stichpunkte__p:focus-within .liq-stichpunkte__weg{ opacity:1; } .liq-stichpunkte__weg:hover{ color:var(--danger,#e55353); background:color-mix(in srgb,var(--danger,#e55353) 12%,transparent); } .liq-stichpunkte__weg:focus-visible{ opacity:1; outline:2px solid var(--accent,#4f8ef7); outline-offset:1px; } .liq-stichpunkte__weg svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; } .liq-stichpunkte__fuss{ font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); padding:4px 10px 0; } @media (pointer:coarse){ .liq-stichpunkte__weg{ opacity:1; width:44px; height:44px; margin-top:-6px; } .liq-stichpunkte__p{ padding:9px 10px; } } .liq-staffel{ display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch; gap:10px; } .liq-staffel__seite{ display:flex; flex-direction:column; gap:4px; padding:12px 14px; border-radius:10px; min-width:0; background:color-mix(in srgb,var(--text,#fff) 3%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-staffel__seite.is-dran{ background:color-mix(in srgb,var(--accent,#4f8ef7) 14%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#4f8ef7) 48%,transparent); } .liq-staffel__wer{ font-size:var(--text-13,13px); font-weight:650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .liq-staffel__seite:not(.is-dran) .liq-staffel__wer{ color:var(--muted,#8892a4); } .liq-staffel__was{ font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); line-height:1.45; } .liq-staffel__seite.is-dran .liq-staffel__was{ color:#dbe7fb; } .liq-staffel__pfeil{ align-self:center; display:flex; align-items:center; justify-content:center; width:30px; height:30px; flex:none; border-radius:50%; color:var(--accent,#4f8ef7); background:color-mix(in srgb,var(--accent,#4f8ef7) 12%,transparent); } .liq-staffel__pfeil svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; } .liq-staffel__pfeil--zurueck{ color:var(--warning,#f0b23c); background:color-mix(in srgb,var(--warning,#f0b23c) 14%,transparent); } .liq-staffel__pfeil--zurueck svg{ transform:scaleX(-1); } .liq-staffel__seit{ font-size:var(--text-11,11.5px); font-variant-numeric:tabular-nums; } .liq-staffel__seit--lang{ color:var(--warning,#f0b23c); font-weight:600; } @media (max-width:560px){ .liq-staffel{ grid-template-columns:1fr; } .liq-staffel__pfeil{ transform:rotate(90deg); justify-self:center; } .liq-staffel__pfeil--zurueck{ transform:rotate(90deg); } } .liq-kopfzahlen{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1px; background:var(--trennlinie,rgba(255,255,255,.1)); border-radius:10px; overflow:hidden; margin:2px 0 14px; } .liq-kopfzahlen__z{ background:var(--bg,#0f1117); padding:12px 15px; min-width:0; } .liq-kopfzahlen__k{ display:block; font-size:var(--text-10,10.5px); font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted,#8892a4); margin-bottom:4px; } .liq-kopfzahlen__v{ display:block; font-size:var(--text-17,17px); font-weight:600; font-variant-numeric:tabular-nums; color:var(--text,#e9eef6); } .liq-kopfzahlen__u{ display:block; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); margin-top:3px; line-height:1.4; } .liq-blockherkunft{ display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin-top:14px; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); position:relative; } .liq-blockherkunft::before{ content:''; position:absolute; left:0; right:0; top:50%; height:1px; background:color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-blockherkunft > *{ position:relative; background:var(--surface,#1d1d1d); padding:0 8px; } .liq-blockherkunft__vor{ } .liq-blockherkunft__wer{ font-weight:600; color:var(--ink-soft,#c2cad8); } .liq-blockherkunft__wann{ font-variant-numeric:tabular-nums; } .liq-blockherkunft__abw{ color:var(--warning,#f0b23c); font-weight:600; } .liq-blockherkunft__abw::before{ content:'· '; color:var(--muted,#8892a4); font-weight:400; } .liq-leerwert{ display:inline-flex; align-items:center; gap:6px; font-size:var(--text-13,13px); color:var(--muted,#8892a4); } .liq-leerwert--antwort{ font-style:normal; } .liq-leerwert--offen{ color:#7aa7f5; font-weight:600; padding-left:8px; box-shadow:inset 2px 0 0 var(--accent,#4f8ef7); } .liq-leerwert--nichtzutreffend{ font-style:italic; opacity:.72; } .liq-leerwert--offen.liq-leerwert--still{ font-weight:500; padding-left:0; box-shadow:none; color:color-mix(in srgb,var(--accent,#4f8ef7) 62%,var(--muted,#8892a4)); } .liq-leerwert__grund{ font-size:var(--text-11,11.5px); opacity:.85; } .liq-kette{ display:block; } .liq-kette__bahn{ display:flex; align-items:stretch; gap:3px; height:34px; border-radius:10px; overflow:hidden; background:color-mix(in srgb,var(--text,#fff) 3%,transparent); } .liq-kette__seg{ position:relative; min-width:6px; display:flex; align-items:center; justify-content:center; padding:0 8px; border-radius:6px; cursor:default; font-size:var(--text-11,11.5px); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#dce8ff; background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#4f8ef7) 46%,transparent); } .liq-kette__seg--luecke{ color:#ffd9d9; background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--danger,#e55353) 30%,transparent) 0 6px, color-mix(in srgb,var(--danger,#e55353) 15%,transparent) 6px 12px); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--danger,#e55353) 55%,transparent); } .liq-kette__seg--offen{ background:color-mix(in srgb,var(--ok,#3ecf8e) 26%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok,#3ecf8e) 46%,transparent); color:#d7f5e8; } .liq-kette__seg--unklar{ color:var(--muted,#8892a4); background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--text,#fff) 9%,transparent) 0 6px, color-mix(in srgb,var(--text,#fff) 4%,transparent) 6px 12px); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text,#fff) 18%,transparent); } .liq-kette__jahre{ display:flex; justify-content:space-between; margin-top:6px; font-size:var(--text-10,10px); color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; } .liq-kette__legende{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); } .liq-kette__lg{ display:inline-flex; align-items:center; gap:6px; } .liq-kette__lgp{ width:11px; height:11px; border-radius:4px; flex:none; background:color-mix(in srgb,var(--accent,#4f8ef7) 30%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#4f8ef7) 46%,transparent); } .liq-kette__lgp--luecke{ background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--danger,#e55353) 30%,transparent) 0 4px, color-mix(in srgb,var(--danger,#e55353) 15%,transparent) 4px 8px); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--danger,#e55353) 55%,transparent); } .liq-kette__lgp--offen{ background:color-mix(in srgb,var(--ok,#3ecf8e) 26%,transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok,#3ecf8e) 46%,transparent); } .liq-kette__lgp--unklar{ background:repeating-linear-gradient(135deg, color-mix(in srgb,var(--text,#fff) 9%,transparent) 0 4px, color-mix(in srgb,var(--text,#fff) 4%,transparent) 4px 8px); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text,#fff) 18%,transparent); } @media (max-width:620px){ .liq-kette__bahn{ height:22px; } .liq-kette__seg{ padding:0 3px; font-size:0; } } .liq-protokoll{ font-size:var(--text-13,13px); } .liq-protokoll__z{ display:grid; grid-template-columns:76px minmax(0,1fr) auto; gap:10px; align-items:start; padding:10px 0; border-top:1px solid color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-protokoll__z:first-of-type{ border-top:0; } .liq-protokoll__t{ color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; font-size:var(--text-12,12px); padding-top:1px; } .liq-protokoll__was{ min-width:0; } .liq-protokoll__w{ color:var(--muted,#8892a4); font-size:var(--text-11,11.5px); margin-top:2px; } .liq-protokoll__ende{ display:flex; align-items:center; gap:7px; flex:none; } .liq-protokoll__z--abgewiesen .liq-protokoll__was{ color:var(--muted,#8892a4); } .liq-protokoll__fuss{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:10px; padding-top:10px; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); border-top:1px solid var(--trennlinie); } @media (max-width:520px){ .liq-protokoll__z{ grid-template-columns:minmax(0,1fr) auto; } .liq-protokoll__t{ grid-column:1 / -1; } } .liq-satzfeld{ position:relative; border-radius:14px; background:var(--surface,#14161f); border:1px solid var(--border,#2a2e3d); overflow:hidden; } .liq-satzfeld__kopf{ display:flex; align-items:center; gap:10px; padding:8px 12px; border-bottom:1px solid var(--border,#2a2e3d); font-size:var(--text-12,12.5px); color:var(--muted,#8892a4); } .liq-satzfeld__rechts{ margin-left:auto; display:flex; gap:6px; } .liq-satzfeld__kopf button{ font:inherit; color:inherit; background:transparent; cursor:pointer; border:1px solid var(--border,#2a2e3d); border-radius:8px; padding:4px 9px; min-height:32px; } .liq-satzfeld__kopf button[aria-pressed="true"]{ color:var(--text,#e9eef6); background:color-mix(in srgb, var(--text,#fff) 7%, transparent); } .liq-satzfeld__buehne{ position:relative; height:clamp(300px,52vh,560px); overflow:hidden; } .liq-satzfeld__feld, .liq-satzfeld__spiegel{ position:absolute; inset:0; margin:0; width:100%; height:100%; font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:var(--text-14,14px); line-height:1.6; border:0; white-space:pre-wrap; word-break:break-word; padding-left:max(22px, calc(50% - 33ch)); padding-right:max(22px, calc(50% - 33ch)); scrollbar-gutter:stable; } .liq-satzfeld__feld{ z-index:2; background:transparent; color:transparent; resize:none; outline:none; overflow-y:auto; overscroll-behavior:contain; caret-color:var(--liq-feld-strich,var(--text,#e9eef6)); } .liq-satzfeld__spiegel{ z-index:1; color:var(--text,#e9eef6); pointer-events:none; overflow:hidden; } .liq-satzfeld__z{ display:block; min-height:1.6em; } .liq-satzfeld__z .liq-satzfeld__s{ display:inline; padding:0; margin:0; border:0; transition:opacity .2s ease; } .liq-satzfeld__z.is-h1{ font-weight:700; color:var(--liq-satzfeld-akzent, var(--accent,#4f8ef7)); } .liq-satzfeld__z.is-h2{ font-weight:700; } .liq-satzfeld__z .is-schutz{ opacity:.55; } .liq-satzfeld.is-fokus .liq-satzfeld__z .liq-satzfeld__s{ opacity:0; } .liq-satzfeld.is-fokus .liq-satzfeld__z .liq-satzfeld__s.is-sicht{ opacity:1; } .liq-satzfeld.is-fokus .liq-satzfeld__feld, .liq-satzfeld.is-fokus .liq-satzfeld__spiegel{ padding-top:50%; padding-bottom:50%; } .liq-satzfeld__hinweis{ position:absolute; right:12px; bottom:10px; z-index:3; font-size:var(--text-11,11.5px); line-height:1.6; text-align:right; color:var(--muted,#8892a4); transition:opacity .3s ease; } .liq-satzfeld__hinweis.is-weg{ opacity:0; } .liq-satzfeld__hinweis code{ font-family:ui-monospace,Menlo,monospace; color:var(--liq-satzfeld-akzent, var(--accent,#4f8ef7)); } .liq-satzfeld.is-vorschau .liq-satzfeld__buehne{ display:none; } .liq-klartab__kopf{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:10px; } .liq-klartab__t{ font-weight:600; color:var(--text,#e9eef6); overflow-wrap:anywhere; } .liq-klartab__u{ display:block; margin-top:3px; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); overflow-wrap:anywhere; } .liq-klartab td.liq-klartab__akt{ text-align:right; white-space:nowrap; } .liq-klartab tbody td{ vertical-align:top; } @media (max-width:620px){ .liq-klartab td.liq-klartab__akt{ text-align:left; padding-top:8px; } } .liq-feldplus{ display:flex; flex-direction:column; padding:9px 12px; border-radius:10px; background:color-mix(in srgb,var(--text,#e2e8f0) 3%,transparent); font-size:var(--text-13); min-height:44px; border:1px solid transparent; box-sizing:border-box; -webkit-tap-highlight-color:transparent; } .liq-feldplus__kopf{ position:relative; display:flex; align-items:center; gap:10px; min-width:0; min-height:26px; } .liq-feldplus__kopf > .liq-field__zeile{ flex:1 1 auto; } .liq-feldplus__kopf > .liq-field__zeile > b{ padding-right:38px; } .liq-feldplus__plus{ position:absolute; right:0; top:50%; transform:translateY(-50%); flex:none; width:28px; height:28px; border-radius:8px; display:grid; place-items:center; cursor:pointer; font:inherit; font-size:17px; line-height:1; font-weight:600; color:var(--ink-soft,#c2cad8); background:none; border:1px solid color-mix(in srgb,var(--text,#fff) 14%,transparent); transition:background .15s, color .15s, border-color .15s; } .liq-feldplus__plus:hover{ color:var(--text,#e9eef6); background:color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-feldplus__plus:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-feldplus__plus::after{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:44px; height:44px; border-radius:10px; } .liq-feldplus__liste{ display:flex; flex-direction:column; margin-top:4px; } .liq-feldplus__z{ display:flex; align-items:center; gap:8px; padding:3px 0; border-top:1px solid color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-feldplus__nr{ flex:none; width:16px; text-align:right; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); font-variant-numeric:tabular-nums; } .liq-feldplus__in{ flex:1 1 0; min-width:0; box-sizing:border-box; min-height:30px; padding:3px 0; font:inherit; font-size:var(--text-13); font-weight:600; color:var(--text,#e9eef6); background:none; border:0; border-bottom:1px solid transparent; transition:border-color .15s; } .liq-feldplus__in--schmal{ flex:0 1 130px; } .liq-feldplus__in::placeholder{ color:var(--subtle,#5a6377); font-weight:400; } .liq-feldplus__in:hover{ border-bottom-color:color-mix(in srgb,var(--text,#fff) 16%,transparent); } .liq-feldplus__in:focus{ outline:none; border-bottom-color:var(--accent,#4f8ef7); } .liq-feldplus__weg{ flex:none; width:26px; height:26px; border-radius:7px; display:grid; place-items:center; cursor:pointer; font:inherit; font-size:var(--text-13); line-height:1; color:var(--muted,#8892a4); background:none; border:0; position:relative; transition:color .15s, background .15s; } .liq-feldplus__weg:hover{ color:var(--danger,#e55353); background:color-mix(in srgb,var(--danger,#e55353) 12%,transparent); } .liq-feldplus__weg:focus-visible{ outline:2px solid var(--accent,#4f8ef7); outline-offset:2px; } .liq-feldplus__weg::after{ content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:44px; height:44px; border-radius:10px; } @media (max-width:520px){ .liq-feldplus__z{ flex-wrap:wrap; } .liq-feldplus__in--schmal{ flex:1 1 100%; } } @media (prefers-reduced-motion:reduce){ .liq-feldplus__plus, .liq-feldplus__weg, .liq-feldplus__in{ transition:none; } } .liq-modal--form{ width:min(620px,calc(100vw - 32px)); padding:0; } .liq-modal--form > .liq-modal__kopf{ border-radius:20px 20px 0 0; } .liq-modal--form > .liq-modal__fuss{ border-radius:0 0 20px 20px; display:flex; justify-content:flex-end; align-items:center; gap:10px; flex-wrap:wrap; } .liq-modal--form > .liq-modal__kopf, .liq-modal--form > .liq-modal__fuss{ background:color-mix(in srgb,var(--text,#e2e8f0) 5%,transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); } @media (prefers-reduced-transparency:reduce){ .liq-modal--form > .liq-modal__kopf, .liq-modal--form > .liq-modal__fuss{ background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; } } .liq-modal--form > .liq-modal__kopf > .liq-modal-close{ position:static; top:auto; right:auto; flex:none; } .liq-modal--form > .liq-modal__body{ display:flex; flex-direction:column; gap:8px; } .liq-modal--form .liq-field + .liq-field{ margin-top:8px; } .liq-modal--form .liq-modal__lead{ margin:0 0 4px; font-size:var(--text-13); color:var(--ink-soft,#c2cad8); line-height:1.45; } @media (max-width:520px){ .liq-modal--form > .liq-modal__kopf{ padding:14px 16px; } .liq-modal--form > .liq-modal__body{ padding:14px 16px; } .liq-modal--form > .liq-modal__fuss{ padding:12px 16px; } .liq-modal--form > .liq-modal__fuss{ flex-direction:column-reverse; align-items:stretch; } .liq-modal--form > .liq-modal__fuss .liq-modal-btn{ width:100%; min-height:44px; } } .liq-ziel__bis{ padding-left:14px; margin-top:1px; } .liq-ziel__bis--bald{ color:var(--frist-bald,#e2c08d); } .liq-ziel__bis--faellig{ color:var(--frist-faellig,#e9b4b0); font-weight:600; } .liq-frist{ font-weight:600; color:var(--ink-soft,#c2cad8); white-space:nowrap; } .liq-frist--bald{ color:var(--frist-bald,#e2c08d); } .liq-frist--faellig{ color:var(--frist-faellig,#e9b4b0); font-weight:650; } .liq-frist--ok{ color:var(--success,#3ecf8e); } .liq-frist--offen{ color:var(--muted,#8892a4); font-weight:500; } .liq-vorspann{ display:inline-flex; align-items:center; gap:7px; padding:6px 14px; border-radius:999px; font-size:var(--text-13,13px); font-weight:600; letter-spacing:.01em; color:var(--ink-soft,#c2cad8); background:color-mix(in srgb, var(--ink,#e2e8f0) 6%, transparent); border:1px solid var(--trennlinie,rgba(255,255,255,.10)); } .liq-vorspann::before{ content:''; width:5px; height:5px; border-radius:50%; flex:none; background:var(--accent,#4f8ef7); } .liq-vorspann--still::before{ display:none; } .liq-vorspann + :is(h1,h2,h3,.liq-hero-title){ margin-top:14px; } .liq-kennzahlen--nackt{ gap:30px; } .liq-kennzahlen--nackt .liq-kennzahl{ flex:0 1 auto; padding:0; background:none; border:0; border-radius:0; } .liq-kennzahlen--nackt .liq-kennzahl__k{ text-transform:none; letter-spacing:0; font-size:var(--text-12); margin:6px 0 0; } .liq-kennzahlen--nackt .liq-kennzahl__v{ font-size:27px; } .liq-kennzahlen--gross .liq-kennzahl__v{ font-size:clamp(30px, 4.4vw, 44px); } .liq-kennzahl__um{ margin-top:8px; } .liq-kennzahl__um .liq-seg{ font-size:var(--text-11,11.5px); } .liq-blockherkunft--still{ display:flex; justify-content:center; align-items:baseline; gap:8px; font-size:var(--text-11); color:var(--muted,#8892a4); padding:14px 2px 7px; margin-top:2px; border-bottom:1px solid color-mix(in srgb, var(--text,#fff) 9%, transparent); } .liq-blockherkunft--still::before{ content:none; } .liq-blockherkunft--still > *{ background:none; padding:0; position:static; } .liq-blockherkunft--still .liq-blockherkunft__wer{ font-weight:600; color:var(--ink-soft,#c2cad8); } .liq-blockherkunft--still .liq-blockherkunft__wann{ font-variant-numeric:tabular-nums; } .liq-blockherkunft--still:empty{ padding-top:0; } .liq-field__vorschlag{ border:1px dashed color-mix(in srgb, var(--ki,#f5a524) 62%, transparent); border-radius:7px; padding:2px 8px; display:inline-block; background:color-mix(in srgb, var(--ki,#f5a524) 9%, transparent); } .liq-field__weg{ min-height:32px; padding:0 13px; border-radius:999px; cursor:pointer; border:0; font:inherit; font-size:var(--text-12); font-weight:700; color:#fff; display:inline-flex; align-items:center; gap:5px; background:var(--danger,#e55353); } .liq-field__weg:hover{ filter:brightness(1.06); } .liq-field__weg:focus-visible{ outline:2px solid var(--danger,#e55353); outline-offset:2px; } .liq-felder > .liq-feldwirt:has(> .liq-field--ki){ grid-column:1 / -1; } .liq-chain__link--offen::before{ background:transparent; border-color:color-mix(in srgb, var(--text,#fff) 26%, transparent); } .liq-chain__link--ki::before{ background:var(--ki,#f5a524); box-shadow:none; outline:1.5px dashed color-mix(in srgb, var(--ki,#f5a524) 70%, transparent); outline-offset:2px; } .liq-chain__link--ki{ border-color:color-mix(in srgb, var(--ki,#f5a524) 42%, transparent); } .liq-chain__link--mensch::before{ background:var(--accent,#4f8ef7); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent,#4f8ef7) 22%, transparent); } .liq-chain__link--mensch{ border-color:color-mix(in srgb, var(--accent,#4f8ef7) 42%, transparent); } .liq-schutzglas{ display:grid; border-radius:13px; overflow:hidden; border:1px solid color-mix(in srgb,var(--text,#fff) 10%,transparent); background:color-mix(in srgb,var(--text,#fff) 3%,transparent); } .liq-schutzglas__inhalt{ grid-area:1/1; padding:15px 16px; font-size:var(--text-14,14px); line-height:1.6; } .liq-schutzglas__glas{ grid-area:1/1; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; padding:18px 16px; -webkit-backdrop-filter:blur(9px) saturate(1.15); backdrop-filter:blur(9px) saturate(1.15); background:color-mix(in srgb,var(--bg,#0f1117) 52%,transparent); transition:opacity .22s; } .liq-schutzglas.is-auf .liq-schutzglas__glas{ opacity:0; pointer-events:none; } .liq-schutzglas__schloss{ width:26px; height:26px; flex:none; fill:none; stroke:var(--accent,#4f8ef7); stroke-width:1.9; stroke-linecap:round; } .liq-schutzglas--marke{ border:1px solid color-mix(in srgb,var(--text,#fff) 10%,transparent); } .liq-schutzglas--marke svg{ width:11px; height:11px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; } .liq-schutzglas__satz{ font-size:var(--text-12,12.5px); color:var(--muted,#8892a4); line-height:1.55; max-width:330px; } .liq-schutzglas__auf{ min-height:44px; padding:0 16px; border-radius:99px; font:inherit; font-size:var(--text-13,13.5px); font-weight:600; cursor:pointer; color:var(--text,#e9eef6); border:1px solid color-mix(in srgb,var(--text,#fff) 20%,transparent); background:color-mix(in srgb,var(--text,#fff) 7%,transparent); } .liq-schutzglas__fuss{ grid-area:2/1; display:none; align-items:center; gap:7px; padding:9px 16px; font-size:var(--text-11,11.5px); color:var(--muted,#8892a4); border-top:1px solid color-mix(in srgb,var(--text,#fff) 8%,transparent); } .liq-schutzglas.is-auf .liq-schutzglas__fuss{ display:flex; } .liq-schutzglas__fuss--achtung{ color:#f0c674; } .liq-schutzglas__zu{ margin-left:auto; min-height:32px; padding:0 11px; border-radius:99px; font:inherit; font-size:var(--text-12,12px); cursor:pointer; color:var(--muted,#8892a4); background:none; border:1px solid color-mix(in srgb,var(--text,#fff) 15%,transparent); } @media (prefers-reduced-motion:reduce){ .liq-schutzglas__glas{ transition:none; } } @media (prefers-reduced-transparency:reduce){ .liq-schutzglas__glas{ -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--bg,#0f1117); } } .liq-mitteilungen{ border-radius:16px; padding:17px; background:color-mix(in srgb,var(--text,#fff) 4%,transparent); border:1px solid color-mix(in srgb,var(--text,#fff) 9%,transparent); } .liq-mitteilungen__t{ font-family:var(--d-font-display,inherit); font-size:var(--text-16,15.5px); font-weight:600; margin:0 0 6px; } .liq-mitteilungen p{ margin:0 0 12px; font-size:var(--text-13,13.5px); line-height:1.6; color:var(--muted,#8892a4); } .liq-mitteilungen p b{ color:var(--text,#e9eef6); } .liq-mitteilungen__liste{ margin:0 0 13px; padding:0; list-style:none; } .liq-mitteilungen__liste li{ display:flex; gap:9px; align-items:flex-start; font-size:var(--text-13,13px); line-height:1.55; padding:5px 0; color:var(--muted,#8892a4); } .liq-mitteilungen__liste li b{ color:var(--text,#e9eef6); font-weight:600; } .liq-mitteilungen__punkt{ width:6px; height:6px; border-radius:50%; flex:none; margin-top:7px; background:var(--accent,#4f8ef7); } .liq-mitteilungen__reihe{ display:flex; gap:9px; flex-wrap:wrap; } .liq-geraet{ padding:14px 15px; margin-bottom:11px; } .liq-geraet__kopf{ display:flex; align-items:flex-start; gap:11px; } .liq-geraet__ic{ flex:none; width:26px; height:26px; border-radius:8px; display:grid; place-items:center; background:color-mix(in srgb,var(--text,#e9eef6) 5%,transparent); } .liq-geraet__ic svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; color:var(--muted,#8892a4); } .liq-geraet__t{ flex:1 1 auto; min-width:0; } .liq-geraet__name{ display:block; font-weight:600; font-size:var(--text-15,15.5px); line-height:1.3; } .liq-geraet__zuletzt{ display:block; font-size:var(--text-13,13.5px); margin-top:3px; color:var(--text,#e9eef6); } .liq-geraet__zuletzt b{ font-weight:600; } .liq-geraet__zuletzt--frisch{ color:var(--success,#4ade80); } .liq-geraet__zuletzt--nie{ color:var(--muted,#8892a4); } .liq-geraet__meta{ display:block; font-size:var(--text-12,12px); color:var(--muted,#8892a4); margin-top:6px; line-height:1.5; } .liq-geraet__akt{ margin-top:12px; } .liq-zeichenfeld{ display:block; } .liq-zeichenfeld__label{ display:block; font-size:var(--text-13,13.5px); color:var(--muted,#8892a4); line-height:1.5; margin:0 0 8px; } .liq-zeichenfeld__flaeche{ position:relative; width:100%; aspect-ratio:3/1; min-height:180px; max-height:260px; border-radius:12px; background:#fff; overflow:hidden; border:1px solid var(--border-strong,#8d94a0); } .liq-zeichenfeld__c{ position:absolute; inset:0; width:100%; height:100%; touch-action:none; display:block; cursor:crosshair; } .liq-zeichenfeld__linie{ position:absolute; left:8%; right:8%; bottom:26%; height:1px; background:#c9ced8; pointer-events:none; } .liq-zeichenfeld__akt{ display:flex; gap:14px; margin-top:8px; } .liq-navitem.gated.has-grund, .liq-spine .liq-sp-it.gated.has-grund{ cursor:pointer; } .liq-navitem__grund, .liq-spine .liq-sp-it .liq-sp-grund{ display:none; } .liq-navitem.is-grund-offen, .liq-spine .liq-sp-it.is-grund-offen{ flex-wrap:wrap; } .liq-navitem.is-grund-offen .liq-navitem__grund, .liq-spine .liq-sp-it.is-grund-offen .liq-sp-grund{ display:block; flex:0 0 100%; width:100%; margin:6px 0 1px; font-size:var(--text-11,11px); line-height:1.45; font-weight:400; color:var(--muted,#8892a4); white-space:normal; text-align:left; padding-left:9px; border-left:2px solid color-mix(in srgb,var(--warning,#f59e0b) 55%,transparent); } .liq-rail.is-collapsed .liq-navitem__grund{ display:none !important; }