:root{
  --layout-shell:1280px;
  --layout-gap:clamp(10px,1.2vw,16px);
  --layout-line:rgba(190,198,255,.095);
  --layout-control:40px;
}
.dashboard-shell{
  width:min(var(--layout-shell),calc(100% - clamp(24px,4vw,48px)));
  margin-inline:auto;
  padding:clamp(10px,1.35vw,17px) 0 max(28px,env(safe-area-inset-bottom));
}
.topbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  min-height:0;
  margin:0;
  padding:0 0 11px;
  border-bottom:1px solid var(--layout-line);
}
.brand-link{display:inline-flex;align-items:center;gap:11px;min-width:0;width:max-content;max-width:100%;text-decoration:none}
.brand-link img{width:42px;height:42px;flex:0 0 42px;border-radius:13px}
.brand-link>span{display:grid;min-width:0;gap:2px;line-height:1.25}
.brand-link span strong{font-size:.98rem;letter-spacing:-.035em}
.brand-link span small{margin:0;font-size:.68rem;color:#8f98b0}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;width:auto;flex-wrap:nowrap}
.top-actions .status{display:inline-flex;align-items:center;white-space:nowrap;min-height:34px;padding:0 10px;font-size:.65rem}
.top-actions .profile{display:flex;align-items:center;gap:9px;min-width:0;max-width:clamp(170px,22vw,260px);min-height:40px;margin:0;padding:3px 10px 3px 4px;overflow:hidden;border-radius:12px}
.top-actions .profile>div{display:grid;min-width:0;gap:2px;line-height:1.3}
.top-actions .profile strong{display:block;max-width:100%;font-size:.7rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-actions .profile small{display:block;max-width:100%;font-size:.61rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-actions .avatar{width:31px;height:31px;flex:0 0 31px}
.top-actions .logout-btn{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:82px;min-height:var(--layout-control);padding:0 12px;border-radius:11px;white-space:nowrap;font-size:.7rem;line-height:1.1}
.mobile-tabs-toggle{display:none}
.dashboard-nav{width:100%;max-width:none;margin:10px 0 14px;padding:6px;gap:7px;border-radius:16px}
.dashboard-tab{display:flex;align-items:center;min-width:0;min-height:54px;gap:9px;padding:8px 11px;border-radius:11px}
.dashboard-tab .tab-icon{width:33px;height:33px;flex:0 0 33px;border-radius:10px;font-size:.88rem}
.dashboard-tab>span:last-child{min-width:0}
.dashboard-tab strong{font-size:.73rem;line-height:1.25;white-space:normal}
.dashboard-tab small{margin-top:3px;font-size:.59rem;line-height:1.3;white-space:normal}
.dashboard-section:not(.hidden){animation:glowAuthLift .2s ease both}
.dashboard-section>.hero-panel,.dashboard-section>.builder-heading,.dashboard-section>.api-hero,.dashboard-section>.docs-hero{margin-top:9px}
.section-top,.result-head,.panel-card-heading,.key-list-head,.generated-keys-head,.builder-heading{min-width:0;gap:12px}
.section-top,.result-head,.panel-card-heading,.key-list-head,.generated-keys-head{align-items:center;justify-content:space-between}
.section-top>div,.result-head>div,.panel-card-heading>div,.key-list-head>div,.generated-keys-head>div,.builder-heading>div{min-width:0}
.section-top h2,.result-head h2,.files-head h2,.panel-card-heading h2,.key-list-head strong,.generated-keys-head strong{letter-spacing:-.035em}
.library-tools{align-items:center}
.primary-btn,.secondary-btn,.logout-btn,.builder-heading-actions button,.saved-panel-actions button,.file-row-actions button,.file-row-actions a,.published-link-row button,.published-link-row a,.panel-loader-box button,.key-list-head button,.generated-keys-head button,.panel-key-actions button{
  min-height:var(--layout-control);
  line-height:1.15;
  border-radius:10px;
}
.primary-btn,.secondary-btn,.logout-btn,.builder-heading-actions button,.saved-panel-actions button,.file-row-actions button,.file-row-actions a,.published-link-row button,.published-link-row a,.panel-loader-box button,.key-list-head button,.generated-keys-head button,.panel-key-actions button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.primary-btn{padding:0 15px}
.secondary-btn{padding:0 12px;white-space:nowrap}
.builder-heading-actions{align-items:center;gap:8px}
.card,.panel-editor-card,.panel-preview-card,.saved-panels-card,.key-manager-card,.api-token-card,.api-usage-card,.api-pricing-card{scroll-margin-top:16px}
@media(max-width:1000px) and (min-width:701px){
  .dashboard-shell{width:calc(100% - 32px)}
  .topbar{gap:12px}
  .top-actions{gap:6px}
  .top-actions .status{padding-inline:8px}
  .top-actions .profile{max-width:205px}
  .top-actions .profile small{display:none}
  .dashboard-nav{margin:9px 0 12px;gap:5px}
  .dashboard-tab{gap:7px;padding-inline:8px}
  .dashboard-tab .tab-icon{width:30px;height:30px;flex-basis:30px}
  .dashboard-tab strong{font-size:.68rem}
  .dashboard-tab small{font-size:.55rem}
}
@media(max-width:700px){
  .dashboard-shell{width:calc(100% - 24px);padding:max(8px,env(safe-area-inset-top)) 0 max(22px,env(safe-area-inset-bottom))}
  .topbar{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"brand menu" "actions actions";
    align-items:center;
    gap:8px 10px;
    padding:0 0 9px;
    margin:0;
  }
  .topbar>.brand-link{grid-area:brand;min-width:0}
  .topbar>.mobile-tabs-toggle{grid-area:menu;display:inline-flex;align-items:center;justify-content:center;justify-self:end;margin:0;min-height:38px;padding:0 11px;border-radius:11px;font-size:.68rem}
  .topbar>.top-actions{grid-area:actions;display:flex;width:100%;min-width:0;gap:8px;justify-content:stretch;flex-wrap:nowrap}
  .top-actions .status{display:none}
  .top-actions .profile{flex:1 1 auto;width:auto;max-width:none;min-width:0;min-height:38px;margin:0;padding:3px 9px 3px 4px;border-radius:11px}
  .top-actions .profile>div{flex:1;min-width:0}
  .top-actions .profile strong{font-size:.7rem;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .top-actions .profile small{display:none}
  .top-actions .avatar{width:29px;height:29px;flex-basis:29px}
  .top-actions .logout-btn{flex:0 0 auto;min-width:82px;min-height:38px;padding:0 11px;border-radius:10px;font-size:.67rem}
  .dashboard-nav{margin:0}
  .dashboard-section>.hero-panel,.dashboard-section>.builder-heading,.dashboard-section>.api-hero,.dashboard-section>.docs-hero{margin-top:8px}
  .section-top,.result-head,.panel-card-heading,.key-list-head,.generated-keys-head{align-items:flex-start;gap:9px}
  .section-top>div,.result-head>div,.panel-card-heading>div,.key-list-head>div,.generated-keys-head>div{flex:1 1 auto;min-width:0}
  .section-top>.limit-pill,.result-head>.live-pill,.panel-card-heading>.editor-state{flex:0 0 auto;max-width:42%;white-space:normal;text-align:center}
  .files-head{gap:11px}
  .library-tools{width:100%;grid-template-columns:minmax(0,1fr) auto;gap:7px}
  .library-tools .secondary-btn{min-width:76px;padding-inline:10px}
  .builder-heading{align-items:flex-start;flex-wrap:wrap;gap:8px}
  .builder-heading-actions{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .builder-heading-actions>*{width:100%;min-width:0;padding-inline:9px}
  .primary-btn,.secondary-btn,.builder-heading-actions button,.saved-panel-actions button,.file-row-actions button,.file-row-actions a,.published-link-row button,.published-link-row a,.panel-loader-box button,.key-list-head button,.generated-keys-head button,.panel-key-actions button{min-height:39px}
}
@media(max-width:390px){
  .dashboard-shell{width:calc(100% - 18px)}
  .brand-link{gap:8px}
  .brand-link img{width:36px;height:36px;flex-basis:36px;border-radius:11px}
  .brand-link span strong{font-size:.9rem}
  .brand-link span small{font-size:.62rem}
  .topbar>.mobile-tabs-toggle{min-height:36px;padding-inline:9px;gap:7px}
  .top-actions{gap:6px}
  .top-actions .logout-btn{min-width:76px;padding-inline:8px}
  .builder-heading-actions{grid-template-columns:minmax(0,1fr)}
  .builder-heading-actions>*{width:100%}
  .section-top>.limit-pill,.result-head>.live-pill,.panel-card-heading>.editor-state{max-width:38%}
}
@media(prefers-reduced-motion:reduce){.dashboard-section:not(.hidden){animation:none!important}}
