/* Fenaky Lab Studio, base layer. Fluent 2 components over design-system/tokens.css (generated from
   design/tokens.json). Only token variables here: no literal colors, no theme selectors. Screen
   layouts live in styles/*.css and developers.css. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--colorNeutralBackground3);color:var(--colorNeutralForeground1);font:var(--typeBody1)}
h1,h2,h3,h4,p,figure,dl,dd,ol,ul{margin:0}
ol,ul{padding-left:20px}
img{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--colorBrandForegroundLink)}
a:hover{color:var(--colorBrandForegroundLinkHover)}
a:active{color:var(--colorBrandForegroundLinkPressed)}
:focus-visible{outline:var(--strokeWidthThick) solid var(--colorStrokeFocus2);outline-offset:1px}
[hidden]{display:none !important}
.mono,code,kbd,pre{font-family:var(--fontFamilyMonospace)}
code{font-size:12px}
.offscreen{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:100;top:-80px;left:16px;padding:8px 16px;border-radius:var(--borderRadiusMedium);background:var(--colorBrandBackground);color:var(--colorNeutralForegroundOnBrand);font:var(--typeBody1Strong);text-decoration:none}
.skip-link:focus{top:8px;color:var(--colorNeutralForegroundOnBrand)}

/* Type ramp helpers */
.type-large-title{font:var(--typeLargeTitle)}
.type-title2{font:var(--typeTitle2)}
.type-title3{font:var(--typeTitle3)}
.type-subtitle1{font:var(--typeSubtitle1)}
.type-subtitle2{font:var(--typeSubtitle2)}
.type-caption{font:var(--typeCaption1);color:var(--colorNeutralForeground3)}

/* Icons: Fluent System Icons, 20 px */
.icon{display:inline-block;flex:none;width:20px;height:20px;vertical-align:middle}
.icon.small{width:16px;height:16px}
.icon.spin{animation:lab-spin 1s linear infinite}
@keyframes lab-spin{to{transform:rotate(360deg)}}

/* Buttons (Fluent Button: secondary by default, primary, subtle, toggle, sizes) */
.button,.icon-button,.text-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacingSNudge);min-height:32px;padding:5px var(--spacingM);border:var(--strokeWidthThin) solid transparent;border-radius:var(--borderRadiusMedium);font:var(--typeBody1Strong);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color var(--durationFaster) var(--curveEasyEase),border-color var(--durationFaster) var(--curveEasyEase),color var(--durationFaster) var(--curveEasyEase)}
.button{background:var(--colorNeutralBackground1);border-color:var(--colorNeutralStroke1);color:var(--colorNeutralForeground1)}
.button:hover{background:var(--colorNeutralBackground1Hover);border-color:var(--colorNeutralStroke1Hover);color:var(--colorNeutralForeground1)}
.button:active{background:var(--colorNeutralBackground1Pressed);border-color:var(--colorNeutralStroke1Pressed)}
.button.primary{background:var(--colorBrandBackground);border-color:transparent;color:var(--colorNeutralForegroundOnBrand)}
.button.primary:hover{background:var(--colorBrandBackgroundHover);color:var(--colorNeutralForegroundOnBrand)}
.button.primary:active{background:var(--colorBrandBackgroundPressed)}
.button.subtle,.text-button,.icon-button{background:transparent;border-color:transparent;color:var(--colorNeutralForeground2)}
.button.subtle:hover,.text-button:hover,.icon-button:hover{background:var(--colorSubtleBackgroundHover);color:var(--colorNeutralForeground2Hover)}
.button.subtle:active,.text-button:active,.icon-button:active{background:var(--colorSubtleBackgroundPressed)}
.text-button{font-weight:var(--fontWeightRegular)}
.icon-button{min-width:32px;padding:5px}
.button.large{min-height:40px;padding:8px var(--spacingL);font:var(--typeSubtitle2)}
.button.compact{min-height:24px;padding:1px var(--spacingS);font:var(--typeCaption1Strong)}
.button.compact .icon{width:16px;height:16px}
.button.block{display:flex;width:100%}
.button.danger{color:var(--colorStatusDangerForeground1)}
.button.danger:hover{border-color:var(--colorStatusDangerBorder1);color:var(--colorStatusDangerForeground1)}
.button[aria-pressed="true"],.icon-button[aria-pressed="true"]{background:var(--colorBrandBackground2);border-color:var(--colorBrandStroke1);color:var(--colorBrandForeground2);font-weight:var(--fontWeightSemibold)}
.button[aria-pressed="true"]:hover,.icon-button[aria-pressed="true"]:hover{background:var(--colorBrandBackground2Hover);color:var(--colorBrandForeground2)}
.button:disabled,.icon-button:disabled,.text-button:disabled,.button[aria-disabled="true"]{background:var(--colorNeutralBackgroundDisabled);border-color:var(--colorNeutralStrokeDisabled);color:var(--colorNeutralForegroundDisabled);cursor:not-allowed}
.icon-button:disabled,.text-button:disabled{background:transparent;border-color:transparent}
.button.pill{border-radius:var(--borderRadiusCircular)}
.inline-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacingS)}

/* Toggle groups (Fluent ToggleButton set) */
.segmented,.toggle-group{display:inline-flex;flex-wrap:wrap;gap:var(--spacingXS)}
.segmented > button,.toggle-group > button{min-height:32px;padding:5px var(--spacingMNudge);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);font:var(--typeBody1);cursor:pointer}
.segmented > button:hover,.toggle-group > button:hover{background:var(--colorNeutralBackground1Hover);border-color:var(--colorNeutralStroke1Hover)}
.segmented > button[aria-pressed="true"],.segmented > button[aria-selected="true"],.toggle-group > button[aria-pressed="true"]{background:var(--colorBrandBackground2);border-color:var(--colorBrandStroke1);color:var(--colorBrandForeground2);font-weight:var(--fontWeightSemibold)}
.theme-switch{display:inline-flex;gap:2px;padding:2px;border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1)}
.theme-switch .icon-button{min-width:28px;min-height:28px;padding:3px}

/* Fields (Fluent Field, Input, Select, Textarea, Checkbox) */
.field{display:flex;flex-direction:column;gap:var(--spacingXS)}
.field > span,.field-label,legend{font:var(--typeBody1Strong);color:var(--colorNeutralForeground1)}
.field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),.field select,.field textarea,.input{width:100%;min-height:32px;padding:5px var(--spacingMNudge);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-bottom-color:var(--colorNeutralStrokeAccessible);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);font:var(--typeBody1)}
.field textarea{resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover,.input:hover{border-color:var(--colorNeutralStroke1Hover);border-bottom-color:var(--colorNeutralStrokeAccessibleHover)}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible,.input:focus-visible{outline:none;border-bottom-color:var(--colorCompoundBrandStroke);box-shadow:inset 0 -1px 0 var(--colorCompoundBrandStroke)}
.field input:disabled,.field select:disabled,.field textarea:disabled{background:var(--colorNeutralBackgroundDisabled);border-color:var(--colorNeutralStrokeDisabled);color:var(--colorNeutralForegroundDisabled)}
.field input[aria-invalid="true"],.field select[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-bottom-color:var(--colorStatusDangerForeground1);box-shadow:inset 0 -1px 0 var(--colorStatusDangerForeground1)}
.field-help{font:var(--typeCaption1);color:var(--colorNeutralForeground3)}
.field-error{font:var(--typeCaption1);color:var(--colorStatusDangerForeground1)}
.field-group{display:flex;flex-direction:column;gap:var(--spacingM);margin:0;padding:0;border:0}
.checkbox{display:inline-flex;align-items:center;gap:var(--spacingS);cursor:pointer}
input[type="checkbox"],input[type="radio"]{width:16px;height:16px;margin:0;flex:none;accent-color:var(--colorCompoundBrandBackground)}
.file-field input[type="file"]{font:var(--typeCaption1);color:var(--colorNeutralForeground2)}
.search-field{position:relative}

/* Surfaces (Fluent Card) */
.card,.panel{background:var(--colorNeutralBackground1);border-radius:var(--borderRadiusXLarge);box-shadow:var(--shadow4)}
.card{padding:var(--spacingL)}
.card-link{display:flex;flex-direction:column;overflow:hidden;color:var(--colorNeutralForeground1);text-decoration:none;transition:box-shadow var(--durationNormal) var(--curveEasyEase),background-color var(--durationFaster) var(--curveEasyEase)}
.card-link:hover{background:var(--colorNeutralBackground1Hover);box-shadow:var(--shadow8);color:var(--colorNeutralForeground1)}
.divider,hr{margin:0;border:0;border-top:var(--strokeWidthThin) solid var(--colorNeutralStroke2)}

/* Badges, status labels and tags (Fluent Badge) */
.status-label,.badge,.tag{display:inline-flex;align-items:center;gap:var(--spacingXS);min-height:20px;padding:0 var(--spacingSNudge);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusCircular);background:var(--colorNeutralBackground1);color:var(--colorNeutralForeground2);font:var(--typeCaption1Strong);white-space:nowrap}
.status-label.success{background:var(--colorStatusSuccessBackground1);border-color:var(--colorStatusSuccessBorder1);color:var(--colorStatusSuccessForeground1)}
.status-label.warning{background:var(--colorStatusWarningBackground1);border-color:var(--colorStatusWarningBorder1);color:var(--colorStatusWarningForeground1)}
.status-label.error,.status-label.danger{background:var(--colorStatusDangerBackground1);border-color:var(--colorStatusDangerBorder1);color:var(--colorStatusDangerForeground1)}
.status-label.brand,.status-label.info,.badge.brand{background:var(--colorBrandBackground2);border-color:var(--colorBrandStroke2);color:var(--colorBrandForeground2)}
.badge.filled{background:var(--colorBrandBackground);border-color:transparent;color:var(--colorNeutralForegroundOnBrand)}
.badge.warning-filled{background:var(--colorStatusWarningBackground3);border-color:transparent;color:var(--colorNeutralForeground1Static)}
.tag{font-weight:var(--fontWeightRegular)}
.pill-row{display:flex;flex-wrap:wrap;gap:var(--spacingXS)}

/* Message bars (Fluent MessageBar) */
.notice{display:flex;align-items:flex-start;gap:var(--spacingS);padding:var(--spacingS) var(--spacingM);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground2);font:var(--typeBody1)}
.notice > .icon{margin-top:0;color:var(--colorNeutralForeground3)}
.notice strong{font-weight:var(--fontWeightSemibold)}
.notice.success{background:var(--colorStatusSuccessBackground1);border-color:var(--colorStatusSuccessBorder1)}
.notice.success > .icon{color:var(--colorStatusSuccessForeground1)}
.notice.warning{background:var(--colorStatusWarningBackground1);border-color:var(--colorStatusWarningBorder1)}
.notice.warning > .icon{color:var(--colorStatusWarningForeground1)}
.notice.error{background:var(--colorStatusDangerBackground1);border-color:var(--colorStatusDangerBorder1)}
.notice.error > .icon{color:var(--colorStatusDangerForeground1)}
.notice.info,.synthetic-note{background:var(--colorBrandBackground2);border-color:var(--colorBrandStroke2)}
.notice.info > .icon{color:var(--colorBrandForeground1)}
.inline-note{font:var(--typeCaption1);color:var(--colorNeutralForeground3)}

/* Metadata list, tables, empty states */
.metadata{display:grid;gap:var(--spacingXS)}
.metadata > div{display:flex;justify-content:space-between;gap:var(--spacingM);padding:var(--spacingXS) 0;border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke3)}
.metadata dt{color:var(--colorNeutralForeground3)}
.metadata dd{font-weight:var(--fontWeightSemibold);text-align:right;overflow-wrap:anywhere}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{padding:var(--spacingS) var(--spacingM);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke1);font:var(--typeBody1Strong);text-align:left}
td{padding:var(--spacingS) var(--spacingM);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);vertical-align:top}
.empty-result{display:flex;flex-direction:column;align-items:center;gap:var(--spacingS);padding:var(--spacingXXXL) var(--spacingL);text-align:center;color:var(--colorNeutralForeground3)}
.empty-result > .icon{width:32px;height:32px;color:var(--colorNeutralForeground4)}
.empty-result h2{font:var(--typeSubtitle2);color:var(--colorNeutralForeground1)}

/* Pixel art: never smoothed, always over the transparency checker */
.checker{background-color:var(--labCheckerA);background-image:linear-gradient(45deg,var(--labCheckerB) 25%,transparent 25%),linear-gradient(-45deg,var(--labCheckerB) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--labCheckerB) 75%),linear-gradient(-45deg,transparent 75%,var(--labCheckerB) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}
.pixel-img,.pixelated{image-rendering:pixelated}
.palette{display:flex;flex-wrap:wrap;gap:2px}

/* Shared view blocks rendered by views.js (studio, library, tasks) */
/* Linha de versão */
.version-row{display:flex;align-items:center;gap:var(--spacingS);width:100%;padding:var(--spacingS) var(--spacingM);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);text-align:left;cursor:pointer;transition:background-color var(--durationFaster) var(--curveEasyEase),border-color var(--durationFaster) var(--curveEasyEase)}
.version-row:hover{background:var(--colorNeutralBackground1Hover);border-color:var(--colorNeutralStroke1Hover)}
.version-row > span{padding:var(--spacingXXS) var(--spacingSNudge);border-radius:var(--borderRadiusSmall);background:var(--colorNeutralBackground3);font:600 12px/16px var(--fontFamilyMonospace)}
.version-row > div{flex:1;min-width:0}
.version-row strong{display:block;font:var(--typeBody1Strong)}
.version-row small{display:block;font:var(--typeCaption1);color:var(--colorNeutralForeground3)}
.version-row small.synthetic-note{margin-top:var(--spacingXXS);padding:0 var(--spacingXS);border-radius:var(--borderRadiusSmall);color:var(--colorStatusWarningForeground1);background:var(--colorStatusWarningBackground1);border:0}
.version-row > .icon{color:var(--colorBrandForeground1)}
.version-row.selected,.version-row[aria-pressed="true"]{background:var(--colorBrandBackground2);border-color:var(--colorBrandStroke1)}

/* Verificações de qualidade */
.quality-summary{margin-bottom:var(--spacingS)}
.quality-list{display:flex;flex-direction:column;gap:var(--spacingS);margin:0 0 var(--spacingS);padding:0;list-style:none}
.quality-check{display:flex;align-items:flex-start;gap:var(--spacingS);font:var(--typeBody1);color:var(--colorNeutralForeground2)}
.check-state{flex:none;min-width:44px;padding:0 var(--spacingSNudge);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusCircular);font:var(--typeCaption1Strong);text-align:center}
.quality-check.ok .check-state{background:var(--colorStatusSuccessBackground1);border-color:var(--colorStatusSuccessBorder1);color:var(--colorStatusSuccessForeground1)}
.quality-check.warning .check-state{background:var(--colorStatusWarningBackground1);border-color:var(--colorStatusWarningBorder1);color:var(--colorStatusWarningForeground1)}
.quality-check.error .check-state{background:var(--colorStatusDangerBackground1);border-color:var(--colorStatusDangerBorder1);color:var(--colorStatusDangerForeground1)}

/* Paleta e amostras de cor; --labSwatch vem do dado da arte, nunca de um tema */
.palette i{display:block;width:22px;height:22px;border-radius:var(--borderRadiusSmall);background:var(--labSwatch);box-shadow:inset 0 0 0 var(--strokeWidthThin) var(--colorNeutralStroke1)}
.inline-swatch{display:inline-flex;align-items:center;gap:var(--spacingXS)}
.inline-swatch i{display:block;width:14px;height:14px;border-radius:var(--borderRadiusSmall);background:var(--labSwatch);box-shadow:inset 0 0 0 var(--strokeWidthThin) var(--colorNeutralStroke1)}

/* Seção recolhível */
.advanced{border-top:var(--strokeWidthThin) solid var(--colorNeutralStroke2);padding-top:var(--spacingS)}
.advanced summary{display:flex;align-items:center;justify-content:space-between;gap:var(--spacingS);min-height:28px;font:var(--typeBody1Strong);cursor:pointer;list-style:none}
.advanced summary::-webkit-details-marker{display:none}
.advanced summary::after{content:"+";margin-left:auto;font:var(--typeSubtitle2);color:var(--colorNeutralForeground3)}
.advanced[open] > summary{margin-bottom:var(--spacingS)}
.advanced[open] > summary::after{content:"\2212"}
.advanced summary > .icon{display:none}

/* Page primitives */
.page-heading{display:flex;flex-direction:column;gap:var(--spacingXS);margin-bottom:var(--spacingXXL)}
.page-heading h1{font:var(--typeTitle2)}
.page-heading p{max-width:720px;color:var(--colorNeutralForeground3)}
.section-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--spacingM);margin-bottom:var(--spacingM)}
.section-heading h2{font:var(--typeSubtitle1)}
.section-heading a{margin-left:auto}

/* Shell: top header with tabs, content, footer */
.topbar{position:sticky;top:0;z-index:20;background:var(--colorNeutralBackground1);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2)}
.topbar-inner{display:flex;align-items:center;gap:var(--spacingM);min-height:48px;padding:0 var(--spacingXL)}
a.brand{display:inline-flex;align-items:center;gap:var(--spacingMNudge);color:var(--colorNeutralForeground1);font:var(--typeSubtitle2);text-decoration:none;white-space:nowrap}
a.brand:hover{color:var(--colorNeutralForeground1)}
.brand-mark{display:grid;grid-template-columns:repeat(2,7px);gap:2px}
.brand-mark i{display:block;width:7px;height:7px;background:var(--colorNeutralForeground1)}
.brand-mark i:first-child,.brand-mark i:last-child{background:var(--colorBrandBackground)}
.project-switch select{min-height:32px;max-width:220px;padding:5px 28px 5px var(--spacingS);border:var(--strokeWidthThin) solid transparent;border-radius:var(--borderRadiusMedium);background:transparent;color:var(--colorNeutralForeground1);font:var(--typeBody1Strong);cursor:pointer}
.project-switch select:hover{background:var(--colorSubtleBackgroundHover)}
.topnav{display:flex;align-items:stretch;align-self:stretch;margin-left:auto}
.nav-link{position:relative;display:inline-flex;align-items:center;gap:var(--spacingS);padding:0 var(--spacingMNudge);color:var(--colorNeutralForeground2);font:var(--typeBody1);text-decoration:none;white-space:nowrap}
.nav-link:hover{color:var(--colorNeutralForeground2Hover)}
.nav-link:hover::after,.nav-link[aria-current]::after{content:"";position:absolute;left:var(--spacingMNudge);right:var(--spacingMNudge);bottom:0;height:3px;border-radius:var(--borderRadiusCircular);background:var(--colorNeutralStroke1Hover)}
.nav-link[aria-current]{color:var(--colorNeutralForeground1);font-weight:var(--fontWeightSemibold)}
.nav-link[aria-current]::after{background:var(--colorCompoundBrandStroke)}
.nav-link .icon{display:none}
.topbar-right{display:flex;align-items:center;gap:var(--spacingS)}
.balance-badge{display:inline-flex;align-items:center;gap:var(--spacingXS);min-height:24px;padding:0 var(--spacingMNudge);border:var(--strokeWidthThin) solid var(--colorBrandStroke2);border-radius:var(--borderRadiusCircular);background:var(--colorBrandBackground2);color:var(--colorBrandForeground2);font:600 12px/16px var(--fontFamilyMonospace);text-decoration:none;white-space:nowrap}
.balance-badge:hover{color:var(--colorBrandForeground2);background:var(--colorBrandBackground2Hover)}
.env-badge{display:inline-flex;align-items:center;min-height:24px;padding:0 var(--spacingMNudge);border-radius:var(--borderRadiusCircular);background:var(--colorStatusWarningBackground3);color:var(--colorNeutralForeground1Static);font:var(--typeCaption1Strong);white-space:nowrap}
.avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--colorBrandBackground2);color:var(--colorBrandForeground2);font:var(--typeCaption1Strong);text-decoration:none}
.avatar:hover{color:var(--colorBrandForeground2);box-shadow:0 0 0 var(--strokeWidthThick) var(--colorBrandStroke2)}
.mobile-menu{display:none}
.content{display:block;width:100%;max-width:1480px;margin:0 auto;padding:var(--spacingXXL) var(--spacingXXL) var(--spacingXXXL)}
.content:focus{outline:none}
.app-footer{max-width:1480px;margin:0 auto;padding:var(--spacingL) var(--spacingXXL) var(--spacingXXL);font:var(--typeCaption1);color:var(--colorNeutralForeground3)}
.app-footer a{color:var(--colorNeutralForeground3)}

/* Sign-in and load errors */
.auth-screen{display:grid;place-items:center;min-height:100vh;padding:var(--spacingXXL)}
.auth-card{display:flex;flex-direction:column;gap:var(--spacingL);width:min(440px,100%);padding:var(--spacingXXL);background:var(--colorNeutralBackground1);border-radius:var(--borderRadiusXLarge);box-shadow:var(--shadow16)}
.auth-card h1{font:var(--typeTitle3);font-weight:var(--fontWeightSemibold)}
.auth-card p{color:var(--colorNeutralForeground3)}
.auth-card form{display:flex;flex-direction:column;gap:var(--spacingL)}
.auth-theme{display:flex;justify-content:flex-end}

/* Toast (Fluent Toast) */
.toast{position:fixed;z-index:90;bottom:var(--spacingXXL);left:50%;display:flex;align-items:center;gap:var(--spacingS);max-width:min(560px,calc(100vw - 32px));padding:var(--spacingM) var(--spacingL);border-radius:var(--borderRadiusMedium);background:var(--colorNeutralBackground1);box-shadow:var(--shadow16);opacity:0;pointer-events:none;transform:translateX(-50%) translateY(16px);transition:opacity var(--durationNormal) var(--curveEasyEase),transform var(--durationNormal) var(--curveDecelerateMid)}
.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}
.toast > .icon{color:var(--colorStatusSuccessForeground1)}

/* Narrow screens: the tabs become a menu under the header */
@media (max-width:900px){
  .topbar-inner{flex-wrap:wrap;padding:0 var(--spacingM)}
  .mobile-menu{display:inline-flex}
  .project-switch{order:3;width:100%;padding-bottom:var(--spacingXS)}
  .project-switch select{max-width:none;width:100%}
  .topnav{position:absolute;top:100%;left:0;right:0;z-index:30;display:none;flex-direction:column;margin:0;padding:var(--spacingS);background:var(--colorNeutralBackground1);border-bottom:var(--strokeWidthThin) solid var(--colorNeutralStroke2);box-shadow:var(--shadow8)}
  .topnav.is-open{display:flex}
  .nav-link{min-height:44px;padding:0 var(--spacingM);border-radius:var(--borderRadiusMedium)}
  .nav-link .icon{display:inline-block}
  .nav-link:hover::after,.nav-link[aria-current]::after{left:0;right:auto;top:10px;bottom:10px;width:3px;height:auto}
  .topbar-right{margin-left:auto}
  .balance-badge,.env-badge{display:none}
  .content{padding:var(--spacingL) var(--spacingL) var(--spacingXXL)}
  .app-footer{padding:var(--spacingL)}
}

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