*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
    :root{
      --bg:#0d1117;--bg2:#161b22;--card:#1c2128;--surface:#21262d;
      --border:#30363d;--border2:#3d444d;
      --txt:#e6edf3;--txt2:#7d8590;--txt3:#484f58;
      --green:#3fb950;--green2:#56d364;--green3:#aff5b4;
      --blue:#58a6ff;--purple:#bc8cff;--orange:#ffa657;
      --yellow:#e3b341;--red:#ff7b72;--pink:#f778ba;
      --cyan:#39d0d8;
      --ff:'Syne',sans-serif;--fb:'Outfit',sans-serif;--fm:'DM Mono',monospace;
      --spring:cubic-bezier(.34,1.56,.64,1);
    }
    html,body{height:100%;overflow:hidden}
    body{font-family:var(--fb);background:var(--bg);color:var(--txt);
      display:flex;flex-direction:column;cursor:none}
    body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
      background-image:radial-gradient(rgba(63,185,80,.035) 1px,transparent 1px);
      background-size:28px 28px}

    /* CURSOR */
    #cursor{pointer-events:none;position:fixed;z-index:9999;width:10px;height:10px;
      border-radius:50%;background:var(--green);opacity:.7;
      transform:translate(-50%,-50%);transition:width .1s,height .1s}

    /* ── NAV ── */
    nav{position:relative;z-index:10;height:52px;flex-shrink:0;
      background:var(--bg2);border-bottom:1px solid var(--border);
      display:flex;align-items:center;justify-content:space-between;padding:0 1rem}
    .nav-brand{display:flex;align-items:center;gap:.5rem;text-decoration:none}
    .nav-logo{width:30px;height:30px;border-radius:7px;background:var(--green);
      display:flex;align-items:center;justify-content:center;
      font-family:var(--ff);font-size:.85rem;font-weight:800;color:#0d1117;
      box-shadow:0 0 12px rgba(63,185,80,.35);flex-shrink:0}
    .nav-title{font-family:var(--ff);font-size:.95rem;font-weight:800;color:var(--green)}
    .nav-sub{font-family:var(--fm);font-size:.52rem;color:var(--txt3);
      letter-spacing:.1em;text-transform:uppercase;display:none}
    @media(min-width:520px){.nav-sub{display:inline}}
    .nav-right{display:flex;align-items:center;gap:.4rem}
    .lang-toggle{display:flex;gap:2px;background:var(--surface);
      border:1px solid var(--border);border-radius:6px;padding:2px}
    .lang-btn{padding:2px 8px;border-radius:4px;font-family:var(--fm);
      font-size:.55rem;font-weight:700;cursor:pointer;border:none;
      background:transparent;color:var(--txt3);transition:all .12s;
      text-transform:uppercase;letter-spacing:.06em}
    .lang-btn.active{background:var(--green);color:#0d1117}
    .nav-link{width:28px;height:28px;border-radius:5px;background:var(--surface);
      border:1px solid var(--border);display:flex;align-items:center;justify-content:center;
      color:var(--txt2);font-size:.7rem;text-decoration:none;transition:all .12s}
    .nav-link:hover{background:var(--green);color:#0d1117;border-color:var(--green)}

    /* ── TAB BAR ── */
    .tab-bar{position:relative;z-index:9;flex-shrink:0;
      background:var(--bg2);border-bottom:1px solid var(--border);
      display:flex;overflow-x:auto;scrollbar-width:none}
    .tab-bar::-webkit-scrollbar{display:none}
    .tab-btn{display:flex;align-items:center;gap:.4rem;
      padding:.55rem .9rem;font-family:var(--fm);font-size:.58rem;font-weight:700;
      text-transform:uppercase;letter-spacing:.08em;color:var(--txt3);
      cursor:pointer;border:none;background:transparent;
      border-bottom:2px solid transparent;white-space:nowrap;
      transition:all .12s;flex-shrink:0}
    .tab-btn i{font-size:.65rem}
    .tab-btn:hover{color:var(--txt2)}
    .tab-btn.active{color:var(--green);border-bottom-color:var(--green)}

    /* ── MAIN ── */
    .main{position:relative;z-index:1;flex:1;overflow:hidden;display:flex;flex-direction:column}

    /* all panels */
    .panel{display:none;flex:1;overflow:hidden;flex-direction:column}
    .panel.active{display:flex}

    /* panel inner scroll */
    .panel-scroll{flex:1;overflow-y:auto;padding:1.2rem}
    .panel-scroll::-webkit-scrollbar{width:4px}
    .panel-scroll::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

    /* ─────────────────────────────────
       SHARED COMPONENTS
    ───────────────────────────────── */
    .sec-title{font-family:var(--ff);font-size:1.1rem;font-weight:800;
      color:var(--txt);margin-bottom:.2rem}
    .sec-sub{font-family:var(--fm);font-size:.62rem;color:var(--txt3);
      margin-bottom:1.2rem;letter-spacing:.06em}
    .card{background:var(--card);border:1px solid var(--border);
      border-radius:10px;padding:1rem 1.2rem;margin-bottom:.8rem}
    .card.green{border-left:3px solid var(--green)}
    .card.blue{border-left:3px solid var(--blue)}
    .card.orange{border-left:3px solid var(--orange)}
    .card.purple{border-left:3px solid var(--purple)}
    .card.yellow{border-left:3px solid var(--yellow)}
    .card.red{border-left:3px solid var(--red)}
    .card.cyan{border-left:3px solid var(--cyan)}
    .label{font-family:var(--fm);font-size:.55rem;color:var(--txt3);
      text-transform:uppercase;letter-spacing:.15em;margin-bottom:.5rem;
      display:flex;align-items:center;gap:.3rem}
    .label i{font-size:.55rem}
    .chip-wrap{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.8rem}
    .chip{padding:.35rem .8rem;border-radius:6px;border:1px solid var(--border2);
      background:var(--surface);color:var(--txt2);font-family:var(--fm);
      font-size:.62rem;cursor:pointer;transition:all .12s;user-select:none}
    .chip:hover{border-color:var(--green);color:var(--txt)}
    .chip.on{background:rgba(63,185,80,.1);border-color:var(--green);color:var(--green)}
    textarea,input[type=text],select{width:100%;padding:.7rem .9rem;
      border-radius:8px;border:1px solid var(--border2);background:var(--card);
      color:var(--txt);font-family:var(--fb);font-size:.88rem;
      outline:none;resize:vertical;transition:border-color .15s,box-shadow .15s;
      appearance:none}
    textarea:focus,input[type=text]:focus,select:focus{
      border-color:var(--green);box-shadow:0 0 0 3px rgba(63,185,80,.1)}
    textarea::placeholder,input::placeholder{color:var(--txt3)}
    select option{background:var(--card)}
    .action-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;
      padding:.75rem 1.5rem;border-radius:8px;border:2px solid var(--green);
      background:var(--green);color:#0d1117;
      font-family:var(--ff);font-size:.88rem;font-weight:800;
      cursor:pointer;transition:all .15s var(--spring);
      box-shadow:3px 3px 0 rgba(63,185,80,.2);text-transform:uppercase;letter-spacing:.06em}
    .action-btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(63,185,80,.25)}
    .action-btn:active{transform:translate(1px,1px);box-shadow:none}
    .action-btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important}
    .action-btn.outline{background:transparent;color:var(--green)}
    .action-btn.outline:hover{background:rgba(63,185,80,.08)}
    .output-box{background:var(--bg2);border:1px solid var(--border2);
      border-radius:8px;padding:.9rem 1rem;font-size:.85rem;line-height:1.7;
      color:var(--txt);margin-top:.8rem;min-height:80px;display:none}
    .output-box.show{display:block}
    .output-box code{font-family:var(--fm);font-size:.75rem;
      background:var(--surface);border:1px solid var(--border);
      padding:1px 5px;border-radius:3px;color:var(--orange)}
    .output-box pre{font-family:var(--fm);font-size:.75rem;
      background:var(--bg);border:1px solid var(--border);
      padding:.7rem;border-radius:6px;overflow-x:auto;
      color:var(--green3);line-height:1.6;margin:.4rem 0;white-space:pre-wrap}
    .output-box strong{color:var(--green2)}
    .output-box ul{padding-left:1.2rem;margin:.3rem 0}
    .output-box li{margin-bottom:.25rem}
    .loading-dots{display:inline-flex;gap:3px;align-items:center}
    .loading-dots span{width:5px;height:5px;border-radius:50%;background:var(--green);
      animation:ld .7s ease-in-out infinite}
    .loading-dots span:nth-child(2){animation-delay:.15s}
    .loading-dots span:nth-child(3){animation-delay:.3s}
    @keyframes ld{0%,80%,100%{transform:scale(.5);opacity:.3}40%{transform:scale(1);opacity:1}}
    .copy-btn{display:inline-flex;align-items:center;gap:.3rem;
      padding:.3rem .7rem;border-radius:5px;border:1px solid var(--border2);
      background:var(--surface);color:var(--txt2);font-family:var(--fm);
      font-size:.58rem;cursor:pointer;transition:all .12s;margin-top:.5rem}
    .copy-btn:hover{border-color:var(--green);color:var(--green)}
    .step-box{display:flex;gap:.7rem;padding:.7rem;background:var(--surface);
      border:1px solid var(--border);border-radius:8px;margin-bottom:.5rem}
    .step-num{width:24px;height:24px;border-radius:50%;background:var(--green);
      color:#0d1117;font-family:var(--fm);font-size:.6rem;font-weight:700;
      display:flex;align-items:center;justify-content:center;flex-shrink:0}
    .step-content{flex:1;font-size:.82rem;line-height:1.5}
    .step-content strong{color:var(--txt);font-weight:600}
    .step-content .cmd{font-family:var(--fm);font-size:.72rem;
      background:var(--bg);border:1px solid var(--border);
      padding:.4rem .7rem;border-radius:5px;color:var(--green2);
      display:block;margin:.3rem 0;cursor:pointer;transition:background .12s}
    .step-content .cmd:hover{background:rgba(63,185,80,.06)}
    .badge{display:inline-flex;align-items:center;gap:.25rem;
      font-family:var(--fm);font-size:.55rem;font-weight:700;
      padding:2px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.08em}
    .badge.green{color:var(--green);background:rgba(63,185,80,.1);border:1px solid rgba(63,185,80,.25)}
    .badge.blue{color:var(--blue);background:rgba(88,166,255,.1);border:1px solid rgba(88,166,255,.25)}
    .badge.orange{color:var(--orange);background:rgba(255,166,87,.1);border:1px solid rgba(255,166,87,.25)}
    .badge.red{color:var(--red);background:rgba(255,123,114,.1);border:1px solid rgba(255,123,114,.25)}
    .badge.yellow{color:var(--yellow);background:rgba(227,179,65,.1);border:1px solid rgba(227,179,65,.25)}
    .progress-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.3rem}
    .prog-label{font-family:var(--fm);font-size:.6rem;color:var(--txt2);
      min-width:100px;text-transform:uppercase;letter-spacing:.06em}
    .prog-track{flex:1;height:6px;background:var(--border);border-radius:3px;overflow:hidden}
    .prog-fill{height:100%;border-radius:3px;transition:width .6s var(--spring)}
    .prog-val{font-family:var(--fm);font-size:.58rem;color:var(--txt3);min-width:30px;text-align:right}

    /* ─────────────────────────────────
       PANEL 0 — CHAT BHAIYA
    ───────────────────────────────── */
    .chat-messages{flex:1;overflow-y:auto;padding:1rem;
      display:flex;flex-direction:column;gap:.75rem}
    .chat-messages::-webkit-scrollbar{width:3px}
    .chat-messages::-webkit-scrollbar-thumb{background:var(--border2)}
    .msg{display:flex;gap:.6rem;animation:msg-in .2s var(--spring)}
    @keyframes msg-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
    .msg.user{flex-direction:row-reverse}
    .av{width:30px;height:30px;border-radius:50%;flex-shrink:0;
      display:flex;align-items:center;justify-content:center;font-size:.7rem;
      font-weight:800;font-family:var(--ff);margin-top:.1rem}
    .av.b{background:linear-gradient(135deg,var(--green),#1a7f37);color:#fff;
      box-shadow:0 0 8px rgba(63,185,80,.3)}
    .av.u{background:var(--surface);border:1.5px solid var(--border2);color:var(--txt2)}
    .msg-inner{max-width:76%;display:flex;flex-direction:column;gap:.2rem}
    .msg.user .msg-inner{align-items:flex-end}
    .msg-who{font-family:var(--fm);font-size:.5rem;color:var(--txt3);
      letter-spacing:.08em;text-transform:uppercase;padding:0 .3rem}
    .bubble{padding:.7rem .95rem;border-radius:10px;font-size:.86rem;line-height:1.65;word-break:break-word}
    .msg.b .bubble{background:var(--card);border:1px solid var(--border);
      border-radius:3px 10px 10px 10px;color:var(--txt)}
    .msg.user .bubble{background:var(--green);color:#0d1117;
      border-radius:10px 3px 10px 10px;font-weight:500}
    .bubble code{font-family:var(--fm);font-size:.75rem;background:var(--surface);
      border:1px solid var(--border);padding:1px 5px;border-radius:3px;color:var(--orange)}
    .msg.user .bubble code{background:rgba(0,0,0,.15);border-color:rgba(0,0,0,.2);color:#0d1117}
    .bubble pre{font-family:var(--fm);font-size:.73rem;background:var(--bg);
      border:1px solid var(--border);padding:.6rem .8rem;border-radius:6px;
      overflow-x:auto;color:var(--green3);line-height:1.6;margin:.35rem 0;white-space:pre-wrap}
    .bubble strong{color:var(--green2);font-weight:700}
    .bubble a{color:var(--blue);text-decoration:none}
    .bubble a:hover{text-decoration:underline}
    .bubble ul{padding-left:1.1rem;margin:.25rem 0}
    .bubble li{margin-bottom:.2rem}
    .qr-row{display:flex;flex-wrap:wrap;gap:.3rem;padding:.15rem 0 .3rem}
    .qr{padding:.35rem .75rem;border-radius:16px;border:1px solid var(--border2);
      background:var(--surface);color:var(--txt2);font-family:var(--fb);
      font-size:.72rem;cursor:pointer;transition:all .12s;white-space:nowrap}
    .qr:hover{border-color:var(--green);color:var(--green);background:rgba(63,185,80,.06)}
    .typing-b{display:flex;gap:.6rem;align-items:center}
    .typing-bubble{padding:.55rem .8rem;background:var(--card);border:1px solid var(--border);
      border-radius:3px 10px 10px 10px;display:flex;align-items:center;gap:3px}
    .td{width:5px;height:5px;border-radius:50%;background:var(--txt3);
      animation:td .75s ease-in-out infinite}
    .td:nth-child(2){animation-delay:.14s}
    .td:nth-child(3){animation-delay:.28s}
    @keyframes td{0%,80%,100%{transform:scale(.5);opacity:.3}40%{transform:scale(1);opacity:1}}
    .chat-input-wrap{flex-shrink:0;padding:.65rem 1rem;
      background:var(--bg2);border-top:1px solid var(--border)}
    .chat-input-row{display:flex;gap:.45rem;align-items:flex-end;
      background:var(--card);border:1px solid var(--border2);
      border-radius:10px;padding:.45rem .5rem .45rem .85rem;
      transition:border-color .15s,box-shadow .15s}
    .chat-input-row:focus-within{border-color:var(--green);
      box-shadow:0 0 0 3px rgba(63,185,80,.1)}
    #ci{flex:1;background:transparent;border:none;outline:none;
      font-family:var(--fb);font-size:.88rem;color:var(--txt);
      resize:none;max-height:110px;min-height:22px;line-height:1.5;padding:.15rem 0}
    #ci::placeholder{color:var(--txt3)}
    .send{width:32px;height:32px;border-radius:7px;border:none;
      background:var(--green);color:#0d1117;font-size:.75rem;
      cursor:pointer;flex-shrink:0;transition:all .12s var(--spring);
      display:flex;align-items:center;justify-content:center}
    .send:hover{transform:scale(1.08)}
    .send:disabled{opacity:.4;cursor:not-allowed;transform:none}
    .input-hint{font-family:var(--fm);font-size:.5rem;color:var(--txt3);
      text-align:center;margin-top:.3rem;letter-spacing:.06em}
    .module-shortcuts{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:.5rem}
    .mshort{padding:.28rem .65rem;border-radius:5px;border:1px solid var(--border);
      background:var(--surface);color:var(--txt3);font-family:var(--fm);
      font-size:.55rem;cursor:pointer;transition:all .12s;
      display:flex;align-items:center;gap:.25rem;text-transform:uppercase;letter-spacing:.06em}
    .mshort:hover{border-color:var(--green);color:var(--green)}
    .mshort i{font-size:.55rem}

    /* ─────────────────────────────────
       PANEL 1 — IDEA GENERATOR
    ───────────────────────────────── */
    .idea-card{background:var(--card);border:1px solid var(--border2);
      border-radius:10px;padding:1rem;margin-bottom:.6rem;cursor:pointer;
      transition:all .15s;animation:fade-in .2s ease}
    @keyframes fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
    .idea-card:hover{border-color:var(--green);background:rgba(63,185,80,.04)}
    .idea-name{font-family:var(--ff);font-size:.95rem;font-weight:800;color:var(--txt);
      margin-bottom:.3rem;display:flex;align-items:center;gap:.5rem}
    .idea-desc{font-size:.8rem;color:var(--txt2);line-height:1.5;margin-bottom:.5rem}
    .idea-meta{display:flex;gap:.4rem;flex-wrap:wrap}

    /* ─────────────────────────────────
       PANEL 2 — PROJECT BUILDER
    ───────────────────────────────── */
    .task-item{display:flex;align-items:flex-start;gap:.6rem;
      padding:.6rem .8rem;background:var(--surface);border:1px solid var(--border);
      border-radius:7px;margin-bottom:.4rem;cursor:pointer;transition:all .12s}
    .task-item:hover{border-color:var(--border2)}
    .task-item.done{opacity:.55}
    .task-item.done .task-text{text-decoration:line-through;color:var(--txt3)}
    .task-cb{width:18px;height:18px;border-radius:4px;border:1.5px solid var(--border2);
      background:var(--card);flex-shrink:0;margin-top:.1rem;
      display:flex;align-items:center;justify-content:center;
      transition:all .15s;color:transparent;font-size:.6rem}
    .task-item.done .task-cb{background:var(--green);border-color:var(--green);color:#0d1117}
    .task-text{font-size:.82rem;color:var(--txt);line-height:1.4}
    .task-phase{font-family:var(--fm);font-size:.55rem;color:var(--txt3);
      margin-top:.1rem;text-transform:uppercase;letter-spacing:.08em}

    /* ─────────────────────────────────
       PANEL 3 — GIT GUIDE
    ───────────────────────────────── */
    .git-stage{background:var(--card);border:1px solid var(--border);
      border-radius:10px;margin-bottom:.8rem;overflow:hidden}
    .git-stage-header{padding:.7rem 1rem;background:var(--surface);
      border-bottom:1px solid var(--border);
      display:flex;align-items:center;justify-content:space-between;cursor:pointer}
    .git-stage-title{font-family:var(--ff);font-size:.85rem;font-weight:800;
      color:var(--txt);display:flex;align-items:center;gap:.5rem}
    .git-stage-title i{font-size:.75rem;color:var(--green)}
    .git-stage-body{padding:.9rem 1rem;display:none}
    .git-stage.open .git-stage-body{display:block}
    .git-stage.open .git-chevron{transform:rotate(180deg)}
    .git-chevron{color:var(--txt3);font-size:.7rem;transition:transform .2s}
    .cmd-block{font-family:var(--fm);font-size:.78rem;
      background:var(--bg);border:1px solid var(--border);
      padding:.55rem .8rem;border-radius:6px;color:var(--green2);
      margin:.4rem 0;cursor:pointer;display:flex;align-items:center;
      justify-content:space-between;transition:background .12s}
    .cmd-block:hover{background:rgba(63,185,80,.05)}
    .cmd-block .copy-icon{color:var(--txt3);font-size:.65rem;flex-shrink:0}
    .git-note{font-size:.78rem;color:var(--txt2);line-height:1.6;margin-bottom:.5rem}
    .git-note strong{color:var(--green2)}
    .git-note .warn{color:var(--yellow)}
    .fear-tag{display:inline-block;font-family:var(--fm);font-size:.58rem;
      color:var(--yellow);background:rgba(227,179,65,.1);border:1px solid rgba(227,179,65,.25);
      padding:2px 8px;border-radius:3px;margin-bottom:.5rem}

    /* ─────────────────────────────────
       PANEL 4 — HOSTING GUIDE
    ───────────────────────────────── */
    .host-card{background:var(--card);border:1px solid var(--border2);
      border-radius:10px;padding:1rem;margin-bottom:.7rem;cursor:pointer;
      transition:all .15s;position:relative}
    .host-card:hover,.host-card.active{border-color:var(--green);background:rgba(63,185,80,.04)}
    .host-card.active::before{content:'';position:absolute;left:0;top:0;bottom:0;
      width:3px;background:var(--green);border-radius:3px 0 0 3px}
    .host-name{font-family:var(--ff);font-size:.9rem;font-weight:800;margin-bottom:.2rem;
      display:flex;align-items:center;gap:.5rem}
    .host-desc{font-size:.78rem;color:var(--txt2);margin-bottom:.5rem}
    .host-steps{display:none;margin-top:.7rem;padding-top:.7rem;
      border-top:1px solid var(--border)}
    .host-card.active .host-steps{display:block}

    /* ─────────────────────────────────
       PANEL 5 — DEBUG HELPER
    ───────────────────────────────── */
    .error-type-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.4rem;
      margin-bottom:.8rem}
    .error-chip{padding:.5rem .7rem;border-radius:7px;border:1px solid var(--border2);
      background:var(--surface);color:var(--txt2);font-family:var(--fm);
      font-size:.6rem;cursor:pointer;text-align:center;transition:all .12s;
      display:flex;flex-direction:column;align-items:center;gap:.25rem}
    .error-chip i{font-size:.9rem;color:var(--txt3);transition:color .12s}
    .error-chip:hover,.error-chip.on{border-color:var(--red);color:var(--red);
      background:rgba(255,123,114,.06)}
    .error-chip:hover i,.error-chip.on i{color:var(--red)}

    /* ─────────────────────────────────
       PANEL 6 — PORTFOLIO CHECKER
    ───────────────────────────────── */
    .check-item{display:flex;align-items:center;justify-content:space-between;
      padding:.6rem .8rem;background:var(--surface);border:1px solid var(--border);
      border-radius:7px;margin-bottom:.4rem;cursor:pointer;transition:all .12s}
    .check-item:hover{border-color:var(--border2)}
    .check-left{display:flex;align-items:center;gap:.6rem;flex:1}
    .check-icon{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border2);
      display:flex;align-items:center;justify-content:center;
      font-size:.55rem;color:transparent;transition:all .15s;flex-shrink:0}
    .check-item.done .check-icon{background:var(--green);border-color:var(--green);color:#0d1117}
    .check-item.miss .check-icon{border-color:var(--red)}
    .check-label{font-size:.82rem;color:var(--txt)}
    .check-item.done .check-label{color:var(--txt2)}
    .check-tip{font-family:var(--fm);font-size:.58rem;color:var(--txt3)}
    .score-ring{width:80px;height:80px;flex-shrink:0}
    .score-ring circle{fill:none;stroke-linecap:round}
    .score-ring .track{stroke:var(--border)}
    .score-ring .fill{stroke:var(--green);transition:stroke-dashoffset 1s var(--spring)}

    /* ─────────────────────────────────
       PANEL 7 — INTERVIEW PREP
    ───────────────────────────────── */
    .interview-qa{background:var(--card);border:1px solid var(--border);
      border-radius:10px;margin-bottom:.7rem;overflow:hidden}
    .iq-header{padding:.7rem 1rem;cursor:pointer;display:flex;align-items:center;
      justify-content:space-between;background:var(--surface)}
    .iq-q{font-size:.85rem;color:var(--txt);font-weight:500;flex:1}
    .iq-body{padding:.8rem 1rem;font-size:.82rem;color:var(--txt2);
      line-height:1.7;display:none;border-top:1px solid var(--border)}
    .interview-qa.open .iq-body{display:block}
    .interview-qa.open .iq-chev{transform:rotate(180deg)}
    .iq-chev{color:var(--txt3);font-size:.7rem;transition:transform .2s;flex-shrink:0}

    /* ─────────────────────────────────
       ONBOARDING
    ───────────────────────────────── */
    #onboarding{position:fixed;inset:0;z-index:500;background:var(--bg);
      display:flex;flex-direction:column;align-items:center;justify-content:center;
      gap:1.2rem;padding:1.5rem;text-align:center;transition:opacity .4s}
    #onboarding.gone{opacity:0;pointer-events:none}
    .ob-logo{width:60px;height:60px;border-radius:14px;background:var(--green);
      display:flex;align-items:center;justify-content:center;
      font-family:var(--ff);font-size:1.5rem;font-weight:800;color:#0d1117;
      box-shadow:0 0 28px rgba(63,185,80,.4);animation:ob-p 2s ease-in-out infinite}
    @keyframes ob-p{0%,100%{box-shadow:0 0 20px rgba(63,185,80,.3)}50%{box-shadow:0 0 40px rgba(63,185,80,.6)}}
    .ob-title{font-family:var(--ff);font-size:clamp(2rem,6vw,3.2rem);
      font-weight:800;color:var(--txt);text-transform:uppercase;line-height:.9}
    .ob-title span{color:var(--green)}
    .ob-desc{font-family:var(--fb);font-size:.9rem;color:var(--txt2);
      max-width:400px;line-height:1.7}
    .ob-desc strong{color:var(--green)}
    .ob-step{width:100%;max-width:460px;display:none;flex-direction:column;gap:.7rem;
      animation:fade-in .3s var(--spring)}
    .ob-step.active{display:flex}
    .ob-lbl{font-family:var(--fm);font-size:.56rem;color:var(--green);
      text-transform:uppercase;letter-spacing:.15em;display:flex;align-items:center;gap:.35rem}
    .ob-chips{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:center}
    .ob-chip{padding:.45rem .9rem;border-radius:7px;border:1px solid var(--border2);
      background:var(--surface);color:var(--txt2);font-family:var(--fb);font-size:.78rem;
      cursor:pointer;transition:all .15s;user-select:none}
    .ob-chip:hover{border-color:var(--green);color:var(--txt)}
    .ob-chip.on{background:rgba(63,185,80,.1);border-color:var(--green);color:var(--green)}
    .ob-input{width:100%;padding:.75rem 1rem;border-radius:8px;
      border:1px solid var(--border2);background:var(--card);
      color:var(--txt);font-family:var(--fb);font-size:.9rem;outline:none;
      transition:border-color .15s,box-shadow .15s}
    .ob-input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(63,185,80,.1)}
    .ob-input::placeholder{color:var(--txt3)}
    .ob-btn{padding:.8rem 2.2rem;border-radius:9px;
      border:2px solid var(--green);background:var(--green);
      color:#0d1117;font-family:var(--ff);font-size:.95rem;font-weight:800;
      cursor:pointer;letter-spacing:.05em;text-transform:uppercase;
      box-shadow:3px 3px 0 rgba(63,185,80,.25);transition:all .15s var(--spring);
      display:flex;align-items:center;gap:.45rem;margin:0 auto}
    .ob-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 rgba(63,185,80,.25)}
    .ob-dots{display:flex;gap:.35rem;justify-content:center}
    .ob-dot{width:6px;height:6px;border-radius:50%;background:var(--border2);transition:all .2s}
    .ob-dot.active{background:var(--green);width:14px;border-radius:3px}

    /* footer */
    .footer{font-family:var(--fm);font-size:.5rem;color:var(--txt3);
      text-align:center;padding:.25rem;flex-shrink:0}
    .footer a{color:var(--green);text-decoration:none}