.table-scroll{overflow-x:auto;padding:17px 18px 20px;overscroll-behavior-x:contain;scrollbar-color:#aba4c1 #f4f2f9}.periodic-table{display:grid;grid-template-columns:28px repeat(18,minmax(51px,1fr));grid-template-rows:23px repeat(7,78px) 13px repeat(2,78px);gap:5px;min-width:1090px}.group-label,.period-label{font-size:12px;color:#6b7789;display:grid;place-items:center}.element-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:5px 2px;border-radius:7px;background:var(--tile);border:1px solid var(--tile-border);color:var(--tile-ink);transition:transform .15s,box-shadow .15s;line-height:1.15}.element-tile:hover,.element-tile:focus-visible{transform:translateY(-3px);box-shadow:0 5px 13px #15224125;z-index:2}.element-tile .atomic-number{font-size:12px;position:absolute;top:4px;left:5px;opacity:.85}.element-tile strong{font-size:24px;font-weight:600;margin-top:10px}.element-tile .element-name{font-size:14px;margin-top:3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}html[lang=en] .element-tile .element-name{font-size:12px}.series-placeholder{font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #d3c0b2;border-radius:7px;color:#906044;background:#faf7f4;text-align:center}.series-label{font-size:14px;align-self:center;color:#6f657b;text-align:right;padding-right:9px;line-height:1.5}.table-bottom{padding:0 20px 19px}.table-bottom .science-note{margin-bottom:13px;font-size:12px}.chem-learning{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:24px;padding:0 4px}.chem-learning h2{font-size:16px;margin-bottom:6px}.chem-learning p{font-size:14px;color:#637184;line-height:1.85}#element-dialog{width:min(850px,calc(100% - 24px));max-width:850px;padding:23px;max-height:92dvh;overflow:auto}.element-dialog-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}.element-detail-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:25px}.atom-card{background:radial-gradient(ellipse at center,#283654,#141923 75%);border-radius:13px;min-height:355px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.atom-card canvas{height:285px;width:100%}.atom-card p{font-size:12px;color:#bac8de;line-height:1.8;margin:0;padding:0 19px 18px}.isotope-notation{position:absolute;left:20px;top:14px;color:#eff5ff;font-size:36px;display:flex;gap:6px;align-items:center;line-height:1}.isotope-notation .mass-stack{display:flex;flex-direction:column;font-size:14px;gap:3px}.element-copy h2{font-size:29px;line-height:1.4}.element-copy h2 small{font-size:16px;font-weight:400;color:#6f7b8e;margin-left:8px}.element-copy p{font-size:14px;color:#606f83;line-height:1.8;margin:11px 0}.element-copy .element-position{font-size:12px;margin:4px 0 12px}.isotope-control{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:18px 0 12px;font-size:14px}.isotope-control select{border:1px solid #d5dce8;border-radius:7px;padding:6px 10px;background:#f8f9fc;color:#314257;max-width:65%}.atom-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.atom-counts div{border:1px solid #e0e4ee;background:#f7f8fc;border-radius:8px;padding:9px 5px;text-align:center}.atom-counts strong{display:block;font-size:27px;line-height:1.2}.atom-counts span{font-size:12px}.atom-counts div:first-child{color:#bc4569}.atom-counts div:nth-child(2){color:#4472ac}.atom-counts div:nth-child(3){color:#7c57b5}.isotope-math{margin-top:16px;border-top:1px solid #e5e8ee;padding-top:12px}.isotope-math strong{font-size:16px}.isotope-math p,.element-copy .neutral-note{font-size:12px;margin:7px 0}.element-dialog-bottom{display:flex;justify-content:space-between;gap:12px;margin-top:21px;border-top:1px solid #e4e7ef;padding-top:17px}.element-dialog-bottom button:disabled{opacity:.4;cursor:default}
@media(max-width:700px){.table-scroll{padding:12px 10px 17px}.chem-learning{grid-template-columns:1fr;gap:18px}.element-detail-grid{grid-template-columns:1fr;gap:17px}.atom-card{min-height:270px}.atom-card canvas{height:240px}.element-copy h2{font-size:25px}#element-dialog{padding:17px}.table-bottom{padding:0 13px 16px}.element-dialog-bottom button{font-size:12px}.science-count{display:none}}
.periodic-axis-key{display:flex;gap:12px 30px;flex-wrap:wrap}.periodic-axis-key>div{display:flex;flex-direction:column;gap:2px}.periodic-axis-key strong{font-size:15px;font-weight:600;color:#504077}.periodic-axis-key span{font-size:12px;color:#64748a}.main-group-guide{padding:12px 20px;border-bottom:1px solid #e0e5ed;background:#fafbfe;font-size:14px;color:#5b6780}.main-group-guide summary{cursor:pointer;color:#5f4b8a;font-weight:500}.main-group-guide p{font-size:14px;line-height:1.85;margin-top:11px}.main-group-map{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px;margin-top:14px}.main-group-map>div{display:flex;flex-direction:column;padding:10px 9px;border:1px solid #e0dcec;border-radius:7px;background:#fff;gap:4px}.main-group-map strong{font-size:15px;color:#584179}.main-group-map small{font-size:12px;color:#8d7aa5}.main-group-map span{font-size:14px;color:#536174}.periodic-corner{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;align-items:center;position:sticky;left:0;z-index:3;background:#fff;font-size:12px;color:#665480;line-height:1.7}.periodic-table{grid-template-columns:68px repeat(18,minmax(51px,1fr));grid-template-rows:43px repeat(7,78px) 13px repeat(2,78px);min-width:1130px}.group-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.group-label b{font-size:14px;font-weight:500;color:#46566e}.group-label small{font-size:12px;color:#9172b3;line-height:1}.period-label{position:sticky;left:0;z-index:2;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:3px 0 6px #28304d06}.period-label small{font-size:12px;color:#7c6b91}.period-label b{font-size:16px;font-weight:500;color:#495c78}
@media(max-width:800px){.periodic-axis-key{gap:9px}.periodic-axis-key>div{min-width:100%}.main-group-guide{padding:12px 13px}.main-group-map{grid-template-columns:repeat(2,minmax(0,1fr))}.science-toolbar .science-tag{align-self:flex-start}.science-toolbar:has(.periodic-axis-key){align-items:flex-start}.periodic-axis-key{flex:1;min-width:210px}}
.electron-panel{border-top:1px solid #e1e4ed;margin-top:24px;padding-top:26px}.electron-heading>div{font-size:10px;letter-spacing:2px;color:#8d70b7}.electron-heading h2{font-size:24px;margin:6px 0}.electron-heading p{font-size:13px;color:#758095}.electron-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;align-items:center;margin:18px 0}.electron-visual{background:#f5f3fa;border:1px solid #e8e3f1;border-radius:14px;padding:12px}.electron-visual svg{width:100%;max-height:330px;display:block}.electron-visual p{font-size:11px;margin:0 5px;line-height:1.6}.shell-ring{fill:none;stroke:#d1cadf;stroke-width:1}.shell-electron{fill:#a9a1ba}.active .shell-ring{stroke:#7251ba;stroke-width:1.8}.active .shell-electron{fill:#6743b2}.shell-nucleus{fill:#e1d7f4}.shell-symbol{fill:#624795;font-size:17px;font-family:system-ui}.electron-copy h3,.electron-config-block h3{font-size:14px;margin:0 0 8px}.shell-sequence{font-size:28px;letter-spacing:2px;color:#644d99;font-variant-numeric:tabular-nums}.shell-choices{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.shell-choice{border:1px solid #ded9e8;background:#fff;border-radius:7px;padding:8px 10px;min-height:44px;color:#756982;text-align:left}.shell-choice span{display:block;font-size:10px}.shell-choice strong{display:block;font-size:17px;margin-top:4px}.shell-choice[aria-pressed=true]{background:#eee7fa;border-color:#8868bd;color:#5b398b}.shell-choice:focus-visible{outline:3px solid #b19ed1;outline-offset:2px}.shell-detail{background:#f7f8fb;border-radius:8px;padding:12px;margin:12px 0;min-height:80px}.shell-detail>span{display:block;font-size:12px;color:#6b7586}.electron-configuration{font-size:24px;color:#624795;display:block;max-width:100%;overflow-x:auto;overflow-y:hidden;padding:10px 0}.shell-detail .electron-configuration{font-size:22px;padding:8px 0 0}.electron-stats{display:flex;gap:24px}.electron-stats small{display:block;font-size:11px;color:#737e8e}.electron-stats b{font-size:21px;color:#3f4c62}.electron-config-block{border-top:1px solid #e7e8ef;padding-top:18px}.electron-config-block details{margin-top:10px}.electron-config-block summary{font-size:13px;cursor:pointer;color:#71638f}.electron-source{font-size:12px;color:#71608c;text-underline-offset:4px}.electron-panel>.science-note,.electron-config-block>.science-note{font-size:12px}
@media(max-width:620px){.electron-layout{grid-template-columns:1fr;gap:18px}.electron-visual svg{max-height:300px}.electron-heading h2{font-size:22px}.shell-sequence{font-size:25px}}
