@import url('/illustration-gallery.css');
/* The existing petrol/teal interface, with book proportions and touch reading. */
:root { --reading-image-limit:min(58dvh,640px); }
select.input { color-scheme: dark; background-color: #18273a; color: #edf8fa; }
select.input option,select.input optgroup { background-color: #18273a; color: #edf8fa; }
select.input option:checked { background-color: #2b4568; color: #fff; }
@font-face { font-family: Manrope; src: url('/about/assets/manrope-variable.ttf') format('truetype'); font-weight: 200 800; font-display: swap; }
.learning-footer { position:static; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; width:100%; padding:8px 0 max(4px,env(safe-area-inset-bottom)); margin-top:24px; border-top:1px solid var(--line); }
.learning-footer .footer-links { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0 10px; min-width:0; color:var(--faint); }
.learning-footer .footer-links a,.learning-footer .footer-manage { color:var(--muted); font-size:12px; min-height:44px; display:inline-flex; align-items:center; text-decoration:none; padding:0 4px; }
.learning-footer a:hover { color:var(--text); }
.learning-footer .footer-manage { font-size:11px; }
.learning-footer a:focus-visible { outline:2px solid var(--accent,#3ec8e0); outline-offset:3px; border-radius:4px; }
.learning-footer .redion-credit { min-height:44px; align-items:center; justify-content:center; text-decoration:none; }
.redion-credit:focus-visible { outline:2px solid var(--accent,#3ec8e0); outline-offset:5px; border-radius:4px; }
.redion-credit {
  --redion-by: #667085;
  --redion-blue: #175cd3;
  --redion-red: #c93432;
  --redion-yellow: #986e00;
  --redion-green: #15803d;
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  white-space: nowrap;
  font-family: Manrope, ui-sans-serif, system-ui, sans-serif;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--redion-by);
}
.redion-credit[data-theme="dark"] {
  --redion-by: #aeb7c9;
  --redion-blue: #5798ff;
  --redion-red: #ff5a5f;
  --redion-yellow: #ffd43b;
  --redion-green: #22c55e;
}
.redion-credit__name { font-size: 13px; font-weight: 700; letter-spacing: -0.35px; color: var(--redion-green); }
.redion-credit__blue { color: var(--redion-blue); }
.redion-credit__red { color: var(--redion-red); }
.redion-credit__yellow { color: var(--redion-yellow); }
.redion-credit__green { color: var(--redion-green); }
@media (forced-colors: active) {
  .redion-credit, .redion-credit span { color: CanvasText; }
}

.shelf { grid-template-columns: repeat(5,minmax(0,1fr)); grid-auto-rows: auto; height: auto; max-height: max(390px,calc(100dvh - 295px)); scroll-snap-type: y proximity; align-items: stretch; padding-bottom: 12px; }
.shelf .book { min-height: 0; align-self: stretch; }
.shelf .cover { flex: none; width: 100%; aspect-ratio: 2/3; min-height: 0; }
.shelf .cover-img { object-fit: contain; object-position: center; }
.shelf .book-body { min-height: 92px; }
.shelf .book-body h3 { -webkit-line-clamp: 3; }
.shelf .book-body .meta { flex-wrap: wrap; white-space: normal; }
.shelf .book-body .meta>span { white-space:normal; min-width:0; overflow-wrap:anywhere; }
.catalog-book .pick { min-width: 44px; min-height: 44px; }
.catalog-cover .cover-kind { top: 12px; left: 12px; max-width: calc(100% - 24px); padding: 5px 7px; border-radius: 6px; background: #09232bd9; letter-spacing: .07em; }
.locked-label::before { content: '◈ '; }
.catalog-book:has(.locked-label) .cover-img { opacity: .8; }
.library-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.package-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); gap: 16px; }
.package-choice { display: flex; gap: 14px; padding: 22px; align-items: flex-start; cursor: pointer; }
.package-choice input { width: 22px; height: 22px; flex: none; accent-color: #5bb8c8; }
.package-choice h3 { margin: 0 0 8px; }
.book-description { position: relative; display: grid; grid-template-columns: 150px 1fr; gap: 26px; padding: 34px; max-width: 720px; }
.description-cover { width: 100%; aspect-ratio: 2/3; object-fit: contain; border-radius: 8px; box-shadow: 0 12px 30px #0005; }
.description-close { position: absolute; right: 8px; top: 8px; min-width: 44px; }
.learning-reader { display:flex; flex-direction:column; gap:8px; min-width:0; min-height:calc(100dvh - 100px); outline:none; }
.learning-reader-top { flex-wrap: nowrap; min-width: 0; }
.reader-title { font-size: clamp(16px,2vw,23px); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.reader-language { width: auto; min-width: 66px; max-width: 220px; flex: none; padding: 8px; font-size: 12px; }
.reader-mode { display: flex; gap: 6px; flex-wrap: wrap; }
.reader-mode .btn { font-size: 12px; min-height: 40px; }
.learning-reader-content { display:flex; flex-direction:column; flex:1; min-width:0; min-height:0; }
.learning-reader progress { width: 100%; height: 4px; accent-color: #6bc7d7; border: 0; display: block; margin-bottom: 12px; }
.learning-page { padding: 0; overflow: hidden; touch-action: pan-y; flex:1; min-height:0; }
.learning-page.illustrated { display: grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
.learning-page.gallery-page { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); }
.learning-page figure { margin: 0; background: #101926; position: relative; display: flex; flex-direction: column; justify-content: center; }
.learning-page .chapter-figure { align-self:start; min-width:0; justify-content:flex-start; }
/* Reserve the same image stage before decode, independent of source ratio/text length.
   Contain preserves every detail; never stretch/crop a teaching illustration. */
.chapter-visual { position:relative; width:100%; aspect-ratio:3/2; max-block-size:var(--reading-image-limit,min(58dvh,640px)); min-width:0; overflow:hidden; }
.learning-page .chapter-visual img { position:absolute; inset:0; display:block; width:100%; height:100%; min-height:0; max-height:none; object-fit:contain; object-position:center; }
.learning-page:not(.atlas-page) .learning-page-body { align-self:start; margin:0 auto; }
.learning-page figcaption { padding: 10px 16px; font-size: 10px; color: var(--faint); }
.learning-page-body { min-width:0; padding:clamp(16px,2vw,28px); width:100%; max-width:78ch; margin: auto; }
.learning-page-body h2 { font-size: clamp(24px,3.3vw,38px); line-height: 1.15; }
.learning-page-body p { font-size: clamp(17px,1.5vw,20px); line-height: 1.75; white-space: pre-line; }
.learning-page-body .chapter-source { font-size: 12px; line-height: 1.5; padding-top: 18px; border-top: 1px solid var(--line); }
.chapter-strength { display:inline-flex; padding:5px 10px; font-size:12px; font-weight:700; border-radius:8px; background:#65cdb51a; color:var(--text); border:1px solid var(--line); }
.chapter-strength.never { background:#d06b4c22; }
.learning-page figure>.upload { margin:0 16px 16px; }
.learning-reader-nav { position:static; padding: 10px; border: 1px solid var(--line); border-radius: 16px; background: #0c2832f5; align-items: center; flex-wrap: wrap; z-index: 2; }
.learning-reader .book-frame { flex:1; min-height:65dvh; height:auto; }
.learning-reader .btn,.reader-acts .btn { min-height: 44px; }
.learning-reader:fullscreen,.learning-reader.window-fullscreen,.reader.window-fullscreen { background:#121e2d; width:100%; height:100dvh; padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)); box-sizing:border-box; }
.learning-reader.window-fullscreen,.reader.window-fullscreen { position:fixed; inset:0; z-index:100; }
.learning-reader.window-fullscreen,.learning-reader:fullscreen { min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.learning-reader.window-fullscreen .learning-reader-content,.learning-reader:fullscreen .learning-reader-content { flex:1; overflow:auto; overscroll-behavior:contain; }
.learning-reader.window-fullscreen .learning-page,.learning-reader:fullscreen .learning-page { flex:1 0 auto; min-height:min-content; }
.learning-reader.window-fullscreen .learning-reader-nav,.learning-reader:fullscreen .learning-reader-nav { flex:none; }
.learning-reader.window-fullscreen .book-frame,.learning-reader:fullscreen .book-frame { min-height:100%; height:100%; flex:1; }
.learning-reader.window-fullscreen .learning-reader-top,.learning-reader:fullscreen .learning-reader-top { flex:none; }
.test-scope { display: flex; flex-wrap: wrap; gap: 7px; }
.test-scope .btn[aria-pressed=true] { background: #294365; border-color: #64bccb; }
.test-book-list { max-height: 230px; overflow-y: auto; display: grid; gap: 8px; }
.test-book-choice { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 10px; }
.test-book-choice img { width: 32px; height: 46px; object-fit: contain; border-radius: 3px; }
.learning-public { width:100%; max-width:none; min-height:100dvh; margin:0; padding:16px clamp(14px,2vw,32px) 0; display:flex; flex-direction:column; }
.learning-public>* { min-width:0; flex-shrink:0; }
.learning-public>.learning-footer { margin-top:auto; }
.learning-public>.shelf,.learning-public>.public-test,.learning-public>.public-ask { margin-bottom:20px; }
.learning-public.is-reading>.learning-footer { margin-top:20px; }
.privacy-content { width:100%; max-width:78ch; margin:12px auto 24px; line-height:1.8; }
.privacy-content h1 { font-size:clamp(28px,4vw,40px); line-height:1.2; }
.privacy-content h2 { font-size:20px; margin:28px 0 8px; }
.privacy-content p { overflow-wrap:anywhere; }
.learning-public header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom:16px; }
.learning-public .brand { display: flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; font-weight: 700; font-size: 21px; }
.learning-public .brand img { width: 34px; height: 34px; }
.public-intro { max-width:80ch; padding:0; }
.public-intro h1 { font-size: clamp(28px,3vw,40px); line-height: 1.1; margin:8px 0; }
.public-intro p { font-size:15px; line-height:1.65; margin:8px 0 18px; }
.public-tabs { display:flex; gap:8px; margin-bottom:18px; flex-wrap:wrap; }
.public-tabs .btn { min-height:44px; }
.public-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:12px 24px; margin:12px 0 18px; }
.public-toolbar .public-tabs { margin:0; flex:none; }
.learning-public .public-toolbar .lib-tools { margin:0; flex:1; justify-content:flex-end; }
.public-toolbar .search-wrap { flex:1; max-width:420px; }
@media(min-width:801px) { .public-intro { max-width:none; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:0 24px; } .public-intro>.eyebrow { grid-column:1/-1; } .public-intro p { max-width:80ch; margin:8px 0; } }
@media(max-width:800px) { .public-toolbar { gap:14px; margin-top:0; } .public-toolbar .public-tabs { flex:1 1 100%; max-width:100%; } .learning-public .public-toolbar .lib-tools { flex-basis:100%; justify-content:flex-start; min-width:0; } .public-toolbar .search-wrap { max-width:none; min-width:0; } }
@media(max-width:600px) { .public-toolbar .public-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); } .public-toolbar .public-tabs .btn { white-space:normal; padding:10px 7px; font-size:12px; } }
.public-tabs .btn[aria-pressed=true] { background: #2b4568; border-color: #64bccb; }
.library-filters { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 18px; min-width:0; }
.library-filter { display:grid; gap:6px; flex:0 1 300px; min-width:0; }
.library-filter .input { min-height:44px; width:100%; min-width:0; }
.classification-editor { margin-top:10px; }
.classification-editor summary,.book-bibliography summary { min-height:44px; display:flex; align-items:center; cursor:pointer; color:var(--muted); }
.classification-editor fieldset { border:1px solid var(--line); border-radius:12px; margin:10px 0; padding:10px; min-width:0; }
.classification-editor .test-book-choice { min-height:44px; margin:0; }
.classification-editor form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; width:100%; }
.classification-editor form>.btn { grid-column:1/-1; }
.studio-book>.classification-editor { grid-column:1/-1; min-width:0; margin-top:0; }
.studio-book>img { align-self:start; }
.book-bibliography { max-width:80ch; margin:12px auto 0; padding:0 16px; overflow-wrap:anywhere; }
.chapter-source-links { margin-top:12px; overflow-wrap:anywhere; }
.chapter-source-disclosure { margin-top:18px; }
.chapter-source-disclosure>summary { cursor:pointer; min-height:44px; margin:0; padding-bottom:10px; line-height:1.6; }
.chapter-source-disclosure>summary:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; border-radius:4px; }
.chapter-source-links a,.book-bibliography a { color:var(--teal); text-underline-offset:3px; }
.scope-note { max-width:80ch; margin:12px auto; padding:0 16px; }
.free-toggle { display:flex; align-items:center; justify-content:flex-end; gap:8px; min-height:44px; }
@media(max-width:600px) { .library-filter { flex:1 1 100%; } .library-filters { gap:10px; } }
.learning-public .shelf { grid-template-columns:repeat(auto-fill,minmax(min(100%,175px),1fr)); height:auto; max-height:none; overflow:visible; padding:0; margin-right:0; scroll-snap-type:none; }
.learning-public .lib-tools { margin:0 0 16px; }
.public-test { width:100%; max-width:760px; margin:0 auto; }
.public-question { padding: 24px; margin-bottom: 12px; }
.public-question h3 { margin-top: 0; line-height: 1.5; }
.public-question label { display: flex; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; margin-top: 9px; line-height: 1.6; }
.public-question input { accent-color: #6bc7d7; flex: none; width: 20px; height: 20px; }
.public-result { padding: 24px; margin-bottom: 24px; }
.public-ask { width:100%; max-width:760px; margin:0 auto; }
.public-answer { padding: 24px; margin-top: 20px; white-space: pre-line; line-height: 1.8; }
.studio-editor { display: grid; gap: 16px; max-width: 900px; width: 100%; min-width: 0; margin: auto; }
.studio-editor > * { min-width: 0; }
.learning-public .status { white-space: normal; line-height: 1.6; border-radius: 12px; }
.studio-list { display: grid; gap: 9px; max-height: 360px; overflow: auto; }
.studio-book { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 12px; overflow-wrap: anywhere; }
.studio-book img { width: 44px; height: 66px; object-fit: contain; border-radius: 4px; }
.studio-book input[type=checkbox] { width: 22px; height: 22px; accent-color: #6bc7d7; }
.studio-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.studio-grid .wide { grid-column: 1/-1; }
.studio-page { height:100dvh; min-height:0; overflow:hidden; }
.studio-shell { width:100%; max-width:none; height:100%; min-height:0; margin:0; padding:14px max(20px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); display:grid; grid-template-rows:auto minmax(0,1fr); gap:0; overflow:hidden; }
.studio-shell>header { min-height:50px; padding:0 0 12px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.studio-shell>header .reader-language { min-height:44px; }
.studio-shell>header .btn { min-height:44px; }
.studio-shell .studio-editor { display:flex; flex-direction:column; min-height:0; max-width:none; margin:0; padding:16px 0 0; gap:14px; overflow:hidden; }
.studio-shell .public-tabs { flex:none; margin:0; gap:8px; }
.studio-shell .public-tabs .btn { min-height:44px; }
.studio-shell .status { flex:none; margin:0; }
.studio-workspace { flex:1; min-height:0; min-width:0; overflow:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:2px 12px 0 2px; display:flex; flex-direction:column; }
.studio-workspace>* { flex-shrink:0; }
.studio-workspace>.lead { max-width:900px; margin:0 0 14px; }
.studio-shell .studio-list { max-height:none; overflow:visible; display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr)); align-content:start; align-items:start; gap:12px; }
.studio-shell .studio-book { grid-template-columns:54px minmax(0,1fr) auto; min-height:108px; padding:14px; gap:12px; box-shadow:0 1px 0 #ffffff04 inset; }
.studio-shell .studio-book img { width:54px; height:80px; }
.studio-shell .studio-book .meta { margin:6px 0 0; }
.studio-shell .studio-book>span:last-child { display:flex; align-items:center; gap:8px; min-height:44px; }
.studio-shell .studio-book input[type=checkbox] { margin:0; }
.studio-shell .learning-footer { flex:none; margin-top:auto; }
.studio-workspace>.learning-footer { margin-top:auto; }
.studio-workspace>.studio-list { margin-bottom:24px; }
.studio-workspace>.form { max-width:none; }
.studio-workspace>.form+.form { margin-top:16px; }
.studio-workspace .test-book-list { max-height:none; overflow:visible; }
.studio-workspace .studio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.studio-auth .studio-editor { overflow:auto; padding:20px 0 0; }
.studio-auth .studio-editor>.card { width:min(100%,640px); flex:none; margin:auto auto 24px; }
.studio-auth h1 { font-size:clamp(25px,3vw,34px); }
.company-shell { height:100dvh; min-height:0; overflow:hidden; }
.company-shell #app { height:100%; min-height:0; display:grid; grid-template-rows:minmax(0,1fr); }
.company-shell #app.signed-in { grid-template-rows:auto minmax(0,1fr) auto; }
.company-entry { min-height:0; overflow:auto; display:flex; flex-direction:column; }
.company-entry>.login { flex:1; min-height:min-content; align-content:safe center; }
.company-entry>.learning-footer { flex:none; padding-inline:20px; margin:0; }
.company-shell #app.signed-in>main { grid-row:2; min-height:0; overflow:auto; overscroll-behavior:contain; width:100%; max-width:none; padding:24px clamp(16px,3vw,40px) 0; display:flex; flex-direction:column; }
.company-shell #app.signed-in>main>* { flex-shrink:0; }
.company-shell #app.signed-in>main>.learning-footer { margin-top:auto; }
.company-shell #app.signed-in>.tabbar { grid-row:3; position:static; }

.company-shell #app.signed-in .shelf { max-height:none; overflow:visible; }
@media(min-width:1800px) { .studio-shell { padding-left:32px; padding-right:32px; } }
@media(max-width:600px) {
  .studio-shell { padding:10px max(12px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)); }
  .studio-shell>header .brand { font-size:16px; gap:8px; white-space:normal; }
  .studio-shell>header .brand img { width:30px; height:30px; }
  .studio-shell .studio-editor { padding-top:12px; gap:12px; }
  .studio-shell .public-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
  .studio-shell .public-tabs .btn { padding:9px 8px; font-size:12px; white-space:normal; }
  .studio-workspace { padding-right:6px; }
  .studio-shell .studio-list { grid-template-columns:1fr; gap:10px; }
  .studio-shell .studio-book { grid-template-columns:44px minmax(0,1fr) auto; padding:12px; gap:10px; min-height:94px; }
  .studio-shell .studio-book img { width:44px; height:66px; }
  .studio-workspace .studio-grid { grid-template-columns:1fr; }
  .studio-workspace .card.form { padding:18px; }
}
.reader:fullscreen { background: #121e2d; padding: 20px; overflow: auto; }
@media(min-width:1500px) { .shelf { grid-template-columns: repeat(6,minmax(0,1fr)); } }
@media(max-width:1100px) { .shelf { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media(max-width:800px) { .shelf { grid-template-columns: repeat(3,minmax(0,1fr)); } .learning-page.illustrated { grid-template-columns: 1fr; } }
@media(max-width:600px) { .shelf { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; } .shelf .book-body { padding: 10px; min-height: 90px; } .cover-kind { font-size: 9px; } .book-description { grid-template-columns: 1fr; max-height: 85dvh; overflow: auto; } .description-cover { width: 110px; margin: auto; } .learning-page { min-height: 0; } .learning-reader-nav { gap:7px; } .learning-reader-nav .btn { font-size: 12px; padding: 10px; } .learning-reader .book-frame { min-height:65dvh; } .reader-title { max-width:none; } .reader-acts { gap:4px; } .learning-public { padding-top: 18px; } .learning-public header { padding-bottom: 10px; } .studio-grid { grid-template-columns: 1fr; } .learning-public .library-actions { justify-content: flex-end; } }
@media(prefers-reduced-motion:reduce) { .cover-img,.book { transition: none; } }
.catalog-book.is-locked .book-open { cursor:pointer; }
.locked-label::before { content:none; }
.assistant-audit { width:100%; min-width:0; margin-bottom:20px; }
.assistant-audit>.library-actions { justify-content:space-between; flex-wrap:wrap; }
.assistant-audit h2 { margin:0; }
.assistant-audit>.lead { max-width:80ch; }
.audit-entry { padding:0; margin:10px 0; overflow:hidden; }
.audit-entry>summary { cursor:pointer; min-height:60px; padding:16px 20px; line-height:1.5; overflow-wrap:anywhere; }
.audit-entry>summary::marker { color:var(--muted); }
.audit-question { font-weight:600; }
.audit-entry>summary .meta { display:block; margin:6px 0 0; }
.audit-answer { border-top:1px solid var(--line); padding:6px 20px 16px; max-width:100%; overflow-wrap:anywhere; }
.audit-answer p { white-space:pre-line; line-height:1.7; }
.audit-answer section { margin:16px 0; max-width:90ch; }
.audit-answer h3 { margin-bottom:8px; }
.audit-answer li { line-height:1.7; margin:6px 0; }
@media(max-width:600px) { .audit-entry>summary { padding:14px; } .audit-answer { padding:4px 14px 14px; } }

@media(max-width:420px) { .learning-public .shelf { grid-template-columns:repeat(2,minmax(0,1fr)); } .learning-public header { gap:8px; flex-wrap:wrap; } .learning-public .brand { font-size:18px; } .learning-public .brand .meta { font-size:10px; } .learning-public .library-actions { gap:4px; } .learning-reader-top { gap:6px; } .learning-reader-top>.btn { flex:none; max-width:none; } .learning-reader-nav .meta { order:4; width:100%; text-align:center; } }

/* Tree atlas: the established petrol surfaces, one readable page and native controls. */
.atlas-contents { display:flex; align-items:center; gap:10px; margin:0 0 8px; min-width:0; }
.atlas-contents>span { flex:none; font-size:12px; }
.atlas-contents select { width:100%; min-width:0; min-height:44px; padding:8px 10px; font-size:13px; text-overflow:ellipsis; }
.learning-page.atlas-page { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:start; }
.atlas-page .atlas-plate { align-self:start; min-width:0; width:100%; padding:12px; gap:8px; background:transparent; }
/* Share the contained 3:2 stage: intrinsic 1536px plates must never overflow a column.
   Full-resolution inspection stays in the existing explicit zoom dialog. */
.atlas-visual { border-radius:12px; }
.atlas-plate .atlas-zoom { align-self:flex-start; }
.atlas-plate figcaption { padding:0 2px; font-size:12px; line-height:1.6; }
.atlas-page .atlas-profile { min-width:0; margin:0; padding:clamp(16px,2vw,28px); max-width:none; }
.atlas-profile h2 { margin-bottom:8px; }
.atlas-profile .atlas-latin { margin:0 0 16px; font-size:16px; color:var(--muted); font-style:italic; }
.atlas-facts { margin:0; display:grid; gap:0; }
.atlas-facts>div { border-top:1px solid var(--line); padding:13px 0; }
.atlas-facts dt { color:var(--muted); font-size:12px; margin-bottom:5px; }
.atlas-facts dd { margin:0; font-size:16px; line-height:1.65; overflow-wrap:anywhere; }
.atlas-health,.atlas-sources { grid-column:1/-1; padding:clamp(20px,3vw,36px); width:100%; min-width:0; }
.atlas-health { border-top:1px solid var(--line); }
.atlas-health h3 { font-size:24px; margin:0 0 18px; }
.atlas-problems { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:start; }
.atlas-problem { border:1px solid var(--line); background:var(--surface); border-radius:16px; overflow:hidden; min-width:0; }
.atlas-problem>summary { padding:17px 20px; min-height:56px; line-height:1.5; cursor:pointer; font-weight:600; }
.atlas-problem summary .meta { display:block; margin-top:5px; font-size:12px; font-weight:400; overflow-wrap:anywhere; }
.atlas-problem.needs-attention>summary { border-left:3px solid var(--peach); }
.atlas-problem-content { border-top:1px solid var(--line); padding:18px 20px; }
.atlas-problem-content h4 { font-size:13px; margin:16px 0 6px; color:var(--muted); }
.atlas-problem-content p { font-size:16px; line-height:1.7; margin:0 0 10px; }
.atlas-page .atlas-problem-content figure { background:transparent; }
.atlas-problem-visual { max-block-size:min(42dvh,440px); border-radius:10px; }
.atlas-problem-content figcaption { padding:8px 0; font-size:12px; }
.atlas-page .chapter-source-links { display:grid; gap:10px; font-size:12px; }
.atlas-page .atlas-note { font-size:13px; line-height:1.7; margin:20px 0 0; color:var(--muted); }
.atlas-sources { border-top:1px solid var(--line); }
.atlas-sources summary { min-height:44px; cursor:pointer; }
.atlas-lightbox { width:min(1440px,calc(100vw - 24px)); max-width:none; height:calc(100dvh - 24px); max-height:none; padding:16px; border:1px solid var(--line-strong); border-radius:20px; background:var(--bg); color:var(--text); }
.atlas-lightbox[open] { display:flex; flex-direction:column; gap:12px; }
.atlas-lightbox::backdrop { background:#03151bd9; }
.atlas-lightbox-top { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.atlas-lightbox-top h2 { font-size:clamp(17px,2vw,24px); margin:0; }
.atlas-lightbox .btn { min-height:44px; }
.atlas-crop-tools { display:flex; flex-wrap:wrap; gap:8px; }
.atlas-crop-tools [aria-pressed=true] { border-color:var(--cyan); background:var(--surface-2); }
.atlas-lightbox-image { min-height:0; min-width:0; flex:1; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.atlas-lightbox-image svg { display:block; width:100%; height:100%; }
.atlas-lightbox>.meta { margin:0; font-size:12px; line-height:1.5; }
@media(max-width:800px) { .learning-page.atlas-page { grid-template-columns:1fr; } .atlas-problems { grid-template-columns:1fr; } .atlas-page .atlas-plate { padding:12px; } .atlas-page .atlas-profile { padding:20px; } .atlas-health,.atlas-sources { padding:20px; } }
@media(max-height:500px) { .atlas-lightbox { padding:10px; gap:6px; } .atlas-lightbox-top h2 { font-size:16px; } .atlas-crop-tools { gap:4px; } .atlas-crop-tools .btn { padding:8px 10px; font-size:12px; } }

/* KiDraht library: quiet controls, real book proportions, natural end-of-content credit. */
.visually-hidden { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.library-icon { width:19px; height:19px; flex:none; vertical-align:middle; }
body:has(.learning-public.is-browsing) { overflow:hidden; }
.learning-public.is-browsing { height:100dvh; min-height:0; overflow:auto; overscroll-behavior-y:contain; scrollbar-gutter:stable; padding-top:8px; }
.learning-public.is-browsing>header { position:sticky; top:-8px; z-index:12; padding:8px 0; background:linear-gradient(180deg,rgba(23,37,56,.98),rgba(23,37,56,.9)); backdrop-filter:blur(12px); border-bottom:1px solid rgba(214,238,242,.07); }
.learning-public .brand { font-size:20px; gap:8px; }
.learning-public .brand img { width:30px; height:30px; }
.learning-public .brand .meta { font-size:11px; }
.learning-public .btn { min-height:44px; padding:7px 11px; font-size:12px; gap:7px; border-color:rgba(218,238,242,.1); background:rgba(255,255,255,.035); color:var(--text); box-shadow:none; }
.learning-public .btn.primary { background:rgba(94,213,234,.12); border-color:rgba(94,213,234,.3); color:var(--text); }
.learning-public .btn:hover { background:rgba(255,255,255,.08); border-color:rgba(218,238,242,.2); }
.learning-public .btn:focus-visible,.learning-public .input:focus-visible { outline:2px solid var(--cyan); outline-offset:2px; }
.learning-public .icon-button { width:44px; padding:10px; }
.learning-public .library-actions { gap:5px; }
.learning-public .reader-language { min-height:44px; font-size:12px; padding:8px 10px; width:auto; max-width:140px; }
.learning-public .public-toolbar { gap:10px 14px; margin:12px 0 20px; }
.public-toolbar .public-tabs { gap:4px; flex:0 0 auto; }
.public-toolbar .public-tabs .btn { border-color:transparent; background:transparent; }
.public-toolbar .public-tabs .btn[aria-pressed=true] { background:rgba(94,213,234,.09); border-color:rgba(94,213,234,.2); color:#c6f6ff; }
.public-toolbar .library-filters { margin:0; display:flex; flex:1 1 330px; gap:8px; }
.public-toolbar .library-filter { flex:1 1 0; min-width:0; gap:0; }
.public-toolbar .library-filter>span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.public-toolbar .library-filter .input { min-height:44px; padding:8px 10px; font-size:12px; border-radius:10px; background:rgba(255,255,255,.035); }
.learning-public .public-toolbar .lib-tools { flex:1 1 280px; gap:8px; justify-content:flex-end; }
.public-toolbar .search-wrap { display:flex; align-items:center; position:relative; min-width:0; max-width:none; }
.public-toolbar .search-wrap::before { content:none; }
.public-toolbar .search-wrap>.library-icon { position:absolute; left:12px; color:var(--muted); pointer-events:none; }
.public-toolbar .search-wrap .search { min-height:44px; width:100%; min-width:0; padding:8px 12px 8px 39px; font-size:12px; background:rgba(255,255,255,.035); }
.learning-public .shelf { grid-template-columns:repeat(auto-fill,minmax(min(100%,185px),1fr)); gap:22px 20px; }
.catalog-shelf .catalog-book { border-radius:4px 10px 10px 4px; border:1px solid rgba(221,238,241,.16); background:#142131; overflow:hidden; box-shadow:2px 2px 0 rgba(193,212,215,.22),5px 5px 0 rgba(10,17,25,.38),0 12px 20px -16px #000; align-self:start; }
.catalog-shelf .catalog-book:hover { transform:translateY(-2px); }
.catalog-shelf .catalog-book,.catalog-shelf .book-open,.catalog-shelf .catalog-cover { min-width:0; }
.catalog-shelf .catalog-book .catalog-cover { aspect-ratio:2/3; width:100%; border:0; isolation:isolate; overflow:hidden; }
.catalog-book .catalog-cover .cover-img { width:100%; height:100%; object-fit:cover; }
.catalog-cover::before { content:''; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg,rgba(10,17,26,.88) 0%,rgba(10,17,26,.52) 18%,rgba(10,17,26,.05) 52%,rgba(10,17,26,.08) 80%,rgba(10,17,26,.38)); }
.catalog-cover::after { left:6px; width:5px; z-index:4; background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(255,255,255,.1),rgba(0,0,0,.12)); }
.cover-title { position:absolute; left:19px; right:14px; top:17px; z-index:2; color:#fff; text-align:left; pointer-events:none; }
.cover-title h3 { margin:0; font:700 clamp(15px,1.25vw,21px)/1.23 Manrope,system-ui,sans-serif; letter-spacing:-.025em; text-wrap:pretty; overflow-wrap:anywhere; text-shadow:0 1px 3px rgba(0,0,0,.3); }
.cover-series { display:block; font-size:10px; line-height:1.3; letter-spacing:.04em; margin-bottom:6px; color:rgba(255,255,255,.8); }
.cover-access { position:absolute; bottom:11px; right:11px; top:auto; left:auto; z-index:2; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:#e9fcff; background:rgba(12,20,30,.55); border:1px solid rgba(255,255,255,.16); }
.cover-access .library-icon { width:15px; height:15px; }
.cover-access.access-text { width:auto; height:auto; min-height:0; padding:3px 7px; border:0; border-radius:5px; background:rgba(11,17,26,.48); font:600 10px/1.5 Manrope,system-ui,sans-serif; letter-spacing:.03em; text-shadow:0 1px 2px #0008; }
.cover-access.locked-label::before { content:none; }
.catalog-book.is-locked .cover-access { color:#ffdbac; }
.catalog-book.is-locked .cover-img { opacity:.82; }
.catalog-shelf .catalog-book .pick { top:auto; right:auto; left:13px; bottom:7px; z-index:5; background:rgba(12,20,30,.65); }
.catalog-shelf .book-open:focus-visible { outline:2px solid var(--cyan); outline-offset:-3px; border-radius:3px 9px 9px 3px; }
/* Category folders are slightly wider than books; artwork is generated once. */
body.library-workspace { overflow:hidden; }
.learning-public.is-browsing { height:100vh; height:100dvh; }
.learning-public .shelf.field-shelf { grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr)); gap:24px; }
.field-folder { position:relative; padding-top:12px; min-width:0; align-self:start; }
.field-open { appearance:none; display:block; position:relative; padding:0; width:100%; border:0; background:none; color:var(--text); text-align:left; cursor:pointer; font:inherit; }
.folder-tab { position:absolute; z-index:1; top:-12px; left:0; width:72px; height:25px; padding:3px 12px; border:1px solid var(--line-strong); border-bottom:0; border-radius:9px 12px 0 0; background:#243751; }
.folder-tab .library-icon { width:15px; height:15px; opacity:.65; }
.folder-cover { position:relative; aspect-ratio:3/4; overflow:hidden; border:1px solid var(--line-strong); border-radius:3px 12px 12px 12px; background:#142131; box-shadow:3px 4px 0 #071e2877,0 14px 24px -20px #000; }
.folder-cover>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.folder-cover::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,#061d28c9,transparent 48%,#061d281a); }
.folder-title { position:absolute; z-index:2; inset:18px 18px auto; color:#fff; text-shadow:0 1px 3px #0005; }
.folder-title h2 { margin:0 0 7px; font:700 clamp(18px,1.5vw,25px)/1.2 Manrope,system-ui,sans-serif; letter-spacing:-.02em; overflow-wrap:anywhere; }
.folder-title>span { font-size:11px; opacity:.75; }
.field-open:focus-visible { outline:2px solid var(--cyan); outline-offset:5px; border-radius:4px 12px 12px 12px; }
.field-open:hover .folder-cover { border-color:#68cdb87a; }
.library-breadcrumb { display:flex; align-items:center; gap:12px; margin:-7px 0 18px; font-size:13px; min-width:0; }
.library-breadcrumb[hidden] { display:none; }
.library-motto { font:500 12px/1.7 Manrope,system-ui,sans-serif; color:var(--muted); margin:-7px 0 20px; letter-spacing:.01em; }
.library-motto[hidden] { display:none; }
.learning-reader.window-fullscreen { height:100vh; height:100dvh; }
.reader-dialog-fallback { position:fixed!important; top:12px; left:12px; width:calc(100vw - 24px); height:calc(100vh - 24px); margin:0; z-index:500; box-shadow:0 0 0 100vmax #03151be6; }
@media(max-width:600px) { .learning-public .shelf.field-shelf { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 14px; } .folder-title { inset:13px 12px auto; } .folder-title h2 { font-size:17px; } .folder-title>span { font-size:10px; } }
@media(max-width:1100px) { .learning-public .public-toolbar .lib-tools { flex-basis:100%; } .public-toolbar .library-filters { flex-basis:280px; } }
@media(max-width:600px) {
 .learning-public .brand .meta,.learning-public .company-link>span { display:none; }
 .learning-public .company-link { width:44px; padding:10px; }
 .learning-public header { gap:8px; flex-wrap:wrap; }
 .learning-public .public-toolbar { gap:8px; margin:8px 0 16px; }
 .public-toolbar .public-tabs { display:flex; flex:1 1 100%; max-width:none; }
 .public-toolbar .public-tabs .btn { flex:1; white-space:nowrap; padding:7px 8px; font-size:12px; }
 .public-toolbar .library-filters { flex:1 1 100%; gap:8px; }
 .public-toolbar .library-filter { flex:1 1 0; }
 .learning-public .public-toolbar .lib-tools { flex:1 1 100%; }
 .learning-public .shelf { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 14px; }
 .cover-title { left:16px; right:10px; top:13px; }
 .cover-title h3 { font-size:clamp(14px,3.8vw,18px); }
}
@media(max-height:500px) and (min-width:700px) { .learning-public.is-browsing { padding-top:0; } .learning-public.is-browsing>header { top:0; padding:3px 0; } .learning-public .public-toolbar { margin:6px 0 12px; } }
