:root{
      --bg:#f7f8f9;
      --surface:#ffffff;
      --surface-2:#f1f2f4;
      --surface-3:#e9ebee;
      --text:#172b4d;
      --muted:#626f86;
      --border:#dcdfe4;
      --blue:#0c66e4;
      --blue-2:#0055cc;
      --blue-soft:#e9f2ff;
      --green:#1f845a;
      --green-soft:#dcfff1;
      --yellow:#b65c02;
      --yellow-soft:#fff7d6;
      --red:#c9372c;
      --red-soft:#ffebe6;
      --purple:#803fa5;
      --shadow:0 1px 2px rgba(9,30,66,.14), 0 0 1px rgba(9,30,66,.12);
      --radius:10px;
      --sidebar:#101828;
    }

    *{box-sizing:border-box}
    body{
      margin:0;
      color:var(--text);
      background:var(--bg);
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
      min-height:100vh;
    }

    button,input,select,textarea{font:inherit}
    button{cursor:pointer}

    .app{
      display:grid;
      grid-template-columns:260px minmax(0,1fr);
      min-height:100vh;
    }

    /* SIDEBAR */
    .sidebar{
      background:var(--sidebar);
      color:#fff;
      padding:18px 14px;
      display:flex;
      flex-direction:column;
      gap:14px;
      position:sticky;
      top:0;
      height:100vh;
      overflow:auto;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:10px;
      font-weight:800;
      letter-spacing:-.01em;
      padding:6px 8px 14px;
    }

    .brand-icon{
      width:34px;height:34px;
      border-radius:9px;
      display:grid;place-items:center;
      background:linear-gradient(135deg,#579dff,#0c66e4);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
      font-weight:900;
    }

    .sidebar-section-title{
      text-transform:uppercase;
      letter-spacing:.08em;
      font-size:11px;
      color:rgba(255,255,255,.48);
      padding:7px 8px;
      margin-top:4px;
    }

    .project-list{
      display:grid;
      gap:4px;
    }

    .project-row{
      display:flex;
      align-items:center;
      gap:6px;
    }

    .project-btn{
      min-width:0;
      flex:1;
      border:0;
      color:rgba(255,255,255,.78);
      background:transparent;
      border-radius:7px;
      padding:9px 10px;
      text-align:left;
      display:flex;
      gap:9px;
      align-items:center;
    }

    .project-btn:hover{background:rgba(255,255,255,.07)}
    .project-btn.active{
      background:rgba(87,157,255,.18);
      color:#fff;
    }

    .project-dot{
      width:10px;height:10px;border-radius:3px;
      background:#579dff;
      flex:0 0 auto;
    }

    .project-name{
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
      font-size:14px;
      font-weight:650;
    }

    .project-settings{
      width:32px;height:32px;border:0;
      background:transparent;color:rgba(255,255,255,.55);
      border-radius:6px;
    }

    .project-settings:hover{background:rgba(255,255,255,.08);color:#fff}

    .sidebar-add{
      width:100%;
      border:1px dashed rgba(255,255,255,.22);
      background:transparent;
      color:rgba(255,255,255,.76);
      border-radius:7px;
      padding:9px 10px;
      text-align:left;
    }

    .sidebar-add:hover{background:rgba(255,255,255,.06);color:#fff}

    .sidebar-footer{
      margin-top:auto;
      padding:12px 8px 4px;
      color:rgba(255,255,255,.45);
      font-size:11px;
      line-height:1.5;
    }

    /* MAIN */
    .main{
      min-width:0;
      padding:24px;
    }

    .topbar{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:20px;
      margin-bottom:14px;
    }

    .breadcrumbs{
      color:var(--muted);
      font-size:12px;
      margin-bottom:6px;
    }

    h1{
      margin:0;
      font-size:25px;
      letter-spacing:-.02em;
    }

    .project-description{
      color:var(--muted);
      font-size:13px;
      margin-top:6px;
    }

    .top-actions{
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      justify-content:flex-end;
      align-items:center;
    }

    .btn{
      min-height:38px;
      border:1px solid var(--border);
      background:var(--surface);
      color:var(--text);
      border-radius:7px;
      padding:8px 12px;
      font-weight:700;
      transition:.12s ease;
    }

    .btn:hover{background:#f2f3f5}
    .btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
    .btn.primary:hover{background:var(--blue-2)}
    .btn.danger{color:var(--red)}
    .btn.small{min-height:32px;padding:5px 9px;font-size:12px}
    .btn.ghost{background:transparent}

    .current-user{
      display:flex;
      align-items:center;
      gap:7px;
      padding:3px 5px 3px 7px;
      border:1px solid var(--border);
      background:#fff;
      border-radius:8px;
    }

    .current-user label{
      font-size:11px;
      color:var(--muted);
    }

    .current-user select{
      border:0;
      outline:0;
      color:var(--text);
      font-weight:750;
      background:#fff;
      padding:4px;
    }

    .tabs{
      display:flex;
      gap:4px;
      border-bottom:1px solid var(--border);
      margin-bottom:14px;
    }

    .tab{
      border:0;
      background:transparent;
      color:var(--muted);
      padding:10px 12px;
      font-weight:750;
      border-bottom:3px solid transparent;
    }

    .tab:hover{color:var(--text);background:#f3f4f6}
    .tab.active{color:var(--blue);border-bottom-color:var(--blue)}

    .notice{
      display:none;
      align-items:flex-start;
      gap:10px;
      border:1px solid #f5cd47;
      background:var(--yellow-soft);
      border-radius:9px;
      padding:10px 12px;
      margin-bottom:14px;
    }

    .notice.show{display:flex}
    .notice strong{font-size:13px}
    .notice-text{font-size:12px;color:#6f4c00;margin-top:2px}

    .filters{
      display:flex;
      gap:8px;
      align-items:center;
      flex-wrap:wrap;
      margin-bottom:14px;
      background:var(--surface);
      border:1px solid var(--border);
      border-radius:10px;
      padding:10px;
      box-shadow:var(--shadow);
    }

    .search{
      flex:1 1 260px;
      position:relative;
    }

    .search input{
      width:100%;height:38px;
      border:1px solid var(--border);
      border-radius:7px;
      padding:0 12px 0 35px;
      outline:none;
      color:var(--text);
    }

    .search span{
      position:absolute;
      left:12px;top:50%;
      transform:translateY(-50%);
      color:var(--muted);
      font-size:14px;
    }

    .filters select{
      height:38px;
      border:1px solid var(--border);
      border-radius:7px;
      padding:0 9px;
      color:var(--text);
      background:#fff;
      outline:none;
    }

    input:focus,select:focus,textarea:focus{
      border-color:var(--blue)!important;
      box-shadow:0 0 0 2px rgba(12,102,228,.12);
    }

    .stats{
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      margin-bottom:14px;
    }

    .stat{
      background:#fff;
      border:1px solid var(--border);
      border-radius:8px;
      padding:8px 11px;
      color:var(--muted);
      font-size:12px;
    }
    .stat strong{color:var(--text)}

    /* BOARD */
    .board{
      display:grid;
      grid-template-columns:repeat(4,minmax(245px,1fr));
      gap:12px;
      align-items:start;
      overflow-x:auto;
      padding-bottom:8px;
    }

    .column{
      background:var(--surface-2);
      border-radius:10px;
      padding:9px;
      min-height:390px;
    }

    .column-header{
      display:flex;
      justify-content:space-between;
      align-items:center;
      padding:4px 4px 9px;
    }

    .column-title{
      font-size:11px;
      font-weight:850;
      color:var(--muted);
      letter-spacing:.06em;
    }

    .count{
      background:#dcdfe4;
      border-radius:999px;
      padding:2px 7px;
      font-size:11px;
      color:#44546f;
      font-weight:800;
    }

    .task-list{display:grid;gap:8px}

    .card{
      background:#fff;
      border:1px solid rgba(9,30,66,.10);
      border-radius:8px;
      padding:11px;
      box-shadow:var(--shadow);
    }

    .card.problem{border-left:4px solid var(--red)}
    .card.overdue{box-shadow:inset 0 0 0 1px #f1b8b3,var(--shadow)}
    .card:hover{box-shadow:0 4px 12px rgba(9,30,66,.12)}

    .overdue-text{color:var(--red)!important;font-weight:850}

    .card-key{
      font-size:11px;
      font-weight:800;
      color:var(--muted);
      margin-bottom:5px;
      display:flex;
      align-items:center;
      gap:6px;
    }

    .type-badge{
      border-radius:4px;
      padding:2px 5px;
      font-size:10px;
      font-weight:800;
      background:var(--blue-soft);
      color:#0055cc;
    }

    .type-badge.bug{background:var(--red-soft);color:#ae2e24}
    .type-badge.story{background:#eae6ff;color:#5e4db2}

    .task-title{
      font-size:14px;
      line-height:1.35;
      font-weight:750;
      overflow-wrap:anywhere;
      margin-bottom:9px;
    }

    .card-footer{
      display:flex;
      align-items:center;
      gap:6px;
    }

    .avatar{
      width:28px;height:28px;border-radius:50%;
      display:grid;place-items:center;
      color:#fff;font-size:10px;font-weight:900;
      flex:0 0 auto;
    }

    .avatar.m{background:#0c66e4}
    .avatar.b{background:#803fa5}

    .priority{
      border-radius:4px;
      padding:3px 6px;
      font-size:10px;
      font-weight:800;
    }

    .priority.high{background:var(--red-soft);color:#ae2e24}
    .priority.medium{background:var(--yellow-soft);color:var(--yellow)}
    .priority.low{background:var(--blue-soft);color:#0055cc}

    .date-chip{
      font-size:10px;
      color:var(--muted);
      margin-left:auto;
      white-space:nowrap;
    }

    .case-summary{
      margin-top:8px;
      display:flex;
      gap:5px;
      flex-wrap:wrap;
      font-size:10px;
    }

    .case-pill{
      border-radius:999px;
      padding:2px 6px;
      font-weight:750;
      background:#f1f2f4;
      color:#44546f;
    }
    .case-pill.fail{background:var(--red-soft);color:#ae2e24}
    .case-pill.pass{background:var(--green-soft);color:#216e4e}
    .case-pill.pending{background:var(--yellow-soft);color:#7f5f01}

    .card-actions{
      display:flex;
      gap:5px;
      margin-top:9px;
      border-top:1px solid #eee;
      padding-top:8px;
    }

    .icon-btn{
      border:0;
      background:#f4f5f7;
      border-radius:6px;
      padding:5px 7px;
      color:#44546f;
      font-size:11px;
      font-weight:750;
    }
    .icon-btn:hover{background:#e9ebee}

    .empty{
      border:1px dashed #b6bfcc;
      border-radius:8px;
      padding:24px 8px;
      text-align:center;
      color:var(--muted);
      font-size:12px;
      background:rgba(255,255,255,.45);
    }

    /* LIST */
    .table-wrap{
      background:#fff;
      border:1px solid var(--border);
      border-radius:10px;
      overflow:auto;
      box-shadow:var(--shadow);
    }

    table{
      width:100%;
      border-collapse:collapse;
      min-width:900px;
    }

    th,td{
      text-align:left;
      padding:10px 12px;
      border-bottom:1px solid #eceef1;
      font-size:12px;
      vertical-align:middle;
    }

    th{
      color:var(--muted);
      font-weight:800;
      background:#fafbfc;
      position:sticky;
      top:0;
    }

    tr:hover td{background:#fafbfc}
    .status-badge{
      display:inline-flex;
      border-radius:4px;
      padding:3px 6px;
      font-size:10px;
      font-weight:850;
      background:#dfe1e6;
      color:#44546f;
    }
    .status-badge.progress{background:var(--blue-soft);color:#0055cc}
    .status-badge.pending{background:var(--yellow-soft);color:#7f5f01}
    .status-badge.done{background:var(--green-soft);color:#216e4e}

    /* TIMELINE */
    .timeline-shell{
      background:#fff;
      border:1px solid var(--border);
      border-radius:10px;
      overflow:auto;
      box-shadow:var(--shadow);
    }

    .timeline{
      min-width:1100px;
      display:grid;
      grid-template-columns:270px 1fr;
    }

    .timeline-left{
      border-right:1px solid var(--border);
      background:#fff;
    }

    .timeline-right{
      min-width:800px;
      position:relative;
    }

    .timeline-head-left{
      height:48px;
      padding:14px 12px;
      font-size:11px;
      font-weight:850;
      color:var(--muted);
      border-bottom:1px solid var(--border);
      background:#fafbfc;
    }

    .timeline-head{
      height:48px;
      border-bottom:1px solid var(--border);
      background:#fafbfc;
      display:grid;
      grid-template-columns:repeat(28,1fr);
    }

    .day{
      border-left:1px solid #eceef1;
      font-size:9px;
      color:var(--muted);
      display:grid;
      place-items:center;
      text-align:center;
    }

    .timeline-label{
      height:56px;
      padding:9px 12px;
      border-bottom:1px solid #eceef1;
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:3px;
    }

    .timeline-label strong{
      font-size:12px;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }
    .timeline-label span{font-size:10px;color:var(--muted)}

    .timeline-row{
      height:56px;
      position:relative;
      border-bottom:1px solid #eceef1;
      background:
        repeating-linear-gradient(
          to right,
          transparent 0,
          transparent calc((100% / 28) - 1px),
          #edf0f2 calc((100% / 28) - 1px),
          #edf0f2 calc(100% / 28)
        );
    }

    .timeline-bar{
      position:absolute;
      top:15px;
      height:25px;
      border-radius:6px;
      background:#579dff;
      color:#fff;
      font-size:10px;
      font-weight:800;
      display:flex;
      align-items:center;
      padding:0 8px;
      overflow:hidden;
      white-space:nowrap;
      min-width:18px;
      box-shadow:0 1px 2px rgba(9,30,66,.15);
    }

    .timeline-bar.pending{background:#d99e00}
    .timeline-bar.done{background:#1f845a}
    .timeline-bar.problem{background:#c9372c}

    .today-line{
      position:absolute;
      top:48px;
      bottom:0;
      width:2px;
      background:#e2483d;
      z-index:4;
      pointer-events:none;
    }


    .backup-menu{position:relative}
    .backup-menu summary{
      list-style:none;
      min-height:38px;
      display:flex;
      align-items:center;
      border:1px solid var(--border);
      background:#fff;
      border-radius:7px;
      padding:8px 11px;
      font-weight:700;
      cursor:pointer;
    }
    .backup-menu summary::-webkit-details-marker{display:none}
    .backup-menu[open] summary{background:#f2f3f5}
    .backup-pop{
      position:absolute;
      right:0;
      top:44px;
      width:170px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:8px;
      padding:6px;
      box-shadow:0 8px 24px rgba(9,30,66,.16);
      z-index:20;
      display:grid;
      gap:4px;
    }
    .backup-pop button{
      border:0;
      background:transparent;
      border-radius:6px;
      padding:8px 9px;
      text-align:left;
      color:var(--text);
      font-size:12px;
      font-weight:700;
    }
    .backup-pop button:hover{background:#f1f2f4}

    .timeline-toolbar{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
      margin-bottom:8px;
    }
    .timeline-toolbar-group{display:flex;gap:6px;align-items:center}
    .timeline-range{
      color:var(--muted);
      font-size:11px;
      font-weight:700;
    }
    .timeline-outside{
      position:absolute;
      top:16px;
      border:0;
      background:#dfe1e6;
      color:#44546f;
      border-radius:5px;
      height:24px;
      padding:0 7px;
      font-size:10px;
      font-weight:850;
    }
    .timeline-outside.left{left:4px}
    .timeline-outside.right{right:4px}

    /* MODALS */
    .modal-backdrop{
      position:fixed;
      inset:0;
      background:rgba(9,30,66,.50);
      display:none;
      place-items:center;
      padding:18px;
      z-index:100;
    }

    .modal-backdrop.open{display:grid}

    .modal{
      width:min(720px,100%);
      max-height:92vh;
      overflow:auto;
      background:#fff;
      border-radius:12px;
      box-shadow:0 20px 60px rgba(9,30,66,.32);
    }

    .modal.small{width:min(480px,100%)}
    .modal.wide{width:min(960px,100%)}

    .modal-header{
      padding:16px 18px;
      border-bottom:1px solid var(--border);
      display:flex;
      justify-content:space-between;
      gap:12px;
      align-items:center;
      position:sticky;
      top:0;
      z-index:3;
      background:#fff;
    }

    .modal-title{font-size:18px;font-weight:850}
    .modal-body{padding:18px}
    .modal-footer{
      padding:14px 18px;
      border-top:1px solid var(--border);
      display:flex;
      justify-content:flex-end;
      gap:8px;
      background:#fff;
      position:sticky;
      bottom:0;
    }

    .form-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:12px;
    }

    .field{
      display:grid;
      gap:6px;
      margin-bottom:12px;
    }

    .field.full{grid-column:1/-1}
    .field label{
      font-size:11px;
      font-weight:800;
      color:var(--muted);
    }

    .field input,.field select,.field textarea{
      width:100%;
      border:1px solid var(--border);
      border-radius:7px;
      padding:9px 10px;
      color:var(--text);
      background:#fff;
      outline:none;
    }

    .field textarea{
      min-height:96px;
      resize:vertical;
    }

    .subsection{
      border-top:1px solid var(--border);
      padding-top:16px;
      margin-top:16px;
    }

    .subsection-title{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:10px;
      margin-bottom:10px;
    }

    .subsection-title h3{
      margin:0;
      font-size:14px;
    }

    .case-editor{
      display:grid;
      gap:7px;
    }

    .case-row{
      border:1px solid var(--border);
      border-radius:8px;
      padding:7px;
      background:#fafbfc;
    }

    .case-main{
      display:grid;
      grid-template-columns:minmax(0,1fr) 110px 34px;
      gap:6px;
      align-items:center;
    }

    .case-row input,.case-row select,.case-row textarea{
      border:1px solid var(--border);
      border-radius:6px;
      padding:7px 8px;
      min-width:0;
      background:#fff;
      outline:none;
    }

    .case-details{
      margin-top:6px;
      border-top:1px solid #e8eaed;
      padding-top:6px;
    }

    .case-details summary{
      cursor:pointer;
      color:var(--muted);
      font-size:11px;
      font-weight:750;
      user-select:none;
    }

    .case-detail-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:7px;
      margin-top:7px;
    }

    .case-detail-grid textarea{
      min-height:60px;
      resize:vertical;
      width:100%;
    }

    .case-meta{
      margin-top:6px;
      color:var(--muted);
      font-size:10px;
    }

    .remove-case{
      width:34px;height:34px;
      border:0;border-radius:6px;
      color:var(--red);
      background:var(--red-soft);
      font-weight:900;
    }

    .notes{
      display:grid;
      gap:8px;
      max-height:230px;
      overflow:auto;
      margin-bottom:10px;
    }

    .note{
      background:#f7f8f9;
      border:1px solid #e5e7eb;
      border-radius:8px;
      padding:9px 10px;
    }

    .note-head{
      display:flex;
      gap:7px;
      align-items:center;
      margin-bottom:5px;
      color:var(--muted);
      font-size:10px;
    }
    .note-head strong{color:var(--text);font-size:11px}
    .note-body{font-size:12px;white-space:pre-wrap;line-height:1.45}

    .note-compose{
      display:grid;
      grid-template-columns:1fr auto;
      gap:7px;
    }

    .note-compose textarea{
      min-height:70px;
      border:1px solid var(--border);
      border-radius:7px;
      padding:8px 9px;
      resize:vertical;
    }

    .problem-list{
      display:grid;
      gap:8px;
    }

    .problem-item{
      border:1px solid #f1b8b3;
      background:var(--red-soft);
      border-radius:8px;
      padding:10px;
      font-size:12px;
    }

    .problem-item strong{display:block;margin-bottom:3px}

    .muted{color:var(--muted)}
    .hidden{display:none!important}

    @media(max-width:1100px){
      .board{grid-template-columns:repeat(4,260px)}
    }

    @media(max-width:760px){
      .app{grid-template-columns:1fr}
      .sidebar{
        position:relative;
        height:auto;
      }
      .project-list{
        grid-template-columns:repeat(3,minmax(0,1fr));
      }
      .project-settings{display:none}
      .main{padding:16px}
      .topbar{flex-direction:column}
      .top-actions{justify-content:flex-start}
      .form-grid{grid-template-columns:1fr}
      .field.full{grid-column:auto}
      .case-detail-grid{grid-template-columns:1fr}
      .tabs{overflow:auto}
    }

    /*
      UI FOUNDATION v1
      Sonraki arayüz güncellemeleri aşağıdaki tasarım tokenlarını, 44px dokunma
      hedefini, tek birincil eylem kuralını ve modal odak yönetimini korumalıdır.
    */
    :root{
      --bg:#f4f6f8;
      --surface:#ffffff;
      --surface-2:#f8fafc;
      --surface-3:#eef2f6;
      --text:#172033;
      --muted:#667085;
      --border:#d9e0e8;
      --border-strong:#c7d0dc;
      --blue:#1769e0;
      --blue-2:#0b57c4;
      --blue-soft:#eaf2ff;
      --green:#18794e;
      --green-soft:#e7f8ef;
      --yellow:#9a5b00;
      --yellow-soft:#fff4d6;
      --red:#c4322b;
      --red-soft:#fff0ee;
      --purple:#7b4ab3;
      --sidebar:#111827;
      --sidebar-muted:#98a2b3;
      --shadow:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.08);
      --shadow-lg:0 24px 64px rgba(16,24,40,.22);
      --radius-sm:8px;
      --radius:12px;
      --radius-lg:16px;
      --focus:0 0 0 3px rgba(23,105,224,.18);
    }

    html{scroll-behavior:smooth}
    body{
      background:var(--bg);
      color:var(--text);
      font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
      line-height:1.45;
      -webkit-font-smoothing:antialiased;
    }
    body.modal-open{overflow:hidden}
    button,input,select,textarea,summary{font:inherit}
    button,summary{-webkit-tap-highlight-color:transparent}
    button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
      outline:0;
      box-shadow:var(--focus);
    }

    .app{grid-template-columns:248px minmax(0,1fr)}
    .mobile-bar,.sidebar-scrim,.sidebar-close{display:none}

    .sidebar{
      padding:18px 12px 16px;
      gap:10px;
      border-right:1px solid rgba(255,255,255,.06);
      scrollbar-width:thin;
    }
    .brand{
      min-height:48px;
      padding:4px 8px 14px;
      font-size:15px;
      letter-spacing:-.015em;
    }
    .brand-copy{display:grid;line-height:1.15}
    .brand-copy small{
      margin-top:4px;
      color:var(--sidebar-muted);
      font-size:10px;
      font-weight:600;
      letter-spacing:.02em;
    }
    .brand-icon{
      width:36px;height:36px;border-radius:10px;
      background:linear-gradient(145deg,#3b82f6,#1554c0);
    }
    .sidebar-section-title{
      color:var(--sidebar-muted);
      margin-top:8px;
      padding:8px 10px 5px;
      font-weight:800;
    }
    .project-list{gap:3px}
    .project-row{gap:4px}
    .project-btn{
      min-height:42px;
      padding:9px 10px;
      border-radius:9px;
      transition:background .16s ease,color .16s ease;
    }
    .project-btn:hover{background:rgba(255,255,255,.08)}
    .project-btn.active{
      background:rgba(59,130,246,.20);
      box-shadow:inset 3px 0 0 #60a5fa;
    }
    .project-dot{width:9px;height:9px;border-radius:50%}
    .project-settings{
      width:36px;height:36px;
      opacity:.72;
    }
    .sidebar-add{
      min-height:42px;
      border-radius:9px;
      padding:9px 11px;
      font-weight:700;
    }
    .quick-access{margin-top:2px}
    .quick-access .project-btn{width:100%}
    .quick-access .count{
      margin-left:auto;
      background:rgba(255,255,255,.12);
      color:#fff;
    }
    .sidebar-footer{
      border-top:1px solid rgba(255,255,255,.08);
      color:var(--sidebar-muted);
      padding:14px 8px 2px;
    }

    .main{
      padding:28px clamp(20px,3vw,42px) 40px;
      overflow:hidden;
    }
    .topbar{
      align-items:center;
      margin:0 0 22px;
      gap:24px;
    }
    .page-heading{min-width:220px;max-width:720px}
    .breadcrumbs{
      margin-bottom:5px;
      color:#7b8799;
      font-size:11px;
      font-weight:750;
      letter-spacing:.02em;
      text-transform:uppercase;
    }
    h1{font-size:clamp(24px,2vw,30px);line-height:1.15;font-weight:800}
    .project-description{margin-top:7px;font-size:13px;line-height:1.45}
    .top-actions{flex-wrap:nowrap}

    .btn{
      min-height:40px;
      border-color:var(--border-strong);
      border-radius:9px;
      padding:8px 13px;
      font-size:13px;
      font-weight:750;
      box-shadow:0 1px 1px rgba(16,24,40,.03);
      transition:background .15s ease,border-color .15s ease,transform .15s ease,box-shadow .15s ease;
    }
    .btn:hover{background:#f6f8fa;border-color:#b9c4d1}
    .btn:active{transform:translateY(1px)}
    .btn.primary{box-shadow:0 1px 2px rgba(11,87,196,.22)}
    .btn.danger{background:#fff;border-color:#efc1bd;color:var(--red)}
    .btn.danger:hover{background:var(--red-soft);border-color:#e59b95}
    .btn.small{min-height:34px;padding:6px 10px;font-size:12px}
    .btn.icon-only{width:38px;padding:0;display:grid;place-items:center;font-size:18px}

    .current-user{
      min-height:40px;
      padding:4px 5px 4px 10px;
      border-color:var(--border-strong);
      border-radius:9px;
      gap:4px;
    }
    .current-user label{font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.04em}
    .current-user select{font-size:12px;padding:4px 3px}

    .workspace-nav{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:16px;
      margin-bottom:14px;
      border-bottom:1px solid var(--border);
    }
    .tabs{margin:0;border:0;gap:2px}
    .tab{
      min-height:44px;
      padding:10px 13px;
      font-size:13px;
      border-bottom-width:2px;
    }
    .tab:hover{background:transparent;color:var(--text)}
    .view-context{padding:0 2px 12px;color:var(--muted);font-size:11px;white-space:nowrap}

    .notice{
      position:relative;
      padding:12px 14px;
      margin:0 0 14px;
      border-color:#e8b931;
      border-radius:var(--radius);
      box-shadow:0 1px 2px rgba(154,91,0,.06);
    }
    .notice-icon{
      width:28px;height:28px;display:grid;place-items:center;flex:0 0 auto;
      border-radius:50%;background:#ffdf86;color:#754400;font-weight:900;
    }
    .notice-copy{min-width:0;flex:1}
    .notice strong{font-size:13px}
    .notice-action{
      border:0;background:transparent;color:#754400;font-size:12px;font-weight:800;
      padding:5px 2px;white-space:nowrap;
    }

    .filters{
      padding:10px;
      margin-bottom:14px;
      border-radius:var(--radius);
      box-shadow:none;
      border-color:var(--border);
    }
    .search input,.filters select{height:40px;border-radius:8px;background:#fff}
    .filter-result{color:var(--muted);font-size:11px;font-weight:700;white-space:nowrap}
    .filter-clear{min-height:36px}

    .stats{
      display:grid;
      grid-template-columns:repeat(5,minmax(132px,1fr));
      gap:10px;
      margin-bottom:18px;
    }
    .stat{
      min-height:76px;
      padding:12px 13px;
      border-radius:var(--radius);
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      gap:5px;
      box-shadow:none;
      font-size:11px;
      font-weight:700;
    }
    .stat strong{font-size:21px;line-height:1;font-weight:820;letter-spacing:-.02em}
    .stat .stat-detail{font-size:10px;color:var(--muted);font-weight:650}
    .stat[data-tone="blue"]{background:#f5f9ff;border-color:#cfe0fa}
    .stat[data-tone="green"]{background:#f3fbf7;border-color:#cdebdc}
    .stat[data-tone="amber"]{background:#fffaf0;border-color:#f1dfb7}
    .stat[data-tone="red"]{background:#fff7f6;border-color:#efcfcc}

    .board{gap:14px;padding:1px 1px 12px}
    .column{
      min-height:420px;
      padding:9px;
      border:1px solid #e2e7ed;
      border-top:3px solid var(--column-color,#98a2b3);
      border-radius:var(--radius);
      background:#eef2f6;
    }
    .column[data-status="todo"]{--column-color:#98a2b3}
    .column[data-status="progress"]{--column-color:#3b82f6}
    .column[data-status="pending"]{--column-color:#e3a008}
    .column[data-status="done"]{--column-color:#2e9d68}
    .column-header{padding:5px 5px 11px}
    .column-title{color:#4b5565;font-size:11px}
    .count{background:#dce3eb;color:#475467}
    .task-list{gap:9px}
    .card{
      border-color:#dce2e9;
      border-radius:10px;
      padding:12px;
      box-shadow:0 1px 2px rgba(16,24,40,.06);
      transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
    }
    .card:hover{transform:translateY(-1px);border-color:#c8d1dc;box-shadow:0 7px 18px rgba(16,24,40,.09)}
    .card.problem{border-left:3px solid var(--red)}
    .card.overdue{box-shadow:inset 0 0 0 1px #efbbb7,0 1px 2px rgba(16,24,40,.06)}
    .card-key{margin-bottom:7px;gap:7px}
    .task-title{font-size:13px;line-height:1.42;margin-bottom:11px}
    .card-footer{gap:7px}
    .avatar{width:26px;height:26px}
    .date-chip{font-size:10px}
    .card-actions{opacity:0;margin-top:10px;padding-top:9px;transition:opacity .15s ease}
    .card:hover .card-actions,.card:focus-within .card-actions{opacity:1}
    .icon-btn{min-height:30px;padding:5px 8px;border:1px solid #e1e6ec;background:#f8fafc}

    .table-wrap,.timeline-shell{border-radius:var(--radius);box-shadow:none}
    .mobile-timeline{display:none}
    th{background:#f7f9fb;color:#5f6b7c}
    th,td{padding:11px 12px}
    tbody tr:last-child td{border-bottom:0}
    .timeline-toolbar{margin-bottom:10px}

    .backup-menu summary{min-height:40px;border-color:var(--border-strong);border-radius:9px;font-size:13px}
    .backup-pop{top:46px;width:190px;border-radius:10px;box-shadow:0 16px 36px rgba(16,24,40,.16)}
    .backup-pop button{min-height:38px}

    .modal-backdrop{
      background:rgba(15,23,42,.58);
      padding:20px;
      backdrop-filter:blur(3px);
    }
    .modal{
      display:flex;
      flex-direction:column;
      width:min(700px,100%);
      max-height:min(90vh,880px);
      overflow:hidden;
      border:1px solid rgba(255,255,255,.18);
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-lg);
    }
    .modal > form{display:flex;flex:1;min-height:0;flex-direction:column}
    .modal.small{width:min(500px,100%)}
    .modal.wide{width:min(940px,100%)}
    .modal-header{padding:17px 20px;flex:0 0 auto}
    .modal-title{font-size:18px;letter-spacing:-.01em}
    .modal-body{min-height:0;padding:20px;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
    .modal-footer{padding:13px 20px;flex:0 0 auto;position:static}
    .modal-footer .danger{margin-right:auto}
    .field{gap:7px;margin-bottom:13px}
    .field label{font-size:11px;color:#526074}
    .field input,.field select,.field textarea{min-height:42px;border-color:var(--border-strong);border-radius:8px;padding:9px 11px}
    .field textarea{min-height:104px}
    .form-grid{gap:0 14px}
    .subsection{margin-top:18px;padding-top:18px}
    .case-row,.note,.problem-item{border-radius:10px}
    .case-main{grid-template-columns:minmax(0,1fr) 120px 38px}
    .case-row input,.case-row select,.case-row textarea{min-height:38px}
    .remove-case{width:38px;height:38px}
    .note-compose textarea{min-height:74px;border-color:var(--border-strong)}

    .confirm-modal{width:min(440px,100%)}
    .confirm-content{display:flex;gap:14px;align-items:flex-start}
    .confirm-icon{
      width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
      flex:0 0 auto;background:var(--blue-soft);color:var(--blue);font-weight:900;font-size:18px;
    }
    .confirm-icon.danger{background:var(--red-soft);color:var(--red)}
    .confirm-icon.warning{background:var(--yellow-soft);color:var(--yellow)}
    .confirm-copy h2{margin:0 0 6px;font-size:17px;line-height:1.3}
    .confirm-copy p{margin:0;color:var(--muted);font-size:13px;white-space:pre-line;line-height:1.55}

    .toast-region{
      position:fixed;
      right:20px;
      bottom:20px;
      z-index:300;
      display:grid;
      gap:8px;
      width:min(380px,calc(100vw - 32px));
      pointer-events:none;
    }
    .toast{
      display:flex;align-items:flex-start;gap:10px;
      padding:12px 14px;border:1px solid var(--border-strong);border-radius:11px;
      background:#fff;color:var(--text);box-shadow:0 16px 36px rgba(16,24,40,.16);
      font-size:12px;font-weight:700;
      animation:toast-in .2s ease both;
    }
    .toast.error{border-color:#efaaa5;background:#fff8f7}
    .toast.success{border-color:#a9dbc4;background:#f7fdf9}
    @keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

    .auth-screen{
      min-height:100vh;
      min-height:100dvh;
      display:grid;
      place-items:center;
      padding:24px;
      background:
        radial-gradient(circle at 15% 10%,rgba(59,130,246,.16),transparent 34%),
        radial-gradient(circle at 85% 90%,rgba(123,74,179,.12),transparent 32%),
        #0f172a;
    }
    .auth-card{
      width:min(440px,100%);
      padding:28px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:20px;
      background:rgba(255,255,255,.98);
      box-shadow:0 30px 80px rgba(2,6,23,.36);
    }
    .auth-brand{display:flex;align-items:center;gap:11px;margin-bottom:24px;font-weight:850}
    .auth-card h1{font-size:25px;margin-bottom:8px}
    .auth-card > p{margin:0 0 22px;color:var(--muted);font-size:13px}
    .auth-card .btn{width:100%;min-height:44px}
    .google-auth-btn{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:11px;
      border-color:#cbd3df;
      background:#fff;
      color:#182230;
      font-size:14px;
      box-shadow:0 1px 2px rgba(16,24,40,.05);
    }
    .google-auth-btn:hover{border-color:#98a2b3;background:#f8fafc}
    .google-auth-btn:focus-visible{outline:3px solid rgba(59,130,246,.24);outline-offset:2px}
    .google-auth-btn:disabled{cursor:wait;opacity:.66}
    .google-auth-btn svg{width:20px;height:20px;flex:0 0 auto}
    .auth-message{min-height:20px;margin-top:13px;color:var(--muted);font-size:12px;line-height:1.5}
    .auth-message.error{color:var(--red)}
    .auth-message.success{color:var(--green)}
    .auth-account-note{margin:8px 0 0!important;font-size:11px!important;line-height:1.5}
    .auth-footnote{margin-top:20px!important;padding-top:16px;border-top:1px solid var(--border);font-size:11px!important}
    body.app-pending .app,body.app-pending .mobile-bar,body.app-pending .sidebar-scrim{display:none!important}
    body.app-ready .auth-screen{display:none}

    .sync-status{
      min-height:40px;
      display:inline-flex;
      align-items:center;
      gap:7px;
      padding:7px 10px;
      border:1px solid var(--border);
      border-radius:9px;
      background:#fff;
      color:var(--muted);
      font-size:11px;
      font-weight:750;
      white-space:nowrap;
    }
    .sync-dot{width:8px;height:8px;border-radius:50%;background:#98a2b3;box-shadow:0 0 0 3px #eef2f6}
    .sync-status[data-state="online"] .sync-dot{background:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
    .sync-status[data-state="saving"] .sync-dot{background:var(--yellow);box-shadow:0 0 0 3px var(--yellow-soft)}
    .sync-status[data-state="pending"]{border-color:#e7c56d;background:#fffaf0;color:#754400}
    .sync-status[data-state="pending"] .sync-dot{background:var(--yellow);box-shadow:0 0 0 3px var(--yellow-soft)}
    .sync-status[data-state="error"]{border-color:#e6aaa6;background:#fff8f7;color:#912d27}
    .sync-status[data-state="error"] .sync-dot{background:var(--red);box-shadow:0 0 0 3px var(--red-soft)}
    .sync-status[data-state="saving"] .sync-dot{animation:sync-pulse 1.4s ease-in-out infinite}
    @keyframes sync-pulse{50%{transform:scale(.78);opacity:.65}}

    .backup-pop .backup-recovery{
      margin-top:5px;
      padding-top:10px;
      border-top:1px solid var(--border);
      color:#754400;
    }

    .portfolio-link{
      display:flex;
      align-items:center;
      gap:9px;
      width:100%;
      min-height:42px;
      padding:9px 10px;
      border:0;
      border-radius:9px;
      background:transparent;
      color:#e5e7eb;
      font-weight:750;
      text-align:left;
    }
    .portfolio-link:hover,.portfolio-link.active{background:rgba(59,130,246,.18);color:#fff}
    .portfolio-link.active{box-shadow:inset 3px 0 0 #60a5fa}
    .portfolio-link span:first-child{width:20px;color:#93c5fd;text-align:center}
    .sidebar-create-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
    .sidebar-create-grid .sidebar-add{margin:0;text-align:center;justify-content:center}
    .company-group{display:grid;gap:3px;margin-bottom:9px}
    .company-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:6px;
      min-height:30px;
      padding:3px 5px 3px 10px;
      color:var(--sidebar-muted);
      font-size:10px;
      font-weight:850;
      letter-spacing:.045em;
      text-transform:uppercase;
    }
    .company-head span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .company-head button{
      width:28px;height:28px;border:0;border-radius:7px;background:transparent;color:var(--sidebar-muted);font-weight:900;
    }
    .company-head button:hover{background:rgba(255,255,255,.08);color:#fff}
    .stage-mini{
      flex:0 0 auto;
      max-width:74px;
      overflow:hidden;
      color:#aeb9c8;
      font-size:9px;
      font-weight:750;
      text-overflow:ellipsis;
      white-space:nowrap;
    }
    .sidebar-empty{padding:7px 10px;color:#7f8a9c;font-size:10px}

    .portfolio-toolbar{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:20px;
      margin:0 0 18px;
    }
    .portfolio-toolbar h2,.section-heading h2,.surface-head h2,.portfolio-company-head h2{margin:0;color:var(--text)}
    .portfolio-toolbar h2{font-size:18px}
    .portfolio-toolbar p,.section-heading p,.portfolio-company-head p{margin:5px 0 0;color:var(--muted);font-size:12px}
    .portfolio-actions{display:flex;gap:8px;flex:0 0 auto}
    .portfolio-groups{display:grid;gap:16px}
    .portfolio-company{
      padding:18px;
      border:1px solid var(--border);
      border-radius:var(--radius-lg);
      background:var(--surface);
      box-shadow:var(--shadow);
    }
    .portfolio-company-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
    .portfolio-company-head h2{font-size:16px}
    .portfolio-company-head p{max-width:680px}
    .portfolio-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
    .portfolio-card{
      position:relative;
      display:flex;
      flex-direction:column;
      min-width:0;
      min-height:198px;
      padding:14px;
      overflow:hidden;
      border:1px solid var(--border);
      border-radius:12px;
      background:#fff;
      color:var(--text);
      text-align:left;
      box-shadow:0 1px 1px rgba(16,24,40,.03);
      transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
    }
    .portfolio-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:#2e9d68}
    .portfolio-card.health-watch::before{background:#e3a008}
    .portfolio-card.health-risk::before{background:var(--red)}
    .portfolio-card.health-paused::before{background:#98a2b3}
    .portfolio-card:hover{transform:translateY(-2px);border-color:#bcc8d6;box-shadow:0 10px 22px rgba(16,24,40,.08)}
    .portfolio-card:focus-visible,.project-btn:focus-visible,.portfolio-link:focus-visible{
      outline:2px solid #60a5fa;
      outline-offset:2px;
      box-shadow:none;
    }
    .portfolio-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:13px}
    .portfolio-card > strong{font-size:15px;line-height:1.35}
    .portfolio-card > p{
      display:-webkit-box;
      min-height:38px;
      margin:7px 0 14px;
      overflow:hidden;
      color:var(--muted);
      font-size:12px;
      line-height:1.5;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:2;
    }
    .stage-badge,.health-badge{
      display:inline-flex;
      align-items:center;
      min-height:24px;
      padding:4px 8px;
      border-radius:999px;
      background:var(--blue-soft);
      color:var(--blue-2);
      font-size:9px;
      font-weight:850;
      letter-spacing:.02em;
    }
    .health-badge{background:var(--green-soft);color:var(--green)}
    .health-badge.watch{background:var(--yellow-soft);color:var(--yellow)}
    .health-badge.risk{background:var(--red-soft);color:var(--red)}
    .health-badge.paused{background:#eef2f6;color:#667085}
    .portfolio-meta{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:auto;color:#667085;font-size:10px;font-weight:700}
    .portfolio-next{
      margin-top:12px;
      padding-top:10px;
      overflow:hidden;
      border-top:1px solid #edf0f4;
      color:#445166;
      font-size:11px;
      font-weight:750;
      text-overflow:ellipsis;
      white-space:nowrap;
    }

    .portfolio-card > strong,.brief-block p,.use-case-card h3,.use-case-card > p,.activity-item strong,.problem-item{
      overflow-wrap:anywhere;
    }

    .section-nav{align-items:center;margin-bottom:18px;overflow-x:auto;scrollbar-width:thin}
    .section-nav .tabs{min-width:max-content}
    .fde-section{animation:section-in .18s ease both}
    @keyframes section-in{from{opacity:.45;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
    .section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:0 0 15px}
    .section-heading h2{font-size:18px}
    .section-heading p{max-width:650px}
    .surface{
      min-width:0;
      padding:17px;
      border:1px solid var(--border);
      border-radius:var(--radius);
      background:var(--surface);
      box-shadow:var(--shadow);
    }
    .surface-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
    .surface-head h2{font-size:15px}
    .overview-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:14px}
    .brief-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:-5px -5px 13px;background:var(--border)}
    .brief-list > div{display:grid;gap:3px;padding:10px;background:#fff}
    .brief-list span,.brief-block > span,.use-case-value span{color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.035em;text-transform:uppercase}
    .brief-list strong{font-size:12px}
    .brief-block{padding:11px 0;border-top:1px solid #edf0f4}
    .brief-block p{margin:4px 0 0;color:#344054;font-size:12px;line-height:1.6;white-space:pre-wrap}
    .activity-list{display:grid;gap:0;max-height:430px;overflow:auto}
    .activity-item{position:relative;display:grid;grid-template-columns:12px minmax(0,1fr);gap:9px;padding:10px 0}
    .activity-item:not(:last-child)::before{content:"";position:absolute;left:5px;top:22px;bottom:-8px;width:1px;background:#d9e0e8}
    .activity-dot{position:relative;z-index:1;width:11px;height:11px;margin-top:3px;border:3px solid var(--blue-soft);border-radius:50%;background:var(--blue)}
    .activity-item strong{display:block;font-size:11px;line-height:1.45}
    .activity-item span{display:block;margin-top:3px;color:var(--muted);font-size:9px}

    .discovery-grid{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr);gap:14px;align-items:start}
    .chip-list{display:flex;flex-wrap:wrap;gap:6px;padding-top:11px;border-top:1px solid #edf0f4}
    .info-chip{padding:5px 8px;border:1px solid #cfe0fa;border-radius:999px;background:#f5f9ff;color:#295e9c;font-size:10px;font-weight:750}
    .use-case-list{display:grid;gap:9px}
    .use-case-card{padding:14px;border:1px solid var(--border);border-radius:11px;background:#fff}
    .use-case-head{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px}
    .use-case-card h3{margin:11px 0 5px;font-size:14px}
    .use-case-card > p{margin:0;color:#526074;font-size:12px;line-height:1.55}
    .use-case-value{display:grid;gap:3px;margin-top:11px;padding:9px;border-radius:8px;background:var(--surface-2);font-size:11px}
    .use-case-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;color:var(--muted);font-size:10px}
    .use-case-footer > div{display:flex;gap:6px}

    .launch-grid{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:14px;align-items:start}
    .readiness{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #efd18e;border-radius:10px;background:#fffaf0}
    .readiness > span{display:grid;place-items:center;flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:var(--yellow-soft);color:var(--yellow);font-weight:900}
    .readiness.ready{border-color:#a9dbc4;background:#f4fbf7}
    .readiness.ready > span{background:var(--green-soft);color:var(--green)}
    .readiness strong{display:block;font-size:13px}
    .readiness p{margin:4px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
    .readiness-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
    .readiness-metrics > div{display:grid;gap:2px;padding:9px;border:1px solid #e3e8ee;border-radius:8px;background:#fafbfc;text-align:center}
    .readiness-metrics strong{font-size:16px}
    .readiness-metrics span{color:var(--muted);font-size:9px;font-weight:750}
    .checklist-item{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:44px;padding:8px 5px;border-top:1px solid #edf0f4;font-size:11px}
    .checklist-item:first-child{border-top:0}
    .checklist-item input{width:18px;height:18px;accent-color:var(--blue)}
    .checklist-item em{color:var(--muted);font-size:9px;font-style:normal;font-weight:750}
    .impact-form{max-width:980px}
    .impact-form > p{margin:0 0 16px;color:var(--muted);font-size:12px}
    .inline-form-actions{display:flex;justify-content:flex-end;padding-top:4px}

    .empty{padding:20px;border:1px dashed var(--border-strong);border-radius:10px;background:var(--surface-2);color:var(--muted);font-size:11px;text-align:center}

    @media(max-width:1180px){
      .topbar{align-items:flex-start}
      .top-actions{max-width:520px;flex-wrap:wrap}
      .stats{grid-template-columns:repeat(3,minmax(140px,1fr))}
      .portfolio-projects{grid-template-columns:repeat(2,minmax(0,1fr))}
      .overview-grid,.discovery-grid,.launch-grid{grid-template-columns:1fr}
      .card-actions{opacity:1}
    }

    @media(max-width:960px){
      body{
        --mobile-bar-height:calc(58px + env(safe-area-inset-top));
        padding-top:var(--mobile-bar-height);
      }
      body.app-pending{padding-top:0}
      body.sidebar-open{overflow:hidden}
      .mobile-bar{
        display:flex;
        position:fixed;
        inset:0 0 auto 0;
        height:var(--mobile-bar-height);
        z-index:90;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        padding:calc(8px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));
        background:#111827;
        color:#fff;
        border-bottom:1px solid rgba(255,255,255,.08);
      }
      .mobile-bar button{
        width:44px;height:44px;border:0;border-radius:9px;background:rgba(255,255,255,.09);color:#fff;font-size:19px;
      }
      .mobile-brand{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px}
      .mobile-brand .brand-icon{width:30px;height:30px;border-radius:8px;font-size:12px}
      .sidebar-scrim{
        display:block;
        position:fixed;
        inset:var(--mobile-bar-height) 0 0 0;
        z-index:94;
        background:rgba(15,23,42,.48);
        opacity:0;
        visibility:hidden;
        transition:.2s ease;
      }
      .sidebar{
        position:fixed;
        inset:var(--mobile-bar-height) auto 0 0;
        z-index:95;
        width:min(300px,86vw);
        height:auto;
        transform:translateX(-102%);
        transition:transform .22s ease;
        box-shadow:18px 0 40px rgba(15,23,42,.24);
        padding-bottom:calc(16px + env(safe-area-inset-bottom));
      }
      body.sidebar-open .sidebar{transform:translateX(0)}
      body.sidebar-open .sidebar-scrim{opacity:1;visibility:visible}
      .sidebar-close{
        display:grid;
        place-items:center;
        margin-left:auto;
        width:44px;height:44px;border:0;border-radius:8px;background:rgba(255,255,255,.08);color:#fff;font-size:17px;
      }
      .app{display:block}
      .project-list{grid-template-columns:1fr}
      .project-settings{display:block}
      .main{padding:20px max(16px,env(safe-area-inset-right)) calc(34px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
      .topbar{display:block;margin-bottom:18px}
      .top-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:none;margin-top:16px}
      .top-actions .current-user{grid-column:1/-1;justify-content:space-between}
      .top-actions .btn,.top-actions .backup-menu,.top-actions .backup-menu summary,.sync-status{width:100%}
      #editProjectBtn,#createTaskBtn{display:none!important}
      .current-user select{font-size:16px}
      .filters select,.search input,.field input,.field select,.field textarea{font-size:16px}
      .sync-status{justify-content:center;min-width:0}
      .workspace-nav{align-items:center}
      .section-nav{
        position:sticky;
        top:var(--mobile-bar-height);
        z-index:40;
        margin-right:-16px;
        margin-left:-16px;
        padding:8px 16px;
        border-bottom:1px solid var(--border);
        background:rgba(246,248,251,.96);
        backdrop-filter:blur(10px);
      }
      .tabs{scroll-snap-type:x proximity}
      .tab{scroll-snap-align:center}
      .portfolio-toolbar,.portfolio-company-head,.section-heading{align-items:stretch;flex-direction:column}
      .portfolio-actions{width:100%}
      .portfolio-actions .btn{flex:1}
      .portfolio-projects{grid-template-columns:1fr}
      .portfolio-company{padding:14px}
      .view-context{display:none}
      .filters{align-items:stretch}
      .search{flex-basis:100%}
      .filters select{flex:1 1 30%;min-width:0}
      .filter-result{align-self:center;margin-left:2px}
      .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
      .stat:last-child{grid-column:1/-1}
      .form-grid{grid-template-columns:1fr}
      .field.full{grid-column:auto}
      .modal-backdrop{padding:0;place-items:end center}
      .modal,.modal.small,.modal.wide{
        width:100%;
        max-height:calc(92dvh - env(safe-area-inset-top));
        border-radius:16px 16px 0 0;
        border-bottom:0;
      }
      .confirm-modal{width:100%}
      .case-detail-grid{grid-template-columns:1fr}
      .modal-footer{padding-bottom:calc(13px + env(safe-area-inset-bottom))}
      .toast-region{right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));left:max(16px,env(safe-area-inset-left));width:auto}
      .project-settings,.company-head button,.remove-case,.icon-btn{min-width:44px;min-height:44px}
      .project-settings,.remove-case{width:44px;height:44px}
      .card-actions{opacity:1}
      .card-key,.type-badge,.priority,.date-chip,.stage-mini,.brief-list span,.brief-block > span,.use-case-value span,.activity-item span,.readiness-metrics span{font-size:11px}

      .table-wrap{overflow:visible;border:0;background:transparent}
      .table-wrap table,.table-wrap tbody{display:block;min-width:0}
      .table-wrap thead{display:none}
      .table-wrap tr{
        display:grid;
        gap:0;
        margin-bottom:10px;
        padding:10px 13px;
        border:1px solid var(--border);
        border-radius:var(--radius);
        background:#fff;
        box-shadow:var(--shadow);
      }
      .table-wrap td{
        display:grid;
        grid-template-columns:minmax(92px,.42fr) minmax(0,1fr);
        gap:10px;
        align-items:center;
        min-height:38px;
        padding:7px 0;
        border:0;
        border-top:1px solid #edf0f4;
        overflow-wrap:anywhere;
      }
      .table-wrap td:first-child{border-top:0}
      .table-wrap td::before{
        content:attr(data-label);
        color:var(--muted);
        font-size:11px;
        font-weight:800;
      }
      .table-wrap td:last-child{grid-template-columns:1fr;padding-top:10px}
      .table-wrap td:last-child::before{display:none}
      .table-wrap td:last-child .btn{width:100%;min-height:44px}
      .table-wrap .table-empty-row{display:block}
      .table-wrap .table-empty-row td{display:block;border:0;text-align:center}
      .table-wrap .table-empty-row td::before{display:none}

      .timeline-shell{display:none}
      .mobile-timeline{display:grid;gap:10px}
      .mobile-timeline-card{
        display:grid;
        gap:9px;
        width:100%;
        min-height:44px;
        padding:13px;
        border:1px solid var(--border);
        border-left:3px solid var(--blue);
        border-radius:var(--radius);
        background:#fff;
        color:var(--text);
        text-align:left;
        box-shadow:var(--shadow);
      }
      .mobile-timeline-card.problem{border-left-color:var(--red)}
      .mobile-timeline-card.done{border-left-color:var(--green)}
      .mobile-timeline-card strong{font-size:13px;line-height:1.45;overflow-wrap:anywhere}
      .mobile-timeline-meta,.mobile-timeline-dates{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px}
      .mobile-timeline-dates{padding-top:8px;border-top:1px solid #edf0f4;font-weight:750}
    }

    @media(max-width:520px){
      .top-actions{grid-template-columns:1fr 1fr}
      .btn,.project-btn,.sidebar-add,.filters select,.search input{min-height:44px}
      .top-actions .btn,.backup-menu,.backup-menu summary{width:100%}
      .top-actions .primary{grid-column:1/-1;grid-row:1}
      .workspace-nav{overflow:auto}
      .tabs{min-width:max-content}
      .sidebar-create-grid{grid-template-columns:1fr 1fr}
      .brief-list{grid-template-columns:1fr}
      .use-case-footer{align-items:flex-start;flex-direction:column}
      .use-case-footer > div{width:100%}
      .use-case-footer .btn{flex:1}
      .readiness-metrics{grid-template-columns:repeat(2,1fr)}
      .impact-form .inline-form-actions .btn{width:100%}
      .toast{overflow-wrap:anywhere}
      .filters select{flex-basis:calc(50% - 4px)}
      .filter-clear{margin-left:auto}
      .stats{gap:8px}
      .stat{min-height:70px;padding:11px}
      .board{
        grid-template-columns:repeat(4,84vw);
        scroll-padding-inline:1px;
        scroll-snap-type:x mandatory;
        overscroll-behavior-inline:contain;
        -webkit-overflow-scrolling:touch;
      }
      .column{scroll-snap-align:start}
      .column{min-height:360px}
      .modal-header,.modal-body,.modal-footer{padding-left:16px;padding-right:16px}
      .modal-footer{display:grid;grid-template-columns:1fr 1fr}
      .modal-footer .danger{grid-column:1/-1;grid-row:2;width:100%}
      .modal-footer .primary{grid-column:2}
      .confirm-modal .modal-footer{display:flex}
      .confirm-modal .modal-footer .btn{flex:1}
      .confirm-modal .modal-footer .btn.hidden + .btn{flex:0 0 50%;margin-left:auto}
      .case-main{grid-template-columns:minmax(0,1fr) 104px 44px}
      .note-compose{grid-template-columns:1fr}
      .note-compose .btn{justify-self:end}
    }

    @media(prefers-reduced-motion:reduce){
      *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}
    }