@media(min-width:1600px) {
  :root {
    --sidebar:260px;
  }
  .stats-grid {
    grid-template-columns:repeat(6,minmax(0,1fr));
  }
  .four-stats {
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .stat-card {
    padding:18px;
  }
  .stat-card>strong {
    font-size:1.85rem;
  }
  .dashboard-grid {
    grid-template-columns:minmax(0,1.7fr) minmax(330px,1fr);
  }
  main {
    padding:45px 48px;
  }
}

@media(max-width:1200px) {
  :root {
    --sidebar:215px;
  }
  .sidebar {
    padding:25px 14px 18px;
  }
  .brand {
    font-size:1.08rem;
  }
  .topbar {
    padding:0 25px;
  }
  main {
    padding:30px 25px;
  }
  .dashboard-grid {
    grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);
    gap:18px;
  }
  .panel {
    padding:20px;
  }
  .project-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .client-strip {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .kanban {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .four-stats {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .stat-card>strong {
    font-size:1.8rem;
  }
  .stat-card {
    padding:18px;
  }
  .page-heading h1 {
    font-size:2rem;
  }
  .global-search {
    width:40%;
  }
  .recent-projects {
    grid-column:1/-1;
  }
  .auth-layout {
    gap:7%;
    padding:0 20px;
  }
  .auth-intro h1 {
    font-size:3.6rem;
  }
}

@media(max-width:950px) {
  .sidebar {
    transform:translateX(-100%);
    transition:transform .2s;
    width:240px;
  }
  .sidebar.open {
    transform:translateX(0);
  }
  .main-column {
    margin:0;
    width:100%;
  }
  .mobile-only {
    display:inline-flex;
  }
  .sidebar-scrim {
    position:fixed;
    inset:0;
    background:#0006;
    z-index:25;
  }
  .topbar {
    height:72px;
  }
  .page-heading {
    gap:15px;
  }
  .page-heading h1 {
    font-size:2.1rem;
  }
  .auth-intro h1 {
    font-size:3.4rem;
  }
  .breadcrumb {
    display:none;
  }
  .global-search {
    margin-left:0;
    width:100%;
    max-width:none;
  }
  .topbar #refresh-data {
    margin-left:auto;
  }
  .auth-view .topbar #theme-toggle {
    margin-left:auto;
  }
  .auth-layout {
    padding:0;
    margin:30px auto;
    gap:6%;
  }
  .auth-card {
    padding:28px;
  }
  .auth-intro>p {
    font-size:1rem;
  }
}

@media(max-width:700px) {
  main {
    padding:28px 20px;
  }
  .topbar {
    padding:0 20px;
    gap:10px;
  }
  .page-heading {
    align-items:flex-start;
    flex-direction:column;
    margin-bottom:25px;
  }
  .page-heading h1 {
    font-size:2rem;
  }
  .page-heading p {
    font-size:.86rem;
  }
  .stats-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .stat-card {
    padding:16px;
  }
  .stat-card>strong {
    font-size:1.7rem;
  }
  .stat-card>div {
    font-size:.7rem;
  }
  .stat-card>p {
    font-size:.63rem;
  }
  .stat-symbol {
    width:24px;
    height:24px;
  }
  .dashboard-grid {
    grid-template-columns:1fr;
  }
  .recent-projects {
    grid-column:auto;
  }
  .recent-clients {
    grid-column:auto;
  }
  .project-grid {
    gap:15px;
  }
  .project-card {
    padding:18px;
  }
  .project-card h2 {
    font-size:1.05rem;
  }
  .project-card footer {
    flex-direction:column;
    gap:7px;
  }
  .project-facts {
    grid-template-columns:repeat(2,1fr);
  }
  .auth-layout {
    grid-template-columns:1fr;
    gap:28px;
    max-width:480px;
    margin:20px auto;
  }
  .auth-intro h1 {
    font-size:3.2rem;
  }
  .auth-art {
    display:none;
  }
  .auth-intro>p {
    max-width:none;
    margin:15px 0 0;
  }
  .toolbar {
    gap:12px;
  }
  .toolbar .search-field {
    min-width:100%;
    max-width:none;
  }
  .toolbar select {
    max-width:260px;
  }
  .workspace-footer {
    padding:18px 20px;
  }
  .linked-row {
    gap:15px;
    font-size:.8rem;
  }
  .linked-row>span {
    font-size:.75rem;
  }
  .invoice-parties {
    grid-template-columns:1fr 1fr;
  }
  .invoice-parties>section:last-child {
    grid-column:1/-1;
  }
  .invoice-line,.line-head {
    grid-template-columns:minmax(0,1fr) 50px 80px 75px 24px;
    gap:6px;
  }
  .invoice-line .icon-button {
    width:24px;
    height:24px;
  }
  .invoice-line input {
    font-size:.74rem;
    padding:8px 6px;
  }
  .line-total {
    font-size:.72rem;
  }
  .detail-list {
    gap:15px;
  }
  .task-row {
    gap:8px;
    flex-wrap:wrap;
  }
  .task-row>div {
    min-width:55%;
  }
  .task-row .badge {
    font-size:.6rem;
  }
  .search-group .linked-row {
    align-items:flex-start;
    flex-direction:column;
    gap:4px;
  }
}

@media(max-width:480px) {
  .topbar {
    padding:0 15px;
    gap:8px;
  }
  .global-search {
    padding:0 8px;
    gap:6px;
  }
  .global-search input {
    font-size:.72rem;
  }
  .global-search>span {
    font-size:1.1rem;
  }
  .search-submit {
    display:none;
  }
  .topbar .icon-button {
    width:28px;
    height:30px;
  }
  main {
    padding:25px 16px;
  }
  .page-heading h1 {
    font-size:1.8rem;
  }
  .page-heading .eyebrow {
    font-size:.58rem;
  }
  .panel {
    padding:18px;
  }
  .section-heading h2 {
    font-size:1rem;
  }
  .section-heading .text-button {
    font-size:.7rem;
  }
  .stats-grid {
    gap:10px;
  }
  .stat-card {
    padding:14px;
  }
  .stat-card>strong {
    font-size:1.6rem;
  }
  .stat-card>div>span:first-child {
    max-width:100px;
  }
  .stat-symbol {
    display:none;
  }
  .project-grid {
    grid-template-columns:1fr;
  }
  .project-card footer {
    flex-direction:row;
  }
  .client-strip {
    grid-template-columns:1fr;
    gap:18px;
  }
  .kanban {
    grid-template-columns:1fr;
  }
  .kanban-column {
    min-height:180px;
  }
  .task-stack {
    min-height:110px;
  }
  .form-grid {
    grid-template-columns:1fr;
    gap:16px;
  }
  .full-width {
    grid-column:auto;
  }
  dialog {
    padding:20px;
    max-height:92vh;
  }
  .modal-head h2 {
    font-size:1.3rem;
  }
  .invoice-line {
    grid-template-columns:1fr 1fr 1fr 28px;
    padding:15px 0;
    border-bottom:1px solid var(--border);
  }
  .invoice-line>label:first-child {
    grid-column:1/-1;
  }
  .line-head {
    display:none;
  }
  .invoice-line>label:first-child:before {
    content:'Description';
    font-size:.7rem;
    color:var(--muted);
  }
  .invoice-line>label:nth-child(2):before {
    content:'Quantity';
    font-size:.7rem;
    color:var(--muted);
  }
  .invoice-line>label:nth-child(3):before {
    content:'Rate (USD)';
    font-size:.7rem;
    color:var(--muted);
  }
  .line-total {
    align-self:end;
    padding-bottom:8px;
  }
  .invoice-line .icon-button {
    align-self:end;
    margin-bottom:6px;
  }
  .invoice-document {
    padding:10px 0;
  }
  .invoice-brand span {
    display:block;
    margin:6px 0;
  }
  .invoice-parties {
    gap:16px;
  }
  .invoice-parties p {
    font-size:.72rem;
  }
  .invoice-document table {
    font-size:.74rem;
  }
  .invoice-document td,.invoice-document th {
    padding:10px 5px;
  }
  .auth-card {
    padding:24px;
  }
  .auth-intro h1 {
    font-size:2.8rem;
  }
  .auth-view .topbar:before {
    font-size:1.2rem;
  }
  .earnings-chart {
    gap:6px;
  }
  .bars {
    gap:6px;
  }
  .chart-scale {
    min-width:38px;
  }
  .bar-value {
    font-size:.53rem;
  }
  .workspace-footer {
    padding:18px 16px;
    font-size:.62rem;
  }
  .task-row>.badge {
    margin-left:auto;
  }
  .dashboard-skeleton {
    grid-template-columns:1fr 1fr;
  }
  .detail-list {
    grid-template-columns:1fr;
  }
  .linked-row>div:last-child {
    font-size:.7rem;
  }
  .linked-row strong {
    overflow-wrap:anywhere;
  }
  .person-cell strong {
    font-size:.8rem;
  }
}