:root{color-scheme:dark;--bg: #05070d;--fg: #e8ecf7;--muted: #8e9ab8;--accent: #4aa8ff;--on: #5ee0a0;--panel: rgba(12, 18, 32, .72);--border: rgba(140, 170, 230, .22);--top: 56px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}.page{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;min-height:var(--top);padding:8px max(10px,env(safe-area-inset-right)) 8px max(10px,env(safe-area-inset-left));background:#05070de6;border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}.top__title{flex:1;margin:0;font-size:17px;font-weight:600}.top__icon{display:grid;place-items:center;flex:none;width:40px;height:40px;padding:0;color:var(--fg);background:transparent;border:1px solid var(--border);border-radius:12px;cursor:pointer}.top__icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.top__icon:hover{background:#8caae629}.top__icon[aria-expanded=true]{color:var(--accent);border-color:var(--accent)}.top__icon[hidden],.top__icon .icon--out,.top__icon[aria-pressed=true] .icon--in{display:none}.top__icon[aria-pressed=true] .icon--out{display:block}.top__icon[aria-pressed=true]{color:var(--on);border-color:var(--on)}.drawer{position:sticky;top:var(--top);z-index:9;display:flex;flex-direction:column;padding:8px;background:#080c16f7;border-bottom:1px solid var(--border)}.drawer[hidden]{display:none}.drawer__link{padding:12px 14px;color:var(--fg);font-size:15px;text-decoration:none;border-radius:10px}.drawer__link:hover{background:#8caae624}.drawer__link--out{color:var(--muted)}.drawer__rule{width:100%;height:1px;margin:6px 0;background:var(--border);border:0}.body{display:flex;flex-direction:column;gap:12px;width:100%;max-width:940px;margin:0 auto;padding:12px max(10px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.cols{display:grid;gap:12px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}@media(max-width:720px){.cols{grid-template-columns:minmax(0,1fr)}}.card{padding:14px;background:var(--panel);border:1px solid var(--border);border-radius:14px}.card__title{margin:0 0 10px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.card__sub{margin:14px 0 6px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.status{margin:0;font-size:14px;color:var(--muted);overflow-wrap:anywhere}.status.is-online{color:var(--on)}.hint{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--muted)}.hint[hidden]{display:none}.hint code{font-size:12px;color:var(--fg)}.row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.btn{font:inherit;font-size:14px;padding:10px 16px;color:var(--fg);background:#8caae624;border:1px solid var(--border);border-radius:999px;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn[hidden]{display:none}.btn:disabled{opacity:.4;cursor:default}.btn--small{padding:6px 12px;font-size:13px}.row--head{margin:0 0 10px}.hint.is-warn{padding:10px 12px;color:var(--fg);background:#ffc8571a;border:1px solid rgba(255,200,87,.45);border-radius:10px}.hint.is-said{color:var(--on)}.seg{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.seg[hidden]{display:none}.seg button{font:inherit;font-size:13px;padding:8px 14px;color:var(--fg);background:transparent;border:1px solid var(--border);border-radius:999px;cursor:pointer}.seg button.is-active{color:var(--bg);background:var(--accent);border-color:var(--accent)}.diagram{display:grid;place-items:center}.pad{width:100%;max-width:420px;height:auto}.pad__body{fill:#141b2b;stroke:#8caae659;stroke-width:2}.pad__well{fill:#0b1120;stroke:#8caae640;stroke-width:1.5}.pad__hub{fill:#0b1120;stroke:#8caae633;stroke-width:1}.pad__key{fill:#232c42;stroke:#8caae666;stroke-width:1.5;transition:fill 60ms linear}.pad__key.is-down{fill:var(--on);stroke:var(--on);filter:drop-shadow(0 0 6px rgba(94,224,160,.85))}.pad__key--pad{fill:#1a2336}.pad__key--stick{fill:#2c3654}.pad__knob{transition:transform 40ms linear}.pad__tag{fill:#cfd8ee;font-family:system-ui,sans-serif;font-size:11px;font-weight:700;text-anchor:middle;pointer-events:none}.pad__tag--small{font-size:8px}.code{display:flex;align-items:center;gap:12px;padding:12px;background:#05081099;border:1px solid var(--border);border-radius:12px}.code__icon{display:grid;place-items:center;flex:none;width:46px;height:46px;font-size:20px;font-weight:700;color:var(--on);background:#5ee0a01f;border:1px solid rgba(94,224,160,.4);border-radius:12px}.code__lines{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.code__api{font-size:15px;color:var(--accent);overflow-wrap:anywhere}.code__label{font-size:15px}.code__value{font-size:12px;color:var(--muted)}.code__num{flex:none;min-width:56px;font-size:38px;font-weight:700;line-height:1;text-align:right;font-variant-numeric:tabular-nums;color:var(--on)}.log{display:flex;flex-direction:column;gap:4px;margin:0;padding:0;list-style:none}.log__row{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:8px;padding:6px 8px;font-size:13px;color:var(--muted);background:#8caae60f;border-radius:8px}.log__row.is-down{color:var(--fg);background:#5ee0a01f}.log__icon{font-weight:700;text-align:center}.log__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log__code{font-size:12px;color:var(--accent)}.log__time{display:none}@media(min-width:560px){.log__row{grid-template-columns:26px minmax(0,1fr) auto auto}.log__time{display:block;font-variant-numeric:tabular-nums}}.keys{display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));margin:0;padding:0;list-style:none}.key{display:grid;grid-template-columns:30px minmax(0,1fr) auto;grid-template-areas:"icon name value" "icon code value";align-items:center;gap:0 8px;padding:7px 9px;background:#8caae60f;border:1px solid transparent;border-radius:10px}.key__icon{grid-area:icon;font-size:15px;font-weight:700;text-align:center;color:var(--muted)}.key__name{grid-area:name;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.key__code{grid-area:code;font-size:11px;color:var(--muted)}.key__value{grid-area:value;font-size:12px;font-variant-numeric:tabular-nums;color:var(--accent)}.key.is-down{background:#5ee0a029;border-color:var(--on)}.key.is-down .key__icon{color:var(--on)}.key.is-touched{border-color:#4aa8ff80}.keys--editing{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}.key--editing{grid-template-columns:30px minmax(0,1fr) auto;grid-template-areas:"icon name value" "icon code value" "slot slot slot"}.key__slot{grid-area:slot;width:100%;margin-top:8px;padding:6px 8px;font:inherit;font-size:13px;color:var(--fg);background:#050810b3;border:1px solid var(--border);border-radius:8px}.binds{display:flex;flex-direction:column;gap:6px;margin:0 0 4px;padding:0;list-style:none}.bind{display:grid;grid-template-columns:minmax(100px,140px) minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 9px;font-size:14px;background:#8caae60f;border:1px solid transparent;border-radius:10px}@media(max-width:520px){.bind{grid-template-columns:minmax(0,1fr) auto}.bind__on{grid-column:1 / -1}}.bind__name{color:var(--muted)}.bind__on{overflow-wrap:anywhere;font-size:13px}.bind.is-learning{background:#ffc85724;border-color:#ffc857}.bind.is-learning .bind__on:after{content:" — jetzt drücken";color:#ffc857}.axes{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}.axis{display:grid;grid-template-columns:minmax(110px,auto) auto minmax(90px,1fr) 62px;align-items:center;gap:10px;font-size:13px}@media(max-width:520px){.axis{grid-template-columns:minmax(0,1fr) minmax(90px,1.2fr) 58px}.axis__code{display:none}}.axis__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axis__code{font-size:11px;color:var(--muted)}.axis__bar{position:relative;height:10px;background:#8caae61f;border-radius:999px;overflow:hidden}.axis__bar:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:#8caae680}.axis__fill{position:absolute;top:0;bottom:0;background:var(--accent)}.axis__value{font-variant-numeric:tabular-nums;text-align:right;color:var(--muted)}.game{display:flex;flex-direction:column;gap:6px;margin:0}.game__row{display:grid;grid-template-columns:minmax(110px,160px) minmax(0,1fr);gap:10px;align-items:baseline;font-size:14px}.game__row dt{color:var(--muted)}.game__row dd{margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.game__row dd.is-on{color:var(--on)}.game__row code{font-size:13px;color:var(--accent)}.report{margin:0;padding:10px;font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--fg);background:#050810b3;border:1px solid var(--border);border-radius:10px;user-select:all}