/* Motion and reading ergonomics. No catalogue-wide artificial panel heights. */
:root{--atlas-sticky-top:120px;--atlas-ease:cubic-bezier(.2,.65,.3,1);view-transition-name:none}
html{scroll-padding-top:var(--atlas-sticky-top);scrollbar-gutter:stable}
::view-transition{pointer-events:none}
.workspace-main{view-transition-name:atlas-workspace}
::view-transition-group(atlas-workspace){animation-duration:220ms;animation-timing-function:var(--atlas-ease)}
::view-transition-old(atlas-workspace){animation:atlas-leave 140ms ease-out both}
::view-transition-new(atlas-workspace){animation:atlas-arrive 200ms var(--atlas-ease) both}
@keyframes atlas-leave{to{opacity:0}}
@keyframes atlas-arrive{from{opacity:0}to{opacity:1}}
/* Active-state movement is independent of the workspace's content animation. */
#workspace-dock [role=tablist]{position:relative}
#workspace-dock [role=tab][aria-selected=true]::after{opacity:0}
.atlas-dock-indicator{position:absolute;top:0;left:0;height:2px;background:#d8bb83;box-shadow:0 0 9px #d8bb8333;pointer-events:none;transition:transform 240ms var(--atlas-ease),width 240ms var(--atlas-ease);z-index:2}
#workspace-dock [role=tab]{transition:background-color 220ms,border-color 220ms,color 180ms}
/* A persistent resting image and a distinct reveal layer. Hover changes opacity,
   never the image URL or hit target, so interrupted fades reverse naturally. */
.content-grid .nav-card::before,.tool-choice::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--portal-shade),var(--portal-reveal);background-position:var(--portal-position,60% center);background-size:cover;opacity:0;transition:opacity 1200ms cubic-bezier(.45,0,.55,1)}
@media(hover:hover){.content-grid .nav-card:hover::before,.tool-choice:hover::before{opacity:1}}
.content-grid .nav-card:focus-visible::before,.tool-choice:focus-visible::before{opacity:1}
.content-grid .nav-card,.tool-choice{transition:border-color 300ms,box-shadow 300ms!important}
/* Overflow must not create a false scroll container for the reading rails. */
#item-database,#hero-view[data-hero-surface=browser],.hero-browser,.browser-gallery{overflow:visible!important}
#item-database .atlas-reader-bar{position:sticky;top:var(--atlas-sticky-top);z-index:24;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:14px;min-height:72px;padding:11px 14px;margin:0 0 22px;border:1px solid #ad91625c;border-radius:4px;background:linear-gradient(100deg,#393328,#282820);box-shadow:0 5px 20px #0004;isolation:isolate;overflow-anchor:auto}
.atlas-reader-name{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 17px/1.5 var(--atlas-body,system-ui);color:#eadbbd}
#item-database .atlas-reader-bar .item-back{background:transparent;box-shadow:none;border-color:transparent;min-width:90px;padding:10px 6px;font-size:15px;white-space:nowrap}
#item-database .atlas-reader-bar .item-view-navigation{position:static!important;transform:none!important;inset:auto!important;gap:10px;margin:0;padding:0;white-space:nowrap;display:flex;align-items:center}
#item-database .atlas-reader-bar .item-view-arrow{width:44px;height:44px;flex:none;border-color:#c2a16d77;border-radius:3px;background:#191d1766;color:#efdbaf;transition:background 140ms,border-color 140ms}
#item-database .atlas-reader-bar .item-view-arrow:hover:not(:disabled){background:#6f58333d;border-color:#e6ca90}
.atlas-reader-count{display:block;width:110px;text-align:center;font:500 14px/1.5 var(--atlas-body,system-ui);font-variant-numeric:tabular-nums;color:#cec5b1;white-space:nowrap}
.atlas-reader-contents{font:600 14px/1.5 var(--atlas-body,system-ui);color:#d5bf93;padding:9px 12px;min-height:44px;border:1px solid #c2a16d44;border-radius:3px;background:#24251f;white-space:nowrap}
.atlas-reader-contents:hover{border-color:#d8bb83;background:#3d3829}
.atlas-reader-body{overflow-anchor:none}
.item-showcase,.item-view-content{min-width:0}
#item-database .item-title-row .item-view-title{white-space:normal;overflow:visible;overflow-wrap:break-word}
#item-database .item-art-caption .item-art-title{white-space:normal;overflow:visible;overflow-wrap:anywhere;line-height:1.35}
#item-database .atlas-reader-body :is(h2,h3,h4,.item-detail-panel,.item-facts,.item-view-heading,.item-evidence){scroll-margin-top:98px}
.atlas-reader-count-compact{display:none}
#item-database .item-inspector{container:atlas-reader / inline-size}
.hero-reference-body :is(h2,h3),.skills-introduction,.hero-skills-grid{scroll-margin-top:18px}
[data-atlas-jump-target]:focus{outline:none;background:linear-gradient(90deg,#d8bb8317,transparent);box-shadow:-3px 0 #d8bb83;padding-inline-start:10px;margin-inline-start:-10px;border-radius:2px}
/* The same controls follow the results; there is no second, unsynchronised pager. */
.item-results-bar,.browser-results-toolbar{position:sticky;top:var(--atlas-sticky-top);z-index:18;padding:12px 14px;border:1px solid #ad91624d;border-radius:4px;background:#2a2a22;box-shadow:0 4px 14px #0003;gap:16px}
.item-results-bar{margin:22px 0 16px}
.item-results-bar .item-pagination{margin:0;gap:12px;flex:none;font-size:14px}
.item-results-bar .item-page-button{font-size:14px;min-height:42px;padding:9px 12px;white-space:nowrap}
.item-results-bar .item-pagination>span{min-width:85px;text-align:center;font-variant-numeric:tabular-nums}
.atlas-library-coverage{margin:0 0 16px;text-align:left;font-size:13px}
.item-result-grid,.browser-card-grid,.browser-gallery{scroll-margin-top:88px}
.browser-results-toolbar{display:grid;grid-template-columns:minmax(140px,1fr) auto auto;margin-bottom:24px}
.browser-results-toolbar .browser-pagination{margin:0;gap:5px;flex-wrap:nowrap}
.browser-results-toolbar .browser-page{font-size:14px;min-height:38px;min-width:34px;width:34px;padding:6px}
.browser-results-toolbar .browser-clear{font-size:14px;min-height:38px;padding:7px 10px}
.browser-result-count{font-size:16px}
/* Local command/jump palette. Native dialog owns the modal focus boundary. */
.atlas-context{align-items:center}
.atlas-context-description{margin-left:auto}
.atlas-find-trigger{display:flex;align-items:center;gap:13px;padding:7px 12px;border:1px solid #7e613d66;border-radius:3px;background:#ead4a877;color:#48351f;font:600 14px/1.5 var(--atlas-body,system-ui);letter-spacing:0;min-height:36px;white-space:nowrap;cursor:pointer}
.atlas-find-trigger kbd{padding:1px 5px;font:600 11px/1.5 var(--atlas-body,system-ui);border:1px solid #7e613d44;border-radius:2px;background:#e8d3ae55}
.atlas-find-dialog{position:fixed;width:min(690px,calc(100vw - 32px));max-width:none;max-height:min(760px,calc(100dvh - 60px));margin:auto;padding:0;border:1px solid #c8a46c;border-radius:6px;background:#292a23;color:#efe4cf;box-shadow:0 24px 100px #0009;overflow:hidden}
.atlas-find-dialog::backdrop{background:#11170fbf;backdrop-filter:blur(5px)}
.atlas-find-dialog[open]{display:flex;flex-direction:column}
.atlas-find-heading{display:flex;justify-content:space-between;align-items:center;padding:21px 26px 12px;gap:20px}
.atlas-find-heading h2{font:400 29px/1.3 var(--atlas-display,Georgia);margin:0;color:#efdfbe}
.atlas-find-close{width:40px;height:40px;padding:0;border:1px solid #b2966544;border-radius:3px;background:#1b211b;color:#d6c6a4;font-size:27px;line-height:1;cursor:pointer}
.atlas-find-dialog .atlas-find-input{box-sizing:border-box;display:block;width:calc(100% - 52px);margin:0 26px;min-height:52px;padding:12px 16px;border:1px solid #c7a96d88;border-radius:4px;background:#191f19;color:#f0e6d2;font:400 19px/1.5 var(--atlas-body,system-ui)}
.atlas-find-dialog .atlas-find-input::placeholder{color:#b9b7a7}
.atlas-find-status{margin:14px 27px 12px;font:400 14px/1.5 var(--atlas-body,system-ui);color:#bdb8a8}
.atlas-find-results{padding:0 14px 14px;max-height:min(440px,50dvh);min-height:0;flex:1 1 auto;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#8c7851 #252820}
.atlas-find-result{display:flex;align-items:center;justify-content:space-between;gap:22px;text-align:left;width:100%;min-height:54px;padding:12px 14px;border:1px solid transparent;border-radius:4px;background:transparent;color:#e9dfca;cursor:pointer;font:500 18px/1.5 var(--atlas-body,system-ui)}
.atlas-find-result span{min-width:0;overflow-wrap:anywhere}
.atlas-find-result small{flex:none;font:400 13px/1.5 var(--atlas-body,system-ui);color:#c4b794}
.atlas-find-result[aria-selected=true],.atlas-find-result:hover{background:#4b422d77;border-color:#c1a36b55}
.atlas-find-hint{margin:0;padding:14px 26px;border-top:1px solid #b2966533;background:#22271e;font:400 13px/1.6 var(--atlas-body,system-ui);color:#bdb7a5}
@supports(interpolate-size:allow-keywords){
  :is(.atlas-advanced-filters,.skill-upgrade-disclosure,.saved-builds,.hero-support){interpolate-size:allow-keywords}
  :is(.atlas-advanced-filters,.skill-upgrade-disclosure,.saved-builds,.hero-support)::details-content{block-size:0;overflow:clip;transition:block-size 220ms var(--atlas-ease),content-visibility 220ms allow-discrete}
  :is(.atlas-advanced-filters,.skill-upgrade-disclosure,.saved-builds,.hero-support)[open]::details-content{block-size:auto}
}
@media(max-width:1050px){.browser-results-toolbar{grid-template-columns:1fr auto}.browser-results-toolbar .browser-pagination{grid-column:1/-1;justify-content:center}.atlas-context-description{display:none}.item-results-bar .item-pagination{gap:8px}.atlas-reader-name{font-size:16px}.atlas-reader-bar{gap:9px!important}.atlas-reader-count{width:100px}}
@media(max-width:950px){.item-inspector-stage{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){
  #item-database .atlas-reader-bar{grid-template-columns:auto 1fr auto;gap:8px;padding:8px 9px;min-height:62px;margin-bottom:18px}
  .atlas-reader-name{display:none}
  #item-database .atlas-reader-bar .item-back{min-width:0;font-size:14px;padding:9px 0}
  .atlas-reader-contents{font-size:13px;padding:8px;min-height:42px;justify-self:start}
  #item-database .atlas-reader-bar .item-view-navigation{gap:6px;justify-content:flex-end}
  #item-database .atlas-reader-bar .item-view-arrow{height:42px;width:40px}
  .atlas-reader-count{width:84px;font-size:12px}
  .item-results-bar{flex-wrap:wrap;gap:10px;padding:11px}
  .item-results-bar .item-result-count{font-size:15px;margin:0}
  .item-results-bar .item-pagination{justify-content:space-between;width:100%;gap:8px}
  .item-results-bar .item-page-button{padding:8px 11px;font-size:14px;min-height:40px}
  .item-result-grid,.browser-card-grid,.browser-gallery{scroll-margin-top:118px}
  .browser-results-toolbar{padding:11px;gap:10px}
  .browser-results-toolbar .browser-pagination{gap:10px}
  .browser-results-toolbar .browser-page:not(.browser-page-arrow):not([aria-current=page]){display:none}
  .browser-results-toolbar .browser-page{min-width:40px;width:40px;min-height:40px}
  .browser-result-count{font-size:15px}
  .atlas-find-trigger{font-size:13px;min-height:34px;padding:6px 10px;gap:8px}
  .atlas-find-trigger kbd{display:none}
  .atlas-find-dialog{max-height:calc(100dvh - 30px);width:calc(100vw - 22px)}
  .atlas-find-heading{padding:18px 18px 12px}.atlas-find-heading h2{font-size:27px}
  .atlas-find-dialog .atlas-find-input{width:calc(100% - 36px);margin:0 18px;font-size:17px}
  .atlas-find-status{margin:12px 19px;font-size:13px}.atlas-find-results{padding:0 9px 10px;max-height:52dvh}
  .atlas-find-result{font-size:17px;gap:14px;padding:12px 10px}.atlas-find-result small{font-size:12px;max-width:90px;text-align:right}
  .atlas-find-hint{padding:13px 18px;font-size:12px}
}
@media(max-width:380px){#item-database .atlas-reader-bar{gap:5px;padding:8px 6px}.atlas-reader-contents{font-size:0;width:32px;padding:6px}.atlas-reader-contents::after{content:'☷';font-size:22px}.atlas-reader-count{width:76px;font-size:11px}#item-database .atlas-reader-bar .item-view-arrow{width:36px;height:42px}#item-database .atlas-reader-bar .item-back{font-size:13px}}
.atlas-reduced-motion .workspace-main{view-transition-name:none}
@container atlas-reader (max-width:740px){.item-inspector-stage{grid-template-columns:minmax(0,1fr)}.item-showcase{border-right:0;border-bottom:1px solid var(--item-line,#b2966540)}}
@container atlas-reader (max-width:650px){
  #item-database .atlas-reader-bar{grid-template-columns:auto auto minmax(0,1fr);gap:8px;padding:8px 9px;min-height:62px}
  .atlas-reader-name{display:none}.atlas-reader-count{width:72px}
  .atlas-reader-count-full{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .atlas-reader-count-compact{display:block;font:500 14px/1.5 var(--atlas-body,system-ui)}
  #item-database .atlas-reader-contents{font-size:0;width:36px;padding:6px;min-height:42px;line-height:1}#item-database .atlas-reader-contents::after{content:'☷';font-size:24px}
  #item-database .atlas-reader-bar .item-back{min-width:0;font-size:14px;padding:9px 0}
  #item-database .atlas-reader-bar .item-view-navigation{gap:6px;justify-content:flex-end}
  #item-database .atlas-reader-bar .item-view-arrow{width:40px;height:44px}
}
@container atlas-reader (max-width:280px){
  #item-database .atlas-reader-bar{gap:4px;padding:8px 6px}
  #item-database .atlas-reader-bar .item-back{font-size:0;width:32px;min-width:32px}
  #item-database .atlas-reader-bar .item-back::after{content:'↩';font-size:23px}
  .atlas-reader-count{width:60px}.atlas-reader-count-compact{font-size:13px}
  #item-database .atlas-reader-bar .item-view-arrow{width:36px}
}
.atlas-reduced-motion *,.atlas-reduced-motion *::before,.atlas-reduced-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){.workspace-main{view-transition-name:none}::view-transition-group(atlas-workspace),::view-transition-old(atlas-workspace),::view-transition-new(atlas-workspace){animation:none!important}*,*::before,*::after{scroll-behavior:auto!important}}
