:root{
  --ui-accent:#2563eb;
  --ui-accent-hover:#1d4ed8;
  --ui-accent-soft:rgba(37,99,235,.10);
  --ui-success:#168c4b;
  --ui-success-soft:rgba(22,140,75,.10);
  --ui-warning:#a66500;
  --ui-warning-soft:rgba(166,101,0,.12);
  --ui-danger:#c43a3a;
  --ui-danger-soft:rgba(196,58,58,.10);
  --ui-radius-xs:6px;
  --ui-radius-sm:8px;
  --ui-radius-md:12px;
  --ui-radius-lg:16px;
  --ui-control-h:44px;
  --ui-space-1:4px;
  --ui-space-2:8px;
  --ui-space-3:12px;
  --ui-space-4:16px;
  --ui-space-5:20px;
  --ui-space-6:24px;
  --ui-space-8:32px;
  --ui-space-10:40px;
  --ui-space-12:48px;
  --ui-max:1180px;
  --ui-ease:cubic-bezier(.2,.8,.2,1);
  --ui-shadow-sm:0 8px 24px rgba(15,31,55,.08);
  --ui-shadow-lg:0 24px 64px rgba(8,21,44,.16);
}
[data-theme=dark]{
  --ui-success:#49d58a;
  --ui-warning:#f2b95f;
  --ui-danger:#ff7b7b;
  --ui-shadow-sm:0 8px 24px rgba(0,0,0,.24);
  --ui-shadow-lg:0 24px 64px rgba(0,0,0,.42);
}
html.framio-portal :where(button,a,input,select,textarea,summary):focus-visible{
  outline:3px solid color-mix(in srgb,var(--ui-accent) 50%,transparent);
  outline-offset:3px;
}
html.framio-portal :where(button,input,select,textarea):disabled{
  opacity:.48;cursor:not-allowed;filter:saturate(.45);
}
.ui-container{width:min(var(--ui-max),calc(100% - 48px));margin-inline:auto;}
.ui-stack{display:flex;flex-direction:column;gap:var(--ui-space-4);}
.ui-cluster{display:flex;align-items:center;gap:var(--ui-space-3);flex-wrap:wrap;}
.ui-grid{display:grid;gap:var(--ui-space-4);}
.ui-button{
  min-height:var(--ui-control-h);padding:0 18px;border-radius:var(--ui-radius-sm);
  border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font:700 14px/1 var(--sans);text-decoration:none;cursor:pointer;
  transition:background .18s var(--ui-ease),border-color .18s var(--ui-ease),color .18s var(--ui-ease),transform .18s var(--ui-ease),box-shadow .18s var(--ui-ease);
}
.ui-button:hover{transform:translateY(-1px);}
.ui-button:active{transform:translateY(0);}
.ui-button-primary{background:var(--ui-accent);color:#fff;border-color:var(--ui-accent);box-shadow:0 8px 20px rgba(37,99,235,.18);}
.ui-button-primary:hover{background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);}
.ui-button-secondary{background:var(--ui-surface);color:var(--t1);border-color:var(--border2);box-shadow:none;}
.ui-button-secondary:hover{background:var(--ui-hover);border-color:color-mix(in srgb,var(--ui-accent) 35%,var(--border2));}
.ui-button-quiet{background:transparent;color:var(--t2);border-color:transparent;}
.ui-button-quiet:hover{background:var(--ui-hover);color:var(--t1);}
.ui-button-danger{background:var(--ui-danger-soft);color:var(--ui-danger);border-color:color-mix(in srgb,var(--ui-danger) 28%,transparent);}
.ui-surface{
  background:var(--ui-surface);border:1px solid var(--border);border-radius:var(--ui-radius-md);box-shadow:none;
}
.ui-surface-raised{background:var(--ui-surface);border:1px solid var(--border2);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-sm);}
.ui-divider{height:1px;background:var(--border);border:0;}
.ui-field{display:flex;flex-direction:column;gap:var(--ui-space-2);}
.ui-label{font-size:13px;font-weight:600;color:var(--t2);}
.ui-input,.ui-select,.ui-textarea{
  min-height:var(--ui-control-h);width:100%;padding:10px 12px;border:1px solid var(--border2);border-radius:var(--ui-radius-sm);
  background:var(--field-bg);color:var(--t1);font:500 14px/1.45 var(--sans);outline:0;
  transition:border-color .18s,box-shadow .18s,background .18s;
}
.ui-input:hover,.ui-select:hover,.ui-textarea:hover{border-color:color-mix(in srgb,var(--ui-accent) 28%,var(--border2));}
.ui-input:focus,.ui-select:focus,.ui-textarea:focus{border-color:var(--ui-accent);box-shadow:0 0 0 3px var(--ui-accent-soft);}
.ui-badge{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;font:700 10px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;}
.ui-badge-info{background:var(--ui-accent-soft);color:var(--ui-accent);}
.ui-badge-success{background:var(--ui-success-soft);color:var(--ui-success);}
.ui-badge-warning{background:var(--ui-warning-soft);color:var(--ui-warning);}
.ui-badge-danger{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-section-label{font:600 10px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ui-accent);}
.ui-title-xl{font:800 clamp(38px,5vw,72px)/1 var(--sans);letter-spacing:-.05em;color:var(--t1);}
.ui-title-lg{font:800 clamp(30px,4vw,52px)/1.08 var(--sans);letter-spacing:-.045em;color:var(--t1);}
.ui-copy{font:400 16px/1.7 var(--sans);color:var(--t2);}
.ui-meta{font:500 11px/1.5 var(--mono);color:var(--t3);}
.ui-status{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--ui-radius-sm);font-size:13px;line-height:1.5;}
.ui-status-info{background:var(--ui-accent-soft);color:var(--t2);}
.ui-status-success{background:var(--ui-success-soft);color:var(--ui-success);}
.ui-status-warning{background:var(--ui-warning-soft);color:var(--ui-warning);}
.ui-status-danger{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-table-wrap{width:100%;overflow:auto;border:1px solid var(--border);border-radius:var(--ui-radius-md);background:var(--ui-surface);}
.ui-table{width:100%;border-collapse:collapse;font-size:13px;}
.ui-table th{padding:12px 14px;text-align:left;font-size:11px;font-weight:700;color:var(--t3);background:var(--cell-bg);border-bottom:1px solid var(--border);}
.ui-table td{padding:13px 14px;color:var(--t2);border-bottom:1px solid var(--border);}
.ui-table tr:last-child td{border-bottom:0;}
@media(max-width:700px){
  .ui-container{width:min(100% - 32px,var(--ui-max));}
  .ui-button{min-height:46px;}
}