    :root {
      --bg:#08060e; --bg2:#0e0b18;
      --surface:#110e1c; --surface2:#181430; --surface3:#1f1a38;
      --border:rgba(255,255,255,.05); --border2:rgba(255,255,255,.08);
      --text:#eeedf5; --text2:#c0bbd2; --muted:#6b6580; --dim:#3a3550;
      --accent:#c026d3; --accent2:#d946ef; --cyan:#06b6d4; --green:#22c55e; --red:#ef4444; --amber:#f59e0b;
      --inputBg:var(--bg); --inputBorder:rgba(255,255,255,.06);
      --card:var(--surface);
    }
    *{margin:0;padding:0;box-sizing:border-box;}
    body{font-family:'Barlow',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;}

    /* ── PIN OVERLAY ── */
    .pin-overlay{position:fixed;inset:0;z-index:900;background:rgba(8,6,14,.96);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:20px;}
    .pin-overlay.hidden{display:none;}
    .pin-modal{background:var(--surface);border:1px solid var(--border2);border-radius:16px;padding:28px;width:100%;max-width:380px;box-shadow:0 0 60px rgba(0,0,0,.5);}
    .pin-modal h2{font-family:'Oswald',sans-serif;font-size:22px;font-weight:600;letter-spacing:.06em;text-align:center;margin-bottom:4px;background:linear-gradient(135deg,var(--accent),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
    .pin-subtitle{text-align:center;font-size:12px;color:var(--muted);margin-bottom:16px;}
    .pin-tabs{display:flex;gap:4px;margin-bottom:16px;}
    .pin-tabs button{flex:1;padding:8px;border-radius:8px;font-family:'Barlow Condensed',sans-serif;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:all .12s;background:transparent;border:1px solid var(--border2);color:var(--text2);}
    .pin-tabs button.active{background:rgba(192,38,211,.08);border-color:var(--accent);color:var(--accent);}
    .pin-error{color:var(--red);font-size:12px;min-height:18px;margin:6px 0;}
    .pin-modal label{display:block;margin-bottom:3px;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
    .pin-modal input,.pin-modal select{width:100%;padding:9px 12px;background:var(--bg);border:1px solid var(--inputBorder);border-radius:7px;color:var(--text);font-family:'Barlow',sans-serif;font-size:14px;transition:border-color .12s;}
    .pin-modal input:focus,.pin-modal select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(192,38,211,.06);}

    /* ── ANNOUNCEMENT ── */
    .announcement-banner{display:flex;align-items:center;gap:10px;padding:10px 20px;background:linear-gradient(135deg,rgba(192,38,211,.08),rgba(6,182,212,.06));border-bottom:1px solid var(--border);font-size:13px;}
    .announcement-banner button{background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;margin-left:auto;}

    /* ── HEADER ── */
    header{display:flex;align-items:center;justify-content:space-between;padding:10px 24px;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;background:var(--bg2);}
    .hdr-left{display:flex;align-items:center;gap:14px;}
    .logo{font-family:'Oswald',sans-serif;font-size:17px;font-weight:600;letter-spacing:.06em;background:linear-gradient(135deg,var(--accent),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
    .mechanic-chip{display:none;align-items:center;gap:7px;padding:4px 12px 4px 9px;background:rgba(34,197,94,.06);border:1px solid rgba(34,197,94,.12);border-radius:99px;font-size:12px;font-weight:600;}
    .mechanic-chip .gdot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px rgba(34,197,94,.5);}
    .mechanic-chip .sign-out{background:none;border:none;color:var(--muted);cursor:pointer;font-size:13px;padding:0 2px;margin-left:4px;}
    .mechanic-chip .sign-out:hover{color:var(--red);}
    .shift-info{display:none;font-family:'Barlow Condensed',sans-serif;font-size:13px;color:var(--muted);letter-spacing:.03em;align-items:center;gap:4px;}
    .shift-info b{color:var(--accent);font-weight:700;}
    .shift-btn{display:none;}
    .shift-btn.clocked-out{background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.2);color:var(--green);}
    .shift-btn.clocked-in{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.2);color:var(--red);}
    .hdr-right{display:flex;gap:6px;}

    button{border:1px solid var(--border2);background:transparent;color:var(--text2);padding:6px 14px;border-radius:6px;cursor:pointer;font-family:'Barlow Condensed',sans-serif;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;transition:all .12s;white-space:nowrap;}
    button:hover{border-color:var(--accent);color:var(--accent);}
    button.primary{background:linear-gradient(135deg,var(--accent),var(--cyan));color:#fff;border-color:var(--accent);}
    button.primary:hover{box-shadow:0 4px 16px rgba(192,38,211,.25);}
    button.danger{border-color:rgba(239,68,68,.3);color:var(--red);}
    button.danger:hover{border-color:var(--red);background:rgba(239,68,68,.08);}
    button.ghost{background:transparent;border:1px solid var(--border);color:var(--text2);}

    /* ── LAYOUT ── */
    .layout{display:grid;grid-template-columns:1fr 340px;max-width:1280px;margin:0 auto;min-height:calc(100vh - 50px);}

    /* ── LEFT: STEPS ── */
    .steps{padding:20px 24px;}
    .inv-line{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
    .inv-id{font-family:'Oswald',sans-serif;font-size:13px;color:var(--dim);letter-spacing:.04em;}
    .inv-id span{color:var(--accent);font-weight:600;}
    .save-dot{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:4px;}
    .save-dot i{width:5px;height:5px;border-radius:50%;background:var(--green);display:inline-block;}

    .step{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:12px;overflow:hidden;}
    .step-head{display:flex;align-items:center;gap:10px;padding:12px 16px;}
    .step-num{width:26px;height:26px;border-radius:7px;background:rgba(192,38,211,.07);border:1px solid rgba(192,38,211,.15);display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;color:var(--accent);flex-shrink:0;}
    .step-title{font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:.06em;color:var(--accent);}
    .step-opt{font-family:'Barlow',sans-serif;font-size:11px;color:var(--muted);font-weight:400;margin-left:6px;}
    .step-body{padding:0 16px 14px;}

    .fg{display:grid;gap:10px;}
    .fg.c2{grid-template-columns:1fr 1fr;}
    .fg.c3{grid-template-columns:1fr 1fr 120px;}
    .fg.c1a{grid-template-columns:1fr auto;}
    label{display:block;margin-bottom:4px;font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
    input,select,textarea{width:100%;padding:10px 14px;background:var(--bg);border:1px solid var(--inputBorder);border-radius:7px;color:var(--text);font-family:'Barlow',sans-serif;font-size:15px;transition:all .12s;}
    input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(192,38,211,.05);}
    input::placeholder,textarea::placeholder{color:var(--dim);}
    textarea{resize:vertical;min-height:48px;font-size:13px;}

    .sug-btn{align-self:end;height:37px;padding:0 12px;border-radius:7px;background:rgba(192,38,211,.06);border:1px solid rgba(192,38,211,.15);color:var(--accent2);font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap;}
    .sug-btn:hover{background:rgba(192,38,211,.12);}

    /* ── WORK ACTIONS BAR ── */
    .work-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px;}
    .import-trigger{display:flex;align-items:center;gap:7px;padding:8px 16px;border-radius:8px;background:linear-gradient(135deg,rgba(192,38,211,.06),rgba(6,182,212,.04));border:1px solid rgba(192,38,211,.2);color:var(--accent2);font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:all .12s;}
    .import-trigger:hover{background:linear-gradient(135deg,rgba(192,38,211,.1),rgba(6,182,212,.08));border-color:var(--accent2);}
    .sep-v{width:1px;height:22px;background:var(--dim);flex-shrink:0;}
    .qb{padding:7px 12px;border-radius:5px;font-family:'Barlow Condensed',sans-serif;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:all .1s;}
    .qb.add{background:rgba(192,38,211,.06);border:1px solid rgba(192,38,211,.12);color:var(--accent);}
    .qb.add:hover{background:rgba(192,38,211,.1);}
    .qb.pre{background:var(--surface2);border:1px solid var(--border);color:var(--text2);}
    .qb.pre:hover{border-color:var(--accent2);color:var(--accent2);}
    .qb .sc{font-size:9px;color:var(--muted);margin-left:2px;}

    /* ── LINE ITEMS TABLE ── */
    table{width:100%;border-collapse:collapse;}
    thead th{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:6px 5px 6px 0;text-align:left;border-bottom:1px solid var(--border2);}
    thead th.r{text-align:right;}
    tbody tr{border-bottom:1px solid rgba(255,255,255,.02);}
    tbody tr:hover{background:rgba(255,255,255,.01);}
    td{padding:4px 5px 4px 0;}
    td select,td input{width:100%;padding:8px 10px;background:var(--bg);border:1px solid transparent;border-radius:5px;color:var(--text);font-family:'Barlow',sans-serif;font-size:14px;transition:border-color .1s;}
    td select:focus,td input:focus{outline:none;border-color:var(--accent);}
    td.r input{text-align:right;}
    .lt{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:15px;text-align:right;color:var(--text2);white-space:nowrap;}
    .del-btn{width:22px;height:22px;border-radius:5px;background:transparent;border:none;color:var(--dim);font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .1s;padding:0;}
    .del-btn:hover{background:rgba(239,68,68,.08);color:var(--red);}
    .hint{font-size:12px;color:var(--muted);padding-top:6px;}
    .hint kbd{padding:2px 5px;background:var(--bg);border:1px solid var(--border);border-radius:3px;font-size:10px;}

    /* ── RIGHT PANEL ── */
    .panel{padding:20px 18px;border-left:1px solid var(--border);background:var(--surface);}
    .panel-inner{position:sticky;top:60px;}
    .panel-section{margin-bottom:14px;}
    .panel-label{font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:.08em;color:var(--accent);margin-bottom:10px;}
    .disc-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px;}
    .df label{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:2px;}
    .df input{text-align:center;font-size:15px;}
    .flags{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;}
    .flag{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--bg);border:1px solid var(--border);border-radius:7px;cursor:pointer;font-size:14px;font-weight:500;transition:all .12s;}
    .flag:hover{border-color:rgba(192,38,211,.2);}
    .flag input[type=checkbox]{accent-color:var(--accent);width:14px;height:14px;}

    .totals{background:linear-gradient(135deg,rgba(192,38,211,.04),rgba(6,182,212,.03));border:1px solid rgba(192,38,211,.1);border-radius:10px;padding:16px;margin-bottom:4px;}
    .totals .line{display:flex;justify-content:space-between;padding:3px 0;font-size:14px;}
    .totals .line.muted{color:var(--muted);font-size:13px;}
    .totals .line.grand{margin-top:10px;padding-top:12px;border-top:1px solid rgba(192,38,211,.1);align-items:flex-end;}
    .totals .line.grand span:first-child{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:.05em;color:var(--accent);}
    .totals .line.grand .right{font-family:'Bebas Neue',sans-serif;font-size:38px;color:var(--green);line-height:1;}
    .your-cut{text-align:center;padding:10px 0 0;font-family:'Barlow Condensed',sans-serif;font-size:15px;color:var(--muted);letter-spacing:.03em;}
    .your-cut b{color:var(--accent);font-size:17px;}
    .pricing-hint{font-size:12px;color:var(--amber);text-align:center;margin-bottom:14px;line-height:1.4;margin-top:8px;}

    .action-block{border-top:1px solid var(--border);padding-top:14px;margin-top:8px;}
    .btn-discord{width:100%;padding:16px;background:linear-gradient(135deg,var(--accent),var(--cyan));border:none;border-radius:10px;font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:.08em;color:#fff;cursor:pointer;box-shadow:0 4px 20px rgba(192,38,211,.2);transition:all .15s;margin-bottom:8px;}
    .btn-discord:hover{box-shadow:0 6px 28px rgba(192,38,211,.3);transform:translateY(-1px);color:#fff;}
    .btn-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;}

    /* ── IMPORT POPUP ── */
    .import-popup{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:20px;}
    .import-popup.open{display:flex;}
    .import-popup-inner{background:var(--surface);border:1px solid rgba(192,38,211,.3);border-radius:16px;padding:28px;max-width:480px;width:100%;text-align:center;box-shadow:0 0 60px rgba(192,38,211,.1);}
    .import-popup .icon{font-size:40px;margin-bottom:10px;}
    .import-popup .title{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:.06em;color:var(--accent2);margin-bottom:6px;}
    .import-popup .desc{font-size:13px;color:var(--muted);margin-bottom:18px;line-height:1.5;}
    .import-popup .desc kbd{padding:2px 7px;background:var(--bg);border:1px solid var(--border2);border-radius:4px;font-size:11px;}
    #woPasteZone{border:2px dashed var(--dim);border-radius:10px;padding:28px 16px;margin-bottom:14px;transition:border-color .2s;cursor:pointer;}
    #woPasteZone:hover{border-color:var(--accent2);}

    /* ── HISTORY / SEARCH PANELS ── */
    .history-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:590;}
    .history-overlay.open{display:block;}
    .history-panel{display:none;position:fixed;top:0;right:0;bottom:0;width:380px;background:var(--surface);border-left:1px solid var(--border);box-shadow:-8px 0 40px rgba(0,0,0,.6);z-index:600;flex-direction:column;overflow:hidden;}
    .history-panel.open{display:flex;}
    .history-header{padding:14px 16px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;}
    .history-header h3{margin:0;font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:.05em;color:var(--accent);}
    .history-body{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:6px;}
    .history-entry{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;transition:all .15s;}
    .history-entry:hover{border-color:var(--accent);}
    .history-entry .he-top{display:flex;justify-content:space-between;align-items:center;gap:8px;}
    .history-entry .he-no{font-weight:700;font-size:13px;font-family:'Barlow Condensed',sans-serif;color:var(--accent);}
    .history-entry .he-total{font-weight:700;font-size:13px;color:var(--green);font-family:'Bebas Neue',sans-serif;}
    .history-entry .he-meta{font-size:11px;color:var(--muted);margin-top:4px;font-family:'Barlow Condensed',sans-serif;}
    .history-entry .he-delete{background:none;border:none;color:var(--red);cursor:pointer;font-size:14px;padding:0 2px;flex-shrink:0;}

    /* ── TOAST ── */
    .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120%);background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 20px;font-size:14px;font-weight:600;z-index:9999;opacity:0;transition:all .3s;pointer-events:none;white-space:nowrap;max-width:90vw;overflow:hidden;text-overflow:ellipsis;}
    .toast.show{transform:translateX(-50%) translateY(0);opacity:1;}

    /* ── AUTOSAVE ── */
    .autosave-indicator{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:4px;font-family:'Barlow Condensed',sans-serif;letter-spacing:.03em;}
    .autosave-indicator i{width:5px;height:5px;border-radius:50%;background:var(--green);display:inline-block;}
    .autosave-indicator.saving{color:var(--accent);}
    .autosave-indicator.saved{color:var(--green);}

    /* ── TUTORIAL SLIDESHOW ── */
    .tut-overlay{position:fixed;inset:0;z-index:2000;background:rgba(4,3,8,.95);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:20px;}
    .tut-box{background:var(--surface);border:1px solid var(--border2);border-radius:18px;max-width:620px;width:100%;overflow:hidden;box-shadow:0 0 80px rgba(0,0,0,.6);}
    .tut-visual{position:relative;background:var(--bg);padding:32px 28px;min-height:180px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--border);}
    .tut-body{padding:24px 28px;}
    .tut-step-label{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent2);margin-bottom:6px;}
    .tut-title{font-family:'Bebas Neue',sans-serif;font-size:28px;letter-spacing:.04em;color:var(--accent);margin-bottom:10px;line-height:1.1;}
    .tut-desc{font-size:14px;color:var(--text2);line-height:1.7;margin-bottom:0;}
    .tut-desc strong{color:var(--text);}
    .tut-desc .key{padding:2px 7px;background:var(--bg);border:1px solid var(--border2);border-radius:4px;font-size:12px;font-family:'Barlow',sans-serif;}
    .tut-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 28px 22px;}
    .tut-dots{display:flex;gap:6px;}
    .tut-dot{width:8px;height:8px;border-radius:50%;background:var(--dim);transition:all .2s;}
    .tut-dot.active{background:var(--accent);box-shadow:0 0 8px rgba(192,38,211,.4);}
    .tut-btn{padding:10px 20px;border-radius:8px;font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:all .12s;}
    .tut-btn.skip{background:transparent;border:1px solid var(--border2);color:var(--text2);}
    .tut-btn.skip:hover{border-color:var(--accent);color:var(--accent);}
    .tut-btn.next{background:var(--accent);border:none;color:#fff;}
    .tut-btn.next:hover{box-shadow:0 4px 16px rgba(192,38,211,.25);}

    /* ── SPOTLIGHT TUTORIAL ── */
    .spotlight-overlay{position:fixed;inset:0;z-index:2000;transition:clip-path .35s ease;}
    .spotlight-bg{position:fixed;inset:0;background:rgba(4,3,8,.88);pointer-events:auto;}
    .spotlight-hole{position:fixed;border-radius:14px;box-shadow:0 0 0 9999px rgba(4,3,8,.88);z-index:2001;pointer-events:none;transition:all .35s ease;}
    .spotlight-tooltip{position:fixed;z-index:2002;background:var(--surface);border:1px solid rgba(192,38,211,.25);border-radius:14px;padding:22px 24px;max-width:400px;width:90vw;box-shadow:0 8px 40px rgba(0,0,0,.5),0 0 30px rgba(192,38,211,.08);animation:spotFadeIn .3s ease;}
    .spotlight-tooltip .st-label{font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent2);margin-bottom:4px;}
    .spotlight-tooltip .st-title{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:.04em;color:var(--accent);margin-bottom:8px;line-height:1.1;}
    .spotlight-tooltip .st-desc{font-size:13px;color:var(--text2);line-height:1.65;margin-bottom:14px;}
    .spotlight-tooltip .st-desc strong{color:var(--text);}
    .spotlight-tooltip .st-footer{display:flex;align-items:center;justify-content:space-between;}
    .spotlight-tooltip .st-dots{display:flex;gap:5px;}
    .spotlight-tooltip .st-dot{width:7px;height:7px;border-radius:50%;background:var(--dim);transition:all .2s;}
    .spotlight-tooltip .st-dot.active{background:var(--accent);box-shadow:0 0 6px rgba(192,38,211,.4);}
    .spotlight-tooltip .st-btns{display:flex;gap:6px;}
    .spotlight-tooltip .st-arrow{position:absolute;width:12px;height:12px;background:var(--surface);border:1px solid rgba(192,38,211,.25);transform:rotate(45deg);z-index:-1;}
    @keyframes spotFadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

    /* ── STEP GATING ── */
    .step-gated{pointer-events:none;opacity:.35;filter:grayscale(.4);position:relative;transition:opacity .3s,filter .3s;}
    .step-gated::after{content:'';position:absolute;inset:0;cursor:not-allowed;z-index:10;}
    .submit-gated{pointer-events:none;opacity:.35;filter:grayscale(.4);transition:opacity .3s,filter .3s;}
    @keyframes pulseHint{0%,100%{box-shadow:0 0 0 3px rgba(192,38,211,.45);}50%{box-shadow:0 0 0 8px rgba(192,38,211,0);}}
    .pulse-hint{animation:pulseHint 1.6s ease-in-out infinite;border-radius:8px;}
    .gate-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:11;font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);background:var(--surface);padding:6px 14px;border-radius:6px;border:1px solid rgba(192,38,211,.2);white-space:nowrap;pointer-events:none;}

    /* ── CONTEXTUAL HINTS ── */
    .ctx-hint{position:fixed;z-index:800;background:var(--surface);border:1px solid rgba(192,38,211,.25);border-radius:10px;padding:10px 30px 10px 14px;font-size:12px;color:var(--text2);max-width:260px;box-shadow:0 4px 20px rgba(192,38,211,.12);animation:hintSlideIn .3s ease;line-height:1.5;}
    .ctx-hint strong{color:var(--accent);}
    .ctx-hint .ctx-dismiss{position:absolute;top:4px;right:6px;background:none;border:none;color:var(--muted);cursor:pointer;font-size:14px;padding:2px 4px;line-height:1;}
    .ctx-hint .ctx-dismiss:hover{color:var(--red);}
    .ctx-hint .ctx-arrow{position:absolute;width:10px;height:10px;background:var(--surface);border:1px solid rgba(192,38,211,.25);transform:rotate(45deg);}
    .ctx-hint .ctx-arrow.arrow-top{top:-6px;left:20px;border-bottom:none;border-right:none;}
    .ctx-hint .ctx-arrow.arrow-bottom{bottom:-6px;left:20px;border-top:none;border-left:none;}
    .ctx-hint .ctx-arrow.arrow-left{left:-6px;top:12px;border-top:none;border-right:none;}
    @keyframes hintSlideIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

    /* ── PRINT (hidden, kept for compatibility) ── */
    @media print{.pin-overlay,.history-panel,.history-overlay,.toast,header{display:none!important;}.layout{display:block;}.panel{border:none;}}

    /* ── ITEM NOTE ROW ── */
    .item-note-row td{padding:0 8px 6px!important;border:none!important;}
    .item-note-cell{font-size:11px;color:var(--cyan,#06b6d4);line-height:1.3;padding:2px 10px 8px!important;border-bottom:1px solid rgba(255,255,255,.04)!important;background:rgba(6,182,212,.03);border-radius:0 0 6px 6px;}

    /* ── RESPONSIVE ── */
    @media(max-width:900px){
      .layout{grid-template-columns:1fr;}
      .panel{border-left:none;border-top:1px solid var(--border);}
      .fg.c3{grid-template-columns:1fr 1fr;}
    }
    @media(max-width:600px){
      header{flex-direction:column;gap:8px;padding:8px 12px;}
      .hdr-left,.hdr-right{flex-wrap:wrap;justify-content:center;}
      .hdr-right button{font-size:11px;padding:6px 8px;}
      .steps{padding:8px;}
      .step-body{padding:10px;}
      .fg.c2{grid-template-columns:1fr;}
      .fg.c3{grid-template-columns:1fr;}
      table{font-size:12px;}
      table select.mini,table input.mini{font-size:11px;padding:4px;}
      .work-actions{flex-wrap:wrap;gap:4px;}
      .work-actions .qb{font-size:11px;padding:5px 8px;}
      .panel-inner{padding:12px;}
      .disc-row{flex-direction:column;}
      .btn-discord{font-size:13px;padding:10px;}
      .history-panel{width:100vw!important;}
    }
