[hidden]{display:none!important}html{scroll-padding-top:100px}.skip-link{position:absolute;top:-80px;left:12px;z-index:100;background:white;padding:12px}.skip-link:focus{top:12px}a,button,input,select,textarea,summary{outline-offset:4px}.mobile-nav{position:relative}.mobile-nav summary{padding:8px;cursor:pointer;list-style:none}.mobile-nav nav{position:absolute;right:0;top:100%;min-width:180px;display:flex;flex-direction:column;gap:16px;padding:20px;background:hsl(var(--background));border:1px solid hsl(var(--border));border-radius:10px;box-shadow:var(--shadow-sm)}.gallery-controls{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:50px 20px 20px;background:linear-gradient(transparent,hsl(var(--primary)/.92))}.gallery-controls>button{color:white;background:#0004;border:1px solid #fff6;border-radius:50%;min-width:40px;height:40px;display:flex;align-items:center;justify-content:center}.gallery-controls>div{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}.gallery-dot{height:8px;width:8px;border-radius:10px;background:#ffffff73}.gallery-dot[aria-current=true]{width:25px;background:white}.pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px;font-size:14px}.pagination>div{display:flex;gap:12px}.identifier-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}.identifier-grid>div{border-left:1px solid hsl(var(--border));padding-left:20px}.identifier-grid>div:first-child{border:0;padding:0}dd{margin-left:0;overflow-wrap:anywhere}.chemical-structure{color:hsl(var(--foreground));text-align:center;padding:12px;min-height:190px}.chemical-structure canvas{max-width:100%;width:100%;height:auto}.chemical-structure strong{display:block;font-size:26px;margin-top:35px}.chemical-structure p{overflow-wrap:anywhere}.empty-results{grid-column:1/-1;text-align:center;padding:48px 20px}.empty-results h3{font-size:24px;font-weight:bold;margin-bottom:12px}.draft-text{white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid hsl(var(--border));border-radius:10px;padding:24px;max-width:700px;font:inherit;line-height:1.7}.material-card svg{flex-shrink:0}.material-card h3{overflow-wrap:anywhere}.detail-grid h1{overflow-wrap:anywhere}main:focus{outline:none}@media(max-width:800px){.identifier-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.identifier-grid>div{border:0;padding:0}.pagination{align-items:flex-start;flex-direction:column}.pagination>div{flex-wrap:wrap}.hero-title{overflow-wrap:normal}}@media(prefers-reduced-motion:reduce){.fade-up{animation:none!important;opacity:1!important;transform:none!important}html{scroll-behavior:auto!important}}
/* Live search keeps the server-rendered forms and links as its fallback. */
.header-search{position:relative}.header-search>summary{list-style:none;cursor:pointer}.header-search>summary::-webkit-details-marker{display:none}.header-search[open]>summary{border-color:hsl(var(--accent));box-shadow:0 0 0 3px hsl(var(--accent)/.12)}.header-search-panel{position:absolute;right:0;top:calc(100% + 16px);width:560px;max-width:calc(100vw - 32px);padding:22px;border:1px solid hsl(var(--border));border-radius:14px;background:hsl(var(--background));box-shadow:0 18px 50px hsl(var(--primary)/.18);max-height:75vh;overflow:auto}.header-search label{display:block;font-size:14px;font-weight:700;margin-bottom:10px}.header-search-field{display:flex;gap:10px}.header-search-field input{min-width:0}.header-search-field button{flex-shrink:0}.search-status{font-size:13px;line-height:1.6;color:hsl(var(--muted-foreground));margin-top:12px;min-height:1.6em}.header-search-result{display:flex;flex-direction:column;gap:5px;padding:14px 4px;border-top:1px solid hsl(var(--border))}.header-search-result:hover,.header-search-result:focus-visible{background:hsl(var(--muted)/.65)}.header-search-result strong{font-size:14px;line-height:1.5;overflow-wrap:anywhere}.header-search-result span{font-size:12px;color:hsl(var(--muted-foreground));font-family:monospace}.header-search-all{display:block;padding:16px 4px 0;font-size:14px;font-weight:700;color:hsl(var(--accent))}#catalog-results[aria-busy=true],#header-search-results[aria-busy=true]{opacity:.55}#catalog-results{scroll-margin-top:110px}
/* SVG stays sharp at any zoom; its transparent surface matches the page. */
.structure-card,.chemical-structure,.structure-stage,#structure-dialog{background:hsl(var(--background))}.chemical-structure svg{display:block;width:100%;height:100%;background:transparent}.structure-stage{height:320px;min-width:0;overflow:hidden;position:relative;touch-action:pan-y}.structure-stage.can-pan{cursor:grab;touch-action:none}.structure-stage.is-panning{cursor:grabbing}.structure-tools{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px;margin:12px 0 6px}.structure-tools button{border:1px solid hsl(var(--border));border-radius:6px;padding:6px 10px;min-height:36px;background:hsl(var(--card));font-size:13px;color:hsl(var(--foreground))}.structure-tools button:hover:not(:disabled){border-color:hsl(var(--accent))}.structure-tools button:disabled{opacity:.4;cursor:default}.structure-tools output{font-size:12px;min-width:45px;color:hsl(var(--muted-foreground))}.structure-hint{font-size:12px;color:hsl(var(--muted-foreground));margin:8px 0 0}#structure-dialog{width:min(1200px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);border:1px solid hsl(var(--border));border-radius:14px;padding:20px;color:hsl(var(--foreground))}#structure-dialog::backdrop{background:hsl(var(--primary)/.72);backdrop-filter:blur(3px)}.structure-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}.structure-dialog-heading h2{font-size:18px;font-weight:700;line-height:1.4;overflow-wrap:anywhere}.structure-dialog-heading>button{font-size:28px;min-width:40px;min-height:40px;border:1px solid hsl(var(--border));border-radius:6px}#structure-dialog .structure-stage{height:min(65dvh,760px)}#structure-dialog [data-expand]{display:none}#structure-dialog .structure-hint{text-align:center}@media(max-width:650px){.header-search-panel{position:fixed;top:82px;left:16px;right:16px;width:auto;padding:16px}.header-search-field{gap:6px}.header-search-field button{padding:12px}.header-search-field button svg{display:none}.structure-stage{height:300px}#structure-dialog{padding:14px}.structure-dialog-heading h2{font-size:15px}}

.material-card-link{display:block}.card-structure-preview{height:125px;margin-top:12px;display:flex;align-items:center;justify-content:center;position:relative;background:transparent}.card-structure{display:block;width:100%;max-width:290px;height:125px;background:transparent}.card-structure-fallback{font-size:13px;color:hsl(var(--muted-foreground));position:absolute}.card-cas-row{display:flex;align-items:center;gap:10px;margin-top:10px;min-height:28px;font-size:11px;color:hsl(var(--muted-foreground))}.card-cas-copy{display:inline-flex;align-items:center;gap:7px;color:#1670be;cursor:pointer;padding:5px 0;user-select:text}.card-cas-copy:hover{text-decoration:underline}.card-cas-copy:focus-visible{outline:2px solid #1670be;border-radius:3px}.card-copy-status{font-size:11px;color:#1670be}

.header-search-row{border-top:1px solid hsl(var(--border));padding:10px 4px}.header-search-row .header-search-result{border:0;padding:4px 0}.header-search-row .card-cas-row{margin-top:3px;font-size:12px}.card-structure-preview{height:150px;overflow:hidden}.card-structure{max-width:none;width:100%;height:100%}.card-structure-preview.can-pan{touch-action:none;cursor:grab}.card-structure-preview.is-panning{cursor:grabbing}.card-pan-hint{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;pointer-events:none;font-size:10px;color:hsl(var(--muted-foreground));background:hsl(var(--card)/.9);padding:2px 6px;border-radius:4px}.card-structure:focus-visible{outline:2px solid hsl(var(--accent));outline-offset:-2px}

.hero-slideshow{position:relative;aspect-ratio:3/2}.hero-slideshow>img{display:block;width:100%;height:100%;object-fit:contain}.hero-slide-toggle{position:absolute;bottom:10px;right:10px;background:#11283de6;color:white;border:1px solid #ffffff70;border-radius:6px;padding:5px 10px;font-size:12px;cursor:pointer}

@media (min-width: 1024px) { .category-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }