.about-terminal {
    --terminal-font: "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #444;
    border-radius: 14px;
    background: #1e1e1e;
    box-shadow: 0 22px 65px rgba(0, 0, 0, .25);
    color: #d5d5d5;
    font: .86rem/1.75 var(--terminal-font);
}
.terminal-titlebar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: .5rem 90px;
    background: #323232;
    border-bottom: 1px solid rgba(255, 255, 255, .04);
}
.terminal-traffic { position: absolute; left: 15px; top: 50%; display: flex; gap: 8px; transform: translateY(-50%); }
.terminal-traffic i { width: 13px; height: 13px; border-radius: 50%; background: #ff5f57; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1); }
.terminal-traffic i:nth-child(2) { background: #febc2e; }
.terminal-traffic i:nth-child(3) { background: #28c840; }
.terminal-window-title { display: flex; align-items: center; justify-content: center; gap: .45rem; min-width: 0; color: #b7b7b7; font: 600 .78rem/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.terminal-window-title > svg { width: 16px; height: 14px; flex: none; }
.terminal-window-title > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.terminal-body { display: flex; flex-direction: column; min-height: 450px; padding: clamp(1.1rem, 2.5vw, 1.8rem); }
.terminal-intro { margin-bottom: 1.4rem; }
.terminal-intro h2 { margin: 0; color: #a4a4a4; font: 500 .73rem/1.6 var(--terminal-font); letter-spacing: .06em; text-transform: uppercase; }
.terminal-intro > p { margin-top: .3rem; color: #999; font-size: .75rem; }
.terminal-body[data-view="whoami"] .terminal-intro > p { display: none; }
.terminal-history { padding-right: .5rem; }
.terminal-command { display: flex; flex-wrap: wrap; align-items: baseline; gap: .55em; min-width: 0; font: inherit; }
.terminal-host { color: #eee; font-weight: 600; }
.terminal-path { color: #b7b7b7; }
.terminal-percent, .terminal-typed { color: #eee; }
.terminal-typed { overflow-wrap: anywhere; }
.terminal-entry-output { margin-top: .5rem; overflow-wrap: anywhere; }
.terminal-bio { max-width: 88ch; }
.terminal-bio p + p { margin-top: .4rem; }
.terminal-name { color: #fff; font-weight: 700; }
.terminal-bio .terminal-bio-text { margin-top: .7rem; }
.terminal-bio-heading { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.terminal-bio-navigation { display: flex; align-items: center; gap: .3rem; flex: none; }
.terminal-bio-navigation button { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #444; border-radius: 6px; color: #ddd; font: inherit; line-height: 1; }
.terminal-bio-navigation button:hover:not(:disabled) { border-color: #888; background: rgba(255, 255, 255, .035); }
.terminal-bio-navigation button:disabled { color: #777; border-color: #353535; cursor: default; }
.terminal-bio-navigation button:focus-visible { outline: 2px solid #ccc; outline-offset: 3px; }
.terminal-bio-count { min-width: 3.2rem; color: #aaa; font-size: .73rem; text-align: center; white-space: nowrap; }
.terminal-muted, .terminal-comment { color: #aaa; }
.terminal-bio .terminal-muted { margin-top: .75rem; }
.terminal-bio a { color: inherit; text-decoration: underline; text-decoration-color: #666; text-underline-offset: .25rem; }
.terminal-bio a:hover { color: #fff; text-decoration-color: #aaa; }
.terminal-projects { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1.1rem; margin: .45rem 0 .75rem; }
.terminal-projects button { padding: .2rem 0; min-height: 36px; border-bottom: 1px solid transparent; color: #a7a7a7; font: inherit; font-size: .78rem; text-align: left; }
.terminal-projects button:hover { color: #fff; }
.terminal-projects button[aria-pressed="true"] { color: #f2f2f2; border-bottom-color: #b4b4b4; }
.about-terminal .workbench-command { color: #f2f2f2; font: inherit; font-weight: 600; }
.about-terminal .workbench-terminal { font: inherit; }
.about-terminal .workbench-terminal dl { margin-top: .5rem; }
.about-terminal .workbench-terminal dl > div { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 1rem; padding: .15rem 0; }
.about-terminal .workbench-terminal dt { color: #999; }
.about-terminal .workbench-terminal dd { color: #d5d5d5; }
.terminal-list, .terminal-links, .terminal-help { list-style: none; margin: 0; padding: 0; }
.terminal-list li + li, .terminal-links li + li { margin-top: .4rem; }
.terminal-help li { display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: 1rem; padding: .15rem 0; }
.terminal-help code { color: #eee; font: inherit; }
.terminal-help-detail { margin-top: .85rem; }
.terminal-links a { color: #d5d5d5; text-decoration: underline; text-decoration-color: #666; text-underline-offset: .25rem; }
.terminal-links a:hover { color: #fff; text-decoration-color: #aaa; }
.terminal-form { display: flex; align-items: center; gap: .55em; margin-top: auto; padding-top: 1.4rem; min-height: 38px; }
.terminal-form > label { flex: none; white-space: nowrap; }
.terminal-input-area { position: relative; display: flex; align-items: center; flex: 1; min-width: 0; }
.terminal-input-area input { display: block; width: 100%; min-width: 0; border: 0; border-radius: 0; outline: none; padding: .25rem 0; color: #eee; background: transparent; font: inherit; caret-color: #eee; }
.terminal-caret { position: absolute; left: 0; width: .58em; height: 1.1em; background: #b7b7b7; pointer-events: none; animation: terminal-caret 1.2s step-end 5; }
.terminal-form:focus-within .terminal-caret, .terminal-form[data-has-value="true"] .terminal-caret { display: none; }
.terminal-form:focus-within { box-shadow: 0 1px 0 rgba(255, 255, 255, .12); }
.terminal-submit { display: grid; place-items: center; width: 36px; height: 36px; flex: none; color: #aaa; border: 1px solid #454545; border-radius: 6px; font: inherit; }
.terminal-submit:hover { color: #fff; border-color: #888; }
.terminal-shortcuts { display: flex; flex-wrap: wrap; gap: .35rem 1.2rem; padding: .7rem clamp(1.1rem, 2.5vw, 1.8rem); border-top: 1px solid #353535; background: #202020; }
.terminal-shortcuts button { min-height: 36px; padding: .1rem 0; border-bottom: 1px solid transparent; color: #aaa; font: inherit; font-size: .75rem; }
.terminal-shortcuts button[aria-pressed="true"] { color: #fff; border-bottom-color: #aaa; }
.terminal-shortcuts button:hover { color: #fff; }
.terminal-shortcuts button:last-child { margin-left: auto; }
.terminal-projects button:focus-visible, .terminal-shortcuts button:focus-visible, .terminal-submit:focus-visible { outline: 2px solid #ccc; outline-offset: 4px; }
.terminal-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@keyframes terminal-caret { 50% { opacity: 0; } }
@media (max-width: 560px) {
    .about-terminal { font-size: .8rem; border-radius: 12px; }
    .terminal-titlebar { padding-inline: 74px; }
    .terminal-traffic { left: 12px; gap: 7px; }
    .terminal-traffic i { width: 11px; height: 11px; }
    .terminal-window-title { font-size: .73rem; }
    .terminal-body { min-height: 500px; }
    .terminal-host-location { display: none; }
    .terminal-projects { gap: .2rem .9rem; }
    .terminal-projects button { font-size: .75rem; }
    .about-terminal .workbench-terminal dl > div { grid-template-columns: 3.7rem minmax(0, 1fr); gap: .6rem; }
    .terminal-help li { grid-template-columns: 4rem minmax(0, 1fr); gap: .6rem; }
    .terminal-shortcuts { gap: .1rem 1rem; }
}
@media (max-width: 360px) {
    .terminal-body { min-height: 590px; }
}
@media (prefers-reduced-motion: reduce) {
    .terminal-caret { animation: none; }
}
