:root{
    --navy:#0B2942;
    --navy-deep:#081E31;
    --grid-line: rgba(79,168,216,0.16);
    --grid-line-strong: rgba(79,168,216,0.32);
    --blue-line:#4FA8D8;
    --electric:#12A3E6;
    --electric-deep:#0B6FA0;
    --black:#0A0A0A;
    --paper:#F6F3EA;
    --paper-line:#D9D2BE;
    --ink:#16202B;
    --ink-soft:#4A5560;
    --amber:#E08A2E;
    --amber-deep:#B5691B;
    --teal:#2E8B84;
    --red:#C1443C;
    --green:#3F7D5C;
    --white:#FDFCF8;
    --radius:2px;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--navy-deep);
    font-family:'IBM Plex Sans', sans-serif;
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
  }
  ::selection{background:var(--amber); color:var(--navy-deep);}

  .mono{font-family:'IBM Plex Mono', monospace;}
  .display{font-family:'Space Grotesk', sans-serif;}

  /* ---------- Login gate ---------- */
  .login-overlay{
    position:fixed; inset:0; z-index:500;
    background:
      linear-gradient(rgba(18,163,230,0.06) 1px, transparent 1px),
      linear-gradient(90deg, rgba(18,163,230,0.06) 1px, transparent 1px),
      var(--navy-deep);
    background-size:28px 28px;
    display:flex; align-items:center; justify-content:center; padding:20px;
  }
  .login-card{
    width:100%; max-width:380px; background:var(--black); border:1px solid var(--electric);
    box-shadow:0 0 0 1px rgba(18,163,230,0.3), 0 25px 60px rgba(8,30,49,0.7), 0 0 40px rgba(18,163,230,0.15);
    padding:32px 28px; border-top:3px solid var(--electric);
    border-radius:2px;
    animation:loginPop .3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  @keyframes loginPop{
    from{opacity:0; transform:translateY(14px) scale(0.98);}
    to{opacity:1; transform:translateY(0) scale(1);}
  }
  .login-lock{
    text-align:center; font-size:26px; margin-bottom:8px; opacity:0.9;
  }
  .login-card input[type=text], .login-card input[type=password]{
    background:var(--paper); color:var(--ink); font-weight:600;
  }
  .login-card input[type=text]:focus, .login-card input[type=password]:focus{
    outline:2px solid var(--electric); outline-offset:1px;
  }
  .login-card .btn-primary{
    transition:transform .12s ease, box-shadow .12s ease;
  }
  .login-card .btn-primary:hover{
    box-shadow:0 4px 16px rgba(224,138,46,0.35); transform:translateY(-1px);
  }

  /* ---------- Page frame with drafting corner marks ---------- */
  .sheet{
    position:relative;
    min-height:100vh;
    background:
      linear-gradient(var(--grid-line) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-line) 1px, transparent 1px),
      var(--navy);
    background-size:28px 28px;
    padding:22px;
  }
  .reg-mark{position:absolute; width:22px; height:22px; opacity:.55; z-index:5;}
  .reg-mark svg{width:100%;height:100%;}
  .reg-tl{top:14px;left:14px;} .reg-tr{top:14px;right:14px;}
  .reg-bl{bottom:14px;left:14px;} .reg-br{bottom:14px;right:14px;}

  /* ---------- Title block: diagonal blue/black split ---------- */
  .titleblock{
    position:relative;
    overflow:hidden;
    background:linear-gradient(115deg, var(--electric) 0%, var(--electric) 56%, var(--black) 56%, var(--black) 100%);
    padding:26px 26px 30px 26px;
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:16px;
  }
  .tb-logo{
    display:flex; align-items:center; gap:10px; width:100%; margin-bottom:6px;
  }
  .tb-logo-box{
    background:var(--black); color:var(--white); font-family:'Space Grotesk',sans-serif;
    font-weight:700; font-size:14px; line-height:1.05; padding:9px 12px; letter-spacing:-0.01em;
  }
  .tb-logo-tag{
    font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    color:var(--black); font-weight:700;
  }
  .tb-left{display:flex; flex-direction:column; gap:6px; min-width:280px;}
  .tb-eyebrow{
    color:var(--black); letter-spacing:.16em; font-size:11px; text-transform:uppercase;
    font-weight:700;
  }
  .tb-title{
    color:var(--black); font-size:clamp(28px,4.2vw,44px); font-weight:800; line-height:0.98;
    letter-spacing:-0.015em; text-transform:uppercase;
  }
  .tb-sub{color:rgba(10,10,10,0.78); font-size:13px; max-width:480px; line-height:1.5; font-weight:500;}

  .tb-fields{
    display:grid; grid-template-columns:repeat(3, auto); gap:0;
    border:1px solid rgba(255,255,255,0.28);
  }
  .tb-field{
    padding:8px 16px; border-right:1px solid rgba(255,255,255,0.28);
    min-width:118px;
  }
  .tb-field:last-child{border-right:none;}
  .tb-field-label{color:rgba(255,255,255,0.55); font-size:9px; letter-spacing:.12em; text-transform:uppercase;}
  .tb-field-value{color:var(--white); font-size:13px; margin-top:3px; font-weight:600;}
  .tb-field-value.status-running{color:var(--amber); animation:statusPulse 1.4s ease-in-out infinite;}
  .tb-field-value.status-ready{color:#4FCE81;}
  @keyframes statusPulse{0%,100%{opacity:1;} 50%{opacity:0.5;}}

  .tb-actions{display:flex; gap:10px;}
  .tb-actions .btn-ghost{border-color:var(--black); color:var(--black);}
  .tb-actions .btn-ghost:hover{background:var(--black); color:var(--white);}
  .btn{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px; letter-spacing:.03em;
    padding:10px 16px;
    border:1px solid var(--blue-line);
    background:transparent;
    color:var(--white);
    cursor:pointer;
    border-radius:var(--radius);
    transition:background .15s, color .15s, transform .05s;
    white-space:nowrap;
  }
  .btn:hover{background:var(--blue-line); color:var(--navy-deep);}
  .btn:active{transform:translateY(1px);}
  .btn-primary{background:var(--amber); border-color:var(--amber); color:var(--navy-deep); font-weight:600;}
  .btn-primary:hover{background:#F0A24C; border-color:#F0A24C; color:var(--navy-deep);}
  .btn-ghost{border-color:var(--grid-line-strong); color:#B9CCDA;}
  .modal-foot .btn-ghost, .sidepanel-foot .btn-ghost, .modal-body .btn-ghost{
    border-color:var(--white); color:var(--white); font-weight:600;
  }
  .modal-foot .btn-ghost:hover, .sidepanel-foot .btn-ghost:hover, .modal-body .btn-ghost:hover{background:var(--white); color:var(--black);}
  .modal-foot .btn-ghost:disabled, .sidepanel-foot .btn-ghost:disabled, .modal-body .btn-ghost:disabled{
    border-color:#5A6470; color:#5A6470; cursor:not-allowed; background:transparent;
  }
  .btn-board{
    border-color:var(--electric); color:var(--electric); font-weight:700;
    background:rgba(18,163,230,0.14);
    clip-path:polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  }
  .btn-board:hover{background:var(--electric); border-color:var(--electric); color:var(--black);}
  .btn-board.done{border-color:#4FCE81; color:#4FCE81; background:rgba(63,125,92,0.16);}
  .btn-board.done:hover{background:#4FCE81; color:var(--black);}
  .btn-board.danger{border-color:var(--red); color:var(--red); background:rgba(193,68,60,0.14);}
  .btn-board.danger:hover{background:var(--red); color:var(--white);}
  .btn-ghost:hover{background:rgba(255,255,255,0.08); color:var(--white);}
  .btn-sm{padding:6px 10px; font-size:11px;}
  .btn-danger{border-color:var(--red); color:#F3B9B4;}
  .btn-danger:hover{background:var(--red); color:var(--white);}

  /* ---------- Tabs ---------- */
  .tabs{display:flex; gap:2px; margin-bottom:12px;}
  .tab{
    font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:.04em;
    padding:10px 18px; cursor:pointer; color:#9FB6C8;
    border:1px solid var(--grid-line-strong); border-bottom:none;
    background:rgba(255,255,255,0.02);
  }
  .tab.active{background:var(--black); color:var(--white); font-weight:600; border-color:var(--electric);}
  .tab .count{color:var(--electric); margin-left:6px;}
  .tab.active .count{color:var(--electric-deep);}

  /* ---------- Board: dark surface matching the header theme ---------- */
  .board{
    background:
      linear-gradient(rgba(18,163,230,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(18,163,230,0.05) 1px, transparent 1px),
      var(--black);
    background-size:24px 24px;
    border:1px solid var(--black);
    border-top:3px solid var(--electric);
    box-shadow:0 0 0 1px rgba(18,163,230,0.3);
    padding:0;
    position:relative;
  }
  .board-head{
    display:flex; justify-content:space-between; align-items:center;
    padding:16px 20px 12px 20px; border-bottom:1px solid rgba(255,255,255,0.1);
    background:rgba(18,163,230,0.06);
    flex-wrap:wrap; gap:10px;
  }
  .board-eyebrow{
    font-family:'IBM Plex Mono', monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    color:var(--electric); font-weight:700; margin-bottom:4px; display:flex; align-items:center; gap:6px;
  }
  .live-dot{
    display:inline-block; width:7px; height:7px; border-radius:50%;
    background:#4FCE81; box-shadow:0 0 0 rgba(79,206,129,0.6);
    animation: live-pulse 1.8s infinite;
  }
  @keyframes live-pulse{
    0%{ box-shadow:0 0 0 0 rgba(79,206,129,0.55); }
    70%{ box-shadow:0 0 0 7px rgba(79,206,129,0); }
    100%{ box-shadow:0 0 0 0 rgba(79,206,129,0); }
  }
  .legend-row{
    display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; max-width:420px;
  }
  .legend-chip{
    display:inline-flex; align-items:center; gap:5px;
    padding:4px 9px; border-radius:20px;
    background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.09);
    font-family:'IBM Plex Mono', monospace; font-size:11px; color:#C7D1DA; font-weight:500;
    white-space:nowrap;
  }
  .legend-chip-muted{ color:#8B98A5; background:rgba(255,255,255,0.03); }
  .legend-chip-icon{ font-size:13px; line-height:1; filter:saturate(0.85) brightness(0.95); }
  .legend-chip-icon.posted-fresh{ color:#4FCE81; }
  .legend-chip-icon.posted-old{ color:var(--amber); }
  .legend-chip-icon.sort-icon{ color:var(--electric); font-weight:700; font-size:12px; }
  .board-title{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px; color:var(--white);}
  .board-note{color:#B7C2CC; font-size:12.5px; margin-top:2px; font-weight:500;}
  .link-back{
    font-family:'IBM Plex Mono', monospace; font-size:12px; color:#9FB6C8;
    cursor:pointer; text-decoration:none;
  }
  .link-back:hover{color:var(--white);}

  table{width:100%; border-collapse:collapse; position:relative;}
  thead th{
    text-align:left; font-family:'IBM Plex Mono', monospace; font-size:10px;
    letter-spacing:.08em; text-transform:uppercase; color:var(--electric);
    padding:10px 14px; border-bottom:2px solid var(--electric);
    background:rgba(255,255,255,0.03);
  }
  tbody td{
    padding:12px 14px; font-size:13px; border-bottom:1px solid rgba(255,255,255,0.08);
    vertical-align:top; color:var(--white);
  }
  tbody tr:hover{background:rgba(18,163,230,0.09);}
  tbody tr.applied-row{background:rgba(63,125,92,0.14);}

  .job-title-cell{display:flex; align-items:flex-start; gap:7px; max-width:340px;}
  .job-title-text{font-weight:600; font-size:13.5px; line-height:1.35; color:var(--white);}
  .badge{
    display:inline-flex; align-items:center; gap:4px;
    font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.04em;
    padding:2px 6px; border-radius:2px; white-space:nowrap; text-transform:uppercase;
  }
  .badge-repost{background:rgba(46,139,132,0.22); color:#5FD0C6; border:1px solid var(--teal); font-weight:700; font-size:10.5px;}
  .flag{
    position:relative; flex-shrink:0; width:16px; height:16px; margin-top:2px; cursor:help;
  }
  .flag svg{width:16px;height:16px;}
  .flag .tip{
    display:none; position:absolute; top:20px; left:0; z-index:20;
    width:230px; background:var(--black); color:var(--white); font-size:11px;
    padding:10px 12px; line-height:1.5; border:1px solid var(--amber);
    font-family:'IBM Plex Sans',sans-serif;
  }
  .flag:hover .tip{display:block;}
  .company-cell{color:#C7D0D8; font-size:13px; font-weight:600;}
  a.joblink{color:#5BC1F5; text-decoration:none; font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700;}
  a.joblink:hover{text-decoration:underline; color:var(--electric);}
  .posted-cell{font-family:'IBM Plex Mono',monospace; font-size:12.5px; font-weight:700; white-space:nowrap;}
  .posted-fresh{color:#4FCE81;}
  .posted-old{color:var(--amber);}
  .applicants-cell{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#C7D0D8; font-weight:700; white-space:nowrap;}

  .checkbox-wrap{display:flex; align-items:center; gap:8px;}
  input[type=checkbox]{
    appearance:none; width:17px; height:17px; border:1.5px solid #7C8B99;
    cursor:pointer; position:relative; background:var(--white); flex-shrink:0;
  }
  input[type=checkbox]:checked{background:var(--green); border-color:var(--green);}
  input[type=checkbox]:checked::after{
    content:''; position:absolute; left:5px; top:1px; width:4px; height:9px;
    border:solid white; border-width:0 2px 2px 0; transform:rotate(45deg);
  }

  .empty-state{
    padding:60px 20px; text-align:center; color:#9FB6C8;
  }
  .empty-state .display{font-size:16px; color:var(--white); margin-bottom:6px;}

  input[type=text], input[type=email], textarea, input[type=time]{
    font-family:'IBM Plex Sans', sans-serif; font-size:12.5px; padding:6px 8px;
    border:1px solid var(--paper-line); background:var(--white); color:var(--ink); width:100%;
  }
  textarea{resize:vertical; font-family:'IBM Plex Sans',sans-serif;}
  input:focus, textarea:focus{outline:2px solid var(--electric); outline-offset:1px;}

  /* ---------- Modal / panel scaffolding: dark surface matching the theme ---------- */
  .overlay{
    position:fixed; inset:0; background:rgba(8,30,49,0.72); backdrop-filter:blur(2px);
    display:none; align-items:flex-start; justify-content:center; z-index:100; padding:40px 16px;
    overflow-y:auto;
  }
  .overlay.open{display:flex;}
  .modal{
    background:
      linear-gradient(rgba(18,163,230,0.06) 1px, transparent 1px),
      linear-gradient(90deg, rgba(18,163,230,0.06) 1px, transparent 1px),
      var(--black);
    background-size:22px 22px;
    width:100%; max-width:640px; border:1px solid var(--electric);
    box-shadow:0 0 0 1px rgba(18,163,230,0.3), 0 20px 50px rgba(8,30,49,0.5);
    animation:pop .16s ease;
  }
  .modal.wide{max-width:760px;}
  @keyframes pop{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}
  .modal-head{
    display:flex; justify-content:space-between; align-items:flex-start; gap:12px;
    padding:18px 22px; border-bottom:1px solid rgba(255,255,255,0.12);
    background:linear-gradient(180deg, rgba(18,163,230,0.1), transparent);
    border-top:3px solid var(--electric);
  }
  .modal-eyebrow{
    font-family:'IBM Plex Mono', monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    color:var(--electric); font-weight:700; margin-bottom:5px; display:block;
  }
  .modal-head h2{font-family:'Space Grotesk',sans-serif; font-size:17px; margin:0 0 4px 0; color:var(--white);}
  .modal-head p{margin:0; font-size:12.5px; color:#B7C2CC; max-width:480px; line-height:1.5;}
  .modal-close{
    background:none; border:none; font-size:20px; cursor:pointer; color:#9FB6C8; line-height:1;
    padding:4px;
  }
  .modal-close:hover{color:var(--white);}
  .modal-body{padding:20px 22px; max-height:70vh; overflow-y:auto; color:var(--white);}
  .modal-foot{
    padding:16px 22px; border-top:1px solid rgba(255,255,255,0.12); display:flex; justify-content:flex-end; gap:10px;
    background:rgba(18,163,230,0.06);
  }

  .form-section{margin-bottom:22px;}
  .form-section-title{
    font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
    color:var(--electric); margin-bottom:10px; padding-bottom:6px; border-bottom:1px dashed rgba(255,255,255,0.2);
    display:flex; align-items:center; gap:6px;
  }
  .form-section-title::before{
    content:''; width:6px; height:6px; border:1.4px solid var(--electric); border-radius:50%; flex-shrink:0;
  }
  .checkgrid{display:flex; flex-wrap:wrap; gap:10px 20px;}
  .check-item{display:flex; align-items:center; gap:7px; font-size:13px; color:var(--white);}
  .rule-note{font-size:11px; color:#9FB6C8; margin-top:6px; font-style:italic;}
  .field-label{font-size:12px; font-weight:600; margin-bottom:5px; display:block; color:var(--white);}
  .field-help{font-size:11px; color:#9FB6C8; margin-bottom:6px;}
  .conn-status{
    font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:700;
    padding:4px 9px; border-radius:2px; display:none; align-items:center; gap:5px;
  }
  .conn-status.show{display:inline-flex;}
  .conn-status.ok{color:#4FCE81; background:rgba(63,125,92,0.16); border:1px solid #4FCE81;}
  .conn-status.fail{color:#F08B84; background:rgba(193,68,60,0.16); border:1px solid var(--red);}
  .conn-status.testing{color:var(--electric); background:rgba(18,163,230,0.12); border:1px solid var(--electric);}

  .key-field-wrap{position:relative; display:flex; align-items:stretch;}
  .key-field{
    padding:12px 44px 12px 12px !important; font-size:14px !important;
    font-family:'IBM Plex Mono',monospace; letter-spacing:0.5px;
  }
  .key-toggle{
    position:absolute; right:6px; top:50%; transform:translateY(-50%);
    background:none; border:none; cursor:pointer; font-size:16px; line-height:1;
    padding:6px 8px; opacity:0.65; border-radius:3px;
  }
  .key-toggle:hover{opacity:1; background:rgba(255,255,255,0.08);}
  .upload-box{
    border:1.5px dashed rgba(255,255,255,0.3); padding:16px; text-align:center; font-size:12.5px;
    color:#B7C2CC; cursor:pointer; background:rgba(255,255,255,0.04);
  }
  .upload-box:hover{border-color:var(--electric);}
  .upload-box.filled{border-style:solid; border-color:#4FCE81; color:#4FCE81; background:rgba(63,125,92,0.14);}

  /* side panel (tailor resume) */
  .side-overlay{
    position:fixed; inset:0; background:rgba(8,30,49,0.55); display:none; z-index:100;
  }
  .side-overlay.open{display:block;}
  .sidepanel{
    position:fixed; top:0; right:0; height:100%; width:min(480px, 100%);
    background:var(--black); z-index:101; transform:translateX(100%);
    transition:transform .2s ease, width .2s ease; display:flex; flex-direction:column;
    border-left:1px solid var(--electric); color:var(--white);
  }
  .sidepanel.open{transform:translateX(0);}
  .sidepanel.wide{width:min(760px, 96vw);}
  .sidepanel.maximized{width:100vw; max-width:100vw;}
  .sidepanel.minimized{transform:translateX(0); height:0; min-height:0; border:none; overflow:hidden;}

  .win-controls{
    position:absolute; top:14px; right:18px; display:flex; gap:6px;
    background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.15);
    border-radius:5px; padding:4px 5px;
  }
  .win-btn{
    width:26px; height:22px; border:none; background:transparent; color:#B7C2CC;
    cursor:pointer; font-size:12px; line-height:1; border-radius:3px;
    display:flex; align-items:center; justify-content:center;
  }
  .win-btn:hover{background:rgba(255,255,255,0.14); color:var(--white);}
  .win-btn.win-close:hover{background:var(--red); color:var(--white);}

  .sidepanel-restore{
    position:fixed; bottom:22px; right:22px; z-index:102;
    background:var(--black); color:var(--white); border:1px solid var(--electric);
    font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:600;
    padding:12px 16px; cursor:pointer; box-shadow:0 8px 24px rgba(0,0,0,0.4);
    display:flex; align-items:center; gap:8px;
  }
  .sidepanel-restore:hover{background:var(--electric); color:var(--black);}
  .sidepanel-head{padding:18px 90px 18px 22px; border-bottom:1px solid rgba(255,255,255,0.12); border-top:3px solid var(--electric); position:relative;}
  .sidepanel-body{padding:18px 22px; overflow-y:auto; flex:1;}
  .sidepanel-foot{padding:16px 22px; border-top:1px solid rgba(255,255,255,0.12); display:flex; gap:10px; flex-wrap:wrap; background:rgba(18,163,230,0.06);}
  .kw-pill{
    display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:11px;
    padding:3px 8px; border:1px solid #E27A72; color:#E27A72; border-radius:2px; margin:2px 4px 2px 0;
  }
  .kw-pill.have{border-color:#4FCE81; color:#4FCE81;}

  .toast{
    position:fixed; bottom:22px; left:50%; transform:translateX(-50%) translateY(0);
    background:var(--navy-deep); color:var(--white); padding:12px 18px; border:1px solid var(--amber);
    font-family:'IBM Plex Mono',monospace; font-size:12.5px; z-index:200; display:flex; gap:14px; align-items:center;
    opacity:0; pointer-events:none; transition:opacity .18s;
  }
  .toast.show{opacity:1; pointer-events:auto;}
  .toast.success{border-color:#4FCE81; background:rgba(63,125,92,0.25);}
  .toast.danger{border-color:var(--red); background:rgba(193,68,60,0.3); font-weight:700;}
  .toast button{
    background:none; border:1px solid var(--amber); color:var(--amber); font-family:'IBM Plex Mono',monospace;
    font-size:11px; padding:4px 9px; cursor:pointer;
  }
  .toast button:hover{background:var(--amber); color:var(--navy-deep);}

  .site-footer{color:#63788C; font-size:11px; text-align:center; margin-top:18px; font-family:'IBM Plex Mono',monospace;}
  .footer-main{margin-bottom:8px;}
  .footer-credits{
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px 16px;
    border-top:1px dashed var(--grid-line-strong); padding-top:8px;
  }
  .footer-left, .footer-right{flex:1; min-width:140px;}
  .footer-right{text-align:right;}
  .footer-center{flex:0 0 auto; color:#9FB6C8;}
  .footer-credits a{color:#9FB6C8;}
  .footer-credits a:hover{color:var(--white);}
  @media (max-width:600px){
    .footer-credits{flex-direction:column; text-align:center;}
    .footer-left, .footer-right{text-align:center;}
  }
  footer a{color:#9FB6C8;}

  @media (max-width:720px){
    .tb-fields{display:none;}
    thead{display:none;}
    tbody tr{display:block; border-bottom:6px solid var(--navy-deep);}
    tbody td{display:block; border:none; padding:6px 14px;}
    tbody td::before{content:attr(data-label); display:block; font-family:'IBM Plex Mono',monospace; font-size:9px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:2px;}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation-duration:0.001s !important; transition-duration:0.001s !important;}
  }