:root{color-scheme:dark;--bg: #0b0f0d;--surface: #131815;--surface-2: #1b211d;--border: rgba(214, 232, 222, .09);--text: #e4ebe6;--text-muted: rgba(228, 235, 230, .62);--text-faint: rgba(228, 235, 230, .4);--node-fill: #1c221e;--node-stroke: #343e38;--node-text: rgba(228, 235, 230, .55);--edge: #29312c;--light: #2dff6e;--light-soft: rgba(45, 255, 110, .12);--light-dim: rgba(45, 255, 110, .38);--on-light: #03170a;--amber: #f2b84b;--danger: #f0605d;--accent: #1c9a50;--on-accent: #03170a;--radius-s: 8px;--radius-m: 12px;--radius-l: 20px;--shadow-accent: 0 8px 24px rgba(28, 154, 80, .28);--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;--fs-s: .8rem;--fs-m: 1rem;--fs-l: 1.25rem;--fs-xl: 1.5625rem}:root[data-theme=light]{color-scheme:light;--bg: #f4f1e9;--surface: #fbf9f4;--surface-2: #ebe7dd;--border: rgba(60, 54, 40, .12);--text: #2b2d29;--text-muted: rgba(43, 45, 41, .68);--text-faint: rgba(43, 45, 41, .45);--node-fill: #e7e3d9;--node-stroke: #c3bdb0;--node-text: rgba(43, 45, 41, .6);--edge: #d3cec2;--light: #00b34f;--light-soft: rgba(0, 179, 79, .12);--light-dim: rgba(0, 179, 79, .4);--on-light: #ffffff;--amber: #b5730f;--danger: #c43c39;--accent: #176a3b;--on-accent: #ffffff;--shadow-accent: 0 8px 24px rgba(23, 106, 59, .26)}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button,input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--light);outline-offset:2px}.app{display:flex;flex-direction:column;height:100dvh;max-width:1200px;margin:0 auto;padding:max(8px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.app-header{display:flex;align-items:center;justify-content:space-between;min-height:48px}.app-title{display:flex;align-items:center;gap:12px;margin:0;font-size:var(--fs-l);font-weight:650;letter-spacing:-.01em}.brand-mark{display:inline-flex;align-items:center;gap:4px}.mark-dot{width:10px;height:10px;border-radius:50%;background:var(--light)}.mark-dash{width:20px;height:10px;border-radius:3px;background:var(--light)}.icon-button{display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:var(--radius-m);background:transparent;color:var(--text-muted);cursor:pointer;transition:background-color .15s,color .15s}.icon-button:hover{background:var(--surface-2);color:var(--text)}.header-actions{display:flex;align-items:center;gap:4px}.mode-menu{position:relative}.mode-menu-button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px 8px 16px;border:1px solid var(--border);border-radius:var(--radius-m);background:var(--surface);color:var(--text);font-size:.9375rem;font-weight:600;white-space:nowrap;cursor:pointer;transition:background-color .15s,border-color .15s}.mode-menu-button:hover,.mode-menu-button[aria-expanded=true]{background:var(--surface-2)}.mode-menu-button .icon{color:var(--text-muted);transition:transform .15s}.mode-menu-button[aria-expanded=true] .icon{transform:rotate(180deg)}.mode-menu-list{position:absolute;top:calc(100% + 8px);right:0;z-index:10;display:flex;flex-direction:column;gap:4px;min-width:200px;padding:4px;border:1px solid var(--border);border-radius:var(--radius-m);background:var(--surface);box-shadow:0 16px 40px #00000052;animation:menu-in .12s ease-out}@keyframes menu-in{0%{opacity:0;transform:translateY(-4px)}}.mode-menu-item{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:8px 12px;border:0;border-radius:var(--radius-s);background:transparent;color:var(--text-muted);font-size:.9375rem;font-weight:550;text-align:left;white-space:nowrap;cursor:pointer}.mode-menu-item:hover,.mode-menu-item:focus-visible{background:var(--surface-2);color:var(--text);outline:none}.mode-menu-item.selected{color:var(--text)}.mode-menu-item.selected .icon{color:var(--light)}.app-main{flex:1;min-height:0;display:flex;flex-direction:column}.view{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;padding-top:8px}.tree-wrap{flex:1;min-height:200px;display:flex;align-items:center;justify-content:center}.tree{width:100%;height:100%;max-height:720px;overflow:visible;-webkit-user-select:none;user-select:none}.edge{stroke:var(--edge);stroke-width:5;stroke-linecap:square;transition:stroke .9s ease-out,opacity .9s ease-out}.edge.lit{stroke:var(--light-dim);opacity:.6}.edge.on{stroke:var(--light);stroke-width:6;stroke-dasharray:1;filter:url(#neon);animation:edge-draw .2s ease-out both;transition:stroke .12s}@keyframes edge-draw{0%{stroke-dashoffset:1}to{stroke-dashoffset:0}}.node-base{fill:var(--bg)}.node-shape{fill:var(--node-fill);stroke:var(--node-stroke);stroke-width:3;transition:fill .7s ease-out,stroke .7s ease-out}.node-label{fill:var(--node-text);font-size:36px;font-weight:600;pointer-events:none;transition:fill .7s ease-out}.antenna-mast,.antenna-head{fill:none;stroke:var(--node-stroke);stroke-width:4;stroke-linejoin:round;stroke-linecap:round;transition:stroke .4s ease-out}.node.root.on .antenna-mast,.node.root.on .antenna-head{stroke:var(--light);filter:url(#neon);transition-duration:.12s}.node.lit .node-shape{fill:var(--light-soft);stroke:var(--light-dim)}.node.lit .node-label{fill:var(--text-muted)}.node.on .node-shape{fill:var(--light-soft);stroke:var(--light);transition-duration:.12s}.node.on .node-label{fill:var(--text);transition-duration:.12s}.node.current .node-shape,.node.done .node-shape{fill:var(--light);stroke:var(--light);filter:url(#neon)}.node.current .node-label,.node.done .node-label{fill:var(--light)}.node.done{animation:node-done .5s ease-out}@keyframes node-done{0%{opacity:.6}to{opacity:1}}.node.preview .node-shape{stroke:var(--light);stroke-dasharray:8 6;animation:preview-pulse .9s ease-in-out infinite alternate}@keyframes preview-pulse{to{stroke-opacity:.35}}.light{opacity:0;transition:transform .22s cubic-bezier(.3,.7,.3,1),opacity .4s ease-out;pointer-events:none}.light.visible{opacity:1}.light-halo{transition:transform .12s ease-out;transform:scale(.8)}.light.tone .light-halo{transform:scale(1.15)}.light-error{pointer-events:none;animation:error-blink .6s steps(1,end) both}@keyframes error-blink{0%,50%{opacity:1}25%,75%{opacity:.15}to{opacity:0}}.text-panel{flex:none;min-height:52px;padding:12px 16px;border-radius:var(--radius-m);background:var(--surface);border:1px solid var(--border)}.text-panel-text{margin:0;font-family:var(--mono);font-size:var(--fs-l);letter-spacing:.08em;line-height:1.4;word-break:break-word;max-height:2.8em;overflow-y:auto}.text-panel-empty{margin:0;color:var(--text-muted);font-size:.875rem}.text-panel-status{margin:4px 0 0;color:var(--danger);font-size:var(--fs-s);font-weight:550}.char{color:var(--text-faint);transition:color .15s}.char.past{color:var(--text)}.char.current{color:var(--on-light);background:var(--light);border-radius:4px}.pending{color:var(--light);margin-left:2px}.caret{display:inline-block;width:2px;height:1.1em;margin-left:2px;vertical-align:-.15em;background:var(--text-faint);animation:caret 1s steps(1) infinite}@keyframes caret{50%{opacity:0}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px 16px;border-radius:var(--radius-m);border:1px solid transparent;font-size:.9375rem;font-weight:600;white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s,transform .1s}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow-accent)}.btn-primary:hover:not(:disabled){filter:brightness(1.06)}.btn-secondary{background:transparent;border-color:var(--border);color:var(--text)}.btn-secondary:hover:not(:disabled){background:var(--surface-2)}.btn-tertiary{background:transparent;color:var(--text-muted)}.btn-tertiary:hover:not(:disabled){color:var(--danger)}.icon{flex:none}.keyer-controls{flex:none;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:16px;row-gap:4px}.keyer-side{display:flex;flex-direction:column;gap:8px}.keyer-side.start{align-items:flex-end}.keyer-side.end{align-items:flex-start}.keyer-hint{grid-column:1 / -1;justify-content:center}.btn-compact{flex-direction:column;gap:2px;min-width:76px;min-height:56px;padding:6px 12px;border-color:var(--border);background:transparent;color:var(--text);font-size:var(--fs-s)}.btn-compact:hover:not(:disabled){background:var(--surface-2)}.btn-compact.btn-quiet{border-color:transparent;color:var(--text-muted)}.btn-compact.btn-quiet:hover:not(:disabled){background:transparent;color:var(--danger)}.keyer{display:flex;flex-direction:column;align-items:center;gap:8px}.keyer-button{position:relative;display:grid;place-items:center;width:116px;height:116px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.keyer-ring{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.ring-track{fill:none;stroke:var(--surface-2);stroke-width:6}.ring-fill{fill:none;stroke:var(--light);stroke-width:6;stroke-linecap:round;opacity:0}.keyer-button.pressing .ring-fill,.keyer-button.dash .ring-fill{opacity:1;animation:ring-fill var(--hold-ms) linear forwards}.keyer-button.dash .ring-fill{stroke:var(--amber)}@keyframes ring-fill{0%{stroke-dashoffset:var(--ring-c)}to{stroke-dashoffset:0}}.keyer-face{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:96px;height:96px;border-radius:50%;background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow-accent);transition:transform .1s ease-out,background-color .15s,box-shadow .15s}.keyer-button:hover .keyer-face{filter:brightness(1.05)}.keyer-button.pressing .keyer-face,.keyer-button.dash .keyer-face{transform:scale(.94);box-shadow:0 0 0 10px var(--light-soft),var(--shadow-accent)}.keyer-button.dash .keyer-face{background:var(--amber)}.keyer-glyph{display:block;background:currentColor;transition:width .15s,border-radius .15s}.keyer-glyph.dot{width:18px;height:18px;border-radius:50%}.keyer-glyph.dash{width:40px;height:16px;border-radius:5px}.keyer-label{min-height:1.2em;font-size:var(--fs-s);font-weight:650;text-transform:uppercase;letter-spacing:.06em}.keyer-hint{display:flex;gap:8px;margin:0;color:var(--text-faint);font-size:.75rem;white-space:nowrap}.text-controls{display:flex;flex-direction:column;gap:12px}.field{display:flex;flex-direction:column;gap:8px}.field label,.field-label{font-size:.875rem;font-weight:600;color:var(--text)}.field-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.value{font-size:.875rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-muted);white-space:nowrap}.field-help{margin:0;color:var(--text-muted);font-size:var(--fs-s)}input[type=text]{width:100%;min-height:48px;padding:12px 16px;border-radius:var(--radius-m);border:1px solid var(--border);background:var(--surface);font-size:var(--fs-m);text-transform:uppercase;letter-spacing:.04em;transition:border-color .15s,box-shadow .15s}input[type=text]::placeholder{color:var(--text-faint);text-transform:none;letter-spacing:0}input[type=text]:focus{outline:none;border-color:var(--light);box-shadow:0 0 0 3px var(--light-soft)}input[type=range]{width:100%;height:32px;margin:0;accent-color:var(--light);cursor:pointer}input[type=range]:disabled{opacity:.4;cursor:not-allowed}.check{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer}.check input{width:20px;height:20px;margin:0;accent-color:var(--light)}.playback-buttons{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px}.playback-buttons .btn{padding-inline:12px}.btn-link{align-self:flex-start;min-height:44px;margin-top:-8px;padding:0;border:0;background:transparent;color:var(--light);font-size:var(--fs-s);font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.btn-link:disabled{color:var(--text-faint);text-decoration:none;cursor:default}.settings-view{overflow-y:auto;gap:12px;padding-bottom:16px}.section-title{margin:4px 0;font-size:var(--fs-l);font-weight:650}.card{padding:16px;border-radius:var(--radius-m);background:var(--surface);border:1px solid var(--border)}.segmented{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--radius-m);background:var(--surface-2)}.segmented button{min-height:44px;border:0;border-radius:var(--radius-s);background:transparent;color:var(--text-muted);font-weight:600;cursor:pointer}.segmented button.selected{background:var(--accent);color:var(--on-accent)}@media(max-width:420px){.playback-buttons .btn span{font-size:.875rem}}@media(max-width:360px){.playback-buttons .btn-secondary span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}@media(min-width:820px)and (min-height:520px){.keyer-view,.text-view{display:grid;grid-template-columns:1fr 360px;grid-template-rows:1fr auto;grid-template-areas:"tree panel" "tree controls";gap:16px 24px}.tree-wrap{grid-area:tree}.text-panel{grid-area:panel;align-self:end}.keyer-controls,.text-controls{grid-area:controls}.text-panel-text{max-height:5.6em}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;transition-duration:1ms!important}.keyer-button.pressing .ring-fill{animation-duration:var(--hold-ms)!important}}
