/* The shared reading-page look for tools hubs (assets/course/reading.css). */
@import url(../../../assets/course/reading.css);
/* The A&P tools hub (tools.html). The page shape, the featured block and the
   tool cards are shared (assets/course/hub.css, .cx-feat and .cx-tool); what
   is left here is A&P's own: the ?chapter= bar, the lab practical's mode
   buttons and its masked figure (the featured block's art). */
.anp-app-mount[data-slug="tools"]{min-height:320px;margin:14px 0 28px;}
.anp-hub-filter{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0 0 14px;padding:12px 16px;border-radius:var(--radius);background:var(--ctint);font:700 14px/1.5 var(--font-ui);color:var(--ink);}
.anp-hub-filter a{color:var(--cink);font-weight:900;}
.anp-hub-dot{width:7px;height:7px;border-radius:50%;background:#F2B9A9;box-shadow:0 0 0 4px rgba(242,185,169,.18);}
.anp-hub-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 22px;padding:0;list-style:none;}
.anp-hub-modes li{display:flex;}
.anp-hub-mode{flex:1;display:flex;flex-direction:column;gap:2px;background:rgba(255,255,255,.07);border-radius:14px;padding:10px 12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.10);text-decoration:none;color:#fff;transition:background .12s ease;}
.anp-hub-mode:hover{background:rgba(255,255,255,.13);color:#fff;}
.anp-hub-mode.is-on{background:rgba(242,185,169,.16);box-shadow:inset 0 0 0 1.5px #F2B9A9;}
.anp-hub-mode:focus-visible{outline:3px solid #F2B9A9;outline-offset:2px;}
.anp-hub-mode b{font:900 13px var(--font-ui);color:#fff;display:flex;align-items:center;gap:7px;}
.anp-hub-mode b svg{width:15px;height:15px;fill:none;stroke:#F2B9A9;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none;}
.anp-hub-mode span{font:700 11.5px/1.4 var(--font-ui);color:var(--muted-on-dark);}
.anp-hub-fig{position:relative;background:#fff;border-radius:20px;padding:12px;box-shadow:0 18px 40px rgba(0,0,0,.28);transform:rotate(.6deg);}
.anp-hub-fig-img{position:relative;border-radius:12px;overflow:hidden;}
.anp-hub-fig-img img{display:block;width:100%;height:auto;}
.anp-hub-mask{position:absolute;background:#FFF7E6;border:1.5px solid #D9C9A6;border-radius:4px;display:flex;align-items:center;justify-content:center;font:900 9px var(--font-ui);color:#8A7550;line-height:1;}
.anp-hub-mask.is-on{background:#fff;border:2.5px solid #A33B26;color:#A33B26;box-shadow:0 0 0 4px rgba(163,59,38,.18);font-size:10px;}
.anp-hub-fig-q{position:absolute;left:18px;right:18px;bottom:-18px;background:var(--white);color:var(--ink);border-radius:14px;padding:10px 14px;box-shadow:var(--lift-lg);display:flex;align-items:center;gap:10px;font:800 13px var(--font-ui);}
.anp-hub-fig-n{flex:none;width:24px;height:24px;border-radius:7px;background:var(--ctint);color:var(--cink);display:grid;place-items:center;font:900 12px var(--font-ui);}
.anp-hub-fig-inp{flex:1;min-width:0;border-radius:9px;background:var(--paper);padding:6px 10px;color:var(--muted);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.anp-hub-fig-cap{margin:28px 4px 0;font:800 11px var(--font-ui);color:var(--muted-on-dark);text-align:center;letter-spacing:.02em;}
@media (max-width:600px){
  .cx-feat-art{margin-bottom:18px;}
}
@media (prefers-reduced-motion:reduce){ .anp-hub-fig{transform:none;} }