automata/docs/style.css

.tipTitle{font-weight:700;margin-bottom:4px}.tipTitle.error{color:var(--error)}.tipTitle.warning{color:var(--warning)}.tipTitle.info{color:var(--accent)}.cm-tooltip.cm-tooltip-hover{border:1px solid color-mix(in srgb, var(--fg-muted) 35%, transparent);background:var(--bg-1);color:var(--fg-0);box-shadow:0 8px 30px rgba(0,0,0,.25);border-radius:var(--radius-md);padding:8px 10px;max-width:420px;font-size:13px;line-height:1.35}.tipBody{white-space:pre-wrap;color:var(--fg-1)}.editor{height:100%;width:100%}.cm-scroller{overflow-y:auto !important;background:var(--bg-0)}.cm-editor{height:100%;background:var(--bg-1);color:var(--fg-0)}.cm-content{caret-color:var(--fg-0) !important}.cm-gutters{background:var(--bg-2) !important;color:var(--fg-muted);border-right:1px solid color-mix(in srgb, var(--fg-muted) 20%, transparent) !important}.cm-lineNumbers .cm-gutterElement{padding:0 10px 0 6px;font-family:var(--font-mono)}.cm-activeLine{background:color-mix(in srgb, var(--accent) 6%, transparent) !important}.cm-activeLineGutter{background:color-mix(in srgb, var(--accent) 8%, transparent) !important;color:var(--fg-0)}.cm-cursor{border-left:2px solid var(--accent) !important}.cm-focused .cm-cursor{border-left-color:var(--accent) !important}.tok-comment{color:color-mix(in srgb, var(--success) 65%, var(--fg-muted))}.tok-keyword{color:var(--warning);font-weight:600}.tok-error{color:var(--error);font-weight:700}.tok-ident{color:var(--accent)}.tok-brace{color:var(--error);font-weight:600}.tok-punc{color:var(--fg-0)}.tok-string{color:color-mix(in srgb, var(--success) 75%, transparent)}.rb-0{color:color-mix(in srgb, var(--error) 85%, transparent);font-weight:700}.rb-1{color:color-mix(in srgb, var(--warning) 85%, transparent);font-weight:700}.rb-2{color:color-mix(in srgb, var(--success) 85%, transparent);font-weight:700}.rb-3{color:color-mix(in srgb, var(--accent) 85%, transparent);font-weight:700}.rb-4{color:color-mix(in srgb, var(--focus) 85%, transparent);font-weight:700}.rb-5{color:color-mix(in srgb, var(--accent) 60%, var(--fg-muted));font-weight:700}.cm-diag-error{text-decoration:underline wavy var(--error);text-underline-offset:2px}.cm-diag-warning{text-decoration:underline wavy var(--warning);text-underline-offset:2px}.cm-diag-info{text-decoration:underline wavy var(--accent);text-underline-offset:2px}.terminal{background:var(--bg-1);color:var(--fg-0);padding:1em;margin:0px;font-family:var(--font-mono);line-height:1.35;white-space:pre-wrap;word-break:break-word;height:100%;width:100%;overflow-y:auto;overflow-x:auto}.ansi-bold{font-weight:700}.ansi-dim{opacity:.7}.ansi-fg-30{color:var(--ansi-fg-30)}.ansi-fg-31{color:var(--ansi-fg-31)}.ansi-fg-32{color:var(--ansi-fg-32)}.ansi-fg-33{color:var(--ansi-fg-33)}.ansi-fg-34{color:var(--ansi-fg-34)}.ansi-fg-35{color:var(--ansi-fg-35)}.ansi-fg-36{color:var(--ansi-fg-36)}.ansi-fg-37{color:var(--ansi-fg-37)}.ansi-fg-90{color:var(--ansi-fg-90)}.ansi-fg-91{color:var(--ansi-fg-91)}.ansi-fg-92{color:var(--ansi-fg-92)}.ansi-fg-93{color:var(--ansi-fg-93)}.ansi-fg-94{color:var(--ansi-fg-94)}.ansi-fg-95{color:var(--ansi-fg-95)}.ansi-fg-96{color:var(--ansi-fg-96)}.ansi-fg-97{color:var(--ansi-fg-97)}.ansi-bg-40{background:var(--ansi-bg-40)}.ansi-bg-41{background:var(--ansi-bg-41)}.ansi-bg-42{background:var(--ansi-bg-42)}.ansi-bg-43{background:var(--ansi-bg-43)}.ansi-bg-44{background:var(--ansi-bg-44)}.ansi-bg-45{background:var(--ansi-bg-45)}.ansi-bg-46{background:var(--ansi-bg-46)}.ansi-bg-47{background:var(--ansi-bg-47)}.centered{margin-right:auto;margin-left:auto;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:#f0f0f0;font-size:24px;font-family:Ubuntu-Light,Helvetica,sans-serif;text-align:center}.lds-dual-ring{display:inline-block;width:24px;height:24px}.lds-dual-ring:after{content:" ";display:block;width:24px;height:24px;margin:0px;border-radius:50%;border:3px solid #fff;border-color:#fff rgba(0,0,0,0) #fff rgba(0,0,0,0);animation:lds-dual-ring 1.2s linear infinite}@keyframes lds-dual-ring{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.controls{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);user-select:none}.controls .spacer{flex:1}.btn{appearance:none;border:1px solid hsla(0,0%,100%,.12);background:hsla(0,0%,100%,.06);color:var(--fg-0);padding:8px 12px;border-radius:var(--radius-md);font:600 13px/1.1 var(--font-ui);cursor:pointer;transition:transform .04s ease,background var(--dur-med) var(--ease-standard),border-color var(--dur-med) var(--ease-standard),opacity var(--dur-med) var(--ease-standard)}.btn:hover{background:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.2)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-green{background:color-mix(in srgb, var(--success) 18%, transparent);border-color:color-mix(in srgb, var(--success) 35%, transparent)}.btn-green:hover{background:color-mix(in srgb, var(--success) 26%, transparent)}.btn-yellow{background:color-mix(in srgb, var(--warning) 14%, transparent);border-color:color-mix(in srgb, var(--warning) 40%, transparent)}.btn-yellow:hover{background:color-mix(in srgb, var(--warning) 22%, transparent)}.btn-blue{background:color-mix(in srgb, var(--focus) 14%, transparent);border-color:color-mix(in srgb, var(--focus) 40%, transparent)}.btn-blue:hover{background:color-mix(in srgb, var(--focus) 22%, transparent)}.btn-grey{background:color-mix(in srgb, var(--ansi-fg-90) 12%, transparent);border-color:color-mix(in srgb, var(--ansi-fg-90) 28%, transparent)}.btn-grey:hover{background:color-mix(in srgb, var(--ansi-fg-90) 18%, transparent)}.btn-red{background:color-mix(in srgb, var(--error) 12%, transparent);border-color:color-mix(in srgb, var(--error) 28%, transparent)}.btn-red:hover{background:color-mix(in srgb, var(--error) 18%, transparent)}.btn-toggle.active{background:color-mix(in srgb, var(--success) 14%, transparent);border-color:color-mix(in srgb, var(--success) 30%, transparent)}.speed{display:flex;align-items:center;gap:var(--space-1);padding:6px 10px;border:1px solid hsla(0,0%,100%,.12);background:hsla(0,0%,100%,.04);border-radius:var(--radius-md);font:600 12.5px var(--font-ui);color:var(--fg-0)}.speed input[type=range]{width:160px}.speed #speedLabel{min-width:40px;text-align:right;opacity:.9}.test-input{width:100%;max-width:420px;align-self:center;padding:10px 14px;border-radius:12px;border:1px solid var(--bg-1);background:var(--bg-2);font:var(--font-ui);color:var(--fg-0);outline:none;transition:border-color 150ms ease,box-shadow 150ms ease}.test-input::placeholder{color:var(--fg-0)}.test-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent)}:root{color-scheme:dark}@media(prefers-color-scheme: light){:root:not([data-theme]){color-scheme:light}}:root{--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--font-ui: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono";--dur-fast: 80ms;--dur-med: 160ms;--dur-slow: 240ms;--ease-standard: cubic-bezier(0.2, 0, 0, 1);--graph-bg-0: var(--bg-0);--graph-bg-1: var(--bg-1);--graph-bg-2: var(--bg-2);--graph-fg-0: var(--fg-0);--graph-fg-1: var(--fg-1);--graph-fg-2: var(--fg-2);--graph-font: arial;--graph-node-font-size: 14;--graph-edge-font-size: 10;--graph-node-border: var(--focus);--graph-current-node-border: var(--success);--graph-node-anchor: var(--warning);--graph-edge: var(--fg-muted);--graph-edge-hover: var(--accent);--graph-edge-active: var(--focus)}:root[data-theme=dark]{color-scheme:dark;--bg-0: #0d1117;--bg-1: #161b22;--bg-2: #21262d;--fg-0: #e6edf3;--fg-1: #c9d1d9;--fg-muted: #8b949e;--separator-bg: rgba(255, 255, 255, 0.06);--separator-hover: rgba(121, 192, 255, 0.28);--separator-active: rgba(121, 192, 255, 0.45);--accent: #79c0ff;--focus: #388bfd;--success: #2ea043;--warning: #f2cc60;--error: #f85149;--ansi-fg-30: #0b0f14;--ansi-fg-31: #ff7b72;--ansi-fg-32: #7ee787;--ansi-fg-33: #f2cc60;--ansi-fg-34: #79c0ff;--ansi-fg-35: #d2a8ff;--ansi-fg-36: #a5d6ff;--ansi-fg-37: #c9d1d9;--ansi-fg-90: #6e7681;--ansi-fg-91: #ffa198;--ansi-fg-92: #a6f3a6;--ansi-fg-93: #ffe082;--ansi-fg-94: #a5d6ff;--ansi-fg-95: #e3b8ff;--ansi-fg-96: #c7f0ff;--ansi-fg-97: #ffffff;--ansi-bg-40: #0b0f14;--ansi-bg-41: rgba(255, 123, 114, 0.22);--ansi-bg-42: rgba(126, 231, 135, 0.18);--ansi-bg-43: rgba(242, 204, 96, 0.18);--ansi-bg-44: rgba(121, 192, 255, 0.18);--ansi-bg-45: rgba(210, 168, 255, 0.18);--ansi-bg-46: rgba(165, 214, 255, 0.18);--ansi-bg-47: rgba(201, 209, 217, 0.10)}:root[data-theme=light]{color-scheme:light;--bg-0: #f6f8fa;--bg-1: #ffffff;--bg-2: #eaeef2;--fg-0: #0b1220;--fg-1: #1f2937;--fg-muted: #5b6472;--separator-bg: rgba(0, 0, 0, 0.06);--separator-hover: rgba(9, 105, 218, 0.28);--separator-active: rgba(9, 105, 218, 0.45);--accent: #1f6feb;--focus: #0969da;--success: #1a7f37;--warning: #9a6700;--error: #cf222e;--ansi-fg-30: #111827;--ansi-fg-31: #b42318;--ansi-fg-32: #1a7f37;--ansi-fg-33: #9a6700;--ansi-fg-34: #0969da;--ansi-fg-35: #8250df;--ansi-fg-36: #0550ae;--ansi-fg-37: #1f2937;--ansi-fg-90: #6b7280;--ansi-fg-91: #cf222e;--ansi-fg-92: #1f883d;--ansi-fg-93: #9a6700;--ansi-fg-94: #0969da;--ansi-fg-95: #8250df;--ansi-fg-96: #0550ae;--ansi-fg-97: #030712;--ansi-bg-40: #ffffff;--ansi-bg-41: rgba(180, 35, 24, 0.16);--ansi-bg-42: rgba(26, 127, 55, 0.14);--ansi-bg-43: rgba(154, 103, 0, 0.14);--ansi-bg-44: rgba(9, 105, 218, 0.14);--ansi-bg-45: rgba(130, 80, 223, 0.14);--ansi-bg-46: rgba(5, 80, 174, 0.14);--ansi-bg-47: rgba(0, 0, 0, 0.06)}html,body{height:100%;width:100%;margin:0;color:var(--fg-0);font-family:var(--font-ui);font-size:14px;background:#909090}.app{height:100vh;width:100vw;overflow:hidden;background-color:var(--bg-0);display:flex}.graph{width:100%;height:100%;background:var(--graph-bg)}.vscroll{height:100%;overflow-y:scroll}.flexCol{display:flex;flex-direction:column}.flexRow{display:flex;flex-direction:row}.flexCenter{display:flex;justify-content:center}.gap{gap:1em}.marginTop{margin-top:1em}.sidePadding{padding:0px 1em}.hSplit :not(.styleOnly){cursor:col-resize}.hSplit{height:8px;min-height:8px;max-height:8px;background:var(--separator-bg);transition:background var(--dur-med) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard)}.vSplit :not(.styleOnly){cursor:col-resize}.vSplit{width:8px;min-width:8px;max-width:8px;background:var(--separator-bg);transition:background var(--dur-med) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard)}.hSplit:hover:not(.styleOnly),.vSplit:hover:not(.styleOnly){background:var(--separator-hover)}.ex-label{display:block;margin-bottom:6px}.ex-select{width:320px;max-width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(bg-1);background:var(--bg-2);font:var(--font-ui)}.share-toast{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);padding:.45rem .65rem;border-radius:10px;background:var(--bg-2);color:var(--fg-0);font-size:12px;white-space:nowrap;pointer-events:none;opacity:0}.share-toast.show{animation:toastFade 1.4s ease forwards}@keyframes toastFade{0%{opacity:0;transform:translateX(-50%) translateY(-4px)}15%{opacity:1;transform:translateX(-50%) translateY(0)}80%{opacity:1}100%{opacity:0}}