/* Orbit Suite admin, UrusPro manage DNA with Orbit tokens. */
:root {
  --p:#635BFF;--p-hover:#5851EA;--info:#EEF2FF;
  --ink:#0A2540;--ink-600:#425466;--mut:#697386;--ink-300:#8A94A6;
  --line:#E3E8EE;--bg:#F6F9FC;--surface-muted:#F6F9FC;--surface-sunken:#EDF1F6;--surface:#fff;
  --success-bg:#ECFDF5;--success-ink:#09825D;
  --warning-bg:#FFF8EC;--warning-ink:#C44C12;
  --error-bg:#FFF0F3;--error-ink:#DF1B41;
  /* Radius System v1.0. Balanced voice, suite-wide base 12. */
  --radius-unit:4px;--radius-base:12px;
  --radius-surface:calc(var(--radius-base) + var(--radius-unit));
  --radius-container:var(--radius-base);
  --radius-control:calc(var(--radius-base) - var(--radius-unit));
  --radius-element:max(calc(var(--radius-base) - var(--radius-unit) * 2),0px);
  --radius-detail:0;--radius-pill:9999px;--corner-shape:round;
  --font-sans:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-display:'Bricolage Grotesque','Hanken Grotesk',sans-serif;
  --row-h:52px;--row-action-h:32px;--control-h:40px;--cta-h:42px;
  --page-pad:16px;--section-gap:28px;--card-gap:12px;--input-gap:8px;
  --row-status-w:9rem;--row-figure-w:6.5rem;--row-actions-w:11.5rem;
  --header-h:56px;--pbar-h:64px;--sidebar-w:240px;--rail-w:56px;
  --notification-badge-size:16px;--notification-dot-size:8px;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;
  --shadow-card:0 1px 3px rgba(10,37,64,.06);--shadow-overlay:0 12px 32px -12px rgba(10,37,64,.28);--spinner-size:16px;
  --focus:0 0 0 3px rgba(99,91,255,.22);
}
*,*::before,*::after{box-sizing:border-box;corner-shape:var(--corner-shape,round)}
html{background:var(--bg)}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font:400 14px/1.5 var(--font-sans);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{font-weight:600}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:var(--focus)}
::selection{background:var(--info);color:var(--ink)}
*{scrollbar-color:var(--ink-300) transparent;scrollbar-width:thin}
[hidden]{display:none!important}
.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr)}
.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;background:var(--surface);border-right:1px solid var(--line);padding:var(--space-3) var(--space-2);z-index:10}
.sidebar-brand,.desktop-brand,.brand{height:var(--control-h);display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-2)}
.brand-name,.brand{font:700 16px/1.2 var(--font-display);letter-spacing:-.01em}
.admin-badge,.badge{display:inline-flex;align-items:center;min-height:20px;padding:0 var(--space-2);border-radius:var(--radius-element);background:var(--info);color:var(--p);font-size:11px;font-weight:600;line-height:1}
.nav-list{display:flex;flex-direction:column;gap:var(--space-1);margin-top:var(--space-4)}
.nav-bottom{margin-top:auto}
.nav-button{position:relative;width:100%;height:var(--control-h);display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-3);border:0;border-radius:var(--radius-control);background:transparent;color:var(--ink-600);cursor:pointer;text-align:left;font-weight:400;transition:background 150ms ease,color 150ms ease,transform 100ms ease}
.nav-button:hover{background:var(--surface-muted);color:var(--ink)}
.nav-button:active{transform:translateY(1px)}
.nav-button[aria-current="page"]{background:var(--info);color:var(--p)}
.icon{display:inline-flex;width:18px;height:18px;flex:0 0 auto;color:currentColor}
.icon svg{display:block;width:100%;height:100%}
.workspace{min-width:0;display:flex;min-height:100vh;flex-direction:column}
.topbar{position:sticky;top:0;height:var(--header-h);display:flex;align-items:center;padding:0 var(--page-pad);background:var(--surface);border-bottom:1px solid var(--line);z-index:9}
.desktop-brand{display:none}.phone-title{font:700 20px/1.2 var(--font-display);letter-spacing:-.02em}
.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:var(--space-1)}
.account{position:relative}
.icon-button{width:var(--control-h);height:var(--control-h);display:inline-flex;align-items:center;justify-content:center;padding:0;border:1px solid transparent;border-radius:var(--radius-control);background:transparent;color:var(--ink-600);cursor:pointer;transition:background 150ms ease,color 150ms ease,transform 100ms ease}
.icon-button:hover{background:var(--surface-muted);color:var(--ink)}.icon-button:active{transform:scale(.96)}
.icon-button:disabled,.button:disabled{cursor:not-allowed;opacity:.5;transform:none}
.notification-button{position:relative}.notification-button>svg{width:18px;height:18px}
.notification-badge{position:absolute;top:var(--space-1);right:var(--space-1);min-width:var(--notification-badge-size);height:var(--notification-badge-size);padding:0 var(--space-1);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-pill);background:var(--error-ink);color:var(--surface);font-size:10px;line-height:1;font-variant-numeric:tabular-nums}
.avatar-button{border-radius:var(--radius-pill);background:var(--info);color:var(--p)}
.account-menu,.overflow-menu{position:absolute;right:0;top:calc(var(--control-h) + var(--space-2));width:200px;padding:var(--space-1);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-container);box-shadow:var(--shadow-overlay);z-index:30}
.account-label{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);margin-bottom:var(--space-1)}
.account-label strong,.account-label span{display:block}.account-label span{font-size:11px;color:var(--mut)}
.account-menu button,.overflow-menu button{width:100%;height:var(--control-h);padding:0 var(--space-3);border:0;border-radius:var(--radius-control);background:transparent;text-align:left;cursor:pointer;font-weight:400}
.account-menu button:hover,.overflow-menu button:hover{background:var(--surface-muted)}
main{flex:1;min-width:0}.page{width:100%;max-width:1120px;margin:0 auto;padding:var(--section-gap) var(--page-pad) calc(var(--pbar-h) + var(--section-gap) + env(safe-area-inset-bottom))}
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--card-gap);margin-bottom:var(--section-gap)}
.page-header.has-action{min-height:var(--control-h)}
.page-header h1{margin:0;font:700 20px/1.2 var(--font-display);letter-spacing:-.02em}
.page-header p{margin:var(--space-1) 0 0;color:var(--mut);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60ch}
.page-header-actions{display:flex;gap:var(--input-gap);margin-left:auto;flex:0 0 auto}
.section-stack{display:grid;gap:var(--section-gap)}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--card-gap);margin-bottom:var(--card-gap)}
.section-heading h2{margin:0;font-size:16px;line-height:1.2;font-weight:600}
.section-heading p{margin:var(--space-1) 0 0;color:var(--mut);font-size:13px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-container);box-shadow:var(--shadow-card)}
.card-pad{padding:var(--space-4)}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--card-gap)}
.stat{min-height:92px;padding:var(--space-4);display:flex;flex-direction:column;justify-content:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-container);box-shadow:var(--shadow-card)}
.stat-label{font-size:12px;font-weight:600;color:var(--mut)}
.stat-value{margin-top:var(--space-1);font:600 24px/1.2 var(--font-display);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.toolbar{display:flex;align-items:center;gap:var(--input-gap);margin-bottom:var(--card-gap)}
.toolbar .search{flex:1;max-width:320px}.toolbar .select-field{width:180px}
.button{height:var(--control-h);display:inline-flex;align-items:center;justify-content:center;padding:0 var(--space-4);border:1px solid var(--line);border-radius:var(--radius-control);background:var(--surface);color:var(--ink-600);cursor:pointer;white-space:nowrap;transition:background 150ms ease,border-color 150ms ease,color 150ms ease,transform 100ms ease}
.button:hover{background:var(--surface-muted);border-color:var(--ink-300);color:var(--ink)}.button:active{transform:translateY(1px)}
.button.primary{background:var(--p);border-color:var(--p);color:#fff}.button.primary:hover{background:var(--p-hover);border-color:var(--p-hover);color:#fff}
.button.danger{color:var(--error-ink)}.button.danger:hover{background:var(--error-bg);border-color:var(--error-bg)}
.button.loading{color:transparent;position:relative}.button.loading::after{content:'';position:absolute;width:var(--spinner-size);height:var(--spinner-size);border:2px solid var(--ink-600);border-right-color:transparent;border-radius:var(--radius-pill);animation:spin .7s linear infinite}.button.primary.loading::after{border-color:var(--surface);border-right-color:transparent}
.row-action{height:var(--row-action-h);padding:0 var(--space-3);font-size:12px}
.field{display:grid;gap:var(--space-1)}
.field>span,.field-label{font-size:12px;font-weight:600;color:var(--ink-600)}
.field input,.field select,.field textarea,.select-field,.search input{width:100%;height:var(--control-h);padding:0 var(--space-3);border:1px solid var(--line);border-radius:var(--radius-control);background:var(--surface);font-size:14px;transition:border-color 150ms ease,box-shadow 150ms ease}
.field textarea{height:auto;min-height:96px;padding-block:var(--space-2);resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover,.select-field:hover{border-color:var(--ink-300)}
.field-hint{font-size:11px;color:var(--mut)}
.form-grid{display:grid;gap:var(--input-gap)}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.checkbox{display:flex;align-items:center;gap:var(--space-2);min-height:var(--control-h);font-size:14px}.checkbox input{width:18px;height:18px;accent-color:var(--p)}
.search{position:relative}.search .icon{position:absolute;left:var(--space-3);top:50%;transform:translateY(-50%);color:var(--ink-300);pointer-events:none}.search input{padding-left:var(--control-h);-webkit-appearance:none;appearance:none}
.segments{display:flex;width:100%;padding:var(--space-1);gap:var(--space-1);overflow-x:auto;background:var(--surface-sunken);border-radius:var(--radius-control);scrollbar-width:none}.segments::-webkit-scrollbar{display:none}
.segment{height:var(--row-action-h);flex:1;padding:0 var(--space-3);border:0;border-radius:var(--radius-element);background:transparent;color:var(--mut);font-size:13px;font-weight:400;white-space:nowrap;cursor:pointer}
.segment:hover{color:var(--ink)}.segment[aria-selected="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(10,37,64,.12)}
.data-list{--list-cols:minmax(0,1fr);overflow:visible}
.data-list.has-status{--list-cols:minmax(0,1fr) var(--row-status-w)}
.data-list.has-figure{--list-cols:minmax(0,1fr) var(--row-figure-w)}
.data-list.has-actions{--list-cols:minmax(0,1fr) var(--row-actions-w)}
.data-list.has-status.has-figure{--list-cols:minmax(0,1fr) var(--row-status-w) var(--row-figure-w)}
.data-list.has-status.has-actions{--list-cols:minmax(0,1fr) var(--row-status-w) var(--row-actions-w)}
.data-list.has-figure.has-actions{--list-cols:minmax(0,1fr) var(--row-figure-w) var(--row-actions-w)}
.data-list.has-status.has-figure.has-actions{--list-cols:minmax(0,1fr) var(--row-status-w) var(--row-figure-w) var(--row-actions-w)}
.list-head,.data-row{display:grid;grid-template-columns:var(--list-cols);align-items:center}
.list-head{height:var(--control-h);padding:0 var(--space-4);background:var(--surface-muted);border-bottom:1px solid var(--line);color:var(--mut);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.data-row{position:relative;min-height:var(--row-h);padding:0 var(--space-4);border-bottom:1px solid var(--line);transition:background 150ms ease}
.data-row:last-child{border-bottom:0}.data-row:hover{background:var(--surface-muted)}
.row-identity{min-width:0;display:flex;align-items:center;gap:var(--space-3)}
.row-open{min-width:0;width:100%;height:var(--row-h);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0;border:0;background:transparent;text-align:left;cursor:pointer}
.row-title,.row-secondary{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-title{font-size:14px;font-weight:600;color:var(--ink)}.row-secondary{font-size:13px;color:var(--mut)}
.row-status,.row-figure,.row-actions{min-width:0}.row-figure{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.row-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-1);position:relative}
.status{display:inline-flex;align-items:center;min-height:22px;padding:0 var(--space-2);border-radius:var(--radius-element);font-size:11px;font-weight:600;white-space:nowrap;background:var(--surface-muted);color:var(--mut)}
.status.success{background:var(--success-bg);color:var(--success-ink)}.status.warning{background:var(--warning-bg);color:var(--warning-ink)}.status.error{background:var(--error-bg);color:var(--error-ink)}.status.info{background:var(--info);color:var(--p)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;overflow-wrap:anywhere}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4) var(--card-gap);margin:0;padding-bottom:var(--space-6);border-bottom:1px solid var(--line)}/* Flat label-over-value pairs. A tinted tile per value made a sheet read as a
   grid of small cards inside a panel (no nested cards). */
.detail{padding:0;min-width:0}
.detail dd{overflow-wrap:anywhere}.detail dt{font-size:12px;color:var(--mut)}.detail dd{margin:var(--space-1) 0 0;font-size:14px;font-variant-numeric:tabular-nums}
.empty,.error-state{min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-8)}
.empty img{width:112px;height:84px;object-fit:contain;margin-bottom:var(--space-3)}.empty p,.error-state p{margin:0 0 var(--space-3);color:var(--mut)}
/* A secondary list (payout requests) needs no page-sized empty state. */
.section-heading + .data-list .empty{min-height:0;padding:var(--space-6)}
.section-heading + .data-list .empty img{width:80px;height:60px}
.skeleton-list{overflow:hidden}.skeleton{height:var(--row-h);border-bottom:1px solid var(--line);background:linear-gradient(90deg,var(--surface-muted),var(--surface),var(--surface-muted));background-size:200% 100%;animation:shimmer 1.2s linear infinite}.skeleton:last-child{border-bottom:0}
.notice{padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius-container);background:var(--warning-bg);color:var(--warning-ink)}
.login{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:var(--page-pad);background:var(--bg);z-index:100}
.login-card{width:min(100%,380px);padding:var(--space-8);display:grid;gap:var(--card-gap);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-surface);box-shadow:var(--shadow-overlay)}
.brand-login{padding:0}.login-card h1{margin:var(--space-2) 0 0;font:700 20px/1.2 var(--font-display)}.login-card>p{margin:0;color:var(--mut);font-size:13px}.login-card .button{width:100%;margin-top:var(--space-1)}.form-error{min-height:20px;color:var(--error-ink)!important;font-size:12px!important}
.phone-nav{position:fixed;left:var(--space-3);right:var(--space-3);bottom:calc(var(--space-2) + env(safe-area-inset-bottom));height:var(--pbar-h);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:var(--space-1);background:var(--ink);border-radius:var(--radius-pill);box-shadow:var(--shadow-overlay);z-index:20}
.phone-nav button{min-width:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);padding:0;border:0;border-radius:var(--radius-pill);background:transparent;color:#B6C3CF;font-size:10px;font-weight:400;cursor:pointer}.phone-nav button[aria-current="page"]{background:rgba(255,255,255,.12);color:#fff}.phone-nav .icon{width:19px;height:19px}
.toast-region{position:fixed;right:var(--space-4);bottom:calc(var(--pbar-h) + var(--space-6) + env(safe-area-inset-bottom));display:grid;gap:var(--space-2);z-index:80;pointer-events:none}
.toast{max-width:360px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);background:var(--ink);color:#fff;box-shadow:var(--shadow-overlay);font-size:13px;animation:toast-in 180ms ease-out}.toast.error{background:var(--error-ink)}
.overlay{position:fixed;inset:0;display:flex;justify-content:flex-end;z-index:60}.overlay-scrim{position:absolute;inset:0;background:rgba(10,37,64,.38)}
.sheet{position:relative;width:min(480px,100%);height:100%;display:flex;flex-direction:column;background:var(--surface);box-shadow:var(--shadow-overlay);animation:sheet-in 300ms cubic-bezier(.32,.72,0,1)}
.sheet.short{width:min(460px,calc(100% - var(--space-8)));height:auto;max-height:90vh;margin:auto;border-radius:var(--radius-surface)}
.sheet-header{height:var(--header-h);display:flex;align-items:center;gap:var(--card-gap);padding:0 var(--space-4);border-bottom:1px solid var(--line);flex:0 0 auto}.sheet-header h2{margin:0;font-size:16px;font-weight:600}.sheet-header .icon-button{margin-left:auto}
.sheet-header-action{margin-left:auto;padding:var(--space-2);border:0;border-radius:var(--radius-control);background:transparent;color:var(--p);cursor:pointer;font-size:13px}.sheet-header-action:hover{background:var(--info)}.sheet-header-action+.icon-button{margin-left:0}
.sheet-body{flex:1;min-height:0;overflow:auto;padding:var(--space-4);display:grid;align-content:start;gap:var(--card-gap)}
.sheet-footer{position:sticky;bottom:0;display:flex;gap:var(--input-gap);padding:var(--space-3) var(--space-4) max(var(--space-3),env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface)}.sheet-footer .button{flex:1}
.overlay.closing .sheet{animation:sheet-out 200ms ease-in forwards}.overlay.closing .overlay-scrim{opacity:0;transition:opacity 200ms ease-in}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{to{background-position:-200% 0}}@keyframes toast-in{from{opacity:0;transform:translateY(var(--space-2))}}@keyframes sheet-in{from{transform:translateX(100%)}}@keyframes sheet-out{to{transform:translateX(100%)}}
@media(min-width:640px){.segments{width:max-content}.segment{flex:0 0 auto}.page-header-actions .button{width:auto}}
@media(min-width:768px){:root{--page-pad:24px;--header-h:64px}.phone-nav{display:none}.page{padding-bottom:var(--section-gap)}.topbar{justify-content:flex-end}.phone-title{display:none}.desktop-brand{display:flex;margin-right:auto}.toast-region{bottom:var(--space-6)}.sheet-footer{padding-bottom:var(--space-3)}}
@media(min-width:768px) and (max-width:1023px){.app-shell{grid-template-columns:var(--rail-w) minmax(0,1fr)}.sidebar{padding-inline:var(--space-2)}.sidebar-brand{justify-content:center;padding:0}.sidebar-brand .brand-name,.sidebar-brand .admin-badge,.nav-button span:last-child{display:none}.nav-button{justify-content:center;padding:0}.nav-button::after{content:attr(aria-label);position:absolute;left:calc(100% + var(--space-2));padding:var(--space-1) var(--space-2);border-radius:var(--radius-element);background:var(--ink);color:#fff;font-size:11px;opacity:0;pointer-events:none;white-space:nowrap}.nav-button:hover::after,.nav-button:focus-visible::after{opacity:1}}
@media(min-width:1024px){:root{--page-pad:32px;--row-figure-w:10rem}.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.stat-value{font-size:clamp(18px,1.6vw,24px)}.desktop-brand{display:none}}
@media(max-width:767px){.stat-value{font-size:20px}.app-shell{grid-template-columns:minmax(0,1fr)}.sidebar{display:none}.page:has(.page-header.has-action){padding-bottom:calc(var(--pbar-h) + var(--cta-h) + var(--space-4) + var(--section-gap) + env(safe-area-inset-bottom))}.page-header h1,.page-header p{display:none}.page-header{min-height:0;margin-bottom:0}.page-header.has-action{min-height:0}.page-header-actions{width:100%}.page-header-actions .button{position:fixed;left:var(--page-pad);right:var(--page-pad);bottom:calc(var(--pbar-h) + var(--space-4) + env(safe-area-inset-bottom));height:var(--cta-h);width:calc(100% - var(--page-pad) * 2);z-index:19;box-shadow:var(--shadow-overlay)}}
@media(max-width:639px){.toolbar{align-items:stretch;flex-wrap:wrap}.toolbar .search{max-width:none;flex-basis:100%}.toolbar .select-field{flex:1}.form-grid.two,.detail-grid{grid-template-columns:1fr}.card.data-list{background:transparent;border:0;box-shadow:none}.list-head{display:none}.data-list{display:grid;gap:var(--card-gap)}.data-row{display:grid;grid-template-columns:1fr auto;grid-template-areas:'identity identity' 'status figure' 'actions actions';gap:var(--space-2) var(--card-gap);min-height:0;padding:var(--space-4);background:var(--surface);border:1px solid var(--line)!important;border-radius:var(--radius-container);box-shadow:var(--shadow-card)}.row-identity{grid-area:identity}.row-open{height:auto;min-height:var(--control-h)}.row-secondary{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.row-status{grid-area:status}.row-figure{grid-area:figure}.row-actions{grid-area:actions;min-height:var(--row-action-h)}.sheet{align-self:flex-end;width:100%;height:auto;max-height:90vh;border-radius:var(--radius-surface) var(--radius-surface) var(--radius-detail) var(--radius-detail);animation-name:sheet-up}.sheet.short{width:100%;margin:auto 0 0;border-radius:var(--radius-surface) var(--radius-surface) var(--radius-detail) var(--radius-detail)}.overlay.closing .sheet{animation-name:sheet-down}.toast-region{left:var(--space-3);right:var(--space-3)}.toast{max-width:none}.empty{min-height:220px}}
@keyframes sheet-up{from{transform:translateY(100%)}}@keyframes sheet-down{to{transform:translateY(100%)}}
@media(pointer:coarse){button,.icon-button,.nav-button,.account-menu button,.overflow-menu button{min-height:44px}.row-action{min-height:44px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:1ms!important}}

/* A labelled button inside a form grid hugs its label; a grid item would
   otherwise stretch the full row on desktop. Full width is the phone rule. */
.form-grid > .button{justify-self:start}
@media (max-width:639px){.form-grid > .button{justify-self:stretch}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.unread-dot{width:var(--notification-dot-size);height:var(--notification-dot-size);flex:0 0 auto;border-radius:var(--radius-pill);background:var(--p)}
.notification-feed{display:grid;gap:var(--card-gap)}
.notification-feed .row-figure{font-size:12px;color:var(--mut)}
.notification-more{justify-self:center}
.notification-settings-actions{display:flex;flex-wrap:wrap;gap:var(--input-gap);margin-bottom:var(--space-4)}
.notification-settings-actions:empty{display:none}
.notification-events{margin:0;padding-inline-start:var(--space-5);columns:2;column-gap:var(--section-gap);color:var(--ink-600)}
.notification-events li{break-inside:avoid;padding-block:var(--space-1)}
@media(max-width:639px){.notification-feed .data-list{display:block;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-card)}.notification-feed .data-row{display:grid;grid-template-columns:minmax(0,1fr) var(--row-figure-w);grid-template-areas:none;gap:var(--card-gap);min-height:var(--row-h);padding:0 var(--space-4);background:transparent;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:var(--radius-detail);box-shadow:none}.notification-feed .data-row:last-child{border-bottom:0!important}.notification-feed .row-identity,.notification-feed .row-figure{grid-area:auto}.notification-feed .row-secondary{white-space:nowrap;display:block}.notification-events{columns:1}}

/* A read row keeps the dot's column so titles align down the feed. */
.unread-dot.is-read{visibility:hidden}
/* Lists inside a sheet are flat: the sheet is already the surface. */
.sheet-body .data-list.card{border:0;box-shadow:none;background:transparent;border-radius:var(--radius-detail)}
