*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
    a, button, .light, .s-btn, #dock-icon, #dock-icon .d-app, .tag, .btn { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }
    a:focus, button:focus, .light:focus, #dock-icon:focus, .light:focus-visible, #dock-icon:focus-visible { outline: none; }

    :root {
      --cyan:      #00d4ff;
      --amber:     #ff8800;
      --green:     #00ff88;
      --screen-bg: #000810;
      --frame-bg:  #1c2028;
      --border:    #2a3540;
    }

    html, body {
      width: 100%; min-height: 100vh;
      background: #030508;
      display: flex; align-items: center; justify-content: center;
      overflow-x: hidden;
    }

    /* ── Full-page intro canvas ──────────────────────────────────── */
    #fullcnv {
      position: fixed; inset: 0; z-index: 500;
      pointer-events: none; display: block;
    }

    /* ── Terminal — hidden until forged ─────────────────────────── */
    .terminal {
      width: min(96vw, 920px);
      background: var(--frame-bg);
      border-radius: 14px;
      border: 2px solid #3a4550;
      box-shadow:
        0 0 0 1px #060810,
        0 0 60px rgba(0,212,255,.1),
        0 28px 80px rgba(0,0,0,.9);
      overflow: hidden;
      opacity: 0;
      transform: scale(0.04);
      position: relative; z-index: 1;
      will-change: transform;
      filter: brightness(1);
    }
    .terminal.forged {
      animation: forge 1.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    .terminal.reborn {
      animation: reborn .7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    @keyframes reborn {
      0%   { opacity: 0; transform: scale(.4);  filter: brightness(1.8) blur(8px) saturate(.5); }
      45%  { opacity: 1;                         filter: brightness(1.3) blur(2px); }
      100% { opacity: 1; transform: scale(1);   filter: none; }
    }
    @keyframes forge {
      0%   { opacity: 1; transform: scale(0.04);   filter: brightness(16) blur(40px) saturate(0); }
      18%  {             transform: scale(0.18);   filter: brightness(8)  blur(20px) saturate(.2); }
      45%  {             transform: scale(1.04);   filter: brightness(3)  blur(6px)  saturate(.7); }
      70%  {             transform: scale(1.015);  filter: brightness(1.4) blur(1px) saturate(.95); }
      100% { opacity: 1; transform: scale(1);      filter: none; }
    }

    /* ── Header ──────────────────────────────────────────────────── */
    .t-header {
      background: #12161e; border-bottom: 1px solid var(--border);
      padding: 9px 18px;
      display: flex; align-items: center; gap: 14px;
    }
    .lights { display: flex; gap: 6px; }
    .light  { width: 11px; height: 11px; border-radius: 50%; cursor: pointer; transition: filter .15s; }
    .light:hover { filter: brightness(1.4); }
    .light.r { background: #ff4444; box-shadow: 0 0 6px #ff4444; }
    .light.y { background: #ffaa00; box-shadow: 0 0 6px #ffaa00; }
    .light.g { background: var(--green); box-shadow: 0 0 7px var(--green); }

    .h-title {
      flex: 1; text-align: center;
      font: .58rem/1 'Courier New', monospace;
      letter-spacing: .18em; color: #3a5a6a; text-transform: uppercase;
    }
    .h-status { font: .6rem/1 'Courier New', monospace; letter-spacing: .1em; color: var(--green); }

    /* ── Body grid ───────────────────────────────────────────────── */
    .t-body { display: grid; grid-template-columns: 66px 1fr 66px; min-height: 500px; }

    /* ── Side panels ─────────────────────────────────────────────── */
    .side {
      background: #13181f; padding: 12px 9px;
      display: flex; flex-direction: column; align-items: center; gap: 8px;
    }
    .side.l { border-right: 1px solid var(--border); }
    .side.r { border-left:  1px solid var(--border); }

    .s-btn { width: 34px; height: 10px; background: #1e2a34; border-radius: 2px; border: 1px solid #3a4a58; }
    .s-btn.on { background: #003d55; border-color: #0099bb; box-shadow: 0 0 5px #0099bb44; }

    /* LEDs */
    .s-led { width: 9px; height: 9px; border-radius: 50%; background: #002233; border: 1px solid #004455; }
    .s-led.c-red  { background:#ff3333; border-color:#ff6666; box-shadow:0 0 7px #ff3333aa; }
    .s-led.c-amb  { background:#ffaa00; border-color:#ffcc44; box-shadow:0 0 7px #ffaa00aa; }
    .s-led.c-grn  { background:#00ff88; border-color:#44ffaa; box-shadow:0 0 7px #00ff88aa; }
    .s-led.c-cyn  { background:#00ccff; border-color:#44ddff; box-shadow:0 0 7px #00ccffaa; }
    .s-led.c-pur  { background:#cc44ff; border-color:#dd88ff; box-shadow:0 0 7px #cc44ffaa; }

    @keyframes blink  { 55%{opacity:.1;} }
    @keyframes blink2 { 0%,100%{opacity:1} 40%,60%{opacity:.1} }
    @keyframes blink3 { 0%,100%{opacity:1} 20%,80%{opacity:.85} 50%{opacity:.05} }
    .blink  { animation: blink  1.9s step-end   infinite; }
    .blink2 { animation: blink2 2.6s ease-in-out infinite; }
    .blink3 { animation: blink3 1.1s ease-in-out infinite; }

    .led-strip { display: flex; gap: 4px; }
    .led-strip .s-led { width: 7px; height: 7px; }
    .led-col { display: flex; flex-direction: column; gap: 5px; align-items: center; }

    .cable-svg .plug { animation: plugglow 3s ease-in-out infinite; }
    @keyframes plugglow {
      0%,100%{filter:drop-shadow(0 0 2px #00aacc44);}
      50%{filter:drop-shadow(0 0 6px #00aaccaa);}
    }

    /* ── Screen ──────────────────────────────────────────────────── */
    .screen { position: relative; background: var(--screen-bg); overflow: hidden; }
    .screen::before {
      content:''; position:absolute; inset:0; z-index:25; pointer-events:none;
      background: repeating-linear-gradient(to bottom, transparent 0,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px);
    }
    .screen::after {
      content:''; position:absolute; inset:0; z-index:10; pointer-events:none;
      background: radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.7) 100%);
    }
    #cnv { position:absolute; inset:0; z-index:23; pointer-events:none; }

    /* ── Content ─────────────────────────────────────────────────── */
    .s-content { position:relative; z-index:26; padding:28px 32px 34px; }

    @keyframes from-exhaust {
      0%   { opacity:0; transform:translateX(22px) translateY(-12px) scale(.93); filter:blur(4px) brightness(2); }
      55%  { opacity:1; filter:blur(0) brightness(1.15); }
      100% { opacity:1; transform:none; filter:none; }
    }
    .rv { opacity: 0; pointer-events: none; }
    .rv.show { animation: from-exhaust .6s cubic-bezier(.22,1,.36,1) both; pointer-events: auto; }

    .sys-line { font:.68rem/1 'Courier New',monospace; color:var(--green); letter-spacing:.08em; margin-bottom:20px; }
    .sys-cur  { display:inline-block; margin-left:2px; color:var(--green); animation:sys-blink 1s steps(1) infinite; }
    .sys-cur.gone { display:none; }
    @keyframes sys-blink { 50% { opacity: 0; } }
    #sys-ok { color:#7fffa7; text-shadow:0 0 8px #00ff8866, 0 0 18px #00ff8844; font-weight:700; opacity:0; transition:opacity .12s ease; }
    #sys-ok.show { opacity:1; animation:sys-ok-flash .4s ease-out; }
    @keyframes sys-ok-flash {
      0%   { color:#fff; text-shadow:0 0 14px #fff, 0 0 28px #00ff88; }
      100% { color:#7fffa7; text-shadow:0 0 8px #00ff8866, 0 0 18px #00ff8844; }
    }
    .hero-name { font:700 clamp(2rem,4.5vw,3rem)/1.1 'Courier New',monospace; color:var(--cyan); letter-spacing:.04em; margin-bottom:6px; text-shadow:0 0 28px #00d4ff66; }
    .hero-role { font:.9rem/1 'Courier New',monospace; color:var(--amber); letter-spacing:.14em; margin-bottom:18px; text-shadow:0 0 8px #ff880055; }
    .hero-bio  { font:.78rem/1.8 'Courier New',monospace; color:#5a9aaa; max-width:480px; margin-bottom:30px; text-shadow:0 0 12px #00d4ff33; }
    .hero-tag  { font:.82rem/1.5 'Courier New',monospace; color:#9fc3d4; max-width:580px; margin-bottom:18px; text-shadow:0 0 10px #00d4ff33; }
    .hero-tag::before { content:'> '; color:var(--green); text-shadow:0 0 6px #00ff8866; }
    .manifest  { display:grid; gap:5px; max-width:620px; margin-bottom:26px; font:.72rem/1.5 'Courier New',monospace; }
    .mf-row    { display:grid; grid-template-columns:120px 1fr; gap:16px; align-items:baseline; }
    .mf-row dt { color:var(--amber); letter-spacing:.18em; opacity:.82; text-shadow:0 0 6px #ff880033; }
    .mf-row dd { color:#9fbfd0; letter-spacing:.02em; }
    .open-to   { margin-bottom:26px; }
    @media (max-width: 520px) { .mf-row { grid-template-columns:100px 1fr; gap:12px; } }
    @media (max-width: 400px) {
      .mf-row { grid-template-columns:1fr; gap:0; margin-bottom:6px; }
      .mf-row dt { font-size:.62rem; opacity:.65; }
    }
    .sec-hdr {
      font:.62rem/1 'Courier New',monospace; color:var(--amber); letter-spacing:.18em; text-transform:uppercase;
      margin-bottom:14px; display:flex; align-items:center; gap:10px;
      text-shadow:0 0 8px #ff880055,0 0 20px #000810;
    }
    .sec-hdr::after { content:''; flex:1; height:1px; background:linear-gradient(to right,#ff880044,transparent); }

    .skills { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:30px; }
    .tag { font:.73rem/1 'Courier New',monospace; padding:6px 13px; border-radius:3px; letter-spacing:.07em; cursor:default; transition:all .2s; position:relative; opacity:.9; }
    #skill-tooltip {
      position:fixed; z-index:9999; width:210px;
      background:rgba(0,13,20,.7); border:1px solid #00d4ff55;
      color:#00d4ff; border-radius:3px; backdrop-filter:blur(4px);
      padding:8px 10px; pointer-events:none;
      font:.67rem/1.5 'Courier New',monospace; text-transform:none; letter-spacing:0;
      max-height:0; overflow:hidden; opacity:0;
      transition:max-height .35s ease, opacity .2s ease;
    }
    #skill-tooltip.visible { max-height:120px; opacity:1; }
    .tag.core { background:#001a22; border:1px solid #00aacc44; color:var(--cyan); text-shadow:0 0 6px #00d4ff44; }
    .tag.base { background:#1a1000; border:1px solid #ff880033; color:#cc7700; }
    .tag:hover { border-color:var(--cyan); box-shadow:0 0 12px #00d4ff33; transform:translateY(-2px); opacity:1; }

    .cta { display:flex; flex-wrap:wrap; gap:12px; }
    .btn {
      font:.78rem/1 'Courier New',monospace; padding:10px 18px; border-radius:3px;
      text-decoration:none; letter-spacing:.08em; text-transform:uppercase;
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      transition:all .2s; cursor:pointer; border:none;
      opacity:.75; flex-shrink:0; white-space:nowrap;
    }
    .btn:hover { opacity:.85; }
    .btn svg { width:15px; height:15px; flex-shrink:0; }
    .btn-p svg { width:16.8px; height:16.8px; }
    .btn-p { background:#001e2e; border:1px solid var(--green); color:var(--green); text-shadow:0 0 8px #00ff88; box-shadow:0 0 16px #00ff8822; }
    .btn-p:hover { background:#002e1e; box-shadow:0 0 28px #00ff8844; }
    .btn-o { background:#001e2e; border:1px solid #00d4ff55; color:var(--cyan); text-shadow:0 0 8px #00d4ff; }
    .btn-o:hover { background:#001e2e; border-color:var(--cyan); box-shadow:0 0 16px #00d4ff33; }
    .btn-g { background:#001e2e; border:1px solid #ff880055; color:var(--amber); text-shadow:0 0 8px #ff8800; }
    .btn-g:hover { background:#001e2e; border-color:var(--amber); box-shadow:0 0 16px #ff880033; }

    /* ── Footer ──────────────────────────────────────────────────── */
    .t-footer {
      background:#12161e; border-top:1px solid var(--border);
      padding:7px 18px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px;
    }
    .f-txt  { font:.58rem/1 'Courier New',monospace; color:#2a4a5a; letter-spacing:.08em; }
    .f-live { font:.58rem/1 'Courier New',monospace; color:#00ff8866; letter-spacing:.06em; }

    /* ── Mobile ──────────────────────────────────────────────────── */
    @media (max-width: 768px) {
      .h-title { font-size:.5rem; letter-spacing:.1em; }
      .hero-name { font-size: clamp(1.8rem, 8vw, 2.6rem); }
      .hero-role { font-size:.82rem; }
      .hero-bio  { font-size:.74rem; }
      .tag { font-size:.68rem; padding:5px 10px; }
    }
    @media (max-width: 600px) {
      .side { display:none; }
      .t-body { grid-template-columns: 1fr; }
      .s-content { padding:18px 16px 26px; }
      .hero-name { font-size: clamp(1.6rem,9vw,2.2rem); }
      .hero-role { font-size:.78rem; }
      .hero-bio  { font-size:.72rem; line-height:1.7; }
      .cta { display:grid; grid-template-columns:1fr; }
      .btn { justify-content:flex-start; padding:10px 16px; font-size:.7rem; width:auto; }
      .t-footer { justify-content:center; flex-direction:column; align-items:center; }
      .f-txt:first-child, .f-txt:last-child { display:none; }
      .h-title { font-size:.48rem; letter-spacing:.08em; }
    }
    @media (max-width: 400px) {
      .h-title { display:none; }
      .tag { font-size:.62rem; padding:4px 8px; }
      .btn { font-size:.68rem; padding:10px 14px; }
      .skills { gap:6px; }
    }

    /* ── Window controls ─────────────────────────────────────────── */
    #dock-icon {
      display:none; position:fixed; bottom:24px; left:50%;
      transform:translateX(-50%); z-index:9000;
      flex-direction:column; align-items:center; gap:5px;
      cursor:pointer;
    }
    #dock-icon.show { display:flex; }
    #dock-icon .d-app {
      width:56px; height:56px;
      background:linear-gradient(145deg,#1a2535,#0d1520);
      border:1px solid #3a5570; border-radius:13px;
      display:flex; align-items:center; justify-content:center;
      font-size:26px; box-shadow:0 8px 28px rgba(0,0,0,.7);
      transition:transform .15s;
    }
    #dock-icon:hover .d-app { transform:scale(1.18) translateY(-5px); }
    #dock-icon.flying .d-app {
      background: transparent; border: none; box-shadow: none;
      filter: drop-shadow(0 0 14px rgba(0,255,136,.65)) drop-shadow(0 0 28px rgba(0,255,136,.3));
    }
    #dock-icon.flying .d-app svg { width: 50px; height: 50px; }
    .d-msg {
      position:absolute; bottom:100%; left:50%; margin-bottom:10px;
      transform:translateX(-50%) translateY(6px);
      font:.65rem/1 'Courier New',monospace; letter-spacing:.14em; text-transform:uppercase;
      color:var(--green); text-shadow:0 0 6px #00ff88;
      background:rgba(0,20,12,.85); border:1px solid #00ff8866;
      border-radius:4px; padding:6px 12px; white-space:nowrap;
      pointer-events:none; opacity:0;
      transition:opacity .35s ease, transform .35s ease;
    }
    .d-msg.show { opacity:1; transform:translateX(-50%) translateY(0); }
    #dock-icon .d-label {
      font:.58rem/1 'Courier New',monospace; color:rgba(255,255,255,.75);
      background:rgba(0,0,0,.55); backdrop-filter:blur(6px);
      padding:3px 7px; border-radius:4px; letter-spacing:.05em;
      white-space:nowrap;
    }

    .s-bar::after{content:'';position:absolute;left:0;right:0;height:26%;background:#00d4ff44;animation:scan 3.4s ease-in-out infinite;}@keyframes scan{0%,100%{top:0}50%{top:74%}}