/* Interactive developer experiences; progressive enhancements over existing portfolio. */
.experience-description{margin:0 0 22px;color:var(--text-secondary)}
.experience-description code{color:#74ffae;font-family:var(--font-code)}
.interactive-console{max-width:940px;border:1px solid rgba(98,255,157,.38);border-radius:15px;overflow:hidden;background:rgba(1,12,6,.95);box-shadow:0 24px 65px rgba(0,0,0,.3)}
.console-bar{display:flex;align-items:center;gap:14px;padding:12px 17px;background:#102417;color:#a5d6b4;font:12px var(--font-code);border-bottom:1px solid rgba(98,255,157,.18)}
.console-output{height:220px;overflow:auto;padding:20px;color:#b6f7c9;font:13px/1.7 var(--font-code);white-space:pre-wrap;overflow-wrap:anywhere}
.console-output p{margin:0 0 7px;color:inherit}.console-output .console-echo{color:#62ff9d}.console-output .console-error{color:#ff9c9c}
.console-form{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid rgba(98,255,157,.18)}
.console-form label{font:12px var(--font-code);color:#62ff9d;white-space:nowrap}
.console-form input{flex:1;min-width:0;border:0;background:transparent;color:#e7fff0;font:14px var(--font-code);outline:none}
.console-form input:focus-visible{outline:2px solid #62ff9d;outline-offset:4px}
.console-form button{padding:8px 15px}
.console-shortcuts{display:flex;gap:8px;flex-wrap:wrap;padding:0 16px 16px}
.console-shortcuts button,.skill-node{cursor:pointer;border:1px solid rgba(98,255,157,.3);border-radius:8px;background:rgba(16,45,26,.75);color:#aaffc7;font:12px var(--font-code);padding:9px 13px;transition:background .2s,border-color .2s,transform .2s}
.console-shortcuts button:hover,.skill-node:hover{background:rgba(48,125,69,.32);border-color:#62ff9d}
.skill-tree{margin-top:28px;padding:20px;border:1px solid rgba(98,255,157,.22);border-radius:14px;background:rgba(3,22,11,.7)}
.skill-tree-intro{font:12px/1.6 var(--font-code);margin-bottom:18px}
.skill-tree-nodes{display:flex;flex-wrap:wrap;gap:12px;position:relative}
.skill-node{position:relative;padding:13px 17px;min-height:44px}
.skill-node::before{content:"●";margin-right:8px;color:#62ff9d}
.skill-node[aria-pressed="true"]{background:rgba(98,255,157,.17);border-color:#62ff9d;box-shadow:0 0 22px rgba(98,255,157,.13)}
.skill-tree-detail{margin-top:20px;padding:12px 15px;border-left:2px solid #62ff9d;color:#d4ffe1;font:13px/1.6 var(--font-code)}
.project-preview-toggle{margin-left:8px}
.project-code-preview{margin-top:18px;max-width:450px;border:1px solid rgba(98,255,157,.25);border-radius:9px;overflow:hidden;background:#04120a}
.project-code-preview[hidden]{display:none!important}
.preview-tab{padding:10px 14px;background:#12271a;font:12px var(--font-code);color:#b8ffce}.preview-tab span{float:right;color:#62ff9d}
.project-code-preview pre{padding:17px;overflow-x:auto;color:#b9f5ca;font:12px/1.7 var(--font-code)}
.project-code-preview p{padding:0 17px 13px;font-size:11px}
.boot-overlay{position:fixed;inset:0;z-index:9999;pointer-events:none;display:grid;place-items:center;background:rgba(1,8,4,.94);animation:boot-appear .15s ease-out both}
.boot-panel{width:min(90vw,540px);padding:26px;border:1px solid rgba(98,255,157,.4);background:#041009;box-shadow:0 0 70px rgba(64,255,145,.1);font:13px/2 var(--font-code);color:#8cffb6}
.boot-heading{font-size:20px;letter-spacing:.15em;margin-bottom:12px}.boot-heading span{font-size:11px;opacity:.65}
.boot-line{animation:boot-line .35s ease-out both}.boot-line:nth-child(3){animation-delay:.22s}.boot-line:nth-child(4){animation-delay:.44s}.boot-ready{color:#e5ffed;font-weight:700;animation-delay:.68s}
.boot-dismiss{opacity:0;transition:opacity .3s}
@keyframes boot-line{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes boot-appear{from{opacity:0}to{opacity:1}}
html.easter-matrix .hacker-data-rain{opacity:.48}
html.easter-matrix .terminal-window{box-shadow:0 0 55px rgba(98,255,157,.35)}
@media(max-width:767px){.console-form{flex-wrap:wrap}.console-form label{width:100%}.console-output{height:190px;font-size:12px}.skill-tree{padding:14px}.skill-node{flex:1 1 110px}.project-preview-toggle{margin:10px 0 0}.boot-panel{padding:18px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.boot-overlay{display:none!important}.boot-line,.boot-appear{animation:none!important}.console-shortcuts button,.skill-node{transition:none!important}}


/* Compact interactive console inside the original hero terminal. */
.hero-visual .terminal-window{width:100%;max-width:100%;overflow:hidden}
.hero-visual .terminal-interactive{padding:0;min-width:0}
.hero-visual .console-output{height:218px;max-height:32vh;min-height:170px;overflow:auto;padding:14px 16px 8px;font:11px/1.7 var(--font-code);scrollbar-width:thin;scrollbar-color:#397d51 transparent}
.hero-visual .console-output p{margin:0 0 6px}
.hero-visual .console-output pre{font:inherit;margin:5px 0 10px;white-space:pre-wrap;overflow-wrap:anywhere}
.hero-visual .console-form{display:flex;flex-wrap:nowrap;gap:5px;padding:8px 12px 13px;border-top:1px solid rgba(98,255,157,.12)}
.hero-visual .console-form label{width:auto;max-width:65%;font:10px/1.4 var(--font-code);letter-spacing:-.4px;color:#62ff9d}
.hero-visual .console-form input{flex:1;width:30px;min-width:20px;font:11px var(--font-code);padding:4px 0}
.hero-visual .console-form input::placeholder{color:#6b9b7b}
.hero-visual .terminal-run{flex:none;background:transparent;color:#62ff9d;border:1px solid rgba(98,255,157,.35);border-radius:5px;padding:2px 7px;cursor:pointer}
.hero-visual .terminal-run:hover{background:rgba(98,255,157,.12)}
.hero-visual .terminal-run:focus-visible{outline:2px solid #8cffb6;outline-offset:2px}
@media(max-width:767px){.hero-visual .console-output{height:200px;max-height:none;font-size:11px}.hero-visual .console-form{flex-wrap:nowrap}.hero-visual .console-form label{width:auto;font-size:9px}.hero-visual .console-form input{font-size:12px}}
