@import url('./references/details/covers.css');

/* Each specimen responds to its actual content width. These dimensions belong to this page. */
.study-tabs { display:flex; flex-wrap:wrap; align-items:stretch; gap:10px 12px; margin:0 0 28px; scroll-margin-top:calc(var(--header,84px) + 16px); }
.study-tabs button { display:flex; align-items:center; justify-content:center; border:1px solid transparent; border-radius:999px; padding:12px 20px; min-height:48px; font-size:15px; line-height:1.4; white-space:nowrap; background:transparent; color:var(--muted); }
.study-tabs button:hover { color:var(--ink); }
.study-tabs button[aria-selected=true] { color:var(--blue); }
.study-panel { scroll-margin-top:calc(var(--header,84px) + 112px); }
.paper-reference { padding:clamp(20px,3vw,34px); border:1px solid var(--line); border-radius:18px; background:var(--paper); }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:26px; margin:0 0 30px; }
.section-kicker { font-size:12px; color:var(--muted); margin:0 0 12px; letter-spacing:.04em; }
.section-heading h2 { font-size:25px; line-height:1.5; font-weight:550; letter-spacing:-.035em; margin:0; }
.section-aside { font-size:13px; line-height:1.8; color:var(--muted); margin:0 0 3px; }
.table-toolbar { display:flex; justify-content:space-between; gap:22px; align-items:center; padding:16px 0; margin:0 0 22px; border-block:1px solid var(--line); }
.material-search { width:min(390px,100%); display:flex; align-items:center; gap:12px; padding:9px 2px; color:var(--muted); }
.material-search:focus-within { color:var(--blue); }
.material-search svg { width:20px; height:20px; flex-shrink:0; }
.material-search input { border:0; background:transparent; color:var(--ink); font-size:14px; min-width:0; outline:none; width:100%; line-height:1.7; }
.material-search input::placeholder { color:var(--muted); opacity:1; }
.material-sort { display:flex; align-items:center; gap:16px; font-size:13px; color:var(--muted); white-space:nowrap; }
.material-sort select { border:0; border-radius:7px; background:var(--soft); color:var(--ink); font-size:14px; padding:11px 30px 11px 14px; }
.table-wrap { max-width:100%; padding-inline:12px; overflow:visible; }
.materials-table { border-collapse:separate; border-spacing:0; width:100%; text-align:left; }
.materials-table th { font-size:13px; font-weight:450; color:var(--muted); padding:15px 18px; background:var(--soft); white-space:nowrap; }
.materials-table th:first-child { border-radius:9px 0 0 9px; }
.materials-table th:last-child { border-radius:0 9px 9px 0; }
.materials-table th:nth-child(2) { width:46%; }
.materials-table td { padding:24px 18px; border-bottom:1px solid var(--line); font-size:15px; transition:background .15s; }
.materials-table tr:hover td { background:var(--soft); }
.materials-table tr.is-selected td { background:color-mix(in srgb,var(--wash) 55%,var(--paper)); }
.materials-table tr.is-selected { outline:1px solid #77c1df; outline-offset:-1px; }
.materials-table .check-column { width:44px; padding-left:12px; padding-right:7px; }
.materials-table input[type=checkbox] { width:18px; height:18px; vertical-align:middle; accent-color:var(--blue); cursor:pointer; margin:0; }
.material-name { border:0; background:transparent; text-align:left; padding:0; display:flex; align-items:center; gap:19px; color:var(--ink); min-height:48px; width:100%; }
.material-name:hover .material-title { text-decoration:underline; text-decoration-color:var(--blue); text-underline-offset:5px; }
.material-title { display:block; font-size:16px; font-weight:500; line-height:1.7; overflow-wrap:anywhere; }
.material-subtitle { display:block; font-size:12px; color:var(--muted); line-height:1.7; margin-top:5px; letter-spacing:.05em; }
.number-column { text-align:right; white-space:nowrap; }
.quantity { display:inline-flex; align-items:baseline; justify-content:flex-end; font-size:18px; font-variant-numeric:tabular-nums; line-height:1.6; }
.quantity span { font-size:12px; color:var(--muted); margin-left:6px; min-width:2em; text-align:left; }
.opacity-column { white-space:nowrap; }
.opacity-measure { display:flex; align-items:center; justify-content:flex-end; gap:15px; }
.opacity-track { display:block; width:60px; height:4px; background:var(--line); overflow:hidden; flex-shrink:0; }
.opacity-track i { display:block; height:100%; background:var(--co-selection-line); }
.place-column { color:var(--muted); font-size:13px!important; line-height:1.8; }
.mobile-label,.mobile-select-all { display:none; }
/* The paper chips retain the source's fibre/opacity cues; the full SVG appears in the detail. */
.paper-chip { display:block; position:relative; width:34px; height:44px; flex:none; background:#fcfbf6; border:1px solid #d9d9ce; border-radius:1px; transform:rotate(-7deg); box-shadow:2px 2px #d3dbda50; }
.paper-chip::after { content:""; position:absolute; inset:7px 6px; background:repeating-linear-gradient(transparent 0 5px,#949785 5px 6px); opacity:.23; }
.paper-chip.soft { background:repeating-radial-gradient(ellipse at 20% 30%,#98835c16 0 .6px,transparent 1px 3px),#f6f1df; }
.paper-chip.soft::after { opacity:.09; }
.paper-chip.clear { background:#fcfcf9; box-shadow:3px 3px #d3dbda8c; }
.paper-chip.clear::after { opacity:.03; }
.paper-chip.fiber { background:repeating-linear-gradient(72deg,#95875b19 0 .6px,transparent 1px 4px),#f7eed6; }
.paper-chip.fiber::after { opacity:.05; }
.selection-bar { display:flex; justify-content:space-between; align-items:center; gap:22px; padding:22px 12px 0; }
.selection-bar p { margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
.selection-bar p strong { color:var(--ink); font-size:16px; font-weight:550; }
.selection-bar>div { display:flex; align-items:center; gap:21px; }
.text-button { border:0; background:transparent; padding:10px 0; color:var(--muted); font-size:13px; min-height:44px; }
.text-button:hover:not(:disabled) { color:var(--ink); text-decoration:underline; text-underline-offset:5px; }
.text-button:disabled { opacity:.4; }
.outline-button { border:1px solid var(--line); border-radius:7px; padding:11px 15px; font-size:13px; background:var(--paper); display:inline-flex; align-items:center; justify-content:center; gap:25px; line-height:1.6; min-height:44px; }
.outline-button:hover:not(:disabled) { border-color:var(--blue); background:var(--soft); }
.outline-button:disabled { color:var(--muted); opacity:.45; }
.table-empty { text-align:center; padding:45px 16px; font-size:15px; color:var(--muted); line-height:2; }
.table-empty button { border:0; background:transparent; color:var(--blue); padding:10px; font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.reference-return { display:flex; justify-content:space-between; align-items:center; gap:28px; margin-top:38px; padding:27px 0; border-block:1px solid var(--line); }
.reference-return strong { display:block; font-size:18px; font-weight:500; line-height:1.6; }
.reference-return>span>span { display:block; font-size:13px; color:var(--muted); line-height:1.8; margin-top:6px; }
.reference-return>span:last-child { color:var(--blue); font-size:13px; white-space:nowrap; }
.reference-return:hover strong { color:var(--blue); }
.reference-with-image { justify-content:flex-start; }
.reference-with-image>img { width:180px; aspect-ratio:1.6; object-fit:cover; border-radius:5px; }
.reference-with-image>span:last-child { margin-left:auto; }
.parts-notes { margin-top:38px; padding:20px 0 0; color:var(--muted); font-size:13px; line-height:1.9; }
.parts-notes summary { cursor:pointer; width:max-content; max-width:100%; padding:10px 0; min-height:44px; }
.parts-notes>div { max-width:720px; padding:6px 0; }
.parts-notes p { margin:12px 0; }
.source-links { display:flex; flex-wrap:wrap; gap:24px; }
.source-links a { color:var(--blue); text-decoration:underline; text-underline-offset:4px; }
.page-footer { margin-top:30px; }
.view-comparison { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); align-items:start; gap:42px; }
.wide-tabs { display:flex; gap:12px; }
.view-tabs button { border:1px solid transparent; background:transparent; color:var(--muted); font-weight:450; }
.view-tabs button:hover { color:var(--ink); }
.view-tabs button[aria-selected=true] { color:var(--blue); }
.wide-tabs button { padding:12px 18px; display:flex; flex:1; align-items:baseline; justify-content:space-between; gap:12px; border-radius:9px; font-size:15px; white-space:nowrap; }
.wide-tabs button>span { font-size:14px; font-variant-numeric:tabular-nums; }
.wide-panel { margin-top:22px; }
.exhibition-plan { position:relative; border-radius:7px; overflow:hidden; aspect-ratio:1.8; background:var(--soft); }
.exhibition-plan>img { display:block; width:100%; height:100%; object-fit:cover; }
.view-time { position:absolute; bottom:18px; left:18px; display:flex; gap:13px; align-items:baseline; padding:10px 13px; border-radius:6px; background:#ffffffeb; color:#244652; font-size:18px; font-variant-numeric:tabular-nums; }
.view-time span { font-size:12px; }
.view-description { padding:24px 0 0; display:grid; grid-template-columns:34px 1fr; gap:17px; }
.view-number { font:400 27px ui-serif,Georgia,serif; color:var(--muted); }
.view-description h3 { font-size:22px; font-weight:500; letter-spacing:-.025em; margin:0 0 12px; line-height:1.6; }
.view-description p { font-size:14px; color:var(--muted); line-height:1.95; margin:0; max-width:520px; }
.small-view { border-left:1px solid var(--line); padding-left:30px; margin-top:7px; }
.small-view-heading { font-size:13px; color:var(--muted); margin:0 0 21px; }
.small-tabs { display:flex; flex-direction:column; gap:11px; }
.small-tabs button { display:flex; align-items:center; gap:14px; border-radius:8px; text-align:left; padding:13px 14px; min-height:78px; width:100%; }
.small-tabs button>img { width:44px; height:48px; flex-shrink:0; object-fit:cover; border-radius:3px; }
.small-tabs button>span:nth-child(2) { flex:1; min-width:0; }
.small-tabs strong { display:block; font-size:15px; line-height:1.6; font-weight:500; }
.small-tabs small { display:block; font-size:12px; color:var(--muted); line-height:1.7; margin-top:3px; }
.small-tabs button>span:last-child { color:var(--muted); font-size:16px; }
.small-panel { margin:24px 0 0; padding-top:22px; border-top:1px solid var(--line); }
.small-panel h3 { font-size:18px; line-height:1.7; font-weight:500; margin:0 0 10px; }
.small-panel p { font-size:13px; line-height:1.95; color:var(--muted); margin:0; }
.small-panel .memo-line { font-size:12px; padding-top:16px; }
.view-sync { font-size:12px; color:var(--muted); margin:15px 0 0; }
.selection-style { display:flex; align-items:center; gap:12px; font-size:12px; color:var(--muted); margin:0 0 25px; }
.selection-style select { padding:9px 12px; border:1px solid var(--line); border-radius:5px; background:var(--paper); color:var(--ink); }
#panel-views[data-selection-style=line] .view-tabs button { border-radius:0; }
.material-dialog{position:fixed;inset:0 0 0 auto;margin:0;width:min(470px,calc(100% - 20px));height:100dvh;max-height:100dvh;max-width:100%;padding:66px 34px 34px;border:0;border-left:1px solid var(--line);background:var(--paper);color:var(--ink);overflow:auto;box-shadow:-15px 0 70px #172d4515}.material-dialog[open]{animation:drawer-in .22s ease-out}.material-dialog::backdrop{background:#14232e3d;backdrop-filter:blur(2px)}.dialog-close{position:absolute;right:23px;top:20px;border:0;width:36px;height:36px;display:grid;place-items:center;border-radius:6px;background:transparent;color:var(--muted)}.dialog-close:hover{background:var(--soft);color:var(--ink)}.dialog-art{aspect-ratio:1.3;border-radius:8px;overflow:hidden;background:var(--soft);margin-bottom:31px}.dialog-art svg{width:100%;height:100%;display:block}.dialog-kicker{font-size:11px;color:var(--muted);letter-spacing:.055em;margin:0 0 10px}.material-dialog h2{font-size:29px;font-weight:500;letter-spacing:-.035em;margin:0 0 17px;line-height:1.5}.dialog-description{font-size:15px;line-height:1.95;color:var(--muted);margin:0 0 28px}.dialog-facts{display:grid;grid-template-columns:90px 1fr;gap:17px 24px;font-size:14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:23px 0;margin:0 0 28px}.dialog-facts dt{color:var(--muted);font-size:12px}.dialog-facts dd{margin:0}.dialog-selection{width:100%;border-color:var(--blue);color:var(--blue);font-size:14px;padding:13px 18px}.dialog-footnote{font-size:11px;color:var(--muted);line-height:1.8;margin:15px 0 0}.summary-list{list-style:none;margin:30px 0;padding:0}.summary-list li{display:flex;align-items:center;gap:15px;border-bottom:1px solid var(--line);padding:18px 0}.summary-list li>div:nth-child(2){flex:1}.summary-list strong{font-size:15px;font-weight:500}.summary-list small{display:block;font-size:12px;color:var(--muted);margin-top:5px}.summary-list .quantity{font-size:16px}.summary-list .material-thumb{width:47px;height:48px}@keyframes drawer-in{from{transform:translateX(24px);opacity:0}to{transform:translateX(0);opacity:1}}

.dialog-art { --ps-muted:#626f75; aspect-ratio:1.5; background:#f5f8f8; }
.summary-list .paper-chip { width:29px; height:37px; }
.summary-list .quantity { flex-shrink:0; }
.dialog-close { width:44px; height:44px; }
.dialog-footnote { font-size:12px; }
@container html-library (max-width:1000px) {
 .section-heading { align-items:flex-start; flex-direction:column; gap:10px; }
 .section-aside { margin:0; }
 .materials-table th,.materials-table td { padding-inline:13px; }
 .opacity-track { width:38px; }
 .material-name { gap:14px; }
 .view-comparison { grid-template-columns:1fr; gap:35px; }
 .small-view { padding:25px 0 0; border-left:0; border-top:1px solid var(--line); }
 .small-view-layout { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
 .small-panel { margin-top:0; padding-top:0; border-top:0; }
}
@container html-library (max-width:650px) {
 .study-panel { scroll-margin-top:calc(var(--header,84px) + 96px); }
 .study-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:24px; }
 .study-tabs button { font-size:14px; padding:12px 10px; }
 .section-heading h2 { font-size:23px; }
 .table-toolbar { align-items:stretch; gap:12px; flex-direction:column; padding-block:12px; }
 .material-search { width:100%; }
 .material-sort { justify-content:flex-end; }
 .table-wrap { padding:0; }
 .mobile-select-all { display:flex; gap:12px; align-items:center; min-height:44px; margin:0 0 8px; padding:0 10px; font-size:13px; color:var(--muted); }
 .mobile-select-all input { width:18px; height:18px; margin:0; accent-color:var(--blue); }
 .materials-table thead #select-all { visibility:hidden; }
 .materials-table,.materials-table tbody { display:block; }
 .materials-table thead { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); }
 .materials-table tr { display:grid; grid-template-columns:24px minmax(0,1fr) auto; gap:13px 14px; padding:22px 10px; border-bottom:1px solid var(--line); }
 .materials-table td { display:block; padding:0; border:0; }
 .materials-table .check-column { grid-column:1; grid-row:1 / 4; width:auto; padding:4px 0 0; }
 .materials-table .subject-column { grid-column:2 / 4; }
 .materials-table .number-column { grid-column:2; text-align:left; }
 .materials-table .opacity-column { grid-column:3; text-align:right; }
 .materials-table .place-column { grid-column:2 / 4; font-size:13px!important; }
 .materials-table tr:hover,.materials-table tr:hover td { background:var(--soft); }
 .materials-table tr.is-selected,.materials-table tr.is-selected td { background:color-mix(in srgb,var(--wash) 55%,var(--paper)); }
 .material-name { gap:15px; }
 .material-title { font-size:16px; }
 .material-subtitle { font-size:12px; }
 .paper-chip { width:28px; height:37px; }
 .mobile-label { display:block; font-size:12px; line-height:1.7; color:var(--muted); margin-bottom:3px; }
 .quantity { font-size:18px; }
 .opacity-track { width:36px; }
 .opacity-measure { gap:9px; }
 .selection-bar { display:block; padding:20px 0 0; }
 .selection-bar>div { justify-content:space-between; gap:18px; margin-top:12px; }
 .outline-button { font-size:13px; gap:15px; }
 .reference-return { align-items:flex-start; gap:18px; flex-wrap:wrap; padding-block:23px; }
 .reference-return>span:last-child { margin-left:auto; }
 .reference-with-image>img { width:100%; aspect-ratio:2; }
 .wide-tabs { gap:8px; }
 .wide-tabs button { padding:10px 8px; gap:4px; flex-direction:column; align-items:center; font-size:14px; }
 .wide-tabs button>span { font-size:14px; }
 .exhibition-plan { aspect-ratio:1.4; }
 .view-time { bottom:12px; left:12px; font-size:17px; padding:8px 11px; }
 .view-description { grid-template-columns:29px 1fr; gap:14px; }
 .view-description h3 { font-size:21px; }
 .small-view-layout { display:block; }
 .small-panel { margin-top:25px; padding-top:23px; border-top:1px solid var(--line); }
}
@media(max-width:540px) { .material-dialog { padding-inline:25px; }.material-dialog h2 { font-size:26px; }.dialog-art { margin-bottom:24px; }.dialog-description { font-size:14px; }.dialog-facts { font-size:13px; } }
@media(forced-colors:active) { .materials-table tr.is-selected { outline-color:Highlight; }.study-tabs button[aria-selected=true],.view-tabs button[aria-selected=true],.cover-reference .pi-lens.is-selected { border-color:Highlight; } }

.parts-entry{display:flex;justify-content:flex-end;margin:0 0 14px;font-size:12px;line-height:1.7}.parts-entry a{display:inline-flex;align-items:center;gap:12px;color:var(--muted);text-decoration:none}.parts-entry a:hover{color:var(--text)}.parts-entry a:focus-visible{outline:2px solid var(--accent,#62a9c6);outline-offset:5px;border-radius:3px}