.login-page.svelte-1p1cuay {
    box-sizing: border-box;
    min-height: 100vh;
    display: flex;
    /* Top-anchored so Login/Register/messages never move the card, but placed
       where a ~38rem-tall card would sit if it were vertically centred - it
       looks centred at any window height without inheriting the height jump. */
    align-items: flex-start;
    justify-content: center;
    padding: 1.5rem;
    background-color: var(--bg-page);
  }

  .login-card.svelte-1p1cuay {
    width: 100%;
    max-width: 380px;
    background-color: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 2rem 2rem 2.25rem;
    margin-top: max(0.5rem, calc((100vh - 3rem - 38rem) / 2));
    text-align: center;
  }

  .logo.svelte-1p1cuay {
    width: 64px;
    height: 64px;
    object-fit: contain;
    margin-bottom: 0.75rem;
  }

  .title.svelte-1p1cuay {
    font-family: var(--font-brand);
    font-size: 1.75rem;
    margin: 0;
    color: var(--text-primary);
  }

  .subtitle.svelte-1p1cuay {
    margin: 0.35rem 0 1.5rem;
    font-size: 0.9rem;
    color: var(--text-muted);
  }

  .closed-note.svelte-1p1cuay {
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    color: var(--text-muted);
    font-size: 0.84rem;
    padding: 0.5rem 0.75rem;
    margin: -0.5rem 0 1rem;
  }

  .reset-note.svelte-1p1cuay {
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    color: var(--text-muted);
    font-size: 0.84rem;
    padding: 0.6rem 0.8rem;
    margin: 0 0 1.25rem;
    text-align: left;
  }

  .link.svelte-1p1cuay {
    margin-top: 1rem;
    background: none;
    border: none;
    color: var(--accent);
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
    text-decoration: underline;
  }

  .link.svelte-1p1cuay:hover {
    color: var(--accent-hover);
  }

  .sso.svelte-1p1cuay {
    width: 100%;
    background-color: var(--bg-card);
    color: var(--text-primary);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-sm);
    padding: 0.65rem;
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease;
  }

  .sso.svelte-1p1cuay:hover {
    background-color: var(--bg-hover);
  }

  .divider.svelte-1p1cuay {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1rem 0 0.25rem;
    color: var(--text-faint);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }

  .divider.svelte-1p1cuay::before,
  .divider.svelte-1p1cuay::after {
    content: '';
    flex: 1;
    border-top: 1px solid var(--border-default);
  }

  .tabs.svelte-1p1cuay {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.35rem;
    background-color: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.25rem;
    margin-bottom: 1.5rem;
  }

  .tab.svelte-1p1cuay {
    border: none;
    background: transparent;
    color: var(--text-muted);
    border-radius: var(--radius-pill);
    padding: 0.45rem 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
  }

  .tab.svelte-1p1cuay:hover {
    color: var(--text-primary);
  }

  .tab.active.svelte-1p1cuay {
    background-color: var(--bg-card);
    color: var(--text-primary);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  }

  form.svelte-1p1cuay {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: left;
  }

  .field.svelte-1p1cuay {
    display: block;
  }

  .field.svelte-1p1cuay span:where(.svelte-1p1cuay) {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.35rem;
  }

  .field.svelte-1p1cuay input:where(.svelte-1p1cuay) {
    width: 100%;
    background-color: var(--bg-inset);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    padding: 0.65rem 0.75rem;
    font-size: 0.95rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }

  .field.svelte-1p1cuay input:where(.svelte-1p1cuay)::placeholder {
    color: var(--text-faint);
  }

  .field.svelte-1p1cuay input:where(.svelte-1p1cuay):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .remember.svelte-1p1cuay {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--text-secondary);
    cursor: pointer;
  }

  .remember.svelte-1p1cuay input:where(.svelte-1p1cuay) {
    accent-color: var(--accent);
  }

  .message.svelte-1p1cuay {
    font-size: 0.85rem;
    border-radius: var(--radius-sm);
    padding: 0.55rem 0.75rem;
    margin: 0;
  }

  .message.error.svelte-1p1cuay {
    color: var(--danger);
    background-color: var(--danger-soft);
  }

  .message.success.svelte-1p1cuay {
    color: var(--success);
    background-color: var(--success-soft);
  }

  .submit.svelte-1p1cuay {
    margin-top: 0.25rem;
    background-color: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.7rem;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease;
  }

  .submit.svelte-1p1cuay:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }

  .submit.svelte-1p1cuay:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }


  .dash-button.svelte-lo8vpp {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    padding: 1.5rem;
    margin: 0.75rem;
    border-radius: 16px;
    background-color: var(--bg-card);
    color: var(--text-primary);
    border: none;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
    cursor: pointer;
    overflow: hidden;
    transform: translateY(0);
  }

  .dash-button.svelte-lo8vpp:hover {
    background-color: var(--bg-hover);
    transform: translateY(-5px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.25);
  }

  .dash-button.svelte-lo8vpp:active {
    transform: translateY(-2px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  }

  .button-icon.svelte-lo8vpp {
    width: 40px;
    height: 40px;
    margin-bottom: 12px;
    filter: var(--icon-filter);
    transition: transform 0.2s ease;
  }

  .dash-button.svelte-lo8vpp:hover .button-icon:where(.svelte-lo8vpp) {
    transform: scale(1.1);
  }

  .button-title.svelte-lo8vpp {
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
  }

  .admin-button.svelte-lo8vpp {
    background-color: var(--accent-soft);
    border-left: 3px solid var(--accent);
  }

  .admin-button.svelte-lo8vpp:hover {
    background-color: var(--accent-soft);
  }

  /* Button pressed effect with pseudo-element */
  .dash-button.svelte-lo8vpp::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--border-default);
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
  }

  .dash-button.svelte-lo8vpp:active::after {
    opacity: 1;
  }


  .dashboard-section.svelte-1pdvwp6 {
    margin-bottom: 2.5rem;
  }

  .button-grid.svelte-1pdvwp6 {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: flex-start;
  }

  .admin-section.svelte-1pdvwp6 {
    background-color: var(--accent-soft);
    padding: 1.5rem;
    border-radius: 12px;
    border-left: 4px solid var(--accent);
  }

  @media (max-width: 768px) {
    .button-grid.svelte-1pdvwp6 {
      justify-content: center;
    }
  }


  /*
  
  .clear-button img,
  .add-button img {
    width: 26px;
    height: 26px;
  }
  */

  .search-bar.svelte-xbhs48 {
    display: flex;
    align-items: center;
    margin-bottom: 2rem;
    background-color: var(--bg-raised);
    border-radius: 4px;
    overflow: hidden;
  }

  .icon.svelte-xbhs48 {
    width: 24px;
    height: 24px;
    margin: 16px 1rem;
  }

  .white-svg.svelte-xbhs48 {
    filter: var(--icon-filter);
  }

  .search-input.svelte-xbhs48 {
    flex-grow: 1;
    background-color: transparent;
    border: none;
    color: var(--text-primary);
    padding: 0.75rem 1rem;
    font-size: 1rem;
    height: 52px;
    margin: 0 3px 0 0;
  }

  .search-input.svelte-xbhs48::placeholder {
    color: var(--text-faint);
  }

  .icon-button.svelte-xbhs48 {
    width: 56px;
    height: 56px;
    cursor: pointer;
    padding: 13px;
    border: none;
    margin: 0;
  }

  .clear-button.svelte-xbhs48 {
    background: var(--text-primary);
  }

  .add-button.svelte-xbhs48 {
    background-color: var(--accent);
  }

  .filter-dropdown.svelte-xbhs48 {
    background-color: var(--bg-hover);
    color: var(--text-primary);
    border: none;
    height: 56px;
    font-size: 16px;
    padding: 0 16px;
    margin: 0;
  }

  .filter-dropdown.svelte-xbhs48:focus {
    outline: none;
    background-color: var(--bg-inset);
  }


  .no-projects.svelte-e958xh {
    color: var(--text-muted);
    font-style: italic;
  }

  .project-grid.svelte-e958xh {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1rem;
  }

  .project-item.svelte-e958xh {
    position: relative;
    display: flex;
    background-color: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    transition: transform 0.15s ease, box-shadow 0.15s ease,
                border-color 0.15s ease;
  }

  .project-item.svelte-e958xh:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
    border-color: var(--border-strong);
  }

  .project-button.svelte-e958xh {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    /* Right padding leaves room for the delete button on owned projects. */
    padding: 1.1rem 3.2rem 1.1rem 1.2rem;
    color: inherit;
    font: inherit;
  }

  .project-button.svelte-e958xh h3:where(.svelte-e958xh) {
    margin: 0;
    color: var(--text-primary);
    font-size: 1.05rem;
    overflow-wrap: anywhere;
  }

  .project-button.svelte-e958xh p:where(.svelte-e958xh) {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.9rem;
    line-height: 1.45;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
  }

  .delete-button.svelte-e958xh {
    position: absolute;
    top: 0.55rem;
    right: 0.55rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.15s ease, background 0.15s ease;
  }

  .delete-button.svelte-e958xh:hover {
    opacity: 1;
    background: var(--danger-soft);
  }

  .delete-button.svelte-e958xh img:where(.svelte-e958xh) {
    width: 20px;
    height: 20px;
    filter: var(--icon-filter);
  }


  .popup-overlay.svelte-19txp87 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
  }

  .popup-content.svelte-19txp87 {
    background-color: var(--bg-hover);
    padding: 2rem;
    border-radius: 8px;
    width: 80%;
    max-width: 600px;
    max-height: 80vh;
    overflow-y: auto;
  }


  .hint.svelte-1mgr6hd {
    color: var(--text-muted);
    font-size: 0.85rem;
    margin: 0.5rem 0 1rem;
  }

  .form-field.svelte-1mgr6hd {
    display: block;
    margin-bottom: 0.9rem;
  }

  .form-field.svelte-1mgr6hd span:where(.svelte-1mgr6hd) {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.35rem;
  }

  .form-field.svelte-1mgr6hd em:where(.svelte-1mgr6hd) {
    color: var(--danger);
    font-weight: normal;
  }

  .form-field.svelte-1mgr6hd input:where(.svelte-1mgr6hd),
  .form-field.svelte-1mgr6hd textarea:where(.svelte-1mgr6hd) {
    width: 100%;
    background-color: var(--bg-inset);
    border: 1px solid var(--border-strong);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.75rem;
    font-size: 0.95rem;
    box-sizing: border-box;
    font-family: inherit;
    resize: none;
  }

  .form-field.svelte-1mgr6hd input:where(.svelte-1mgr6hd):focus,
  .form-field.svelte-1mgr6hd textarea:where(.svelte-1mgr6hd):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .form-field.svelte-1mgr6hd input:where(.svelte-1mgr6hd)::placeholder,
  .form-field.svelte-1mgr6hd textarea:where(.svelte-1mgr6hd)::placeholder {
    color: var(--text-faint);
  }

  .field-help.svelte-1mgr6hd {
    color: var(--text-faint);
    font-size: 0.78rem;
    margin: 0.2rem 0 0;
  }

  .form-error.svelte-1mgr6hd {
    color: var(--danger);
    background: var(--danger-soft);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    margin: 0.5rem 0 0;
  }

  .button-group.svelte-1mgr6hd {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.25rem;
  }

  .button.svelte-1mgr6hd {
    padding: 0.55rem 1.1rem;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: inherit;
  }

  .button-primary.svelte-1mgr6hd {
    background-color: var(--accent);
    color: var(--accent-text);
  }

  .button-primary.svelte-1mgr6hd:hover {
    background-color: var(--accent-hover);
  }

  .button-secondary.svelte-1mgr6hd {
    background-color: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
  }

  .button-secondary.svelte-1mgr6hd:hover {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }


  h2.svelte-181zyrs {
    margin-top: 0;
  }

  .dialog-text.svelte-181zyrs {
    margin: 0 0 0.75rem;
    color: var(--text-secondary);
    font-size: 0.9rem;
    line-height: 1.5;
  }

  .dialog-text.svelte-181zyrs code:where(.svelte-181zyrs) {
    font-family: var(--font-mono);
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.1rem 0.4rem;
    user-select: all;
  }

  .confirm-input.svelte-181zyrs {
    width: 100%;
    box-sizing: border-box;
    background: var(--bg-inset);
    border: 1px solid var(--border-strong);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.55rem 0.75rem;
    font-family: var(--font-mono);
    font-size: 0.95rem;
  }

  .confirm-input.svelte-181zyrs:focus {
    outline: none;
    border-color: var(--danger);
    box-shadow: 0 0 0 3px var(--danger-soft);
  }

  .delete-error.svelte-181zyrs {
    margin: 0.6rem 0 0;
    color: var(--danger);
    font-size: 0.85rem;
  }

  .button-group.svelte-181zyrs {
    display: flex;
    justify-content: flex-end;
    gap: 0.6rem;
    margin-top: 1.25rem;
  }

  .btn-secondary.svelte-181zyrs {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.88rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-181zyrs:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-danger.svelte-181zyrs {
    background: var(--danger);
    border: 1px solid var(--danger);
    color: #fff;
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-danger.svelte-181zyrs:hover:not(:disabled) {
    filter: brightness(1.08);
  }

  .btn-danger.svelte-181zyrs:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }


  .page-desc.svelte-42m8e9 {
    color: var(--text-muted);
    margin-top: 0;
  }

  .board-tools.svelte-42m8e9 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
  }

  .board-tools.svelte-42m8e9 .search-bar {
    flex: 1;
    margin-bottom: 0;
  }

  .new-project-btn.svelte-42m8e9 {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--accent);
    color: var(--accent-text);
    border: 1px solid var(--accent);
    border-radius: var(--radius-md);
    padding: 0.65rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: var(--shadow);
    transition: background 0.15s ease, transform 0.1s ease;
  }

  .new-project-btn.svelte-42m8e9:hover {
    background: var(--accent-hover);
    transform: translateY(-1px);
  }

  .new-project-btn.svelte-42m8e9 .btn-icon:where(.svelte-42m8e9) {
    width: 18px;
    height: 18px;
    filter: var(--icon-filter);
  }


  .project-head.svelte-1yndb1e {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .project-desc.svelte-1yndb1e {
    color: var(--text-muted);
    margin: 0;
  }

  .project-meta.svelte-1yndb1e {
    color: var(--text-faint);
    font-size: 0.85rem;
    margin-top: 0.5rem;
  }

  .owner-name.svelte-1yndb1e {
    color: var(--text-secondary);
  }

  .head-actions.svelte-1yndb1e {
    display: flex;
    gap: 0.6rem;
  }

  .muted.svelte-1yndb1e {
    color: var(--text-muted);
  }

  .error-text.svelte-1yndb1e {
    color: var(--danger);
    font-size: 0.85rem;
    margin-top: 0.4rem;
  }

  .confirm-delete.svelte-1yndb1e {
    margin: 1rem 0 0;
    background: var(--bg-inset);
    border: 1px solid var(--danger);
    border-radius: var(--radius-md);
    padding: 0.75rem 1rem;
  }

  .edit-panel.svelte-1yndb1e {
    margin: 1.25rem 0 0;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 1rem 1.25rem;
  }

  .edit-panel.svelte-1yndb1e h2:where(.svelte-1yndb1e) {
    font-size: 1rem;
    margin: 0 0 0.75rem;
  }

  .edit-field.svelte-1yndb1e {
    display: block;
    margin-bottom: 0.75rem;
  }

  .edit-field.svelte-1yndb1e span:where(.svelte-1yndb1e) {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.3rem;
  }

  .edit-field.svelte-1yndb1e input:where(.svelte-1yndb1e),
  .edit-field.svelte-1yndb1e textarea:where(.svelte-1yndb1e) {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.7rem;
    font-size: 0.9rem;
    font-family: inherit;
    resize: none;
  }

  .edit-field.svelte-1yndb1e input:where(.svelte-1yndb1e):focus,
  .edit-field.svelte-1yndb1e textarea:where(.svelte-1yndb1e):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .edit-actions.svelte-1yndb1e {
    display: flex;
    gap: 0.6rem;
    justify-content: flex-end;
  }

  .confirm-delete.svelte-1yndb1e p:where(.svelte-1yndb1e) {
    color: var(--text-secondary);
    margin: 0 0 0.75rem;
  }

  .confirm-actions.svelte-1yndb1e {
    display: flex;
    gap: 0.6rem;
    justify-content: flex-end;
  }

  .workflow.svelte-1yndb1e {
    margin-top: 2rem;
  }

  .flow-track.svelte-1yndb1e {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1rem 1.25rem;
  }

  .flow-node.svelte-1yndb1e {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .flow-node.svelte-1yndb1e .stage-button:where(.svelte-1yndb1e) {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.6rem 0.9rem;
    text-align: left;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
  }

  .flow-node.active.svelte-1yndb1e .stage-button:where(.svelte-1yndb1e) {
    background: var(--accent-soft);
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
  }

  .stage-button.svelte-1yndb1e .stage-label:where(.svelte-1yndb1e) {
    display: block;
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.9rem;
  }

  .stage-button.svelte-1yndb1e .stage-count:where(.svelte-1yndb1e) {
    display: block;
    color: var(--text-muted);
    font-size: 0.72rem;
    margin-top: 0.2rem;
  }

  .stage-button.svelte-1yndb1e:hover {
    border-color: var(--accent);
  }

  .flow-arrow.svelte-1yndb1e {
    color: var(--text-faint);
    font-size: 1.1rem;
    user-select: none;
  }

  .flow-hint.svelte-1yndb1e {
    color: var(--text-faint);
    font-size: 0.8rem;
    margin: 0.5rem 0 0;
  }

  .members-section.svelte-1yndb1e {
    margin-top: 2rem;
  }

  .member-list.svelte-1yndb1e {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
  }

  .member-chip.svelte-1yndb1e {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.3rem 0.7rem;
    font-size: 0.85rem;
  }

  .member-name.svelte-1yndb1e {
    background: none;
    border: none;
    color: var(--text-secondary);
    cursor: pointer;
    font-family: inherit;
    padding: 0;
  }

  .member-name.svelte-1yndb1e:hover {
    color: var(--accent);
    text-decoration: underline;
  }

  .owner-tag.svelte-1yndb1e {
    color: var(--warning);
    font-size: 0.7rem;
    text-transform: uppercase;
  }

  .chip-remove.svelte-1yndb1e {
    background: none;
    border: 1px solid var(--border-default);
    color: var(--text-faint);
    cursor: pointer;
    font-size: 0.75rem;
    border-radius: var(--radius-sm);
    padding: 0.1rem 0.5rem;
  }

  .chip-remove.svelte-1yndb1e:hover {
    border-color: var(--danger);
    color: var(--danger);
  }

  .add-member.svelte-1yndb1e {
    display: flex;
    gap: 0.6rem;
    margin-top: 1rem;
  }

  .add-member.svelte-1yndb1e select:where(.svelte-1yndb1e) {
    flex: 1;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.75rem;
    font-family: inherit;
  }

  .add-member.svelte-1yndb1e select:where(.svelte-1yndb1e):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .btn-primary.svelte-1yndb1e {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
  }

  .btn-primary.svelte-1yndb1e:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-primary.svelte-1yndb1e:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .btn-secondary.svelte-1yndb1e {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    cursor: pointer;
  }

  .btn-secondary.svelte-1yndb1e:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-danger.svelte-1yndb1e {
    background: var(--danger);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
  }

  .btn-danger.svelte-1yndb1e:hover {
    filter: brightness(1.1);
  }

  .import-box.svelte-1yndb1e {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex-wrap: wrap;
    background: var(--bg-inset);
    border: 1px dashed var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.6rem 1rem;
    margin: 1rem 0 0;
  }

  .import-file.svelte-1yndb1e {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.85rem;
    cursor: pointer;
  }

  .import-file.svelte-1yndb1e input:where(.svelte-1yndb1e) {
    color: var(--text-primary);
  }

  .import-message.svelte-1yndb1e {
    color: var(--text-secondary);
    font-size: 0.85rem;
    margin: 0;
    width: 100%;
  }


  .sub.svelte-y0egbl {
    color: var(--text-muted);
    margin: 0;
  }

  .muted.svelte-y0egbl {
    color: var(--text-muted);
  }

  .table-head.svelte-y0egbl {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .stage-tabs.svelte-y0egbl {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin: 1.25rem 0;
  }

  .stage-tab.svelte-y0egbl {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-muted);
    border-radius: var(--radius-pill);
    padding: 0.35rem 0.9rem;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
  }

  .stage-tab.active.svelte-y0egbl {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--text-primary);
  }

  .table-tools.svelte-y0egbl {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
  }

  /* Fixed width so the "Saving…" <-> "Sorted by …" swap does not reflow the
     search input (which caused a visible layout jump when exiting edit mode). */
  .sort-hint.svelte-y0egbl {
    flex: 0 0 auto;
    min-width: 220px;
    max-width: 300px;
    color: var(--text-faint);
    font-size: 0.8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .tool-sep.svelte-y0egbl {
    color: var(--text-faint);
  }

  .tool-btn.svelte-y0egbl {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.65rem;
    font-size: 0.85rem;
    font-family: inherit;
    cursor: pointer;
  }

  .tool-btn.svelte-y0egbl:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .import-box.svelte-y0egbl {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex-wrap: wrap;
    background: var(--bg-inset);
    border: 1px dashed var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.6rem 1rem;
    margin-bottom: 1rem;
  }

  .import-file.svelte-y0egbl {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.85rem;
    cursor: pointer;
  }

  .import-file.svelte-y0egbl input:where(.svelte-y0egbl) {
    color: var(--text-primary);
  }

  .import-hint.svelte-y0egbl {
    color: var(--text-faint);
    font-size: 0.78rem;
    font-family: var(--font-mono);
    margin: 0;
  }

  .import-result.svelte-y0egbl {
    width: 100%;
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
  }

  .import-result.ok.svelte-y0egbl {
    background: var(--success-soft);
    color: var(--success);
  }

  .import-result.warn.svelte-y0egbl,
  .import-result.error.svelte-y0egbl {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .import-result.svelte-y0egbl ul:where(.svelte-y0egbl) {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
    font-family: var(--font-mono);
    font-size: 0.78rem;
  }

  .import-result.svelte-y0egbl p:where(.svelte-y0egbl) {
    margin: 0;
  }

  .tool-search.svelte-y0egbl {
    flex: 1 1 200px;
    max-width: 360px;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.7rem;
    font-family: inherit;
  }

  .tool-search.svelte-y0egbl:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .tool-toggle.svelte-y0egbl {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    user-select: none;
    color: var(--text-secondary);
    font-size: 0.88rem;
  }

  .tool-toggle.svelte-y0egbl input:where(.svelte-y0egbl) {
    accent-color: var(--accent);
  }

  .sort-th.svelte-y0egbl {
    cursor: pointer;
    user-select: none;
  }

  .sort-th.svelte-y0egbl:hover {
    color: var(--accent);
  }

  .sort-th.sorted-asc.svelte-y0egbl,
  .sort-th.sorted-desc.svelte-y0egbl {
    color: var(--accent);
  }

  .sort-arrow.svelte-y0egbl {
    font-size: 0.65rem;
    margin-left: 0.15rem;
  }

  .left-value.svelte-y0egbl {
    color: var(--success);
    font-weight: 600;
  }

  /* Wide tables scroll horizontally instead of breaking the page layout. */
  .table-wrap.svelte-y0egbl {
    overflow-x: auto;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
  }

  .data-table.svelte-y0egbl {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
  }

  .data-table.svelte-y0egbl th:where(.svelte-y0egbl) {
    text-align: left;
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    padding: 0.45rem 0.7rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
    white-space: nowrap;
  }

  .data-table.svelte-y0egbl td:where(.svelte-y0egbl) {
    padding: 0.4rem 0.7rem;
    border-bottom: 1px solid var(--border-default);
    font-size: 0.85rem;
    color: var(--text-secondary);
    word-break: break-word;
  }

  .data-table.svelte-y0egbl tbody:where(.svelte-y0egbl) tr:where(.svelte-y0egbl):last-child td:where(.svelte-y0egbl) {
    border-bottom: none;
  }

  .empty-cell.svelte-y0egbl {
    text-align: center;
    color: var(--text-faint);
    padding: 1.5rem;
    font-style: italic;
  }

  td.left-cell.svelte-y0egbl {
    color: var(--success);
    font-weight: 600;
  }

  .actions-col.svelte-y0egbl {
    width: 1%;
  }

  .row-actions.svelte-y0egbl {
    width: 1%;
    text-align: right;
    white-space: nowrap;
  }

  .icon-btn.svelte-y0egbl {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    padding: 0.25rem 0.4rem;
    opacity: 0.55;
  }

  .icon-btn.svelte-y0egbl:hover {
    opacity: 1;
  }

  .sample-link.svelte-y0egbl {
    color: var(--accent);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    text-decoration: underline dotted;
  }

  .sample-link.svelte-y0egbl:hover {
    color: var(--accent-hover);
  }

  .cell-input.svelte-y0egbl {
    width: 100%;
    min-width: 90px;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.5rem;
    font-size: 0.85rem;
    font-family: inherit;
  }

  .cell-input.svelte-y0egbl:focus {
    outline: none;
    border-color: var(--accent);
  }

  .entry-form.svelte-y0egbl {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.8rem;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 1rem;
    margin-bottom: 1rem;
  }

  .form-field.svelte-y0egbl {
    display: block;
  }

  .form-field.svelte-y0egbl span:where(.svelte-y0egbl) {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.25rem;
  }

  .form-field.svelte-y0egbl input:where(.svelte-y0egbl),
  .form-field.svelte-y0egbl select:where(.svelte-y0egbl) {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.55rem;
    font-size: 0.88rem;
    font-family: inherit;
  }

  .form-field.svelte-y0egbl input:where(.svelte-y0egbl):focus,
  .form-field.svelte-y0egbl select:where(.svelte-y0egbl):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .form-error.svelte-y0egbl {
    color: var(--danger);
    font-size: 0.85rem;
    margin: 0;
  }

  .form-actions.svelte-y0egbl {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
  }

  .btn-primary.svelte-y0egbl {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.55rem 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
  }

  .btn-primary.svelte-y0egbl:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-primary.svelte-y0egbl:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .btn-secondary.svelte-y0egbl {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    cursor: pointer;
  }

  .btn-secondary.svelte-y0egbl:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .pager.svelte-y0egbl {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    margin: 1rem 0;
    flex-wrap: wrap;
  }

  .pager-btn.svelte-y0egbl {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.65rem;
    font-size: 0.82rem;
    font-family: inherit;
    cursor: pointer;
  }

  .pager-btn.svelte-y0egbl:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .pager-btn.svelte-y0egbl:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }

  .pager-btn.page-number.current.svelte-y0egbl {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .pager-gap.svelte-y0egbl {
    color: var(--text-faint);
    padding: 0 0.15rem;
  }

  .pager-hint.svelte-y0egbl {
    color: var(--text-muted);
    font-size: 0.82rem;
    margin-left: 0.5rem;
  }


  .lab-header.svelte-lnhe0y {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .page-desc.svelte-lnhe0y {
    color: var(--text-muted);
    margin-top: 0;
  }

  .list-tools.svelte-lnhe0y {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
  }

  .list-tools.svelte-lnhe0y .search-bar {
    flex: 1;
    margin-bottom: 0;
  }

  .checkbox-wrapper.svelte-lnhe0y {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    color: var(--text-secondary);
    font-size: 0.88rem;
    user-select: none;
    white-space: nowrap;
  }

  .checkbox-wrapper.svelte-lnhe0y input:where(.svelte-lnhe0y) {
    accent-color: var(--accent);
  }

  .empty.svelte-lnhe0y {
    color: var(--text-faint);
    font-style: italic;
    margin: 2rem 0;
  }

  .error-text.svelte-lnhe0y {
    color: var(--danger);
    font-size: 0.85rem;
  }

  .sample-table.svelte-lnhe0y {
    width: 100%;
    border-collapse: collapse;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
  }

  .sample-table.svelte-lnhe0y th:where(.svelte-lnhe0y) {
    text-align: left;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    padding: 0.6rem 0.8rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
  }

  .sample-table.svelte-lnhe0y td:where(.svelte-lnhe0y) {
    padding: 0.6rem 0.8rem;
    border-bottom: 1px solid var(--border-default);
    font-size: 0.9rem;
    color: var(--text-secondary);
  }

  .sample-table.svelte-lnhe0y tbody:where(.svelte-lnhe0y) tr:where(.svelte-lnhe0y):last-child td:where(.svelte-lnhe0y) {
    border-bottom: none;
  }

  .sample-row.svelte-lnhe0y {
    cursor: pointer;
  }

  .sample-row.svelte-lnhe0y:hover td:where(.svelte-lnhe0y) {
    background: var(--bg-hover);
  }

  .sample-row.active.svelte-lnhe0y td:where(.svelte-lnhe0y) {
    background: var(--accent-soft);
  }

  .sample-id-cell.svelte-lnhe0y {
    font-weight: 700;
    color: var(--text-primary);
    font-family: var(--font-mono);
  }

  .sample-open-link.svelte-lnhe0y {
    color: var(--accent);
    text-decoration: underline dotted;
  }

  .sample-open-link.svelte-lnhe0y:hover {
    color: var(--accent-hover);
  }

  .status-cell.svelte-lnhe0y {
    white-space: nowrap;
  }

  .status-chip.svelte-lnhe0y {
    display: inline-block;
    min-width: 6.2rem;
    box-sizing: border-box;
    text-align: center;
    padding: 0.1rem 0.6rem;
    border: 1px solid transparent;
    border-radius: var(--radius-pill);
    font-size: 0.78rem;
    font-weight: 600;
  }

  .status-chip.active.svelte-lnhe0y {
    background: var(--success-soft);
    color: var(--success);
  }

  .status-chip.completed.svelte-lnhe0y {
    background: var(--bg-inset);
    color: var(--text-muted);
  }

  /* In edit mode the badge itself toggles the status; outlines mark it as
     clickable and "completed" turns a cautionary red. */
  .status-chip.editable.svelte-lnhe0y {
    cursor: pointer;
    font-family: inherit;
  }

  .status-chip.editable.active.svelte-lnhe0y {
    border-color: var(--success);
  }

  .status-chip.editable.completed.svelte-lnhe0y {
    background: var(--danger-soft);
    color: var(--danger);
    border-color: var(--danger);
  }

  .status-chip.editable.svelte-lnhe0y:hover {
    filter: brightness(1.08);
  }

  .row-actions.svelte-lnhe0y {
    width: 1%;
    text-align: right;
  }

  .icon-btn.svelte-lnhe0y {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    padding: 0.25rem 0.4rem;
    opacity: 0.55;
  }

  .icon-btn.svelte-lnhe0y:hover {
    opacity: 1;
  }

  .cell-input.svelte-lnhe0y {
    width: 100%;
    min-width: 90px;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.5rem;
    font-size: 0.88rem;
    font-family: inherit;
  }

  .cell-input.svelte-lnhe0y:focus {
    outline: none;
    border-color: var(--accent);
  }

  .expanded-row.svelte-lnhe0y td:where(.svelte-lnhe0y) {
    padding: 0.75rem 1rem;
    background: var(--bg-inset);
  }

  .expanded-panel.svelte-lnhe0y {
    padding: 1rem;
  }

  .expanded-head.svelte-lnhe0y {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
  }

  .uid-cell.svelte-lnhe0y {
    font-family: var(--font-mono);
    font-weight: 700;
    color: var(--text-primary);
  }

  .detail-chip.svelte-lnhe0y {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.15rem 0.6rem;
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .left-highlight.svelte-lnhe0y {
    color: var(--success);
    font-weight: 600;
  }

  .btn-mini.svelte-lnhe0y {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.7rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-mini.svelte-lnhe0y:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-mini.svelte-lnhe0y:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .hidden-input.svelte-lnhe0y {
    display: none;
  }

  .io-notice.svelte-lnhe0y {
    margin: 0 0 1rem;
    font-size: 0.85rem;
  }

  .io-notice.ok.svelte-lnhe0y {
    color: var(--success);
  }

  .io-notice.warn.svelte-lnhe0y {
    color: var(--warning, var(--accent));
  }

  .io-notice.error.svelte-lnhe0y {
    color: var(--danger);
  }

  .save-panel.svelte-lnhe0y {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
  }

  .save-panel.svelte-lnhe0y:hover {
    background: var(--accent);
    color: var(--accent-text);
  }

  .open-page.svelte-lnhe0y {
    text-decoration: none;
    color: var(--accent);
  }

  /* SampleInformation grid: label / value pairs for every column. */
  .info-grid.svelte-lnhe0y {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 0.5rem 1rem;
  }

  .info-row.svelte-lnhe0y {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .info-label.svelte-lnhe0y {
    flex: 0 0 118px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .info-value.svelte-lnhe0y {
    flex: 1;
    color: var(--text-secondary);
    font-size: 0.9rem;
    font-family: inherit;
  }

  .info-input.svelte-lnhe0y {
    flex: 1;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.5rem;
    font-size: 0.88rem;
    font-family: inherit;
    min-width: 0;
  }

  .info-input.svelte-lnhe0y:focus {
    outline: none;
    border-color: var(--accent);
  }

  .register-btn.svelte-lnhe0y {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--accent);
    color: var(--accent-text);
    border: 1px solid var(--accent);
    border-radius: var(--radius-md);
    padding: 0.65rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: var(--shadow);
    transition: background 0.15s ease, transform 0.1s ease;
  }

  .register-btn.svelte-lnhe0y:hover {
    background: var(--accent-hover);
    transform: translateY(-1px);
  }

  .register-btn.svelte-lnhe0y:active {
    transform: translateY(0);
  }

  .register-btn.svelte-lnhe0y .btn-icon:where(.svelte-lnhe0y) {
    width: 18px;
    height: 18px;
    filter: var(--icon-filter);
  }

  .modal-hint.svelte-lnhe0y {
    color: var(--text-faint);
    font-size: 0.82rem;
    margin: 0.25rem 0 1rem;
  }

  .alert-box.svelte-lnhe0y {
    background: var(--danger-soft);
    border: 1px solid var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.7rem 0.9rem;
    margin: 0.5rem 0 0;
  }

  .alert-box.svelte-lnhe0y p:where(.svelte-lnhe0y) {
    margin: 0;
    color: var(--danger);
    font-size: 0.88rem;
    font-weight: 600;
  }

  .alert-box.svelte-lnhe0y .alert-hint:where(.svelte-lnhe0y) {
    color: var(--text-muted);
    font-size: 0.8rem;
    margin-top: 0.25rem;
    font-weight: 400;
  }

  .modal-overlay.svelte-lnhe0y {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 1rem;
  }

  .modal-content.svelte-lnhe0y {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    width: 92%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: var(--shadow);
  }

  .modal-content.svelte-lnhe0y h2:where(.svelte-lnhe0y) {
    margin-top: 0;
  }

  .form-field.svelte-lnhe0y {
    display: block;
    margin-bottom: 0.9rem;
  }

  .form-field.svelte-lnhe0y span:where(.svelte-lnhe0y) {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.25rem;
  }

  .form-field.svelte-lnhe0y em:where(.svelte-lnhe0y) {
    color: var(--text-faint);
    font-weight: normal;
  }

  .form-field.svelte-lnhe0y input[type="text"]:where(.svelte-lnhe0y) {
    width: 100%;
    background: var(--bg-inset);
    border: 1px solid var(--border-strong);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.75rem;
    font-size: 0.92rem;
    box-sizing: border-box;
  }

  .form-field.svelte-lnhe0y input:where(.svelte-lnhe0y):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .form-field.svelte-lnhe0y input:where(.svelte-lnhe0y)::placeholder {
    color: var(--text-faint);
  }

  .form-field.check.svelte-lnhe0y {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
  }

  .form-field.check.svelte-lnhe0y input:where(.svelte-lnhe0y) {
    accent-color: var(--accent);
    width: 18px;
    height: 18px;
  }

  .check-text.svelte-lnhe0y {
    color: var(--text-primary);
    font-size: 0.92rem;
  }

  .check-hint.svelte-lnhe0y {
    color: var(--text-faint);
    font-size: 0.8rem;
  }

  .modal-actions.svelte-lnhe0y {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.25rem;
  }

  .btn-primary.svelte-lnhe0y {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.55rem 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
  }

  .btn-primary.svelte-lnhe0y:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-primary.svelte-lnhe0y:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .btn-cancel.svelte-lnhe0y {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.55rem 1.1rem;
    font-size: 0.9rem;
    cursor: pointer;
  }

  .btn-cancel.svelte-lnhe0y:hover {
    background: var(--bg-hover);
  }

  .pager.svelte-lnhe0y {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    margin: 1rem 0;
    flex-wrap: wrap;
  }

  .pager-btn.svelte-lnhe0y {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.65rem;
    font-size: 0.82rem;
    cursor: pointer;
  }

  .pager-btn.svelte-lnhe0y:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .pager-btn.svelte-lnhe0y:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }

  .pager-btn.page-number.current.svelte-lnhe0y {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .pager-gap.svelte-lnhe0y {
    color: var(--text-faint);
    padding: 0 0.15rem;
  }

  .pager-hint.svelte-lnhe0y {
    color: var(--text-muted);
    font-size: 0.82rem;
    margin-left: 0.5rem;
  }


  .sample-head.svelte-18q51ur {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .uid-cell.svelte-18q51ur {
    font-family: var(--font-mono);
    color: var(--text-primary);
  }

  .head-meta.svelte-18q51ur {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin: 0.5rem 0 0;
  }

  .status-chip.svelte-18q51ur {
    display: inline-block;
    padding: 0.1rem 0.6rem;
    border-radius: var(--radius-pill);
    font-size: 0.78rem;
    font-weight: 600;
  }

  .status-chip.active.svelte-18q51ur {
    background: var(--success-soft);
    color: var(--success);
  }

  .status-chip.completed.svelte-18q51ur {
    background: var(--bg-inset);
    color: var(--text-muted);
  }

  .detail-chip.svelte-18q51ur {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.15rem 0.6rem;
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .left-highlight.svelte-18q51ur {
    color: var(--success);
    font-weight: 600;
  }

  .head-actions.svelte-18q51ur {
    display: flex;
    gap: 0.6rem;
    align-items: center;
  }

  .tool-edit.svelte-18q51ur {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    user-select: none;
    color: var(--text-secondary);
    font-size: 0.88rem;
  }

  .tool-edit.svelte-18q51ur input:where(.svelte-18q51ur) {
    accent-color: var(--accent);
  }

  .btn-mini.svelte-18q51ur {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.7rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-mini.svelte-18q51ur:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-mini.svelte-18q51ur:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  /* (unused) .save-panel {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
  }*/

  /* (unused) .save-panel:hover {
    background: var(--accent);
    color: var(--accent-text);
  }*/

  .info-section.svelte-18q51ur {
    margin-top: 1.25rem;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.9rem 1rem;
  }

  .info-title.svelte-18q51ur {
    font-size: 1rem;
    margin: 0 0 0.75rem;
  }

  .info-grid.svelte-18q51ur {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 0.5rem 1rem;
  }

  .info-row.svelte-18q51ur {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .info-label.svelte-18q51ur {
    flex: 0 0 118px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .info-value.svelte-18q51ur {
    flex: 1;
    color: var(--text-secondary);
    font-size: 0.9rem;
    word-break: break-word;
  }

  .info-input.svelte-18q51ur {
    flex: 1;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.5rem;
    font-size: 0.88rem;
    font-family: inherit;
    min-width: 0;
  }

  .info-input.svelte-18q51ur:focus {
    outline: none;
    border-color: var(--accent);
  }

  .filter-summary.svelte-18q51ur {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin: 0.5rem 0 0.75rem;
  }

  .filter-chip.svelte-18q51ur {
    background: var(--accent-soft);
    border: 1px solid var(--accent);
    color: var(--accent);
    border-radius: var(--radius-pill);
    padding: 0.15rem 0.7rem;
    font-size: 0.8rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
  }

  .filter-x.svelte-18q51ur {
    background: none;
    border: none;
    color: var(--accent);
    cursor: pointer;
    font-size: 0.85rem;
    line-height: 1;
    padding: 0 0.15rem;
  }

  .filter-clear-all.svelte-18q51ur {
    background: none;
    border: 1px solid var(--border-default);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.15rem 0.6rem;
    font-size: 0.8rem;
    cursor: pointer;
  }

  .filter-hint.svelte-18q51ur {
    color: var(--text-faint);
    font-size: 0.8rem;
    margin: 0;
    font-style: italic;
  }

  .add-note.svelte-18q51ur {
    color: var(--text-faint);
    font-size: 0.85rem;
    margin: 0.25rem 0 1.25rem;
  }

  .muted.svelte-18q51ur {
    color: var(--text-muted);
  }

  .empty.small.svelte-18q51ur {
    color: var(--text-faint);
    font-style: italic;
    margin: 0.5rem 0 1rem;
  }

  .entry-section.svelte-18q51ur {
    margin-top: 1.25rem;
  }

  .entry-header.svelte-18q51ur {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.6rem;
  }

  .entry-header.svelte-18q51ur h2:where(.svelte-18q51ur) {
    font-size: 1.1rem;
    margin: 0;
  }

  .entry-count.svelte-18q51ur {
    background: var(--accent-soft);
    color: var(--accent);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.5rem;
    font-size: 0.75rem;
  }

  .table-wrap.svelte-18q51ur {
    overflow-x: auto;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    background: var(--bg-raised);
  }

  .data-table.svelte-18q51ur {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
  }

  .data-table.svelte-18q51ur th:where(.svelte-18q51ur) {
    text-align: left;
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    padding: 0.45rem 0.7rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
    white-space: nowrap;
  }

  .data-table.svelte-18q51ur td:where(.svelte-18q51ur) {
    padding: 0.4rem 0.7rem;
    border-bottom: 1px solid var(--border-default);
    font-size: 0.85rem;
    color: var(--text-secondary);
  }

  .data-table.svelte-18q51ur tbody:where(.svelte-18q51ur) tr:where(.svelte-18q51ur):last-child td:where(.svelte-18q51ur) {
    border-bottom: none;
  }

  td.left-cell.svelte-18q51ur {
    color: var(--success);
    font-weight: 600;
  }

  .left-value.svelte-18q51ur {
    color: var(--success);
    font-weight: 600;
  }

  .actions-col.svelte-18q51ur {
    width: 1%;
  }

  .row-actions.svelte-18q51ur {
    width: 1%;
    text-align: right;
    white-space: nowrap;
  }

  .icon-btn.svelte-18q51ur {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    padding: 0.25rem 0.4rem;
    opacity: 0.55;
  }

  .icon-btn.svelte-18q51ur:hover {
    opacity: 1;
  }

  .sort-th.svelte-18q51ur {
    cursor: pointer;
    user-select: none;
  }

  .sort-th.svelte-18q51ur:hover {
    color: var(--accent);
  }

  .sort-th.sorted-asc.svelte-18q51ur,
  .sort-th.sorted-desc.svelte-18q51ur {
    color: var(--accent);
  }

  .sort-arrow.svelte-18q51ur {
    font-size: 0.65rem;
    margin-left: 0.15rem;
  }

  .sample-link.svelte-18q51ur {
    color: var(--accent);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    text-decoration: underline dotted;
  }

  .sample-link.svelte-18q51ur:hover {
    color: var(--accent-hover);
  }

  .id-link.svelte-18q51ur {
    background: none;
    border: none;
    color: var(--accent);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    cursor: pointer;
    text-decoration: underline dotted;
    padding: 0;
  }

  .id-link.svelte-18q51ur:hover {
    color: var(--accent-hover);
  }

  .id-link.active.svelte-18q51ur {
    font-weight: 700;
  }

  tr.filtered.svelte-18q51ur td:where(.svelte-18q51ur) {
    background: var(--accent-soft);
  }

  .cell-input.svelte-18q51ur {
    width: 100%;
    min-width: 90px;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.5rem;
    font-size: 0.85rem;
    font-family: inherit;
  }

  .cell-input.svelte-18q51ur:focus {
    outline: none;
    border-color: var(--accent);
  }

  .entry-form.svelte-18q51ur {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.8rem;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 1rem;
    margin-bottom: 1rem;
  }

  .form-field.svelte-18q51ur {
    display: block;
  }

  .form-field.svelte-18q51ur span:where(.svelte-18q51ur) {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.25rem;
  }

  .form-field.svelte-18q51ur input:where(.svelte-18q51ur),
  .form-field.svelte-18q51ur select:where(.svelte-18q51ur) {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.55rem;
    font-size: 0.88rem;
    font-family: inherit;
  }

  .form-field.svelte-18q51ur input:where(.svelte-18q51ur):focus,
  .form-field.svelte-18q51ur select:where(.svelte-18q51ur):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .form-error.svelte-18q51ur {
    color: var(--danger);
    font-size: 0.85rem;
    margin: 0;
  }

  .form-actions.svelte-18q51ur {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
  }

  .btn-primary.svelte-18q51ur {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.55rem 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
  }

  .btn-primary.svelte-18q51ur:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-primary.svelte-18q51ur:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .btn-secondary.svelte-18q51ur {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    cursor: pointer;
  }

  .btn-secondary.svelte-18q51ur:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-danger.svelte-18q51ur {
    border-color: var(--danger);
    color: var(--danger);
  }

  .btn-danger.svelte-18q51ur:hover {
    background: var(--danger-soft);
    color: var(--danger);
  }

  /* Gallery: cubic tiles, left-aligned, wrapping to the next row. */
  .media-grid.svelte-18q51ur {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
  }

  .media-tile.svelte-18q51ur {
    position: relative;
    flex: 0 0 auto;
  }

  .media-open.svelte-18q51ur {
    display: block;
    width: 104px;
    height: 104px;
    padding: 0;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--bg-inset);
    cursor: zoom-in;
  }

  .media-open.svelte-18q51ur img:where(.svelte-18q51ur) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .media-open.svelte-18q51ur:hover img:where(.svelte-18q51ur) {
    opacity: 0.88;
  }

  .media-delete.svelte-18q51ur {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.78rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .media-delete.svelte-18q51ur:hover {
    background: var(--danger);
  }

  .media-add.svelte-18q51ur {
    width: 104px;
    height: 104px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--border-strong);
    border-radius: var(--radius-sm);
    color: var(--text-muted);
    cursor: pointer;
  }

  .media-add.svelte-18q51ur:hover {
    border-color: var(--accent);
    color: var(--accent);
  }

  .media-add.busy.svelte-18q51ur {
    opacity: 0.5;
    pointer-events: none;
  }

  .media-add.svelte-18q51ur input:where(.svelte-18q51ur) {
    display: none;
  }

  .media-plus.svelte-18q51ur {
    font-size: 2rem;
    line-height: 1;
  }

  /* Enlarged image: nearly the whole viewport; clicking anywhere closes. */
  .lightbox.svelte-18q51ur {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5vh 2.5vw;
    background: rgba(0, 0, 0, 0.82);
    cursor: zoom-out;
  }

  .lightbox.svelte-18q51ur img:where(.svelte-18q51ur) {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: var(--radius-sm);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
  }

  .detail-error.svelte-18q51ur {
    margin: 0.6rem 0 0;
    padding: 0.5rem 0.9rem;
    border: 1px solid var(--danger);
    background: var(--danger-soft);
    color: var(--danger);
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
  }


  .head.svelte-1s7wp7m {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .head-actions.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .page-desc.svelte-1s7wp7m {
    color: var(--text-muted);
    margin-top: 0;
    max-width: 620px;
  }

  .error.svelte-1s7wp7m {
    background: var(--danger-soft);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.9rem;
    font-size: 0.88rem;
  }

  .reset-banner.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    flex-wrap: wrap;
    background: var(--success-soft, var(--bg-raised));
    border: 1px solid var(--success, var(--border-default));
    border-radius: var(--radius-md);
    padding: 0.7rem 1rem;
    margin-top: 0.75rem;
  }

  .reset-text.svelte-1s7wp7m {
    flex: 1;
    min-width: 240px;
  }

  .reset-text.svelte-1s7wp7m p:where(.svelte-1s7wp7m) {
    margin: 0.15rem 0 0;
  }

  .reset-code.svelte-1s7wp7m {
    font-family: var(--font-mono);
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.6rem;
    user-select: all;
  }

  .reset-actions.svelte-1s7wp7m {
    display: flex;
    gap: 0.4rem;
  }

  .muted.svelte-1s7wp7m {
    color: var(--text-faint);
  }

  .small.svelte-1s7wp7m {
    font-size: 0.82rem;
  }

  .registration-card.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-left: 3px solid var(--success, var(--accent));
    border-radius: var(--radius-md);
    padding: 0.7rem 1rem;
    margin-top: 1rem;
  }

  .registration-card.closed.svelte-1s7wp7m {
    border-left-color: var(--danger);
  }

  .registration-card.svelte-1s7wp7m p:where(.svelte-1s7wp7m) {
    margin: 0.15rem 0 0;
    max-width: 560px;
  }

  .section-title.svelte-1s7wp7m {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin: 1.4rem 0 0.6rem;
    font-size: 1.1rem;
  }

  .pending-title.svelte-1s7wp7m {
    margin-top: 2rem;
  }

  .tools.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin: 1rem 0 0.25rem;
  }

  .search.svelte-1s7wp7m {
    flex: 1;
    min-width: 220px;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.75rem;
    font-family: inherit;
  }

  .search.svelte-1s7wp7m:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .count.svelte-1s7wp7m {
    color: var(--text-faint);
    font-size: 0.82rem;
  }

  .user-list.svelte-1s7wp7m {
    display: grid;
    gap: 0.5rem;
  }

  .user-row.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.65rem 0.9rem;
    flex-wrap: wrap;
  }

  .user-row.pending.svelte-1s7wp7m {
    border-left: 3px solid var(--warning, var(--accent));
  }

  .avatar-btn.svelte-1s7wp7m {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    flex-shrink: 0;
  }

  .avatar.svelte-1s7wp7m,
  .avatar.fallback.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
  }

  .avatar.fallback.svelte-1s7wp7m {
    background: var(--accent);
    color: var(--accent-text);
    font-weight: 700;
    font-size: 1.1rem;
  }

  .identity.svelte-1s7wp7m {
    flex: 1;
    min-width: 180px;
  }

  .name-line.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
  }

  .name-link.svelte-1s7wp7m {
    background: none;
    border: none;
    padding: 0;
    color: var(--text-primary);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .name-link.svelte-1s7wp7m:hover {
    color: var(--accent);
    text-decoration: underline;
  }

  .at.svelte-1s7wp7m {
    color: var(--text-faint);
    font-size: 0.85rem;
  }

  .email.svelte-1s7wp7m {
    color: var(--text-muted);
    font-size: 0.82rem;
    margin-top: 0.1rem;
  }

  .badge.svelte-1s7wp7m {
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
  }

  .badge.admin.svelte-1s7wp7m {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .badge.sso-badge.svelte-1s7wp7m {
    background: var(--accent-soft);
    color: var(--accent);
  }

  .badge.pending-badge.svelte-1s7wp7m {
    background: var(--bg-inset);
    color: var(--warning, var(--text-muted));
    border: 1px solid var(--border-default);
  }

  .actions.svelte-1s7wp7m {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
  }

  .btn-secondary.svelte-1s7wp7m {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.75rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-1s7wp7m:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-ok.svelte-1s7wp7m {
    background: var(--success-soft);
    border: 1px solid var(--success);
    color: var(--success);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.75rem;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-danger.svelte-1s7wp7m {
    background: transparent;
    border: 1px solid var(--danger);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.75rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-danger.svelte-1s7wp7m:hover:not(:disabled) {
    background: var(--danger-soft);
  }

  button.svelte-1s7wp7m:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .unread.svelte-1s7wp7m {
    background: var(--danger);
    color: #fff;
    border-radius: var(--radius-pill);
    min-width: 1.1rem;
    padding: 0 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.1rem;
  }


  .notice.svelte-19rlhyn {
    border-radius: var(--radius-sm);
    padding: 0.55rem 0.9rem;
    font-size: 0.88rem;
    margin-bottom: 1rem;
  }

  .notice.ok.svelte-19rlhyn {
    background: var(--success-soft);
    color: var(--success);
  }

  .notice.error.svelte-19rlhyn {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .muted.svelte-19rlhyn {
    color: var(--text-muted);
  }

  .small.svelte-19rlhyn {
    font-size: 0.82rem;
  }

  .error-card.svelte-19rlhyn {
    max-width: 460px;
    margin: 3rem auto;
    text-align: center;
    background: var(--bg-card);
    border: 1px solid var(--danger);
    border-radius: var(--radius-lg);
    padding: 2.5rem;
  }

  .error-card.svelte-19rlhyn h1:where(.svelte-19rlhyn) {
    font-size: 3rem;
    margin: 0;
    color: var(--danger);
  }

  .profile-card.svelte-19rlhyn {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    flex-wrap: wrap;
  }

  .avatar-block.svelte-19rlhyn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
  }

  .avatar.svelte-19rlhyn {
    width: 132px;
    height: 132px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--border-default);
  }

  .avatar-fallback.svelte-19rlhyn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--accent);
    color: var(--accent-text);
    font-size: 3rem;
    font-weight: 700;
  }

  .avatar-actions.svelte-19rlhyn {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    justify-content: center;
  }

  .profile-body.svelte-19rlhyn {
    flex: 1;
    min-width: 260px;
  }

  .profile-heading.svelte-19rlhyn h1:where(.svelte-19rlhyn) {
    margin: 0 0 0.35rem;
  }

  .chips.svelte-19rlhyn {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
  }

  .chip.svelte-19rlhyn {
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-muted);
    border-radius: var(--radius-pill);
    padding: 0.1rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
  }

  .chip.admin.svelte-19rlhyn {
    background: var(--danger-soft);
    color: var(--danger);
    border-color: transparent;
  }

  .chip.secure.svelte-19rlhyn {
    background: var(--success-soft);
    color: var(--success);
    border-color: transparent;
  }

  .chip.pending.svelte-19rlhyn {
    background: var(--warning-soft, var(--bg-inset));
    color: var(--warning, var(--text-muted));
    border-color: transparent;
  }

  .details.svelte-19rlhyn {
    margin: 1rem 0;
    display: grid;
    gap: 0.45rem;
  }

  .bio.svelte-19rlhyn {
    max-width: 560px;
    margin: 0.75rem 0 0;
    color: var(--text-secondary);
    font-size: 0.92rem;
    line-height: 1.45;
    white-space: pre-wrap;
  }

  .bio-input.svelte-19rlhyn {
    width: 100%;
    resize: vertical;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.55rem;
    font-family: inherit;
    font-size: 0.9rem;
    box-sizing: border-box;
    margin-bottom: 1rem;
  }

  .bio-input.svelte-19rlhyn:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .field.svelte-19rlhyn em:where(.svelte-19rlhyn) {
    font-style: normal;
    font-weight: 400;
  }

  .details.svelte-19rlhyn div:where(.svelte-19rlhyn) {
    display: flex;
    gap: 0.75rem;
  }

  .details.svelte-19rlhyn dt:where(.svelte-19rlhyn) {
    flex: 0 0 110px;
    color: var(--text-muted);
    font-size: 0.82rem;
    font-weight: 600;
  }

  .details.svelte-19rlhyn dd:where(.svelte-19rlhyn) {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.9rem;
  }

  .field-grid.svelte-19rlhyn {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.8rem;
    margin: 1rem 0;
  }

  .field.svelte-19rlhyn span:where(.svelte-19rlhyn) {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.25rem;
  }

  .field.svelte-19rlhyn input:where(.svelte-19rlhyn) {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.55rem;
    font-family: inherit;
    font-size: 0.9rem;
    box-sizing: border-box;
  }

  .field.svelte-19rlhyn input:where(.svelte-19rlhyn):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .code-input.svelte-19rlhyn {
    letter-spacing: 0.4em;
    font-family: var(--font-mono);
    font-size: 1.05rem;
  }

  .row-actions.svelte-19rlhyn {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
  }

  .color-picker.svelte-19rlhyn {
    margin-top: 1rem;
  }

  .color-label.svelte-19rlhyn {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.35rem;
  }

  .swatches.svelte-19rlhyn {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
  }

  .swatch.svelte-19rlhyn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
  }

  .swatch.svelte-19rlhyn:hover {
    transform: scale(1.1);
  }

  .swatch.selected.svelte-19rlhyn {
    border-color: var(--text-primary);
    box-shadow: 0 0 0 2px var(--bg-raised);
  }

  .security-card.svelte-19rlhyn {
    margin-top: 1.25rem;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.5rem;
  }

  .security-head.svelte-19rlhyn {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
  }

  .security-head.svelte-19rlhyn h2:where(.svelte-19rlhyn) {
    margin: 0;
  }

  .security-divider.svelte-19rlhyn {
    border: none;
    border-top: 1px solid var(--border-default);
    margin: 1.1rem 0;
  }

  .twofa-state.svelte-19rlhyn {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin-bottom: 1rem;
  }

  .twofa-state.svelte-19rlhyn p:where(.svelte-19rlhyn) {
    margin: 0.15rem 0 0;
  }

  .status-dot.svelte-19rlhyn {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-top: 0.35rem;
    flex-shrink: 0;
  }

  .status-dot.on.svelte-19rlhyn {
    background: var(--success);
    box-shadow: 0 0 0 3px var(--success-soft);
  }

  .status-dot.off.svelte-19rlhyn {
    background: var(--text-faint);
  }

  .sub-title.svelte-19rlhyn {
    font-size: 0.95rem;
    margin: 1rem 0 0.5rem;
  }

  .device-list.svelte-19rlhyn {
    list-style: none;
    margin: 0 0 0.9rem;
    padding: 0;
    display: grid;
    gap: 0.4rem;
  }

  .device-list.svelte-19rlhyn li:where(.svelte-19rlhyn) {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    background: var(--bg-inset);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.7rem;
    flex-wrap: wrap;
  }

  .device-name.svelte-19rlhyn {
    color: var(--text-primary);
    font-size: 0.88rem;
  }

  .inline-form.svelte-19rlhyn {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    flex-wrap: wrap;
  }

  .inline-form.svelte-19rlhyn .field:where(.svelte-19rlhyn) {
    flex: 1;
    min-width: 200px;
  }

  .footer-actions.svelte-19rlhyn {
    margin-top: 1.5rem;
    display: flex;
    justify-content: flex-end;
  }

  .btn-primary.svelte-19rlhyn {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.55rem 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-primary.svelte-19rlhyn:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-secondary.svelte-19rlhyn {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-19rlhyn:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-danger-outline.svelte-19rlhyn {
    background: transparent;
    border: 1px solid var(--danger);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-danger-outline.svelte-19rlhyn:hover:not(:disabled) {
    background: var(--danger-soft);
  }

  .btn-mini.svelte-19rlhyn {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.7rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-mini.svelte-19rlhyn:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-mini.danger.svelte-19rlhyn {
    border-color: var(--danger);
    color: var(--danger);
  }

  .btn-primary.svelte-19rlhyn:disabled,
  .btn-secondary.svelte-19rlhyn:disabled,
  .btn-danger-outline.svelte-19rlhyn:disabled,
  .btn-mini.svelte-19rlhyn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }


  .chat-card.svelte-1hheg6w {
    display: flex;
    flex-direction: column;
    height: min(76vh, 780px);
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
  }

  .new-pill.svelte-1hheg6w {
    position: absolute;
    left: 50%;
    bottom: 4.6rem;
    transform: translateX(-50%);
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-pill);
    padding: 0.35rem 0.95rem;
    font-size: 0.8rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    z-index: 5;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
  }

  .new-pill.svelte-1hheg6w:hover {
    background: var(--accent-hover);
  }

  .chat-header.svelte-1hheg6w {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
  }

  .back.svelte-1hheg6w {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0.2rem 0.4rem;
  }

  .back.svelte-1hheg6w:hover {
    color: var(--accent);
  }

  .who.svelte-1hheg6w {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
  }

  .avatar.svelte-1hheg6w,
  .avatar.fallback.svelte-1hheg6w {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
  }

  .avatar.fallback.svelte-1hheg6w {
    background: var(--accent);
    color: var(--accent-text);
    font-weight: 700;
  }

  .who-text.svelte-1hheg6w {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
  }

  .who-name.svelte-1hheg6w {
    color: var(--text-primary);
    font-weight: 600;
  }

  .who-handle.svelte-1hheg6w {
    color: var(--text-faint);
    font-size: 0.78rem;
  }

  .who.svelte-1hheg6w:hover .who-name:where(.svelte-1hheg6w) {
    color: var(--accent);
  }

  .chat-body.svelte-1hheg6w {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
  }

  .message-row.svelte-1hheg6w {
    display: flex;
    justify-content: flex-start;
  }

  /* All bubbles stay left-aligned so a conversation reads as one column;
     own messages are distinguished by their accent tint instead of being
     pushed to the far edge. */
  .bubble.svelte-1hheg6w {
    max-width: min(70%, 560px);
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.5rem 0.75rem;
  }

  .message-row.own.svelte-1hheg6w .bubble:where(.svelte-1hheg6w) {
    background: var(--accent-soft);
    border-color: var(--accent-strong, var(--accent));
  }

  .bubble-meta.svelte-1hheg6w {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 0.15rem;
  }

  .bubble-sender.svelte-1hheg6w {
    color: var(--accent);
    font-weight: 600;
    font-size: 0.8rem;
  }

  .message-row.own.svelte-1hheg6w .bubble-sender:where(.svelte-1hheg6w) {
    color: var(--text-muted);
  }

  .bubble-time.svelte-1hheg6w {
    color: var(--text-faint);
    font-size: 0.72rem;
  }

  .bubble-text.svelte-1hheg6w {
    color: var(--text-primary);
    font-size: 0.92rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
  }

  .chat-input-row.svelte-1hheg6w {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-default);
    background: var(--bg-inset);
  }

  .chat-input-row.svelte-1hheg6w textarea:where(.svelte-1hheg6w) {
    flex: 1;
    resize: none;
    max-height: 150px;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.75rem;
    font-family: inherit;
    font-size: 0.92rem;
    line-height: 1.4;
  }

  .chat-input-row.svelte-1hheg6w textarea:where(.svelte-1hheg6w):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .send.svelte-1hheg6w {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.6rem 1.1rem;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .send.svelte-1hheg6w:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .send.svelte-1hheg6w:disabled {
    opacity: 0.55;
    cursor: not-allowed;
  }

  .send-error.svelte-1hheg6w {
    margin: 0;
    padding: 0.4rem 1rem;
    color: var(--danger);
    background: var(--danger-soft);
    font-size: 0.85rem;
  }

  .muted.svelte-1hheg6w {
    color: var(--text-faint);
  }

  .small.svelte-1hheg6w {
    font-size: 0.82rem;
  }

  .loading-row.svelte-1hheg6w {
    text-align: center;
    margin: 0;
  }

  .center.svelte-1hheg6w {
    text-align: center;
    margin: auto;
  }

  .btn-secondary.svelte-1hheg6w {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.8rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-1hheg6w:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .retry-inline.svelte-1hheg6w {
    background: none;
    border: none;
    padding: 0;
    color: var(--accent);
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
  }


  .head.svelte-1w2h85y {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .head-actions.svelte-1w2h85y {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .page-desc.svelte-1w2h85y {
    color: var(--text-muted);
    margin-top: 0;
    max-width: 620px;
  }

  .error.svelte-1w2h85y {
    background: var(--danger-soft);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.9rem;
    font-size: 0.88rem;
  }

  .muted.svelte-1w2h85y {
    color: var(--text-faint);
  }

  /* (unused) .small {
    font-size: 0.82rem;
  }*/

  .create-card.svelte-1w2h85y {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 1rem;
    margin-top: 1rem;
    display: grid;
    gap: 0.8rem;
  }

  .create-card.svelte-1w2h85y h2:where(.svelte-1w2h85y) {
    margin: 0;
    font-size: 1.05rem;
  }

  .field.svelte-1w2h85y {
    display: block;
  }

  .field.svelte-1w2h85y > span:where(.svelte-1w2h85y) {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.3rem;
  }

  .field.svelte-1w2h85y input:where(.svelte-1w2h85y) {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.6rem;
    font-family: inherit;
    font-size: 0.9rem;
  }

  .field.svelte-1w2h85y input:where(.svelte-1w2h85y):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .hint.svelte-1w2h85y {
    color: var(--text-faint);
    font-weight: 400;
  }

  .picker.svelte-1w2h85y {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    max-height: 180px;
    overflow-y: auto;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.5rem;
  }

  .member-chip.svelte-1w2h85y {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.2rem 0.65rem;
    font-size: 0.83rem;
    color: var(--text-secondary);
    cursor: pointer;
    user-select: none;
  }

  .member-chip.on.svelte-1w2h85y {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
  }

  .member-chip.svelte-1w2h85y input:where(.svelte-1w2h85y) {
    accent-color: var(--accent);
    margin: 0;
  }

  .form-actions.svelte-1w2h85y {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
  }

  .group-list.svelte-1w2h85y {
    display: grid;
    gap: 0.5rem;
    margin-top: 1rem;
  }

  .group-card.svelte-1w2h85y {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    text-align: left;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.7rem 0.9rem;
    cursor: pointer;
    font-family: inherit;
  }

  .group-card.svelte-1w2h85y:hover {
    border-color: var(--accent);
  }

  .group-glyph.svelte-1w2h85y {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 1.2rem;
    font-weight: 700;
  }

  .group-main.svelte-1w2h85y {
    flex: 1;
    min-width: 180px;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
  }

  .group-name.svelte-1w2h85y {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.98rem;
  }

  .group-desc.svelte-1w2h85y {
    color: var(--text-muted);
    font-size: 0.82rem;
  }

  .group-preview.svelte-1w2h85y {
    color: var(--text-faint);
    font-size: 0.82rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 520px;
  }

  .group-preview.svelte-1w2h85y strong:where(.svelte-1w2h85y) {
    color: var(--text-muted);
    font-weight: 600;
  }

  .group-meta.svelte-1w2h85y {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.1rem;
    color: var(--text-faint);
    font-size: 0.76rem;
    flex-shrink: 0;
  }

  .unread.svelte-1w2h85y {
    background: var(--danger);
    color: #fff;
    border-radius: var(--radius-pill);
    min-width: 1.1rem;
    padding: 0 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.1rem;
  }

  .btn-primary.svelte-1w2h85y {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-primary.svelte-1w2h85y:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-secondary.svelte-1w2h85y {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.9rem;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-1w2h85y:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  button.svelte-1w2h85y:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }


  .chat-card.svelte-er9dxv {
    display: flex;
    flex-direction: column;
    height: min(76vh, 780px);
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
  }

  .new-pill.svelte-er9dxv {
    position: absolute;
    left: 50%;
    bottom: 4.6rem;
    transform: translateX(-50%);
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-pill);
    padding: 0.35rem 0.95rem;
    font-size: 0.8rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    z-index: 5;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
  }

  .new-pill.svelte-er9dxv:hover {
    background: var(--accent-hover);
  }

  .loading-row.svelte-er9dxv {
    text-align: center;
    margin: 0;
  }

  .chat-header.svelte-er9dxv {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
  }

  .back.svelte-er9dxv {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0.2rem 0.4rem;
  }

  .back.svelte-er9dxv:hover {
    color: var(--accent);
  }

  .who.svelte-er9dxv {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
  }

  .group-glyph.svelte-er9dxv {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 1.15rem;
    font-weight: 700;
  }

  .who-text.svelte-er9dxv {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
  }

  .who-name.svelte-er9dxv {
    color: var(--text-primary);
    font-weight: 600;
  }

  .who-handle.svelte-er9dxv {
    color: var(--text-faint);
    font-size: 0.78rem;
  }

  .header-actions.svelte-er9dxv {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
  }

  .members-panel.svelte-er9dxv {
    max-height: 45%;
    overflow-y: auto;
    padding: 0.8rem 1rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
    display: grid;
    gap: 0.9rem;
  }

  .manage-block.svelte-er9dxv {
    display: grid;
    gap: 0.45rem;
    justify-items: start;
  }

  .manage-title.svelte-er9dxv {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
  }

  .manage-block.svelte-er9dxv .field:where(.svelte-er9dxv) {
    width: 100%;
  }

  .field.svelte-er9dxv > span:where(.svelte-er9dxv) {
    display: block;
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-bottom: 0.2rem;
  }

  .field.svelte-er9dxv input:where(.svelte-er9dxv) {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.55rem;
    font-family: inherit;
    font-size: 0.88rem;
  }

  .field.svelte-er9dxv input:where(.svelte-er9dxv):focus {
    outline: none;
    border-color: var(--accent);
  }

  .member-list.svelte-er9dxv {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.2rem;
    width: 100%;
  }

  .member-list.svelte-er9dxv li:where(.svelte-er9dxv) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.88rem;
    color: var(--text-secondary);
    padding: 0.15rem 0;
  }

  .member-handle.svelte-er9dxv {
    color: var(--text-faint);
    font-size: 0.78rem;
    margin-left: 0.3rem;
  }

  .tag.svelte-er9dxv {
    background: var(--accent-soft);
    color: var(--accent);
    border-radius: var(--radius-pill);
    padding: 0 0.4rem;
    font-size: 0.68rem;
    font-weight: 700;
    margin-left: 0.35rem;
  }

  .icon-btn.svelte-er9dxv {
    background: none;
    border: none;
    color: var(--text-faint);
    cursor: pointer;
    font-size: 0.85rem;
    padding: 0.1rem 0.35rem;
  }

  .icon-btn.svelte-er9dxv:hover {
    color: var(--danger);
  }

  .add-list.svelte-er9dxv {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    width: 100%;
  }

  .member-chip.svelte-er9dxv {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.2rem 0.65rem;
    font-size: 0.83rem;
    color: var(--text-secondary);
    cursor: pointer;
    user-select: none;
  }

  .member-chip.on.svelte-er9dxv {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
  }

  .member-chip.svelte-er9dxv input:where(.svelte-er9dxv) {
    accent-color: var(--accent);
    margin: 0;
  }

  .chat-body.svelte-er9dxv {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
  }

  .message-row.svelte-er9dxv {
    display: flex;
    justify-content: flex-start;
  }

  /* All bubbles stay left-aligned so a conversation reads as one column;
     own messages are distinguished by their accent tint instead of being
     pushed to the far edge. */
  .bubble.svelte-er9dxv {
    max-width: min(70%, 560px);
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.5rem 0.75rem;
  }

  .message-row.own.svelte-er9dxv .bubble:where(.svelte-er9dxv) {
    background: var(--accent-soft);
    border-color: var(--accent-strong, var(--accent));
  }

  .bubble-meta.svelte-er9dxv {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 0.15rem;
  }

  .bubble-sender.svelte-er9dxv {
    color: var(--accent);
    font-weight: 600;
    font-size: 0.8rem;
  }

  .message-row.own.svelte-er9dxv .bubble-sender:where(.svelte-er9dxv) {
    color: var(--text-muted);
  }

  .bubble-time.svelte-er9dxv {
    color: var(--text-faint);
    font-size: 0.72rem;
  }

  .bubble-text.svelte-er9dxv {
    color: var(--text-primary);
    font-size: 0.92rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
  }

  .chat-input-row.svelte-er9dxv {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-default);
    background: var(--bg-inset);
  }

  .chat-input-row.svelte-er9dxv textarea:where(.svelte-er9dxv) {
    flex: 1;
    resize: none;
    max-height: 150px;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.75rem;
    font-family: inherit;
    font-size: 0.92rem;
    line-height: 1.4;
  }

  .chat-input-row.svelte-er9dxv textarea:where(.svelte-er9dxv):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .send.svelte-er9dxv {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.6rem 1.1rem;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .send.svelte-er9dxv:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .send.svelte-er9dxv:disabled {
    opacity: 0.55;
    cursor: not-allowed;
  }

  .error.svelte-er9dxv {
    background: var(--danger-soft);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.9rem;
    font-size: 0.88rem;
    margin: 0.5rem 1rem;
  }

  .muted.svelte-er9dxv {
    color: var(--text-faint);
  }

  .small.svelte-er9dxv {
    font-size: 0.82rem;
  }

  .center.svelte-er9dxv {
    text-align: center;
    margin: auto;
  }

  .btn-primary.svelte-er9dxv {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.9rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-primary.svelte-er9dxv:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-secondary.svelte-er9dxv {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.8rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-er9dxv:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-danger.svelte-er9dxv {
    background: transparent;
    border: 1px solid var(--danger);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.8rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-danger.svelte-er9dxv:hover {
    background: var(--danger-soft);
  }

  button.svelte-er9dxv:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .retry-inline.svelte-er9dxv {
    background: none;
    border: none;
    padding: 0;
    color: var(--accent);
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
  }


  /* The page itself never scrolls; only the week body and the sidebar do,
     so there is exactly one scrollbar per area. */
  .calendar-page.svelte-3ob38t {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 6.5rem);
    min-height: 0;
  }

  /* Week controls live in the sidebar, beside the day headers, so the
     calendar keeps the full page height. */
  .week-controls.svelte-3ob38t {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .week-nav.svelte-3ob38t {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .week-nav.svelte-3ob38t button:where(.svelte-3ob38t) {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
    white-space: nowrap;
  }

  .week-controls.svelte-3ob38t .btn-primary:where(.svelte-3ob38t) {
    width: 100%;
  }

  .notice.svelte-3ob38t {
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.9rem;
    font-size: 0.88rem;
    flex-shrink: 0;
  }

  .notice.error.svelte-3ob38t {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .muted.svelte-3ob38t {
    color: var(--text-muted);
  }

  .small.svelte-3ob38t {
    font-size: 0.82rem;
  }

  .layout.svelte-3ob38t {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    gap: 1rem;
    align-items: stretch;
    flex: 1;
    min-height: 0;
    margin-top: 0.75rem;
  }

  .calendar-wrap.svelte-3ob38t {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
  }

  /* The bars span the full calendar width (including the hour gutter) so
     they do not leave a bare corner; labels are inset to line up with the
     day columns below. */
  .nav-bars.svelte-3ob38t {
    flex-shrink: 0;
  }

  .bar.svelte-3ob38t {
    display: flex;
    align-items: center;
    text-align: center;
    color: var(--text-muted);
    padding-left: 56px;
    box-sizing: border-box;
    background: var(--bg-inset);
    overflow: hidden;
  }

  .bar.svelte-3ob38t span:where(.svelte-3ob38t) {
    display: block;
    padding: 0.05rem 0.5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* A month change gets a divider matching the day columns. */
  .bar.month.svelte-3ob38t span:where(.svelte-3ob38t) + span:where(.svelte-3ob38t),
  .bar.year.svelte-3ob38t span:where(.svelte-3ob38t) + span:where(.svelte-3ob38t) {
    border-left: 1px solid var(--border-strong);
  }

  .bar.year.svelte-3ob38t {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    border-bottom: 1px solid var(--border-default);
    font-weight: 700;
  }

  .bar.month.svelte-3ob38t {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--border-default);
  }

  .day-header.svelte-3ob38t {
    display: grid;
    grid-template-columns: 56px repeat(7, minmax(0, 1fr));
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
  }

  .day-name.svelte-3ob38t {
    text-align: center;
    padding: 0.4rem 0.25rem;
    font-size: 0.78rem;
    color: var(--text-muted);
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
  }

  .day-name.svelte-3ob38t b:where(.svelte-3ob38t) {
    color: var(--text-primary);
    font-size: 0.95rem;
  }

  .day-name.today.svelte-3ob38t {
    background: var(--accent-soft);
  }

  .day-name.today.svelte-3ob38t b:where(.svelte-3ob38t) {
    color: var(--accent);
  }

  .week-body.svelte-3ob38t {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: 56px repeat(7, minmax(0, 1fr));
    overflow-y: auto;
  }

  .gutter.hours.svelte-3ob38t {
    display: flex;
    flex-direction: column;
    /* Hour lines follow the stretched hour scale. */
    background-image: repeating-linear-gradient(
      to bottom,
      var(--border-default) 0 1px,
      transparent 1px var(--px-hour)
    );
  }

  .hour-label.svelte-3ob38t {
    box-sizing: border-box;
    height: var(--px-hour);
    color: var(--text-faint);
    font-size: 0.7rem;
    text-align: right;
    padding: 2px 0.4rem 0 0;
  }

  .day-column.svelte-3ob38t {
    position: relative;
    border-left: 1px solid var(--border-default);
    /* Half-hour lines share the stretched scale, so events, slots and
       lines stay aligned at any zoom. */
    background-image: repeating-linear-gradient(
      to bottom,
      var(--border-default) 0 1px,
      transparent 1px var(--px-slot)
    );
  }

  .day-column.today.svelte-3ob38t {
    background-color: color-mix(in srgb, var(--accent) 7%, transparent);
  }

  .slot.svelte-3ob38t {
    box-sizing: border-box;
    cursor: pointer;
  }

  .slot.svelte-3ob38t:hover {
    background: var(--bg-hover);
  }

  /* Soft translucent body with a full-colour top ribbon. */
  .segment.svelte-3ob38t {
    position: absolute;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0.02rem;
    align-items: flex-start;
    text-align: left;
    border: 1px solid;
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.35rem 0.15rem;
    overflow: hidden;
    cursor: pointer;
    font-family: inherit;
  }

  .segment.svelte-3ob38t:hover {
    filter: brightness(1.12);
  }

  .segment-ribbon.svelte-3ob38t {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--event-color);
  }

  .segment-title.svelte-3ob38t {
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--text-primary);
    margin-top: 0.15rem;
  }

  .segment-user.svelte-3ob38t,
  .segment-res.svelte-3ob38t {
    font-size: 0.67rem;
    color: var(--text-muted);
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }

  .sidebar.svelte-3ob38t {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 0;
    overflow-y: auto;
  }

  .side-card.svelte-3ob38t {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.9rem 1rem;
    flex-shrink: 0;
  }

  .side-card.svelte-3ob38t h2:where(.svelte-3ob38t) {
    font-size: 1rem;
    margin: 0 0 0.6rem;
  }

  .side-head.svelte-3ob38t {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
  }

  .today-list.svelte-3ob38t {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.5rem;
  }

  .today-list.svelte-3ob38t li:where(.svelte-3ob38t) {
    display: flex;
    gap: 0.55rem;
    align-items: flex-start;
  }

  .dot.svelte-3ob38t {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-top: 0.3rem;
    flex-shrink: 0;
  }

  .today-time.svelte-3ob38t {
    font-size: 0.76rem;
    color: var(--text-faint);
    font-variant-numeric: tabular-nums;
  }

  .today-title.svelte-3ob38t {
    font-size: 0.88rem;
    color: var(--text-primary);
  }

  .resource-list.svelte-3ob38t {
    list-style: none;
    margin: 0.6rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.4rem;
  }

  .resource-list.svelte-3ob38t li:where(.svelte-3ob38t) {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--bg-inset);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.5rem;
  }

  .resource-info.svelte-3ob38t {
    flex: 1;
    min-width: 0;
  }

  .resource-name.svelte-3ob38t {
    color: var(--text-primary);
    font-size: 0.88rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .icon-btn.svelte-3ob38t {
    background: none;
    border: none;
    color: var(--text-faint);
    cursor: pointer;
    padding: 0.15rem 0.3rem;
    font-size: 0.8rem;
  }

  .icon-btn.svelte-3ob38t:hover {
    color: var(--danger);
  }

  .resource-form.svelte-3ob38t {
    display: grid;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
  }

  .field.svelte-3ob38t span:where(.svelte-3ob38t) {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.25rem;
  }

  .field.svelte-3ob38t > input:where(.svelte-3ob38t),
  .field.svelte-3ob38t > textarea:where(.svelte-3ob38t) /* (unused) .field > select*/ {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.55rem;
    font-family: inherit;
    font-size: 0.9rem;
    box-sizing: border-box;
  }

  .field.svelte-3ob38t > input:where(.svelte-3ob38t):focus,
  .field.svelte-3ob38t > textarea:where(.svelte-3ob38t):focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .time-grid.svelte-3ob38t {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.6rem;
    margin: 0.6rem 0;
  }

  .booking-list.svelte-3ob38t {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.35rem;
    max-height: 210px;
    overflow-y: auto;
  }

  .booking-list.svelte-3ob38t li:where(.svelte-3ob38t) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    background: var(--bg-inset);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.6rem;
  }

  .booking-row.svelte-3ob38t {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    flex: 1;
    min-width: 0;
  }

  .booking-row.svelte-3ob38t input[type="checkbox"]:where(.svelte-3ob38t) {
    width: auto;
    flex-shrink: 0;
    accent-color: var(--accent);
  }

  .booking-name.svelte-3ob38t {
    color: var(--text-primary);
    font-size: 0.88rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .capacity-chip.svelte-3ob38t {
    color: var(--text-faint);
    font-size: 0.74rem;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .units-input.svelte-3ob38t {
    width: 64px;
    flex-shrink: 0;
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.4rem;
    font-family: inherit;
  }

  .tag.svelte-3ob38t {
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.55rem;
    font-size: 0.75rem;
    color: var(--text-muted);
    font-weight: 600;
    white-space: nowrap;
  }

  .draft-note.svelte-3ob38t {
    background: var(--accent-soft);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.7rem;
    font-size: 0.84rem;
    margin: 0 0 0.6rem;
  }

  .link-btn.svelte-3ob38t {
    background: none;
    border: none;
    color: var(--accent);
    cursor: pointer;
    font-family: inherit;
    font-size: 0.84rem;
    text-decoration: underline;
    padding: 0;
  }

  .modal-overlay.svelte-3ob38t {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 1rem;
  }

  .modal.svelte-3ob38t {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.5rem;
    width: 92%;
    max-width: 620px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: var(--shadow);
  }

  .modal.svelte-3ob38t h2:where(.svelte-3ob38t) {
    margin: 0 0 0.9rem;
  }

  .modal-actions.svelte-3ob38t {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    margin-top: 1rem;
  }

  .spacer.svelte-3ob38t {
    flex: 1;
  }

  .btn-primary.svelte-3ob38t {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.5rem 1rem;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-primary.svelte-3ob38t:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-secondary.svelte-3ob38t {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.9rem;
    font-size: 0.88rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-3ob38t:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-secondary.tiny.svelte-3ob38t {
    padding: 0.2rem 0.6rem;
    font-size: 0.76rem;
  }

  .btn-danger-outline.svelte-3ob38t {
    background: transparent;
    border: 1px solid var(--danger);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.9rem;
    font-size: 0.88rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-danger-outline.svelte-3ob38t:hover:not(:disabled) {
    background: var(--danger-soft);
  }

  .btn-primary.svelte-3ob38t:disabled,
  .btn-secondary.svelte-3ob38t:disabled,
  .btn-danger-outline.svelte-3ob38t:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  @media (max-width: 980px) {
    .calendar-page.svelte-3ob38t {
      height: auto;
    }

    .layout.svelte-3ob38t {
      grid-template-columns: 1fr;
    }

    .week-body.svelte-3ob38t {
      max-height: 60vh;
    }
  }


  .panel.svelte-1pj4m0z {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    box-shadow: var(--shadow);
  }

  .panel-head.svelte-1pj4m0z {
    padding: 0.9rem 1rem 0.75rem;
    border-bottom: 1px solid var(--border-default);
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
  }

  .title-row.svelte-1pj4m0z {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
  }

  h2.svelte-1pj4m0z {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .controls.svelte-1pj4m0z {
    display: flex;
    gap: 0.5rem;
  }

  .search.svelte-1pj4m0z {
    flex: 1;
    min-width: 0;
  }

  .controls.svelte-1pj4m0z select:where(.svelte-1pj4m0z) {
    flex: 1;
    min-width: 0;
  }

  .io-row.svelte-1pj4m0z {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
  }

  .primary.svelte-1pj4m0z {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
    white-space: nowrap;
  }

  .primary.svelte-1pj4m0z:hover {
    background-color: var(--accent-hover);
  }

  .ghost.svelte-1pj4m0z {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
    font-size: 0.8rem;
    padding: 0.25rem 0.55rem;
  }

  .ghost.svelte-1pj4m0z:hover {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .filter-note.svelte-1pj4m0z {
    margin: 0 0 0 auto;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--accent);
  }

  .notice.svelte-1pj4m0z {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .item-list.svelte-1pj4m0z {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
  }

  .item-card.svelte-1pj4m0z {
    display: flex;
    align-items: stretch;
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
    user-select: none;
    transition: border-color 0.15s ease, background-color 0.15s ease;
  }

  .item-card.svelte-1pj4m0z:hover {
    background-color: var(--bg-hover);
  }

  .item-card.active.svelte-1pj4m0z {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
  }

  .item-body.svelte-1pj4m0z {
    flex: 1;
    min-width: 0;
  }

  .item-row.svelte-1pj4m0z {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 0.6rem;
    padding: 0.6rem;
    align-items: flex-start;
    cursor: pointer;
  }

  .expand-edge.svelte-1pj4m0z {
    flex-shrink: 0;
    width: 2rem;
    border: none;
    border-left: 1px solid var(--border-default);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    background-color: transparent;
    color: var(--text-faint);
    font-size: 0.85rem;
    line-height: 1;
    cursor: pointer;
  }

  .expand-edge.svelte-1pj4m0z:hover {
    background-color: var(--bg-active);
    color: var(--text-primary);
  }

  .thumb.svelte-1pj4m0z {
    width: 3rem;
    height: 3rem;
    border-radius: var(--radius-sm);
    overflow: hidden;
    flex-shrink: 0;
    background-color: var(--bg-inset);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .thumb.svelte-1pj4m0z img:where(.svelte-1pj4m0z) {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .thumb-fallback.svelte-1pj4m0z {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-faint);
  }

  .item-info.svelte-1pj4m0z {
    flex: 1;
    min-width: 0;
  }

  .name-line.svelte-1pj4m0z {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    flex-wrap: wrap;
  }

  .name.svelte-1pj4m0z {
    font-weight: 600;
    color: var(--text-primary);
  }

  .category.svelte-1pj4m0z {
    font-size: 0.66rem;
    font-weight: 600;
    color: var(--text-muted);
    background-color: var(--bg-active);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.4rem;
    white-space: nowrap;
  }

  .incoming.svelte-1pj4m0z {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--warning);
    background-color: var(--warning-soft);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.4rem;
    white-space: nowrap;
  }

  .description.svelte-1pj4m0z {
    margin: 0.15rem 0 0.35rem;
    font-size: 0.78rem;
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    user-select: text;
  }

  .health.svelte-1pj4m0z {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .bar.svelte-1pj4m0z {
    flex: 1;
    height: 0.5rem;
    border-radius: var(--radius-pill);
    background-color: var(--bg-active);
    overflow: hidden;
  }

  .fill.svelte-1pj4m0z {
    height: 100%;
    border-radius: var(--radius-pill);
    transition: width 0.25s ease, background-color 0.25s ease;
  }

  .amounts.svelte-1pj4m0z {
    font-size: 0.75rem;
    color: var(--text-muted);
    white-space: nowrap;
  }

  .containers.svelte-1pj4m0z {
    border-top: 1px solid var(--border-default);
    padding: 0.4rem 0.6rem 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }

  .container-line.svelte-1pj4m0z {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 0.74rem;
    color: var(--text-muted);
  }

  .container-label.svelte-1pj4m0z {
    color: var(--text-secondary);
    font-weight: 500;
    white-space: nowrap;
  }

  .container-room.svelte-1pj4m0z {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .container-units.svelte-1pj4m0z {
    white-space: nowrap;
  }

  .empty-line.svelte-1pj4m0z {
    margin: 0;
    font-size: 0.75rem;
    color: var(--text-faint);
    font-style: italic;
  }

  .empty-state.svelte-1pj4m0z {
    text-align: center;
    color: var(--text-faint);
    padding: 2rem 1rem;
    font-size: 0.85rem;
  }

  .filter-footer.svelte-1pj4m0z {
    margin: 0;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--border-default);
    background-color: var(--accent-soft);
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 600;
    text-align: center;
  }

  @media (max-width: 1100px) {
    .panel.svelte-1pj4m0z {
      max-height: 70vh;
    }
  }


  .panel.svelte-10duvvx {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    box-shadow: var(--shadow);
  }

  .panel-head.svelte-10duvvx {
    padding: 0.9rem 1rem 0.75rem;
    border-bottom: 1px solid var(--border-default);
  }

  .title-row.svelte-10duvvx {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
  }

  h2.svelte-10duvvx {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .ghost.svelte-10duvvx {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
    font-size: 0.8rem;
    padding: 0.25rem 0.6rem;
  }

  .ghost.svelte-10duvvx:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .ghost.active.svelte-10duvvx {
    border-color: var(--accent);
    color: var(--accent);
  }

  /* Constant-height summary of the selected item (mirrors the list card).
     The whole zone is clickable to bring back "all places". */
  .head-zone.svelte-10duvvx {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    width: 100%;
    min-height: 3.1rem;
    margin-top: 0.55rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background-color: var(--bg-card);
    color: inherit;
    font: inherit;
    text-align: left;
    user-select: none;
  }

  .head-zone.svelte-10duvvx:not(.filled) {
    justify-content: center;
  }

  .head-zone.clearable.svelte-10duvvx {
    cursor: pointer;
  }

  .head-zone.clearable.svelte-10duvvx:hover {
    border-color: var(--accent);
  }

  .zone-hint.svelte-10duvvx {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--accent);
    background-color: var(--accent-soft);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.45rem;
    white-space: nowrap;
  }

  .strip-thumb.svelte-10duvvx {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background-color: var(--bg-inset);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-weight: 600;
    color: var(--text-faint);
  }

  .strip-thumb.svelte-10duvvx img:where(.svelte-10duvvx) {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .strip-info.svelte-10duvvx {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }

  .strip-name.svelte-10duvvx {
    font-weight: 600;
    color: var(--text-primary);
    font-size: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .strip-health.svelte-10duvvx {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .strip-bar.svelte-10duvvx {
    display: block;
    flex: 1;
    height: 0.45rem;
    border-radius: var(--radius-pill);
    background-color: var(--bg-active);
    overflow: hidden;
  }

  .strip-fill.svelte-10duvvx {
    display: block;
    height: 100%;
    border-radius: var(--radius-pill);
  }

  .strip-amounts.svelte-10duvvx {
    font-size: 0.74rem;
    color: var(--text-muted);
    white-space: nowrap;
  }

  .strip-hint.svelte-10duvvx {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    text-align: center;
  }

  .map-frame.svelte-10duvvx {
    flex: 1;
    min-height: 0;
    margin: 0.6rem 0.75rem 0.75rem;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: outline-color 0.15s ease;
  }

  .map-frame.all-selected.svelte-10duvvx {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
  }

  .frame-bar.svelte-10duvvx,
  .frame-foot.svelte-10duvvx {
    background-color: var(--bg-inset);
    border: none;
    border-radius: 0;
    color: var(--text-muted);
    font-size: 0.76rem;
    text-align: center;
    padding: 0.35rem 0.5rem;
    user-select: none;
  }

  .frame-bar.svelte-10duvvx {
    border-bottom: 1px solid var(--border-default);
  }

  .frame-foot.svelte-10duvvx {
    border-top: 1px solid var(--border-default);
  }

  .frame-bar.svelte-10duvvx:hover,
  .frame-foot.svelte-10duvvx:hover {
    color: var(--text-primary);
    background-color: var(--bg-hover);
  }

  .frame-bar.active.svelte-10duvvx,
  .frame-foot.active.svelte-10duvvx {
    color: var(--accent);
    font-weight: 600;
  }

  .frame-body.svelte-10duvvx {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
  }

  .location.svelte-10duvvx {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
  }

  .location-head.svelte-10duvvx {
    position: relative;
    background-color: var(--bg-card);
    border-radius: var(--radius-md);
    padding: 0.55rem 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border: 1px solid transparent;
    user-select: none;
  }

  .location-head.svelte-10duvvx:hover {
    border-color: var(--border-strong);
  }

  .location-head.selected.svelte-10duvvx {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
    z-index: 1;
  }

  .location-head.partial.svelte-10duvvx {
    outline: 3px dashed var(--accent-muted);
    outline-offset: 2px;
  }

  .location-name.svelte-10duvvx {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mark.svelte-10duvvx {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 0.03em;
  }

  .rooms.svelte-10duvvx {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 0.5rem;
    padding: 0 0.15rem;
  }

  .room.svelte-10duvvx {
    position: relative;
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.55rem 0.6rem;
    min-height: 3.4rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.3rem;
    user-select: none;
    transition: border-color 0.12s ease, transform 0.12s ease;
  }

  .room.svelte-10duvvx:hover {
    border-color: var(--border-strong);
  }

  .room.selected.svelte-10duvvx {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
    z-index: 1;
  }

  .room.dragover.svelte-10duvvx {
    border-color: var(--accent);
    transform: scale(1.02);
  }

  .room.dragging.svelte-10duvvx {
    opacity: 0.5;
  }

  .room-name.svelte-10duvvx {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .room-amount.svelte-10duvvx {
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .place-actions.svelte-10duvvx {
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    display: flex;
    gap: 0.1rem;
  }

  .icon.svelte-10duvvx {
    background: none;
    border: none;
    padding: 0.1rem 0.25rem;
    font-size: 0.75rem;
    line-height: 1;
    color: var(--text-faint);
    border-radius: var(--radius-sm);
  }

  .icon.svelte-10duvvx:hover {
    background-color: var(--bg-active);
    color: var(--text-primary);
  }

  .icon.danger.svelte-10duvvx:hover {
    color: var(--danger);
  }

  .add-room.svelte-10duvvx {
    background: none;
    border: 1px dashed var(--border-strong);
    border-radius: var(--radius-md);
    color: var(--text-muted);
    font-size: 0.78rem;
    min-height: 3.4rem;
  }

  .add-room.svelte-10duvvx:hover {
    border-color: var(--accent);
    color: var(--accent);
  }

  .inline-edit.svelte-10duvvx {
    display: flex;
    gap: 0.35rem;
    align-items: center;
  }

  .inline-edit.svelte-10duvvx input:where(.svelte-10duvvx) {
    flex: 1;
    min-width: 0;
  }

  .room-edit.svelte-10duvvx {
    min-height: 3.4rem;
  }

  .add-location.svelte-10duvvx {
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--border-default);
    background-color: var(--bg-inset);
  }

  .empty-state.svelte-10duvvx {
    text-align: center;
    color: var(--text-faint);
    font-size: 0.85rem;
    padding: 2rem 1rem;
  }

  @media (max-width: 1100px) {
    .panel.svelte-10duvvx {
      max-height: 70vh;
    }
  }


  .deliveries.svelte-1qrffrz {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .delivery-list.svelte-1qrffrz {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .delivery.svelte-1qrffrz {
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.55rem 0.65rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
  }

  .delivery.pending.svelte-1qrffrz {
    border-left: 3px solid var(--warning);
  }

  .delivery.delivered.svelte-1qrffrz {
    border-left: 3px solid var(--success);
    opacity: 0.85;
  }

  .delivery.cancelled.svelte-1qrffrz {
    border-left: 3px solid var(--danger);
    opacity: 0.6;
  }

  .delivery-info.svelte-1qrffrz {
    min-width: 0;
  }

  .delivery-main.svelte-1qrffrz {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
    font-size: 0.85rem;
    color: var(--text-primary);
  }

  .route.svelte-1qrffrz {
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .delivery-meta.svelte-1qrffrz {
    font-size: 0.72rem;
    color: var(--text-faint);
    margin-top: 0.15rem;
  }

  .delivery-actions.svelte-1qrffrz {
    display: flex;
    gap: 0.3rem;
    flex-shrink: 0;
  }

  .small.svelte-1qrffrz {
    font-size: 0.76rem;
    padding: 0.25rem 0.55rem;
  }

  .primary.svelte-1qrffrz {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .ghost.svelte-1qrffrz {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-1qrffrz:hover {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .empty.svelte-1qrffrz {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-faint);
    font-style: italic;
  }

  .history-toggle.svelte-1qrffrz {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 0.76rem;
    text-align: left;
    padding: 0.1rem 0;
    align-self: flex-start;
  }

  .history-toggle.svelte-1qrffrz:hover {
    color: var(--text-primary);
  }

  .history-toggle.show-all.svelte-1qrffrz {
    color: var(--accent);
    font-weight: 600;
  }


  .panel.svelte-1w05d5p {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    box-shadow: var(--shadow);
  }

  .panel-head.svelte-1w05d5p {
    padding: 0.9rem 1rem 0.8rem;
    border-bottom: 1px solid var(--border-default);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .item-head.svelte-1w05d5p {
    display: flex;
    gap: 0.7rem;
    align-items: flex-start;
  }

  .thumb.svelte-1w05d5p {
    width: 3.6rem;
    height: 3.6rem;
    border-radius: var(--radius-md);
    overflow: hidden;
    background-color: var(--bg-inset);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .thumb.svelte-1w05d5p img:where(.svelte-1w05d5p) {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .thumb-fallback.svelte-1w05d5p {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--text-faint);
  }

  .item-title.svelte-1w05d5p {
    flex: 1;
    min-width: 0;
  }

  h2.svelte-1w05d5p {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.2rem;
  }

  .description.svelte-1w05d5p {
    margin: 0.2rem 0 0.3rem;
    font-size: 0.8rem;
    color: var(--text-muted);
    user-select: text;
  }

  .chips.svelte-1w05d5p {
    display: flex;
    gap: 0.3rem;
    flex-wrap: wrap;
  }

  .chip.svelte-1w05d5p {
    font-size: 0.68rem;
    color: var(--text-muted);
    background-color: var(--bg-hover);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.45rem;
  }

  .chip.category.svelte-1w05d5p {
    background-color: var(--accent-soft);
    color: var(--accent);
    font-weight: 600;
  }

  .head-actions.svelte-1w05d5p {
    display: flex;
    gap: 0.3rem;
  }

  .stats.svelte-1w05d5p {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 0.6rem;
    align-items: end;
  }

  .stat.svelte-1w05d5p {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }

  .stat.side.svelte-1w05d5p {
    align-items: flex-end;
  }

  .stat-label.svelte-1w05d5p {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-faint);
  }

  .stat-value.svelte-1w05d5p {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--text-primary);
  }

  .stat-value.incoming.svelte-1w05d5p {
    color: var(--warning);
  }

  .bar.svelte-1w05d5p {
    height: 0.5rem;
    border-radius: var(--radius-pill);
    background-color: var(--bg-active);
    overflow: hidden;
    margin-top: 0.15rem;
  }

  .fill.svelte-1w05d5p {
    height: 100%;
    border-radius: var(--radius-pill);
    transition: width 0.25s ease, background-color 0.25s ease;
  }

  .actions.svelte-1w05d5p {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
  }

  .primary.svelte-1w05d5p {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-1w05d5p:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }

  .ghost.svelte-1w05d5p {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-1w05d5p:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .ghost.danger.svelte-1w05d5p:hover:not(:disabled) {
    color: var(--danger);
    border-color: var(--danger);
  }

  .small.svelte-1w05d5p {
    font-size: 0.8rem;
    padding: 0.28rem 0.6rem;
  }

  .tiny.svelte-1w05d5p {
    font-size: 0.72rem;
    padding: 0.15rem 0.4rem;
  }

  .details-scroll.svelte-1w05d5p {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0.85rem 1rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
  }

  .more-info.svelte-1w05d5p {
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
  }

  .more-toggle.svelte-1w05d5p {
    width: 100%;
    background: none;
    border: none;
    border-radius: 0;
    text-align: left;
    padding: 0.5rem 0.65rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-secondary);
  }

  .more-toggle.svelte-1w05d5p:hover,
  .more-toggle.open.svelte-1w05d5p {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .more-text.svelte-1w05d5p {
    padding: 0.2rem 0.7rem 0.7rem;
    font-size: 0.82rem;
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-break: break-word;
    user-select: text;
  }

  .more-text.svelte-1w05d5p a:where(.svelte-1w05d5p) {
    color: var(--text-link);
  }

  .cost-line.svelte-1w05d5p {
    padding: 0 0.7rem 0.6rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .cost-line.svelte-1w05d5p strong:where(.svelte-1w05d5p) {
    color: var(--text-primary);
  }

  .usage.svelte-1w05d5p {
    padding: 0 0.7rem 0.7rem;
  }

  .usage.svelte-1w05d5p h5:where(.svelte-1w05d5p) {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
  }

  .usage-list.svelte-1w05d5p {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
  }

  .usage-row.svelte-1w05d5p {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--text-secondary);
  }

  .usage-user.svelte-1w05d5p {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .usage-amount.svelte-1w05d5p {
    color: var(--text-primary);
    white-space: nowrap;
  }

  .usage-cost.svelte-1w05d5p {
    color: var(--text-muted);
    white-space: nowrap;
  }

  .usage-row.total.svelte-1w05d5p {
    border-top: 1px solid var(--border-default);
    margin-top: 0.25rem;
    padding-top: 0.3rem;
    font-weight: 600;
  }

  .block-head.svelte-1w05d5p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
  }

  h3.svelte-1w05d5p {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-secondary);
  }

  .view-toggle.svelte-1w05d5p {
    display: flex;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    overflow: hidden;
    background-color: var(--bg-inset);
  }

  .view-toggle.svelte-1w05d5p button:where(.svelte-1w05d5p) {
    background: none;
    border: none;
    border-radius: 0;
    padding: 0.22rem 0.6rem;
    font-size: 0.72rem;
    color: var(--text-muted);
  }

  .view-toggle.svelte-1w05d5p button.active:where(.svelte-1w05d5p) {
    background-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .container-section.svelte-1w05d5p + .container-section:where(.svelte-1w05d5p) {
    margin-top: 0.6rem;
  }

  .container-section.svelte-1w05d5p h4:where(.svelte-1w05d5p) {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-faint);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.35rem;
  }

  .section-count.svelte-1w05d5p {
    background-color: var(--bg-active);
    border-radius: var(--radius-pill);
    padding: 0.02rem 0.35rem;
    font-size: 0.68rem;
    color: var(--text-muted);
  }

  .container-list.svelte-1w05d5p {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
  }

  .container-row.svelte-1w05d5p {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.4rem 0.5rem;
    font-size: 0.8rem;
    user-select: none;
  }

  .container-row.svelte-1w05d5p input[type="checkbox"]:where(.svelte-1w05d5p) {
    width: 1rem;
    height: 1rem;
    accent-color: var(--accent);
    flex-shrink: 0;
  }

  .container-row.flat.svelte-1w05d5p,
  .container-row.child.svelte-1w05d5p {
    background-color: var(--bg-inset);
  }

  .container-main.svelte-1w05d5p {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    cursor: pointer;
  }

  .container-title.svelte-1w05d5p {
    color: var(--text-primary);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .container-sub.svelte-1w05d5p {
    font-size: 0.72rem;
    color: var(--text-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .container-bar.svelte-1w05d5p {
    width: 3.5rem;
    height: 0.35rem;
    background-color: var(--bg-active);
    border-radius: var(--radius-pill);
    overflow: hidden;
    flex-shrink: 0;
  }

  .container-fill.svelte-1w05d5p {
    height: 100%;
    background-color: var(--accent);
    border-radius: var(--radius-pill);
  }

  .units.svelte-1w05d5p {
    font-size: 0.78rem;
    color: var(--text-muted);
    white-space: nowrap;
  }

  .expand.svelte-1w05d5p {
    background: none;
    border: none;
    color: var(--text-faint);
    line-height: 1;
  }

  .expand.svelte-1w05d5p:hover {
    color: var(--text-primary);
  }

  .group-children.svelte-1w05d5p {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin: 0.3rem 0 0.3rem 1.7rem;
  }

  .icon.svelte-1w05d5p {
    background: none;
    border: none;
    color: var(--text-faint);
    font-size: 0.8rem;
    line-height: 1;
    padding: 0.1rem 0.3rem;
  }

  .icon.danger.svelte-1w05d5p:hover {
    color: var(--danger);
  }

  .empty.svelte-1w05d5p {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-faint);
    font-style: italic;
  }

  .empty-state.svelte-1w05d5p {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem;
    color: var(--text-faint);
  }

  .empty-icon.svelte-1w05d5p {
    font-size: 2.5rem;
    opacity: 0.4;
    margin-bottom: 0.5rem;
  }

  .empty-state.svelte-1w05d5p h3:where(.svelte-1w05d5p) {
    margin: 0 0 0.35rem;
    color: var(--text-muted);
    font-size: 1rem;
  }

  .empty-state.svelte-1w05d5p p:where(.svelte-1w05d5p) {
    margin: 0;
    font-size: 0.82rem;
    max-width: 240px;
  }

  @media (max-width: 1100px) {
    .panel.svelte-1w05d5p {
      max-height: 70vh;
    }
  }


  .overlay.svelte-1xgo08y {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
  }

  .modal.svelte-1xgo08y {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    width: 100%;
    max-width: 540px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 1.25rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
  }

  h2.svelte-1xgo08y {
    margin: 0 0 0.25rem;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .image-row.svelte-1xgo08y {
    display: flex;
    align-items: center;
    gap: 0.9rem;
  }

  .preview.svelte-1xgo08y {
    width: 4rem;
    height: 4rem;
    border-radius: var(--radius-md);
    overflow: hidden;
    background-color: var(--bg-inset);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .preview.svelte-1xgo08y img:where(.svelte-1xgo08y) {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .fallback.svelte-1xgo08y {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--text-faint);
  }

  .image-actions.svelte-1xgo08y {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: flex-start;
  }

  .file.svelte-1xgo08y {
    font-size: 0.8rem;
    color: var(--text-secondary);
    background-color: var(--bg-hover);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.6rem;
    cursor: pointer;
  }

  .file.svelte-1xgo08y input:where(.svelte-1xgo08y) {
    display: none;
  }

  .grid.svelte-1xgo08y {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
  }

  .field.svelte-1xgo08y {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .field.svelte-1xgo08y input:where(.svelte-1xgo08y) {
    font-size: 0.9rem;
  }

  .field.svelte-1xgo08y textarea:where(.svelte-1xgo08y) {
    font-size: 0.85rem;
    resize: vertical;
    min-height: 4.5rem;
    font-family: inherit;
  }

  .error.svelte-1xgo08y {
    margin: 0;
    color: var(--danger);
    font-size: 0.8rem;
  }

  .history-row.svelte-1xgo08y {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-top: 1px solid var(--border-default);
    padding-top: 0.6rem;
  }

  .history-note.svelte-1xgo08y {
    font-size: 0.78rem;
    color: var(--success);
  }

  .modal-actions.svelte-1xgo08y {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.35rem;
  }

  .ghost.svelte-1xgo08y {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-1xgo08y:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .small.svelte-1xgo08y {
    font-size: 0.78rem;
  }

  .primary.svelte-1xgo08y {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-1xgo08y:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }


  .overlay.svelte-1w6wgnw {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
  }

  .modal.svelte-1w6wgnw {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    width: 100%;
    max-width: 440px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 1.25rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
  }

  h2.svelte-1w6wgnw {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .sub.svelte-1w6wgnw {
    margin: -0.4rem 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
  }

  .grid.svelte-1w6wgnw {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
  }

  .field.svelte-1w6wgnw {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .hint.svelte-1w6wgnw {
    margin: 0;
    font-size: 0.76rem;
    color: var(--text-faint);
  }

  .error.svelte-1w6wgnw {
    margin: 0;
    color: var(--danger);
    font-size: 0.8rem;
  }

  .modal-actions.svelte-1w6wgnw {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.35rem;
  }

  .ghost.svelte-1w6wgnw {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-1w6wgnw:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .primary.svelte-1w6wgnw {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-1w6wgnw:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }


  .overlay.svelte-1kxfv2g {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
  }

  .modal.svelte-1kxfv2g {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    width: 100%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 1.25rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
  }

  h2.svelte-1kxfv2g {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .sub.svelte-1kxfv2g {
    margin: -0.4rem 0 0.15rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .grid.two.svelte-1kxfv2g {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
  }

  .field.svelte-1kxfv2g {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .container-picker.svelte-1kxfv2g {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    max-height: 16rem;
    overflow-y: auto;
    background-color: var(--bg-inset);
    border-radius: var(--radius-md);
    padding: 0.5rem;
  }

  .picker-row.svelte-1kxfv2g {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.5rem;
    font-size: 0.82rem;
  }

  .picker-row.checked.svelte-1kxfv2g {
    border-color: var(--accent);
  }

  .picker-label.svelte-1kxfv2g {
    flex: 1;
    color: var(--text-primary);
  }

  .move-amount.svelte-1kxfv2g {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .move-amount.svelte-1kxfv2g input:where(.svelte-1kxfv2g) {
    width: 4.5rem;
    font-size: 0.82rem;
  }

  .empty.svelte-1kxfv2g {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-faint);
    font-style: italic;
    padding: 0.5rem;
  }

  .error.svelte-1kxfv2g {
    margin: 0;
    color: var(--danger);
    font-size: 0.8rem;
  }

  .modal-actions.svelte-1kxfv2g {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.35rem;
  }

  .ghost.svelte-1kxfv2g {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-1kxfv2g:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .primary.svelte-1kxfv2g {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-1kxfv2g:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }


  .overlay.svelte-5ajqg1 {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
  }

  .modal.svelte-5ajqg1 {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    width: 100%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 1.25rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
  }

  h2.svelte-5ajqg1 {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .sub.svelte-5ajqg1 {
    margin: -0.4rem 0 0.15rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .grid.two.svelte-5ajqg1 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
  }

  .field.svelte-5ajqg1 {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .splits.svelte-5ajqg1 {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    background-color: var(--bg-inset);
    border-radius: var(--radius-md);
    padding: 0.55rem;
  }

  .splits-head.svelte-5ajqg1 {
    display: flex;
    justify-content: space-between;
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .splits-head.svelte-5ajqg1 .bad:where(.svelte-5ajqg1) {
    color: var(--warning);
  }

  .splits-head.svelte-5ajqg1 .good:where(.svelte-5ajqg1) {
    color: var(--success);
  }

  .split-row.svelte-5ajqg1 {
    display: flex;
    gap: 0.4rem;
    align-items: center;
  }

  .split-row.svelte-5ajqg1 select:where(.svelte-5ajqg1) {
    flex: 1;
    min-width: 0;
  }

  .split-row.svelte-5ajqg1 input:where(.svelte-5ajqg1) {
    width: 4.5rem;
  }

  .icon.svelte-5ajqg1 {
    background: none;
    border: none;
    color: var(--text-faint);
    font-size: 0.85rem;
    padding: 0.1rem 0.3rem;
  }

  .icon.danger.svelte-5ajqg1:hover {
    color: var(--danger);
  }

  .ghost.svelte-5ajqg1 {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
    align-self: flex-start;
  }

  .ghost.svelte-5ajqg1:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .small.svelte-5ajqg1 {
    font-size: 0.78rem;
    padding: 0.25rem 0.55rem;
  }

  .error.svelte-5ajqg1 {
    margin: 0;
    color: var(--danger);
    font-size: 0.8rem;
  }

  .modal-actions.svelte-5ajqg1 {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.35rem;
  }

  .primary.svelte-5ajqg1 {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-5ajqg1:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }


  .overlay.svelte-wq64cc {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
  }

  .modal.svelte-wq64cc {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    width: 100%;
    max-width: 400px;
    padding: 1.25rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
  }

  h2.svelte-wq64cc {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .sub.svelte-wq64cc {
    margin: -0.4rem 0 0.15rem;
    font-size: 0.82rem;
    color: var(--text-muted);
  }

  .field.svelte-wq64cc {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  .amount-row.svelte-wq64cc {
    display: flex;
    gap: 0.4rem;
  }

  .amount-row.svelte-wq64cc input:where(.svelte-wq64cc) {
    flex: 1;
  }

  .small.svelte-wq64cc {
    font-size: 0.78rem;
  }

  .hint.svelte-wq64cc {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .hint.zero.svelte-wq64cc {
    color: var(--warning);
  }

  .error.svelte-wq64cc {
    margin: 0;
    color: var(--danger);
    font-size: 0.8rem;
  }

  .modal-actions.svelte-wq64cc {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.35rem;
  }

  .ghost.svelte-wq64cc {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-wq64cc:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .primary.svelte-wq64cc {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-wq64cc:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }


  .overlay.svelte-1d8exci {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 1rem;
  }

  .modal.svelte-1d8exci {
    background-color: var(--bg-raised);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    width: 100%;
    max-width: 480px;
    padding: 1.25rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
  }

  h2.svelte-1d8exci {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
  }

  .sub.svelte-1d8exci {
    margin: -0.4rem 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.4;
  }

  .check.svelte-1d8exci {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
    font-size: 0.8rem;
    color: var(--text-muted);
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.55rem 0.65rem;
    cursor: pointer;
  }

  .check.svelte-1d8exci input:where(.svelte-1d8exci) {
    margin-top: 0.15rem;
    accent-color: var(--accent);
  }

  .check.svelte-1d8exci strong:where(.svelte-1d8exci) {
    color: var(--text-primary);
  }

  .file.svelte-1d8exci {
    font-size: 0.85rem;
    color: var(--text-secondary);
    background-color: var(--bg-hover);
    border: 1px dashed var(--border-strong);
    border-radius: var(--radius-md);
    padding: 0.6rem 0.7rem;
    text-align: center;
    cursor: pointer;
  }

  .file.svelte-1d8exci:hover {
    border-color: var(--accent);
    color: var(--text-primary);
  }

  .file.svelte-1d8exci input:where(.svelte-1d8exci) {
    display: none;
  }

  .error.svelte-1d8exci {
    margin: 0;
    color: var(--danger);
    font-size: 0.8rem;
  }

  .modal-actions.svelte-1d8exci {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
  }

  .ghost.svelte-1d8exci {
    background-color: transparent;
    border-color: var(--border-default);
    color: var(--text-muted);
  }

  .ghost.svelte-1d8exci:hover:not(:disabled) {
    background-color: var(--bg-hover);
    color: var(--text-primary);
  }

  .primary.svelte-1d8exci {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
  }

  .primary.svelte-1d8exci:hover:not(:disabled) {
    background-color: var(--accent-hover);
  }


  .inventory-page.svelte-65nl37 {
    display: grid;
    grid-template-columns: minmax(300px, 1.05fr) minmax(340px, 1.15fr) minmax(340px, 1.3fr);
    /* minmax(0, 1fr) keeps the row exactly viewport-tall so each panel's own
       scroll area works instead of the page growing. */
    grid-auto-rows: minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem 1.25rem;
    height: calc(100vh - 6.5rem);
    box-sizing: border-box;
  }

  .loading.svelte-65nl37 {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    color: var(--text-faint);
  }

  .retry.svelte-65nl37 {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.7rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .retry.svelte-65nl37:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .toast.svelte-65nl37 {
    position: fixed;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--danger-soft);
    color: var(--danger);
    border: 1px solid var(--danger);
    border-radius: var(--radius-pill);
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    cursor: pointer;
    z-index: 1200;
    box-shadow: var(--shadow);
    max-width: 80vw;
  }

  .dismiss.svelte-65nl37 {
    margin-left: 0.4rem;
    opacity: 0.7;
  }

  @media (max-width: 1100px) {
    .inventory-page.svelte-65nl37 {
      grid-template-columns: 1fr;
      height: auto;
      padding: 1rem;
    }
  }


  .pipelines-bar.svelte-16pamub {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
  }

  .page-status.svelte-16pamub {
    color: var(--text-muted);
    font-size: 0.85rem;
  }

  .page-status.svelte-16pamub strong:where(.svelte-16pamub) {
    color: var(--text-secondary);
  }

  .bar-actions.svelte-16pamub {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
  }

  .btn-secondary.svelte-16pamub,
  .btn-danger.svelte-16pamub {
    box-sizing: border-box;
    border-radius: 6px;
    padding: 0.45rem 0.9rem;
    font-family: inherit;
    font-size: 0.88rem;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
  }

  .btn-secondary.svelte-16pamub {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
  }

  .btn-secondary.svelte-16pamub:hover {
    border-color: var(--accent);
  }

  .btn-danger.svelte-16pamub {
    background: transparent;
    border: 1px solid var(--danger);
    color: var(--danger);
  }

  .btn-danger.svelte-16pamub:hover:not(:disabled) {
    background: var(--danger-soft);
  }

  .btn-danger.svelte-16pamub:disabled {
    opacity: 0.5;
    cursor: default;
  }

  .file-btn.svelte-16pamub {
    display: inline-flex;
    align-items: center;
  }

  .file-btn.svelte-16pamub input:where(.svelte-16pamub) {
    display: none;
  }

  .file-btn.disabled.svelte-16pamub {
    opacity: 0.5;
    cursor: default;
  }

  .error.svelte-16pamub {
    color: var(--danger);
    margin: 0 0 0.75rem;
    font-size: 0.88rem;
  }

  .muted.svelte-16pamub {
    color: var(--text-faint);
  }

  .empty-state.svelte-16pamub {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg, 10px);
    padding: 3rem 1.5rem;
    text-align: center;
  }

  .empty-state.svelte-16pamub h2:where(.svelte-16pamub) {
    margin: 0 0 0.5rem;
    color: var(--text-secondary);
  }

  .empty-state.svelte-16pamub p:where(.svelte-16pamub) {
    margin: 0 auto 1rem;
    max-width: 480px;
    color: var(--text-muted);
  }

  .pipelines-frame.svelte-16pamub {
    display: block;
    width: 100%;
    height: calc(100vh - 170px);
    min-height: 560px;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: 10px;
  }

  @media (max-width: 768px) {
    .pipelines-frame.svelte-16pamub {
      height: calc(100vh - 150px);
      min-height: 480px;
    }
  }


  .head.svelte-1sls4hg {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .page-desc.svelte-1sls4hg {
    color: var(--text-muted);
    margin-top: 0;
    max-width: 640px;
  }

  .head-right.svelte-1sls4hg {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .live.svelte-1sls4hg {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted);
    font-size: 0.82rem;
  }

  .dot.svelte-1sls4hg {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--success);
    box-shadow: 0 0 0 3px var(--success-soft);
  }

  .error.svelte-1sls4hg {
    background: var(--danger-soft);
    color: var(--danger);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
  }

  .muted.svelte-1sls4hg {
    color: var(--text-faint);
  }

  .small.svelte-1sls4hg {
    font-size: 0.82rem;
  }

  .alert.svelte-1sls4hg {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    background: var(--danger-soft);
    border: 1px solid var(--danger);
    border-radius: var(--radius-md);
    color: var(--danger);
    padding: 0.7rem 1rem;
    margin-bottom: 1rem;
  }

  .alert.svelte-1sls4hg span:where(.svelte-1sls4hg) {
    font-size: 0.85rem;
    opacity: 0.9;
  }

  .cards.svelte-1sls4hg {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
  }

  .card.svelte-1sls4hg {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.8rem 1rem;
  }

  .card.warn.svelte-1sls4hg {
    border-color: var(--warning, var(--accent));
  }

  .card.danger.svelte-1sls4hg {
    border-color: var(--danger);
    background: var(--danger-soft);
  }

  .card-label.svelte-1sls4hg {
    color: var(--text-muted);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }

  .card-value.svelte-1sls4hg {
    color: var(--text-primary);
    font-size: 1.5rem;
    font-weight: 700;
  }

  .card-hint.svelte-1sls4hg {
    color: var(--text-faint);
    font-size: 0.78rem;
  }

  .panel.svelte-1sls4hg {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 1rem 1.1rem;
    margin-bottom: 1.25rem;
  }

  .panel.svelte-1sls4hg h2:where(.svelte-1sls4hg) {
    margin: 0 0 0.75rem;
    font-size: 1.05rem;
  }

  .panel.svelte-1sls4hg h3:where(.svelte-1sls4hg) {
    margin: 0 0 0.5rem;
    font-size: 0.9rem;
    color: var(--text-secondary);
  }

  .danger-panel.svelte-1sls4hg {
    border-color: var(--danger);
  }

  .columns.svelte-1sls4hg {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
    align-items: start;
  }

  .columns.inner.svelte-1sls4hg {
    gap: 1.5rem;
    margin-top: 0.75rem;
  }

  .table-wrap.svelte-1sls4hg {
    overflow-x: auto;
  }

  table.svelte-1sls4hg {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
  }

  th.svelte-1sls4hg {
    text-align: left;
    color: var(--text-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--border-default);
    white-space: nowrap;
  }

  td.svelte-1sls4hg {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--border-default);
    color: var(--text-secondary);
    white-space: nowrap;
  }

  tr.svelte-1sls4hg:last-child td:where(.svelte-1sls4hg) {
    border-bottom: none;
  }

  .danger-row.svelte-1sls4hg td:where(.svelte-1sls4hg) {
    color: var(--danger);
    background: var(--danger-soft);
  }

  .mono.svelte-1sls4hg {
    font-family: var(--font-mono);
    font-size: 0.82rem;
  }

  .tag.svelte-1sls4hg {
    display: inline-block;
    background: var(--bg-inset);
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.55rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-muted);
  }

  .tag.danger.svelte-1sls4hg {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .list.svelte-1sls4hg {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.35rem;
  }

  .list.svelte-1sls4hg li:where(.svelte-1sls4hg) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.35rem 0.6rem;
    border-radius: var(--radius-sm);
    background: var(--bg-inset);
    font-size: 0.85rem;
  }

  .sub-head.svelte-1sls4hg {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
  }

  .sub-head.svelte-1sls4hg h3:where(.svelte-1sls4hg) {
    margin: 0;
  }

  .lockout-actions.svelte-1sls4hg {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
  }

  .code-list.svelte-1sls4hg {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 0.5rem;
  }

  .code-card.svelte-1sls4hg {
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.6rem;
  }

  .code-card.danger.svelte-1sls4hg {
    border-color: var(--danger);
    background: var(--danger-soft);
  }

  .code-head.svelte-1sls4hg {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--text-secondary);
  }

  .code-head.svelte-1sls4hg b:where(.svelte-1sls4hg) {
    color: var(--text-primary);
  }

  .code-card.danger.svelte-1sls4hg .code-head:where(.svelte-1sls4hg) {
    color: var(--danger);
  }

  .code-head.svelte-1sls4hg em:where(.svelte-1sls4hg) {
    font-style: normal;
    font-size: 0.72rem;
    color: var(--text-faint);
  }

  .code-card.danger.svelte-1sls4hg .code-head:where(.svelte-1sls4hg) em:where(.svelte-1sls4hg) {
    color: inherit;
    opacity: 0.85;
  }

  .code-path.svelte-1sls4hg {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.72rem;
    color: var(--text-faint);
    margin-top: 0.2rem;
  }

  .code-card.danger.svelte-1sls4hg .code-path:where(.svelte-1sls4hg) {
    color: var(--danger);
    opacity: 0.85;
  }

  .spark.svelte-1sls4hg {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 90px;
    padding: 0.25rem 0;
  }

  .spark-bar.svelte-1sls4hg {
    flex: 1;
    min-width: 2px;
    background: var(--accent-soft);
    border-top: 2px solid var(--accent);
    border-radius: 2px 2px 0 0;
  }

  .spark-bar.has-errors.svelte-1sls4hg {
    background: var(--danger-soft);
    border-top-color: var(--danger);
  }

  .spark-legend.svelte-1sls4hg {
    display: flex;
    justify-content: space-between;
    color: var(--text-faint);
    font-size: 0.78rem;
    margin-top: 0.35rem;
  }

  .swatch.svelte-1sls4hg {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: var(--danger);
    border-radius: 2px;
    margin-right: 0.25rem;
  }

  .health.svelte-1sls4hg {
    display: grid;
    gap: 0.6rem;
    margin-bottom: 0.9rem;
  }

  .health-row.svelte-1sls4hg {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .health-label.svelte-1sls4hg {
    flex: 0 0 70px;
    color: var(--text-muted);
    font-size: 0.85rem;
  }

  .bar.svelte-1sls4hg {
    flex: 1;
    height: 10px;
    background: var(--bg-inset);
    border-radius: var(--radius-pill);
    overflow: hidden;
  }

  .bar-fill.svelte-1sls4hg {
    height: 100%;
    background: var(--accent);
    border-radius: var(--radius-pill);
    transition: width 0.3s ease;
  }

  .bar-fill.danger.svelte-1sls4hg {
    background: var(--danger);
  }

  .health-value.svelte-1sls4hg {
    flex: 0 0 48px;
    text-align: right;
    color: var(--text-secondary);
    font-size: 0.85rem;
  }

  .net-counters.svelte-1sls4hg {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    color: var(--text-faint);
    font-size: 0.82rem;
  }

  .btn-secondary.svelte-1sls4hg {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.9rem;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-secondary.svelte-1sls4hg:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .btn-secondary.svelte-1sls4hg:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .btn-secondary.tiny.svelte-1sls4hg {
    padding: 0.2rem 0.6rem;
    font-size: 0.76rem;
  }


  .head.svelte-1t1217c {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
  }

  .page-desc.svelte-1t1217c {
    color: var(--text-muted);
    margin-top: 0;
    max-width: 640px;
  }

  .pause-card.svelte-1t1217c {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 0.6rem 0.9rem;
  }

  .pause-card.paused.svelte-1t1217c {
    border-color: var(--danger);
    background: var(--danger-soft);
  }

  .pause-state.svelte-1t1217c {
    color: var(--text-secondary);
    font-size: 0.85rem;
  }

  .pause-card.paused.svelte-1t1217c .pause-state:where(.svelte-1t1217c) {
    color: var(--danger);
    font-weight: 600;
  }

  .btn-pause.svelte-1t1217c {
    background: var(--accent);
    color: var(--accent-text);
    border: none;
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.9rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-pause.svelte-1t1217c:hover:not(:disabled) {
    background: var(--accent-hover);
  }

  .btn-pause.resume.svelte-1t1217c {
    background: var(--success);
  }

  .btn-pause.svelte-1t1217c:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .notice.svelte-1t1217c {
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.8rem;
    font-size: 0.88rem;
  }

  .notice.ok.svelte-1t1217c {
    background: var(--success-soft);
    color: var(--success);
  }

  .notice.error.svelte-1t1217c,
  .error.svelte-1t1217c {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .error.svelte-1t1217c {
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.8rem;
    font-size: 0.88rem;
  }

  .muted.svelte-1t1217c {
    color: var(--text-faint);
  }

  .toolbar.svelte-1t1217c {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin: 1rem 0;
  }

  .search.svelte-1t1217c {
    flex: 1;
    min-width: 200px;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.7rem;
    font-family: inherit;
  }

  .search.svelte-1t1217c:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .toolbar.svelte-1t1217c select:where(.svelte-1t1217c) {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.6rem;
    font-family: inherit;
    font-size: 0.88rem;
  }

  .jump-row.svelte-1t1217c {
    margin-top: -0.4rem;
  }

  .jump-label.svelte-1t1217c {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--text-muted);
    font-size: 0.84rem;
  }

  .jump-input.svelte-1t1217c {
    width: 8.5rem;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.55rem;
    font-family: inherit;
    font-size: 0.85rem;
  }

  .jump-input.svelte-1t1217c:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }

  .btn-jump.svelte-1t1217c {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.75rem;
    font-size: 0.82rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-jump.svelte-1t1217c:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .jump-divider.svelte-1t1217c {
    width: 1px;
    align-self: stretch;
    background: var(--border-default);
    margin: 0 0.2rem;
  }

  .log-wrap.svelte-1t1217c {
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow-x: auto;
  }

  .log-table.svelte-1t1217c {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
  }

  .log-table.svelte-1t1217c th:where(.svelte-1t1217c) {
    text-align: left;
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    padding: 0.5rem 0.7rem;
    border-bottom: 1px solid var(--border-default);
    background: var(--bg-inset);
    white-space: nowrap;
  }

  .log-table.svelte-1t1217c td:where(.svelte-1t1217c) {
    padding: 0.5rem 0.7rem;
    border-bottom: 1px solid var(--border-default);
    font-size: 0.88rem;
    color: var(--text-secondary);
    vertical-align: top;
  }

  .entry.svelte-1t1217c {
    cursor: pointer;
  }

  .entry.svelte-1t1217c:hover td:where(.svelte-1t1217c) {
    background: var(--bg-hover);
  }

  .expander.svelte-1t1217c {
    color: var(--text-faint);
    width: 1.2rem;
  }

  .date-cell.svelte-1t1217c {
    white-space: nowrap;
    min-width: 130px;
  }

  .date-cell.svelte-1t1217c .date:where(.svelte-1t1217c) {
    display: block;
    color: var(--text-primary);
  }

  .date-cell.svelte-1t1217c .time:where(.svelte-1t1217c) {
    display: block;
    color: var(--text-faint);
    font-size: 0.78rem;
  }

  /* The action log id, so "revert of #12" / "reverted by #13" can be found. */
  .id-col.svelte-1t1217c {
    width: 4.5rem;
    white-space: nowrap;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .desc-cell.svelte-1t1217c {
    width: 100%;
  }

  .desc-cell.svelte-1t1217c .desc:where(.svelte-1t1217c) {
    display: block;
    color: var(--text-primary);
  }

  .meta.svelte-1t1217c {
    display: inline-flex;
    gap: 0.35rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
  }

  .chip.svelte-1t1217c {
    display: inline-block;
    border-radius: var(--radius-pill);
    padding: 0.05rem 0.5rem;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
  }

  .reverted-chip.svelte-1t1217c {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .revert-chip.svelte-1t1217c {
    background: var(--accent-soft);
    color: var(--accent);
  }

  .muted-chip.svelte-1t1217c {
    background: var(--bg-inset);
    color: var(--text-faint);
  }

  .user-cell.svelte-1t1217c {
    white-space: nowrap;
  }

  .actions-cell.svelte-1t1217c {
    white-space: nowrap;
    text-align: right;
  }

  .btn-revert.svelte-1t1217c {
    background: transparent;
    border: 1px solid var(--border-strong);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.3rem 0.7rem;
    font-size: 0.8rem;
    cursor: pointer;
    font-family: inherit;
  }

  .btn-revert.svelte-1t1217c:hover:not(:disabled) {
    border-color: var(--danger);
    color: var(--danger);
    background: var(--danger-soft);
  }

  .btn-revert.svelte-1t1217c:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  /* A reverted action is visibly "undone". */
  .entry.reverted.svelte-1t1217c .desc:where(.svelte-1t1217c) {
    text-decoration: line-through;
    color: var(--text-faint);
  }

  .entry.reverted.svelte-1t1217c td:where(.svelte-1t1217c) {
    opacity: 0.75;
  }

  /* An action that IS a revert gets an accent edge. */
  .entry.is-revert.svelte-1t1217c td:where(.svelte-1t1217c):first-child {
    border-left: 3px solid var(--accent);
  }

  .details-row.svelte-1t1217c td:where(.svelte-1t1217c) {
    background: var(--bg-inset);
    padding: 0.6rem 1rem 0.9rem 2.2rem;
  }

  .changelog-entry.svelte-1t1217c {
    padding: 0.5rem 0.6rem;
    margin-bottom: 0.4rem;
    background: var(--bg-card);
    border-left: 3px solid var(--border-default);
    border-radius: var(--radius-sm);
  }

  .changelog-meta.svelte-1t1217c {
    display: flex;
    gap: 0.8rem;
    align-items: baseline;
    margin-bottom: 0.3rem;
    flex-wrap: wrap;
  }

  .table-name.svelte-1t1217c {
    font-weight: 600;
    color: var(--accent);
    font-family: var(--font-mono);
    font-size: 0.82rem;
  }

  .change-type.svelte-1t1217c {
    font-family: var(--font-mono);
    padding: 0.05rem 0.5rem;
    border-radius: var(--radius-pill);
    font-size: 0.72rem;
    font-weight: 600;
  }

  .change-type.insert.svelte-1t1217c {
    background: var(--success-soft);
    color: var(--success);
  }

  .change-type.update.svelte-1t1217c {
    background: var(--accent-soft);
    color: var(--accent);
  }

  .change-type.delete.svelte-1t1217c {
    background: var(--danger-soft);
    color: var(--danger);
  }

  .change-date.svelte-1t1217c {
    font-size: 0.78rem;
    color: var(--text-faint);
  }

  pre.svelte-1t1217c {
    margin: 0;
    padding: 0.5rem;
    overflow-x: auto;
    background: var(--bg-inset);
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-break: break-word;
  }

  .pager.svelte-1t1217c {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin: 1rem 0;
  }

  .pager-btn.svelte-1t1217c {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
  }

  .pager-btn.svelte-1t1217c:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .pager-btn.svelte-1t1217c:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }

  .pager-hint.svelte-1t1217c {
    color: var(--text-muted);
    font-size: 0.85rem;
  }


  .panel.svelte-1xr51gb {
    background-color: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
  }

  .panel.svelte-1xr51gb h2:where(.svelte-1xr51gb) {
    margin-top: 0;
  }

  .field-grid.svelte-1xr51gb {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    max-width: 640px;
  }

  .field.svelte-1xr51gb {
    display: block;
  }

  .field.svelte-1xr51gb span:where(.svelte-1xr51gb) {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.35rem;
  }

  .field.svelte-1xr51gb input:where(.svelte-1xr51gb) {
    width: 100%;
    background-color: var(--bg-inset);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    padding: 0.55rem 0.7rem;
    font-size: 0.95rem;
  }

  .hint.svelte-1xr51gb {
    color: var(--text-muted);
    font-size: 0.85rem;
  }

  .hint.empty.svelte-1xr51gb {
    margin-top: 1rem;
  }

  .muted.svelte-1xr51gb {
    color: var(--text-faint);
    font-style: normal;
    font-weight: 400;
  }

  .check.svelte-1xr51gb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.5rem 0;
    color: var(--text-secondary);
    font-size: 0.9rem;
  }

  .check.svelte-1xr51gb input:where(.svelte-1xr51gb) {
    width: 16px;
    height: 16px;
    accent-color: var(--accent);
  }

  .error.svelte-1xr51gb {
    color: var(--danger);
  }

  .notice.svelte-1xr51gb {
    border-radius: var(--radius-sm);
    padding: 0.55rem 0.8rem;
    font-size: 0.9rem;
  }

  .notice.ok.svelte-1xr51gb {
    color: var(--success);
    background-color: var(--success-soft);
  }

  .notice.error.svelte-1xr51gb {
    color: var(--danger);
    background-color: var(--danger-soft);
  }

  .warning.svelte-1xr51gb {
    color: var(--danger);
    background-color: var(--danger-soft);
    border-radius: var(--radius-sm);
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
  }

  .table.svelte-1xr51gb {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
    font-size: 0.9rem;
  }

  .table.svelte-1xr51gb th:where(.svelte-1xr51gb), .table.svelte-1xr51gb td:where(.svelte-1xr51gb) {
    text-align: left;
    padding: 0.5rem 0.6rem;
    border-bottom: 1px solid var(--border-default);
  }

  .table.svelte-1xr51gb th:where(.svelte-1xr51gb) {
    color: var(--text-secondary);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }

  .mono.svelte-1xr51gb {
    font-family: var(--font-mono);
  }

  .health.svelte-1xr51gb {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .health.svelte-1xr51gb li:where(.svelte-1xr51gb) {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--border-default);
    font-size: 0.9rem;
  }

  .health.svelte-1xr51gb li:where(.svelte-1xr51gb):last-child {
    border-bottom: none;
  }

  .health.svelte-1xr51gb .ok:where(.svelte-1xr51gb) {
    color: var(--success);
  }

  .health.svelte-1xr51gb .bad:where(.svelte-1xr51gb) {
    color: var(--danger);
  }

  .actions.svelte-1xr51gb {
    display: flex;
    gap: 0.5rem;
  }

  .restore-row.svelte-1xr51gb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
  }

  .danger-zone.svelte-1xr51gb {
    border-color: var(--danger);
  }

  .btn-small.svelte-1xr51gb {
    padding: 0.3rem 0.65rem;
    font-size: 0.82rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-strong);
    background-color: var(--bg-card);
    color: var(--text-primary);
    cursor: pointer;
  }

  .btn-small.danger.svelte-1xr51gb {
    color: var(--danger);
    border-color: var(--danger);
  }

  .modal-backdrop.svelte-1xr51gb {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    padding: 1rem;
  }

  .modal.svelte-1xr51gb {
    background-color: var(--bg-raised);
    border: 1px solid var(--danger);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    max-width: 480px;
    width: 100%;
  }

  .modal-actions.svelte-1xr51gb {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1rem;
  }


  .page.svelte-1upqxzd {
    max-width: 720px;
    margin: 2rem auto;
    padding: 0 1rem;
  }

  .muted.svelte-1upqxzd {
    color: var(--text-muted);
  }


  nav.svelte-1tz0u69 {
    background-color: var(--bg-raised);
    padding: 1rem;
    width: 100%;
    box-sizing: border-box;
    font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  }

  .nav-content.svelte-1tz0u69 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    /* Fixed so a wrapped breadcrumb row overflows the bar visually instead
       of making the whole navbar taller. */
    height: 40px;
  }

  .nav-section.svelte-1tz0u69 {
    display: flex;
    align-items: center;
    flex: 1;
  }

  /* Breadcrumb styles: always the link color (--text-link is the global
     accent), because the breadcrumb is a navigation path, not a label.
     The path is nudged up to 50px left of the content column - visually
     only, so the rest of the bar does not move - while never coming closer
     than 1rem to the viewport edge. If it outgrows its third it wraps onto
     a second row instead of pushing the centred quick links. */
  .breadcrumb.svelte-1tz0u69 {
    flex: 0 1 33%;
    min-width: 0;
    flex-wrap: wrap;
    position: relative;
    left: clamp(-50px, calc(1rem - (100vw - 1200px) / 2), 0px);
  }

  .breadcrumb-item.svelte-1tz0u69 {
    color: var(--text-link);
    padding: 0.25rem 0.5rem;
    text-decoration: none;
  }

  .breadcrumb-item.svelte-1tz0u69:hover {
    color: var(--accent-hover);
    text-decoration: underline;
  }

  .separator.svelte-1tz0u69 {
    color: var(--text-link);
    margin: 0 0.3rem;
  }

  /* Navigation items styles */
  .nav-items.svelte-1tz0u69 {
    justify-content: center;
    gap: 1.5rem;
    flex: 0 1 34%;
  }

  .nav-items.svelte-1tz0u69 a:where(.svelte-1tz0u69) {
    color: var(--text-primary);
    text-decoration: none;
    padding: 0.5rem;
  }

  .nav-items.svelte-1tz0u69 a:where(.svelte-1tz0u69):hover {
    color: var(--accent);
    text-decoration: none;
  }

  .pfp-button.svelte-1tz0u69 {
    color: inherit;
    text-decoration: none;
  }

  /* Profile section styles */
  .profile.svelte-1tz0u69 {
    justify-content: flex-end;
    gap: 1rem;
    flex: 0 1 33%;
  }

  .username.svelte-1tz0u69 {
    color: var(--text-primary);
  }

  .theme-toggle.svelte-1tz0u69 {
    background: var(--bg-card);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
    border-radius: var(--radius-pill);
    padding: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease;
  }

  .theme-icon.svelte-1tz0u69 {
    width: 18px;
    height: 18px;
    filter: var(--icon-filter);
    display: block;
  }

  .theme-toggle.svelte-1tz0u69:hover {
    background: var(--bg-hover);
  }

  .profile-pic.svelte-1tz0u69 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
  }

  .profile-initial.svelte-1tz0u69 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--accent);
    color: var(--accent-text);
    font-weight: 700;
    font-size: 1rem;
  }

  .pfp-button.svelte-1tz0u69 {
    background: none;
    border: none;
    padding: 0;
    width: 40px;
    height: 40px;
  }

  .admin-badge.svelte-1tz0u69 {
    background: var(--danger-soft);
    color: var(--text-primary);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
  }

  button.svelte-1tz0u69 {
    background: none;
    border: none;
    color: var(--text-primary);
    cursor: pointer;
    font-size: 1rem;
    padding: 0.5rem;
    transition: color 0.3s ease;
  }

  button.svelte-1tz0u69:hover {
    color: var(--accent);
  }

  /* Mobile support */
  @media (max-width: 768px) {
    .nav-content.svelte-1tz0u69 {
      flex-direction: column;
      gap: 1rem;
      height: auto;
    }

    .nav-section.svelte-1tz0u69 {
      width: 100%;
    }

    .nav-items.svelte-1tz0u69 {
      flex-direction: column;
      align-items: stretch;
    }

    .profile.svelte-1tz0u69 {
      justify-content: flex-start;
    }

    button.svelte-1tz0u69 {
      width: 100%;
      text-align: left;
    }
  }


  .notifications.svelte-1a3vahb {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    width: min(280px, calc(100vw - 2rem));
    background: var(--bg-raised);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow);
    overflow: hidden;
    z-index: 900;
  }

  .notif-head.svelte-1a3vahb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    background: var(--accent-soft);
    border: none;
    color: var(--text-primary);
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 0.5rem 0.7rem;
    cursor: pointer;
    text-align: left;
  }

  .notif-icon.svelte-1a3vahb {
    color: var(--accent);
  }

  .chevron.svelte-1a3vahb {
    margin-left: auto;
    color: var(--text-muted);
  }

  .notif-list.svelte-1a3vahb {
    list-style: none;
    margin: 0;
    padding: 0.35rem;
    display: grid;
    gap: 0.15rem;
    max-height: 220px;
    overflow-y: auto;
  }

  .notif-list.svelte-1a3vahb button:where(.svelte-1a3vahb) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    background: none;
    border: none;
    color: var(--text-secondary);
    font-family: inherit;
    font-size: 0.85rem;
    padding: 0.35rem 0.45rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
    text-align: left;
  }

  .notif-list.svelte-1a3vahb button:where(.svelte-1a3vahb):hover {
    background: var(--bg-hover);
    color: var(--text-primary);
  }

  .sender.svelte-1a3vahb {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .kind.svelte-1a3vahb {
    display: inline-block;
    background: var(--bg-inset);
    border: 1px solid var(--border-default);
    color: var(--text-faint);
    border-radius: var(--radius-pill);
    padding: 0 0.4rem;
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-right: 0.25rem;
  }

  .badge.svelte-1a3vahb {
    background: var(--danger);
    color: #fff;
    border-radius: var(--radius-pill);
    min-width: 1.1rem;
    padding: 0 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.1rem;
  }


  .pause-banner.svelte-1n46o8q {
    background: var(--danger-soft);
    color: var(--danger);
    border-bottom: 1px solid var(--danger);
    text-align: center;
    padding: 0.45rem 1rem;
    font-size: 0.88rem;
    font-weight: 600;
    letter-spacing: 0.01em;
  }

  .boot-screen.svelte-1n46o8q {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    color: var(--text-faint);
    font-size: 1.1rem;
  }

  .page-error.svelte-1n46o8q p:where(.svelte-1n46o8q) {
    color: var(--text-muted);
    font-family: var(--font-mono);
    font-size: 0.85rem;
    max-width: 640px;
  }

  .page-error.svelte-1n46o8q button:where(.svelte-1n46o8q) {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--accent-text);
    font-weight: 600;
    padding: 0.45rem 1rem;
  }