.visually-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.skip-link{
  position:fixed;
  top:max(8px,env(safe-area-inset-top));
  left:50%;
  z-index:100;
  padding:10px 16px;
  border-radius:10px;
  color:#fff;
  background:#173029;
  box-shadow:0 8px 24px rgba(0,0,0,.24);
  transform:translate(-50%,-160%);
  transition:transform .15s ease;
}
.skip-link:focus{transform:translate(-50%,0)}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--focus-ring);
  outline-offset:3px;
}
html,body{min-width:0;max-width:100%;overflow-x:hidden}
body.sidebar-visible,body.dialog-visible{overflow:hidden}
.app-shell,.workspace{min-height:100vh;min-height:100dvh}
.sidebar{z-index:30;padding-top:max(26px,env(safe-area-inset-top));padding-bottom:max(18px,env(safe-area-inset-bottom))}
.workspace-header{min-height:76px;height:auto;padding-top:env(safe-area-inset-top)}
.workspace-family{display:flex;min-width:0;align-items:center;gap:12px}
.workspace-header>div.workspace-family{flex-direction:row}
.workspace-family>div{display:flex;min-width:0;flex-direction:column}
.workspace-header select{max-width:min(48vw,460px);text-overflow:ellipsis}
.sync-state{color:var(--muted)}
.sidebar-toggle{
  display:none;
  width:42px;
  height:42px;
  padding:10px;
  flex:0 0 42px;
  flex-direction:column;
  gap:5px;
  border:1px solid var(--line);
  border-radius:11px;
  color:var(--ink);
  background:var(--card);
}
.sidebar-toggle span{display:block;width:19px;height:2px;border-radius:2px;background:currentColor}
.sidebar-backdrop{
  position:fixed;
  inset:0;
  z-index:25;
  width:100%;
  min-height:100%;
  padding:0;
  border:0;
  border-radius:0;
  background:rgba(8,20,15,.52);
}
.sidebar-backdrop[hidden]{display:none}
.clickable-card{
  width:100%;
  min-height:176px;
  color:inherit;
  appearance:none;
  text-align:left;
}
.content:focus{outline:none}
.content:focus-visible{outline:3px solid var(--focus-ring);outline-offset:-5px}

@media(max-width:960px){
  .sidebar{
    width:min(82vw,300px);
    transform:translateX(-105%);
    transition:transform .2s ease;
    box-shadow:18px 0 45px rgba(6,22,15,.28);
  }
  .app-shell.sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-toggle{display:inline-flex}
  .workspace{margin-left:0}
  .workspace-header{padding-right:max(20px,env(safe-area-inset-right));padding-left:max(20px,env(safe-area-inset-left))}
  .workspace-header select{min-width:0;max-width:42vw}
  .content{padding-right:max(20px,env(safe-area-inset-right));padding-bottom:max(60px,calc(env(safe-area-inset-bottom) + 28px));padding-left:max(20px,env(safe-area-inset-left))}
  .data-row{grid-template-columns:minmax(0,1fr) auto}
  .data-row>:nth-child(2):not(:last-child){grid-column:1/-1}
}

@media(max-width:640px){
  .login-view{padding:calc(env(safe-area-inset-top) + 116px) 16px max(32px,env(safe-area-inset-bottom))}
  .login-home-link{top:max(14px,env(safe-area-inset-top))}
  .login-theme-picker{top:max(56px,calc(env(safe-area-inset-top) + 42px));right:14px}
  .login-theme-picker .theme-segments{width:168px}
  .login-brand{margin-bottom:24px;gap:12px}
  .login-brand h1{font-size:20px}
  .login-brand p{font-size:12px}
  .login-card{padding:28px 20px;border-radius:18px}
  .login-card h2{font-size:22px}
  .approve-code{margin:24px 0 14px;font-size:clamp(34px,11vw,46px);letter-spacing:clamp(7px,2.7vw,13px)}
  .workspace-header{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:12px;align-items:stretch;flex-direction:column;gap:10px}
  .workspace-family{width:100%}
  .workspace-family>div{flex:1}
  .workspace-header select{width:100%;max-width:none;font-size:16px}
  .header-actions{width:100%;justify-content:space-between}
  .header-actions .theme-segments{width:164px}
  .content{padding-top:20px;padding-right:max(15px,env(safe-area-inset-right));padding-left:max(15px,env(safe-area-inset-left))}
  .page-title{font-size:22px}
  .stat-grid,.overview-stat-grid,.module-grid{grid-template-columns:1fr}
  .interaction-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panel,.stat-card,.module-card{padding:17px}
  .panel-head,.task-page-head{align-items:flex-start;flex-direction:column;gap:10px}
  .page-head-actions{width:100%;align-items:stretch;flex-direction:column}
  .page-head-actions>button{width:100%}
  .overview-row{align-items:flex-start;flex-direction:column;gap:7px}
  .data-row{display:flex;align-items:flex-start;flex-direction:column;gap:7px}
  .activity-feed-main,.activity-identity{width:100%;align-items:flex-start}
  .activity-people-copy{flex-wrap:wrap}
  .task-editor{max-height:calc(100dvh - 24px);padding:20px 16px;border-radius:16px}
  .task-editor-actions{position:sticky;bottom:0;padding-top:12px;background:var(--card)}
  .task-editor-actions button{flex:1}
}

@media(max-width:360px){
  .interaction-module-grid{grid-template-columns:1fr}
  .task-editor-actions{align-items:stretch;flex-direction:column}
  .task-editor-actions button{width:100%}
}

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