@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(./fonts/dm-sans.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(./fonts/manrope.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{color-scheme:dark;--bg:#10141d;--surface:#171c27;--surface-raised:#1c2330;--border:#2b3342;--text:#f1f3f5;--muted:#a6aebb;--quiet:#8994a7;--accent:#d6f58a;--ink:#1b2617;--font:'DM Sans',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--display:'Manrope',var(--font);font-family:var(--font);font-size:16px;line-height:1.5;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button{color:inherit}a{color:inherit;text-decoration:none}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,.table-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:650;letter-spacing:-.04em}h1{font-size:clamp(1.8rem,2.5vw,2.5rem);line-height:1.25}h2{font-size:1.6rem;line-height:1.3}h3{font-size:1.1rem;line-height:1.4}p{color:var(--muted);font-size:1rem;line-height:1.65}small{font-size:.75rem}sub{font-size:.6em;line-height:0;vertical-align:-.3em}svg{display:block}button{border:0;background:none}::selection{background:#d6f58a;color:#10141d}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:1rem;top:-8rem;background:var(--accent);color:var(--ink);padding:.8rem;z-index:20}.skip-link:focus{top:1rem}
.site-header{min-height:96px;display:flex;align-items:center;gap:2rem;padding:1.25rem 2.5rem;border-bottom:1px solid var(--border);max-width:1800px;margin:auto}.brand{display:flex;align-items:center;gap:.85rem;white-space:nowrap;font-family:var(--display);font-size:1.3rem;font-weight:750;letter-spacing:-.05em}.brand-light{font-weight:400}.brand>span>small{display:block;font-family:var(--font);font-size:.75rem;letter-spacing:.16em;font-weight:500;margin-top:.2rem;color:var(--muted)}.brand-mark{display:flex;flex-direction:column;justify-content:center;width:44px;height:48px;border:1px solid #809453;border-radius:5px;padding:2px 7px;color:var(--accent);font-size:1.5rem;line-height:1.1;letter-spacing:-.08em}.brand-mark small{font-family:var(--font);font-size:.75rem;letter-spacing:0}.site-header nav{display:flex;gap:.2rem;align-self:stretch;align-items:center;margin:auto}.site-header nav a{font-size:.875rem;color:var(--muted);padding:.7rem .95rem;border-radius:7px;white-space:nowrap}.site-header nav a.active{background:#252d3a;color:var(--text)}.site-header nav a:hover{color:var(--text)}.collection-link{display:flex;align-items:center;gap:.55rem;font-size:.875rem;color:var(--muted);white-space:nowrap}.collection-link>span:first-child{font-size:1.4rem}.collection-link.active{color:var(--accent)}#collection-count{padding:2px 7px;background:#242d3a;border-radius:5px;color:#e2e7ef;font-size:.75rem}
main{max-width:1680px;margin:0 auto;padding:2.15rem 2.5rem 3rem;outline:0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.8rem}.eyebrow{font-family:var(--font);font-size:.75rem;letter-spacing:.14em;font-weight:550;color:var(--quiet);line-height:1.6}.section-heading .eyebrow{margin-bottom:.5rem;color:var(--accent)}.section-heading p{margin-top:.55rem}.badge{font-size:.8125rem;white-space:nowrap;color:var(--muted);border:1px solid var(--border);padding:.5rem .8rem;border-radius:99px}.sound-button{display:flex;align-items:center;gap:.6rem;padding:.55rem .9rem;border:1px solid var(--border);border-radius:8px;color:var(--muted);font-size:.875rem;white-space:nowrap}.sound-button span{font-size:1.3rem}.sound-button.on{color:var(--accent);border-color:#647444}.primary-button,.secondary-button{display:inline-flex;gap:1rem;justify-content:center;align-items:center;font-size:.875rem;font-weight:600;border-radius:6px;padding:.8rem 1.1rem;min-height:44px;line-height:1.4;transition:background .15s,transform .15s}.primary-button{background:var(--accent);color:var(--ink);border:1px solid var(--accent)}.primary-button:hover:not(:disabled){background:#e1ffa0;transform:translateY(-1px)}.secondary-button{background:#242c3a;color:var(--text);border:1px solid #354051}.secondary-button:hover:not(:disabled){background:#303b4c}.text-button{display:inline-flex;gap:.65rem;align-items:center;color:var(--text);font-size:.875rem;padding:0;border:0;text-align:left;line-height:1.5}.text-button:hover:not(:disabled){color:var(--accent)}.icon-button{font-size:1.6rem;min-height:40px;min-width:40px;line-height:1;color:var(--muted);border-radius:5px}.icon-button:hover{background:#303949;color:var(--text)}.full-width{width:100%}.source-link{display:block;font-size:.8125rem;color:var(--muted);line-height:1.5;margin-top:.9rem}.source-link:hover{color:var(--accent)}.small-note{font-size:.8125rem;line-height:1.6;color:var(--quiet)}
.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.7rem}.segmented{display:flex;border:1px solid var(--border);padding:4px;gap:3px;border-radius:8px;background:#151a24;flex-wrap:wrap}.segmented button{font-size:.875rem;padding:.5rem .9rem;border-radius:5px;color:var(--muted);min-height:38px}.segmented button.chosen{background:#344131;color:#d6efb2}.segmented button:hover:not(.chosen){background:#232c38;color:#eef2f9}.table-hint{font-size:.8125rem;color:var(--quiet)}.table-layout{display:grid;grid-template-columns:minmax(0,1fr) 272px;gap:1.75rem;align-items:start}.table-surface{min-width:0}.table-scroll{overflow-x:auto;overflow-y:hidden;padding:4px 4px 10px;margin:-4px;scrollbar-color:#4c586e #151b27;scrollbar-width:thin;border-radius:4px}.periodic-grid{display:grid;grid-template-columns:repeat(18,minmax(41px,1fr));grid-template-rows:20px repeat(7,66px) 13px repeat(2,60px);gap:5px;min-width:845px}.group-label{text-align:center;color:var(--quiet);font-size:.75rem}.element-tile{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;border-radius:4px;padding:4px 3px;border:1px solid color-mix(in srgb,var(--element) 39%,#1b2130);background:color-mix(in srgb,var(--element) 11%,#101722);color:var(--element);transition:background .14s,border-color .14s,opacity .18s,transform .14s;overflow:hidden}.element-tile:hover{background:color-mix(in srgb,var(--element) 26%,#101722);border-color:var(--element);z-index:1;transform:translateY(-2px)}.element-tile.selected{border-color:var(--element);background:color-mix(in srgb,var(--element) 25%,#101722);box-shadow:0 0 0 1px var(--element),0 0 20px color-mix(in srgb,var(--element) 12%,transparent);z-index:2}.element-tile .atomic-number{align-self:flex-start;font-size:.75rem;line-height:1.1;opacity:.8}.element-tile strong{font-family:var(--display);font-size:1.375rem;font-weight:650;line-height:1.35;letter-spacing:-.045em}.element-tile .tile-caption{font-size:.75rem;line-height:1.2;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;opacity:.82}.element-tile.dimmed{opacity:.2}.element-tile.dimmed:hover,.element-tile.dimmed:focus-visible{opacity:1}.element-tile.unknown{background:repeating-linear-gradient(135deg,#1b2230,#1b2230 4px,#141b26 4px,#141b26 8px)}.element-tile.sounding{background:var(--element);color:var(--bg);box-shadow:0 0 15px color-mix(in srgb,var(--element) 40%,transparent);transform:translateY(-3px)}.series-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.75rem;border:1px dashed #374154;border-radius:4px;color:var(--quiet)}.series-placeholder span{font-size:1rem}.series-label{display:flex;align-items:center;font-size:.75rem;line-height:1.4;color:var(--quiet);padding-left:5px}.table-invitation{grid-column:4 / span 8;grid-row:2 / span 3;padding:.65rem .8rem .5rem 1.25rem;align-self:center}.table-invitation .eyebrow{font-size:.75rem;color:var(--quiet)}.table-invitation h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(1.55rem,2.2vw,2.25rem);letter-spacing:-.03em;line-height:1.16;margin:.4rem 0 .85rem}.table-invitation .text-button{color:var(--accent);font-size:.8125rem}.family-legend{display:flex;flex-wrap:wrap;gap:.45rem .8rem;margin-top:1.35rem}.family-legend button{display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--muted);padding:.3rem .1rem;border-bottom:1px solid transparent}.family-legend button.chosen{color:var(--text);border-color:var(--accent)}.family-legend i,.state-legend i{width:7px;height:7px;display:inline-block;border-radius:1px;flex-shrink:0}.family-explanation{font-size:.875rem;padding:.8rem 0 0;max-width:800px}.family-explanation .text-button{margin-left:.5rem;text-decoration:underline}.chart-note{font-size:.8125rem;color:var(--quiet);line-height:1.6;margin-top:.75rem;max-width:850px}.scale-legend{display:flex;align-items:center;gap:1rem;font-size:.75rem;color:var(--muted);margin:1.5rem 0 1rem}.scale-bar{height:8px;width:230px;max-width:35%;background:linear-gradient(90deg,hsl(205 65% 43%),hsl(145 65% 58%),hsl(80 65% 73%));border-radius:20px}.scale-bar.number{background:linear-gradient(90deg,hsl(210 60% 42%),hsl(95 60% 72%))}.state-legend{display:flex;gap:1.5rem;margin-top:1.5rem;font-size:.875rem;color:var(--muted)}.state-legend span{display:flex;align-items:center;gap:.5rem}.scroll-hint{display:none;font-size:.75rem;color:var(--quiet);margin-bottom:.5rem}
.element-detail{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:1.2rem}.detail-top{display:flex;align-items:center;justify-content:space-between}.category-dot{width:8px;height:8px;border-radius:50%}.element-specimen{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:.3rem;margin:1rem 0 .7rem;color:var(--element)}.element-specimen>span:first-child{display:none}.element-specimen strong{font-family:var(--display);font-size:5.25rem;line-height:1.1;font-weight:550;letter-spacing:-.08em}.element-specimen>span:last-child{font-size:.8125rem;color:var(--quiet);letter-spacing:.02em}.element-detail h2{font-size:1.75rem}.detail-category{font-size:.8125rem;color:var(--quiet);margin:.2rem 0 1rem}.element-story{font-size:.9375rem;line-height:1.6}.properties{margin:1.1rem 0 .8rem;border-top:1px solid var(--border);padding-top:.5rem}.properties>div{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;font-size:.8125rem}.properties dt{color:var(--muted)}.properties dd{margin:0;text-align:right}.properties small{color:var(--quiet)}.electron-details{border-top:1px solid var(--border);font-size:.8125rem;padding:.65rem 0 1rem;color:var(--muted)}.electron-details summary{cursor:pointer}.electron-details p{font-family:ui-monospace,monospace;font-size:.8125rem;margin:.5rem 0;color:var(--text)}.electron-details small{display:block;line-height:1.5}.listen-panel{border-top:1px solid var(--border);margin-top:1.15rem;padding-top:1rem}.listen-panel>div:first-child{display:flex;align-items:center;gap:.6rem;font-size:.875rem}.listen-panel>div:first-child>span{color:var(--accent);font-size:1.3rem}.listen-panel strong{font-weight:500}.listen-controls{display:flex;gap:.5rem;margin:.7rem 0}.listen-controls select{flex:1;min-width:0;background:#252d3a;border:1px solid #394356;color:var(--text);font-size:.8125rem;border-radius:5px;padding:.5rem}.listen-controls .secondary-button{padding:.5rem .7rem;min-height:38px;font-size:.8125rem;white-space:nowrap}.listen-panel p{font-size:.75rem;line-height:1.55;color:var(--quiet)}.table-bottom{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin-top:2.5rem;padding:1.75rem 0;border-top:1px solid var(--border)}.table-bottom h3{font-size:1.25rem;margin:.4rem 0}.table-bottom .primary-button,.table-bottom .secondary-button{flex-shrink:0}
.workbench-layout{display:grid;grid-template-columns:235px minmax(300px,1fr) 292px;gap:1.5rem;align-items:start}.panel-heading{display:flex;flex-direction:column;gap:.15rem;margin-bottom:1rem}.panel-heading h2{font-size:1.05rem}.panel-heading span{font-size:.8125rem;color:var(--quiet)}.atom-palette{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:1rem}.palette-tile{display:flex;flex-direction:column;align-items:center;padding:6px 5px 9px;border:1px solid color-mix(in srgb,var(--element) 40%,#18202e);background:color-mix(in srgb,var(--element) 12%,#10141d);color:var(--element);border-radius:5px;cursor:grab;min-height:78px;touch-action:manipulation}.palette-tile:active{cursor:grabbing}.palette-tile:hover{border-color:var(--element);background:color-mix(in srgb,var(--element) 23%,#10141d)}.palette-tile>span{align-self:flex-start;font-size:.75rem;line-height:1.1}.palette-tile strong{font-size:1.6rem;font-family:var(--display);line-height:1.4}.palette-tile small{font-size:.75rem;line-height:1.3}.atom-shelf>.text-button{font-size:.8125rem;color:var(--muted)}.shelf-invitation{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1.3rem}.shelf-invitation h3{margin:.45rem 0 .6rem}.shelf-invitation p{font-size:.875rem}.shelf-invitation button{margin-top:1rem;font-size:.8125rem;width:100%}.bench-surface{background-color:#151b26;background-image:radial-gradient(#343e502f 1px,transparent 1px);background-size:18px 18px;border:1px solid #323d4f;border-radius:12px;padding:1.2rem;min-height:600px;display:flex;flex-direction:column;overflow:hidden}.bench-surface.drag-over{border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent);background-color:#202c29}.bench-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}.bench-top>.text-button{font-size:.8125rem;color:var(--muted)}.model-stage{min-height:300px;display:flex;align-items:center;justify-content:center;flex:1}.compound-model{width:100%;max-width:510px;filter:drop-shadow(0 16px 18px #090d1540);overflow:visible}.compound-model text{font-family:var(--display)}.empty-bench{text-align:center;padding:2rem .5rem}.empty-formula{display:flex;align-items:center;justify-content:center;gap:.9rem;margin-bottom:2rem;color:#aab5c7}.empty-formula span{display:flex;align-items:center;justify-content:center;width:54px;height:62px;border:1px dashed #4b596c;border-radius:6px;font-size:1.7rem;font-family:var(--display);color:#c0cddd}.empty-formula b{font-size:1.3rem;font-weight:400;color:#77869e}.empty-bench h2{font-size:1.5rem}.empty-bench p{font-size:.9375rem;margin:.8rem 0 1.4rem}.composition-title{text-align:center;margin:-.5rem 0 1.4rem}.large-formula{font-family:var(--display);font-size:2.65rem;letter-spacing:-.04em}.composition-title>span{display:block;font-size:.75rem;color:var(--quiet);margin-top:.4rem}.atom-controls{display:flex;justify-content:center;gap:.6rem;flex-wrap:wrap;margin:0 0 1.5rem}.atom-counter{display:flex;align-items:center;gap:.15rem;border:1px solid #384356;background:#1d2735;border-radius:7px;overflow:hidden}.atom-counter strong{font-size:1rem;color:var(--element);padding:0 .8rem}.atom-counter button{width:34px;min-height:40px;font-size:1.2rem;color:var(--muted)}.atom-counter button:hover:not(:disabled){background:#364456;color:white}.atom-counter>span{min-width:20px;text-align:center;font-size:.875rem;font-variant-numeric:tabular-nums}.bench-foot{display:flex;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid #303b4b;font-size:.75rem;color:var(--quiet);flex-wrap:wrap}.compound-detail{background:var(--surface);border:1px solid var(--border);padding:1.4rem;border-radius:10px}.compound-detail>h2{margin:.65rem 0 1rem;font-size:1.55rem}.compound-detail>p{font-size:.9375rem}.suggestions{display:flex;flex-direction:column;gap:.65rem;margin-top:1.5rem}.suggestions>button{display:flex;align-items:center;text-align:left;gap:.8rem;border:1px solid var(--border);border-radius:6px;padding:.7rem .6rem}.suggestions>button:hover{border-color:#617146;background:#293324}.suggestions>button>strong{font-size:1.3rem;color:var(--accent);min-width:50px;letter-spacing:-.04em}.suggestions>button>span:nth-child(2){font-size:.8125rem;flex:1}.suggestions small{display:block;font-size:.75rem;color:var(--quiet);margin-top:3px}.suggestions>button>span:last-child{color:var(--quiet)}.compound-detail>.small-note{margin-top:1.1rem;font-size:.8125rem}.match-label{color:var(--accent);font-size:.75rem;letter-spacing:.12em;display:flex;gap:.55rem;align-items:center}.match-label>span{font-size:1.1rem}.compound-formula{font-size:2rem;font-family:var(--display);color:var(--accent);margin:-.5rem 0 1rem}.found-in{border-left:2px solid #647b46;margin:1.3rem 0;padding:.15rem 0 .2rem .8rem}.found-in .eyebrow{font-size:.75rem}.found-in p{font-size:.875rem;margin-top:.4rem}.kept{background:#2c3828;color:var(--accent);border-color:#586847}.next-question{border-top:1px solid var(--border);margin-top:1.2rem;padding-top:1rem}.next-question h3{font-size:1rem;margin:.5rem 0 .8rem}.next-question p{font-size:.8125rem}.next-question .text-button{font-size:.8125rem;color:var(--accent)}.workbench-note{display:flex;gap:.85rem;border-top:1px solid var(--border);margin-top:2rem;padding-top:1rem}.workbench-note>span{color:var(--accent);font-size:1.3rem}.workbench-note>p{font-size:.875rem;max-width:920px}
.trail-banner{display:flex;gap:1.25rem;align-items:center;padding:1.3rem 1.5rem;background:#222d24;border:1px solid #455439;border-radius:9px;margin:0 0 1.7rem}.trail-progress{display:flex;flex-direction:column;gap:5px;align-self:stretch;justify-content:center}.trail-progress i{width:4px;height:20px;background:#45543b;border-radius:3px}.trail-progress i.filled{background:var(--accent)}.trail-instruction{flex:1}.trail-instruction>.eyebrow{color:#b7cd99;font-size:.75rem}.trail-instruction h2{font-size:1.1rem;margin:.35rem 0}.trail-instruction p{font-size:.875rem;max-width:820px;color:#b7c2b1}.trail-actions{display:flex;flex-direction:column;gap:.7rem;align-items:center;flex-shrink:0}.trail-actions .text-button{font-size:.8125rem;color:#bdc9b5}.trail-checks{display:flex;gap:.5rem;margin-top:.7rem}.trail-checks span{font-size:.8125rem;min-width:34px;text-align:center;border:1px solid #536145;border-radius:4px;padding:2px 6px;color:#bdc9b5}.trail-checks .done{background:#d6f58a;color:#26321e;border-color:#d6f58a}.trails-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}.trail-card{border:1px solid var(--border);border-radius:10px;padding:1.7rem;background:var(--surface)}.trail-card-top{display:flex;justify-content:space-between;gap:1rem}.trail-card-top>span:last-child{font-size:.75rem;color:var(--quiet)}.trail-visual{display:flex;align-items:center;gap:1rem;height:150px;margin:.5rem 0 1rem;color:var(--trail);font-family:var(--display);font-size:2.6rem;letter-spacing:-.07em}.trail-visual>span:not(.trail-operator){border:1px solid color-mix(in srgb,var(--trail) 35%,#1c2532);background:color-mix(in srgb,var(--trail) 9%,#151c27);padding:.4rem 1rem;border-radius:6px;min-width:72px;text-align:center}.trail-operator{font-size:1.5rem;letter-spacing:0}.trail-visual .pull-step:nth-child(1){opacity:.45}.trail-visual .pull-step:nth-child(2){opacity:.7}.trail-card>.eyebrow{color:var(--trail)}.trail-card h2{margin:.5rem 0 .8rem;font-size:1.5rem}.trail-card>p{font-size:.9375rem;max-width:560px;min-height:75px}.trail-card>button{margin-top:1.25rem}
.object-tabs{display:flex;gap:.75rem;margin:1rem 0 2rem;flex-wrap:wrap}.object-tabs button{display:flex;align-items:center;gap:1.2rem;border:1px solid var(--border);border-radius:7px;padding:.8rem 1.2rem;background:var(--surface);font-size:.9375rem}.object-tabs button>span{color:var(--quiet);font-size:.75rem}.object-tabs button.chosen{border-color:#7c915b;color:var(--accent);background:#273121}.everyday-feature{display:grid;grid-template-columns:1.1fr 1fr;gap:5rem;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:3rem}.everyday-story h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(2rem,3.5vw,3.5rem);font-weight:400;letter-spacing:-.045em;line-height:1.13;margin:1rem 0 1.4rem;max-width:470px}.everyday-story>p{max-width:570px}.object-symbols{display:flex;gap:.6rem;flex-wrap:wrap;margin:2rem 0}.object-symbols button{font-family:var(--display);font-size:1.7rem;line-height:1.2;color:var(--element);background:color-mix(in srgb,var(--element) 10%,#151b26);border:1px solid color-mix(in srgb,var(--element) 40%,#171c27);border-radius:5px;width:62px;height:68px}.object-symbols button:hover{border-color:var(--element)}.everyday-story .source-link{margin-top:1.25rem}.matter-breakdown{padding-top:.25rem}.matter-part{display:flex;align-items:center;gap:1rem;text-align:left;width:100%;padding:1.7rem 0;border-bottom:1px solid var(--border)}.part-symbol{color:var(--element);font-family:var(--display);font-size:1.7rem;width:48px;flex-shrink:0}.matter-part>span:nth-child(2){flex:1}.matter-part strong{display:block;font-size:1rem;font-weight:500;line-height:1.4;margin-bottom:.5rem}.matter-part>span:nth-child(2)>span{display:block;font-size:.9375rem;color:var(--muted);line-height:1.6}.matter-part>span:last-child{color:var(--quiet);padding:0 .25rem}.matter-part:hover strong{color:var(--accent)}.matter-breakdown>.small-note{margin-top:1.5rem}
.collection-note{display:flex;gap:.65rem;align-items:center;color:var(--quiet);font-size:.875rem;margin-bottom:2rem}.collection-note>span{font-size:1.25rem}.empty-collection{border:1px dashed #3e485b;border-radius:10px;padding:4rem 1.5rem;text-align:center;max-width:950px;margin:2.5rem auto}.empty-collection-mark{color:var(--accent);font-size:4rem;font-weight:300}.empty-collection h2{font-size:1.8rem;margin:.5rem 0 1rem}.empty-collection p{max-width:510px;margin:0 auto 1.5rem}.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.discovery-card{padding:1.5rem;border:1px solid var(--border);border-radius:9px;background:var(--surface)}.discovery-card-top{display:flex;align-items:center;justify-content:space-between;min-height:40px}.discovery-formula{font-family:var(--display);font-size:3.7rem;letter-spacing:-.06em;color:var(--accent);padding:1.6rem 0}.discovery-card h2{font-size:1.3rem;margin-bottom:.7rem}.discovery-card p{font-size:.9375rem;min-height:54px}.discovery-card>.text-button{margin-top:1.5rem}.trail-keepsake{border-color:#4a543b;background:#20271e}.trail-keepsake .discovery-formula{color:#b7cd99}.collection-more{margin-top:2rem}
.site-footer{max-width:1600px;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid var(--border);padding:1.4rem 2.5rem 2rem;margin:auto;color:var(--quiet);font-size:.8125rem}.site-footer .text-button{font-size:.8125rem;color:var(--muted)}dialog{background:#1a2230;color:var(--text);border:1px solid #4b596e;border-radius:12px;padding:1.5rem 2rem;max-width:680px;width:calc(100% - 2rem);max-height:85dvh;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#050a13c9;backdrop-filter:blur(5px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.dialog-header h2{font-size:1.65rem}#sources-content h3{margin:1.5rem 0 .5rem;font-size:1.1rem}#sources-content p{font-size:.9375rem;margin-bottom:.7rem}#sources-content a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%,15px);background:#d6f58a;color:#202d18;max-width:min(90vw,600px);padding:.85rem 1.2rem;border:1px solid #e4ffb0;border-radius:7px;box-shadow:0 6px 32px #0006;font-size:.875rem;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:30}.toast.visible{opacity:1;transform:translate(-50%,0)}.noscript{padding:2rem;margin:2rem;border:1px solid var(--border)}.noscript a{color:var(--accent);text-decoration:underline}
@media(min-width:1550px){.periodic-grid{grid-template-rows:20px repeat(7,72px) 15px repeat(2,65px)}.element-tile strong{font-size:1.6rem}.table-layout{grid-template-columns:minmax(0,1fr) 300px}.table-invitation{padding-left:2rem}.table-invitation h2{font-size:2.65rem}.element-detail{padding:1.5rem}.workbench-layout{grid-template-columns:250px minmax(320px,1fr) 340px}.bench-surface{min-height:650px}.compound-detail{padding:1.7rem}.compound-detail>h2{font-size:1.8rem}}
@media(max-width:1260px){.site-header{gap:1rem;padding:1rem 1.5rem}.site-header nav a{padding:.6rem .7rem}main{padding:1.8rem 1.5rem 2rem}.table-layout{gap:1.2rem;grid-template-columns:minmax(0,1fr) 250px}.scroll-hint{display:block}.table-hint{display:none}.workbench-layout{grid-template-columns:190px minmax(280px,1fr) 260px;gap:1rem}.compound-detail{padding:1.15rem}.palette-tile small{font-size:.75rem}.atom-palette{gap:5px}.bench-surface{padding:1rem}.everyday-feature{gap:2.5rem;padding:2rem}.collection-link .collection-label{display:none}}
@media(max-width:1000px){.site-header{flex-wrap:wrap;gap:.75rem;min-height:auto}.brand{margin-right:auto}.site-header nav{order:3;width:100%;justify-content:center;border-top:1px solid var(--border);padding-top:.75rem}.collection-link .collection-label{display:inline}.table-layout{grid-template-columns:1fr}.element-detail{display:grid;grid-template-columns:150px 1fr 1fr;column-gap:1.5rem;align-items:start;padding:1.5rem}.detail-top{grid-column:1/-1}.element-specimen{grid-column:1;grid-row:2 / span 3}.element-detail>h2{grid-column:2;grid-row:2;margin-top:1rem}.detail-category{grid-column:2;grid-row:3;margin:0}.element-story{grid-column:2;grid-row:4}.properties{grid-column:3;grid-row:2 / span 3;margin-top:1rem}.electron-details{grid-column:3;grid-row:5}.element-detail>.primary-button{grid-column:1 / span 2;grid-row:5;align-self:center;margin-top:1rem}.element-detail>.source-link{grid-column:1 / span 2;grid-row:6}.listen-panel{grid-column:3;grid-row:6 / span 2;margin:0}.table-toolbar{margin-bottom:1.3rem}.workbench-layout{grid-template-columns:200px minmax(0,1fr)}.compound-detail{grid-column:1/-1;display:block}.compound-detail .suggestions{display:grid;grid-template-columns:repeat(3,1fr)}.compound-detail>.primary-button{width:auto}.compound-detail>p{max-width:820px}.compound-detail>.found-in{display:inline-block;margin-right:2rem;vertical-align:middle}.compound-detail .next-question{margin-top:1.5rem}.bench-surface{min-height:580px}.everyday-feature{gap:2rem}.collection-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.site-header{padding:1rem;gap:1rem}.brand{font-size:1.1rem;gap:.6rem}.brand-mark{width:37px;height:43px;font-size:1.4rem;padding:3px 5px}.brand>span>small{font-size:.75rem;letter-spacing:.1em}.collection-link{font-size:.8125rem;gap:.35rem}.collection-label{display:none!important}.site-header nav{justify-content:flex-start;overflow:auto;gap:3px}.site-header nav a{font-size:.8125rem;padding:.55rem .65rem}.site-header nav a:first-child{margin-left:0}main{padding:1.5rem 1rem 2rem}.section-heading{align-items:flex-start;margin-bottom:1.4rem;gap:.6rem}.section-heading p{font-size:.9375rem;line-height:1.55}.section-heading>.badge{display:none}.section-heading .eyebrow{font-size:.75rem}.sound-button{font-size:.75rem;padding:.4rem .6rem;gap:.35rem;margin-top:1.2rem}.sound-button>span{font-size:1.1rem}.section-heading h1{font-size:1.8rem}.segmented{gap:2px;width:100%;display:grid;grid-template-columns:1fr 1.25fr 1.25fr 1.2fr}.segmented button{font-size:.75rem;padding:.4rem .35rem;min-height:40px;white-space:normal}.table-toolbar{display:block}.periodic-grid{min-width:870px;grid-template-rows:20px repeat(7,68px) 13px repeat(2,60px)}.table-invitation h2{font-size:1.9rem}.table-scroll{padding-bottom:1rem}.family-legend{gap:.35rem .6rem;margin-top:.8rem}.family-legend button{font-size:.75rem;min-height:30px}.table-layout{gap:1.4rem}.element-detail{display:block;padding:1.2rem}.element-specimen{float:left;min-width:100px;margin:1.15rem 1.3rem 1rem 0}.element-specimen strong{font-size:4.5rem}.element-detail>h2{margin-top:1.4rem}.element-story{margin-top:.6rem}.properties{clear:both;margin-top:1.2rem}.element-detail>.primary-button{margin-top:0}.listen-panel{margin-top:1.2rem}.listen-panel p{font-size:.8125rem}.table-bottom{flex-direction:column;align-items:flex-start;gap:1.25rem;margin-top:2rem;padding:1.5rem 0 .5rem}.table-bottom p{font-size:.9375rem}.table-bottom .eyebrow{font-size:.75rem}.chart-note{font-size:.8125rem}.state-legend{gap:1rem;flex-wrap:wrap}.workbench-layout{display:flex;flex-direction:column;gap:1.25rem}.atom-shelf,.bench-surface,.compound-detail{width:100%}.atom-palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin-bottom:.6rem}.palette-tile{min-height:66px;padding:4px 2px 6px}.palette-tile small{display:none}.palette-tile strong{font-size:1.5rem}.palette-tile>span{font-size:.75rem;padding-left:3px}.panel-heading{flex-direction:row;justify-content:space-between;margin-bottom:.7rem}.panel-heading h2{font-size:.9375rem}.panel-heading span{font-size:.75rem}.shelf-invitation{display:none}.bench-surface{min-height:450px;padding:1rem}.model-stage{min-height:230px}.empty-bench{padding:1.5rem 0}.empty-formula{margin-bottom:1.5rem}.empty-bench h2{font-size:1.3rem}.empty-bench p{font-size:.875rem}.empty-bench .secondary-button{font-size:.8125rem}.bench-foot{font-size:.75rem;gap:.5rem}.bench-top .eyebrow{font-size:.75rem}.large-formula{font-size:2.4rem}.atom-controls{gap:.5rem;margin-bottom:1rem}.atom-counter strong{padding:0 .55rem}.compound-detail .suggestions{display:flex}.compound-detail>.primary-button{width:100%}.compound-detail>.found-in{display:block}.composition-title{margin-top:0}.workbench-note p{font-size:.8125rem}.trail-banner{padding:1rem;gap:.8rem;flex-wrap:wrap}.trail-progress{display:none}.trail-instruction{flex-basis:100%}.trail-actions{flex-direction:row;justify-content:space-between;width:100%;gap:1rem}.trail-actions .primary-button,.trail-actions .secondary-button{padding:.6rem .8rem;font-size:.8125rem;min-height:40px}.trail-instruction h2{font-size:1.05rem}.trails-grid{grid-template-columns:1fr;gap:1rem}.trail-card{padding:1.25rem}.trail-visual{font-size:2.1rem;height:120px;gap:.75rem}.trail-visual>span:not(.trail-operator){min-width:60px;padding:.4rem .8rem}.trail-card>p{min-height:0}.object-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin-bottom:1.3rem}.object-tabs button{font-size:.875rem;gap:.75rem;padding:.75rem .9rem}.everyday-feature{grid-template-columns:1fr;padding:1.5rem;gap:2rem}.everyday-story h2{font-size:2.4rem}.everyday-story>p{font-size:.9375rem}.object-symbols{margin:1.5rem 0;gap:.5rem}.object-symbols button{width:48px;height:56px;font-size:1.5rem}.matter-part{padding:1.3rem 0}.matter-part>span:nth-child(2)>span{font-size:.875rem}.matter-part strong{font-size:.9375rem}.part-symbol{width:35px;font-size:1.5rem}.collection-note{font-size:.8125rem;align-items:flex-start}.collection-grid{grid-template-columns:1fr;gap:1rem}.discovery-card{padding:1.25rem}.empty-collection{padding:2rem 1rem;margin:1.5rem 0}.empty-collection h2{font-size:1.45rem}.empty-collection p{font-size:.9375rem}.empty-collection-mark{font-size:3rem}.site-footer{padding:1.25rem 1rem 1.5rem;flex-direction:column;align-items:flex-start;gap:.6rem;font-size:.75rem}.site-footer .text-button{font-size:.75rem}dialog{padding:1.2rem}.toast{bottom:1rem;width:max-content;max-width:calc(100% - 2rem);text-align:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.element-tile:hover,.element-tile.sounding,.primary-button:hover:not(:disabled){transform:none}}