
/* Termynal's lightweight macOS window skin, adapted to the Ghostty reference. */
.demo-area{position:relative;min-width:0;padding-top:8px}
.demo-area:before{content:"";position:absolute;inset:-60px -25px;background:radial-gradient(ellipse,#eaf0fa,transparent 65%);z-index:-1}
.ghostty-window[data-termynal]{width:100%;max-width:none;padding:0;background:var(--term-0);color:var(--term-1);border:1px solid var(--term-2);border-radius:13px;font:12px/1.6 var(--mono);overflow:hidden;box-shadow:0 22px 55px -28px #24375460}
.ghostty-window[data-termynal]:before{top:14px;left:14px;width:10px;height:10px;background:#ff5f57;box-shadow:17px 0 #febc2e,34px 0 #28c840}
.ghostty-window[data-termynal]:after{display:none}
.ghostty-titlebar{height:37px;display:flex;align-items:center;gap:6px;padding-left:74px;font:600 12px Geist,sans-serif;color:var(--term-3)}
.folder-icon{width:13px;height:9px;background:linear-gradient(#68ccec,#35a6d5);border-radius:2px;position:relative}
.folder-icon:before{content:"";position:absolute;top:-2px;left:0;width:6px;height:3px;border-radius:2px 2px 0 0;background:#77d3ee}
.ghostty-tabs{display:flex;align-items:center;gap:5px;padding:0 7px 10px}
.ghostty-tabs button{flex:1;min-width:0;display:flex;justify-content:center;align-items:center;position:relative;border:1px solid transparent;border-radius:16px;padding:4px 25px;background:var(--term-4);color:var(--term-5);font:500 10px/1.5 Geist,sans-serif}
.ghostty-tabs button[aria-selected="true"]{background:var(--term-6);color:var(--term-7);border-color:var(--term-8);box-shadow:inset 0 1px #ffffff12}
.ghostty-tabs button span{position:absolute;right:10px;font-size:9px}
.ghostty-tabs button:hover{color:var(--term-7)}
.ghostty-tabs button:focus-visible{outline:2px solid #84b9ff;outline-offset:0}
.ghostty-plus{display:grid;place-items:center;width:23px;height:23px;border:1px solid var(--term-10);border-radius:50%;color:var(--term-9);font:20px/1 Geist,sans-serif}
.terminal-display{height:420px;display:flex;flex-direction:column}
.terminal-conversation{position:relative;flex:1;min-height:0;padding:18px 19px 10px}
.launch-line{position:absolute;inset:18px 19px auto;color:var(--term-1)}
.shell-prompt{color:var(--term-14)}
.cli-heading{margin-bottom:25px;font-size:12px;line-height:1.6}
.cli-heading strong{font-weight:700;letter-spacing:.03em;color:var(--term-11)}
.cli-heading #cli-version,.cli-heading p{color:var(--term-12);font-size:11px}
.cli-heading p{padding-left:22px}
.cli-mark{color:var(--term-13);margin-right:3px}
.question-line{display:flex;gap:10px;color:var(--term-1);font-size:12px;min-height:20px}
.answer{display:flex;gap:10px;margin-top:19px;min-height:39px;font-size:11px;line-height:1.75;color:#e7e8eb}
.answer-bullet{color:var(--term-1)}
.equation-stage{height:84px;display:grid;place-items:center;margin:5px 0}
.equation-stage code{font:14px var(--mono);color:#b4b8c2;max-width:100%;overflow-wrap:anywhere;text-align:center}
.equation-stage math{font:38px math;color:var(--term-7);math-style:normal}

.explanation{font-size:10px;line-height:1.75;color:#d0d2d8;padding-left:17px}
.cli-bottom{padding:0 5px 7px}
.cli-composer{display:flex;align-items:center;height:34px;padding:0 10px;gap:8px;background:var(--term-15);color:var(--term-16);font-size:11px;white-space:nowrap;overflow:hidden}
.input-placeholder{color:var(--term-17)}
.typing-cursor{display:inline-block;background:var(--term-18);width:7px;height:1.15em;vertical-align:text-bottom;margin-left:1px;animation:cursor-blink 1s steps(1) infinite}
.cli-status{padding:3px 10px 0;font-size:9px;line-height:1.5;white-space:nowrap;overflow:hidden}
#model-name{color:var(--term-19)}.status-separator{color:var(--term-20)}.working-directory{color:var(--term-21)}
.cli-help{display:flex;justify-content:space-between;gap:10px;padding:0 10px;font-size:8px;line-height:1.5;color:var(--term-22)}
.cli-help b{color:var(--term-18);font-weight:500}
.ghostty-window[data-active="claude"] .cli-mark{color:#d68d6d}
.ghostty-window[data-active="claude"] .cli-composer{border-top:1px solid #555963;border-bottom:1px solid #555963;background:transparent}
.demo-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:16px;color:#747b87;font:10px/1.6 var(--mono)}
.demo-caption button,.motion-control{border:0;background:transparent;color:#687488;font:10px var(--mono);padding:4px 0}
.demo-caption button:hover,.motion-control:hover{color:var(--blue)}
.motion-control{display:block;margin:3px 0 0 auto}.is-concealed{visibility:hidden}
.footer{min-height:72px}.footer .brand img{width:26px;height:26px}.footer .brand{font-size:17px}
@keyframes cursor-blink{50%{opacity:0}}

@media(max-width:800px){.demo-area{max-width:600px;margin-inline:auto;width:100%}.footer{padding-block:18px}}
@media(max-width:500px){.demo-area:before{inset:0}.terminal-conversation{padding:17px 13px 10px}.terminal-display{height:410px}.cli-heading{font-size:11px}.cli-heading #cli-version,.cli-heading p{font-size:10px}.question-line{font-size:10px}.answer{font-size:10px}.explanation{font-size:9px}.equation-stage math{font-size:33px}.cli-composer{font-size:10px;height:30px}.cli-status{font-size:8px}.cli-help{font-size:7px}.ghostty-tabs button{font-size:10px}.demo-caption{font-size:8px}.footer{min-height:60px}}


.explanation{white-space:pre-line}
@media(prefers-reduced-motion:reduce){.typing-cursor,.equation-enter{animation:none!important}}

/* A streamed CLI answer, matching the supplied Codex session. */
.terminal-conversation{overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--term-26) transparent;overscroll-behavior:contain}
.question-line{margin:0 -19px 19px;padding:12px 19px;background:var(--term-23);min-height:42px;align-items:center;font-size:12px}
.question-line:before{content:'›';color:var(--term-24)}
.response-stream{font-size:11px;line-height:1.8;color:var(--term-25)}
.working-status{font-size:11px;line-height:1.8;color:var(--term-1)}
.working-status span{color:var(--term-12)}
.working-status strong{color:var(--term-1);font-weight:700}
.response-stream>p{margin:0 0 15px}
.response-stream>p:first-child:before{content:'•';position:absolute;left:6px;color:var(--term-24)}
.response-stream strong{font-weight:700}
.response-stream .response-equation{display:flex;align-items:center;justify-content:center;min-height:50px;margin:3px 0 16px;max-width:100%}



.stream-latex{font:inherit;color:inherit;overflow-wrap:anywhere;white-space:pre-wrap}
.response-equation .stream-latex{font-size:11px;text-align:center}
@media(max-width:500px){.question-line{margin-inline:-13px;padding:10px 13px;font-size:10px}.response-stream{font-size:10px}.response-stream>p:first-child:before{left:3px}.response-equation .stream-latex{font-size:10px}}

.ghostty-window{color-scheme:dark;--term-0:#262b33;--term-1:#f0f0f1;--term-2:#565b63;--term-3:#b5b8be;--term-4:#30353d;--term-5:#a5a8af;--term-6:#4c4f54;--term-7:#fff;--term-8:#65686e;--term-9:#c7c9ce;--term-10:#373c45;--term-11:#f4f4f5;--term-12:#92959c;--term-13:#67aeec;--term-14:#96cf91;--term-15:#41464e;--term-16:#f1f2f4;--term-17:#a2a5ac;--term-18:#e7e9ed;--term-19:#e2c990;--term-20:#858b94;--term-21:#a3cc95;--term-22:#a4a7ae;--term-23:#494d55;--term-24:#a9abb0;--term-25:#eff0f3;--term-26:#555b65;}
.latex-math{color:inherit}.latex-math .katex{font-size:1.2em}.response-equation .latex-math{font-size:16px;max-width:100%;overflow-x:auto;overflow-y:hidden;padding:5px 0}.response-equation .katex-display{margin:0}.response-equation:has(.stream-latex:not([hidden])){justify-content:flex-start}.response-equation .stream-latex{text-align:left}.response-equation:has(.stream-latex:not([hidden]))>span:not(.latex-math){display:none}
@media(max-width:500px){.response-equation .latex-math{font-size:13px}}

.launch-waiting{animation:none;opacity:1;margin-left:0}

/* Claude Code's distinct welcome and compact composer. */
.claude-mascot,.claude-model,.claude-effort,.claude-mode{display:none}
[data-active="claude"] .cli-heading{position:relative;min-height:52px;padding-left:64px;line-height:1.4}
[data-active="claude"] .claude-mascot{display:block;position:absolute;left:0;top:2px;width:51px;height:34px;shape-rendering:crispEdges}
[data-active="claude"] .cli-mark{display:none}
[data-active="claude"] .cli-heading p{padding-left:0}
[data-active="claude"] .claude-model{display:block}
[data-active="claude"] .cli-status,[data-active="claude"] .cli-help{display:none}
[data-active="claude"] .claude-effort{display:block;text-align:right;padding:0 9px 5px;color:#92959c;font-size:9px}
[data-active="claude"] .cli-composer{border-color:#777b83;background:transparent;padding-left:0}
[data-active="claude"] .claude-mode{display:block;padding:5px 9px 0;color:#92959c;font-size:9px;white-space:nowrap;overflow:hidden}
.claude-mode>span{color:#edbc37}
@media(max-width:500px){[data-active="claude"] .claude-mode{font-size:7px}[data-active="claude"] .claude-effort{font-size:8px}}
