:is(.pa,.periodic-scope) .pt{--pt-metal:#c9defa;--pt-nonmetal:#ffe08a;--pt-metalloid:#f6c4cd;--pt-unknown:#e3e7ef;z-index:39;width:min(880px,100vw - 24px);max-height:var(--pt-maxh,calc(100dvh - 76px));background:var(--card);color:var(--ink);border:2px solid var(--ink);font-family:var(--f-body);border-radius:16px;flex-direction:column;display:flex;position:fixed;top:64px;left:12px;overflow:hidden;box-shadow:0 10px 28px #22304d47}:is(.pa,.periodic-scope) .pt[data-dragging]{-webkit-user-select:none;user-select:none}:is(.pa,.periodic-scope) .pt-bar{border-bottom:2px solid var(--ink);background:var(--card2);flex:none;align-items:stretch;gap:4px;padding:4px 4px 4px 6px;display:flex}:is(.pa,.periodic-scope) .pt-drag{min-width:0;min-height:44px;color:var(--ink);font:inherit;text-align:left;cursor:grab;touch-action:none;background:0 0;border:0;border-radius:12px;flex:1;align-items:center;gap:10px;padding:0 10px;display:flex}:is(.pa,.periodic-scope) .pt[data-dragging] .pt-drag{cursor:grabbing}:is(.pa,.periodic-scope) .pt-drag:hover{background:#fff9}:is(.pa,.periodic-scope) .pt-title{white-space:nowrap;font-size:16px;font-weight:800}:is(.pa,.periodic-scope) .pt-tag{background:var(--gold);border:1.5px solid var(--ink);white-space:nowrap;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:800}:is(.pa,.periodic-scope) .pt-x{width:44px;height:44px;color:var(--ink);font:700 26px/1 var(--f-body);cursor:pointer;background:0 0;border:0;border-radius:22px;flex:none}:is(.pa,.periodic-scope) .pt-x:hover{background:#ffffffbf}:is(.pa,.periodic-scope) .pt :is(.pt-drag,.pt-x,.pt-el):focus-visible{outline:3px solid var(--navy);outline-offset:2px;box-shadow:0 0 0 5px #fff}:is(.pa,.periodic-scope) .pt-body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;flex:auto;min-height:0;padding:10px 12px 8px;overflow:auto}:is(.pa,.periodic-scope) .pt-grid{grid-template-rows:auto repeat(7,auto) 8px repeat(2,auto);grid-template-columns:repeat(18,minmax(0,1fr));gap:2px;min-width:612px;display:grid;container-type:inline-size}:is(.pa,.periodic-scope) .pt-grp{height:16px;color:var(--soft);font-variant-numeric:tabular-nums;place-items:center;font-size:10px;font-weight:800;display:grid}:is(.pa,.periodic-scope) .pt-el,:is(.pa,.periodic-scope) .pt-gap{aspect-ratio:5/6;background:var(--pt-bg,var(--pt-metal));min-width:0;color:var(--ink);font:inherit;font-variant-numeric:tabular-nums;border:1.5px solid #22304d8c;border-radius:5px;grid-template-rows:auto 1fr auto;place-items:center;padding:2px 1px;line-height:1;display:grid;position:relative}:is(.pa,.periodic-scope) .pt-el{cursor:pointer}:is(.pa,.periodic-scope) .pt-el i{color:var(--soft);justify-self:start;padding-left:2px;font-size:clamp(7px,1.3cqw,11px);font-style:normal}:is(.pa,.periodic-scope) .pt-el b{font-size:clamp(12px,2.3cqw,19px);font-weight:800}:is(.pa,.periodic-scope) .pt-el span{white-space:nowrap;font-size:clamp(7px,1.3cqw,11px);font-weight:700}:is(.pa,.periodic-scope) .pt-el[aria-pressed=true]{box-shadow:inset 0 0 0 2.5px var(--ink);background-image:linear-gradient(#ffffff8c,#ffffff8c)}:is(.pa,.periodic-scope) .pt-el:hover{background-image:linear-gradient(#fff6,#fff6)}:is(.pa,.periodic-scope) :is(.pt-el,.pt-tile,.pt-key i,.pt-cat)[data-cat=metal]{--pt-bg:var(--pt-metal)}:is(.pa,.periodic-scope) :is(.pt-el,.pt-tile,.pt-key i,.pt-cat)[data-cat=nonmetal]{--pt-bg:var(--pt-nonmetal)}:is(.pa,.periodic-scope) :is(.pt-el,.pt-tile,.pt-key i,.pt-cat)[data-cat=metalloid]{--pt-bg:var(--pt-metalloid)}:is(.pa,.periodic-scope) :is(.pt-el,.pt-tile,.pt-key i,.pt-cat)[data-cat=unknown]{--pt-bg:var(--pt-unknown)}:is(.pa,.periodic-scope) :is(.pt-el,.pt-tile,.pt-key i)[data-cat=unknown]{border-style:dashed}:is(.pa,.periodic-scope) .pt-gap{color:var(--soft);background:0 0;border-style:dashed;border-color:#22304d59;place-items:center;font-size:clamp(7px,1.25cqw,10px);font-weight:700;display:grid}:is(.pa,.periodic-scope) .pt-card{border:1.5px dashed #22304d59;border-radius:12px;grid-area:2/3/5/13;align-items:stretch;gap:12px;min-height:0;margin:2px 6px;display:flex;overflow:hidden}:is(.pa,.periodic-scope) .pt-card:not([data-cat=none]){border:2px solid var(--ink);background:var(--card)}:is(.pa,.periodic-scope) .pt-pick{color:var(--mute);margin:auto;font-size:13px;font-weight:700}:is(.pa,.periodic-scope) .pt-tile{aspect-ratio:1;background:var(--pt-bg);border-right:2px solid var(--ink);flex:none;grid-template-rows:auto 1fr auto;place-items:center;height:100%;padding:6px 4px;line-height:1;display:grid}:is(.pa,.periodic-scope) .pt-tile i{justify-self:start;font-size:13px;font-style:normal;font-weight:700}:is(.pa,.periodic-scope) .pt-tile b{font-size:clamp(30px,6cqw,52px);font-weight:800}:is(.pa,.periodic-scope) .pt-tile span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:12px;font-weight:700;overflow:hidden}:is(.pa,.periodic-scope) .pt-facts{flex-direction:column;flex:1;justify-content:center;gap:4px;min-width:0;padding:4px 10px 4px 0;display:flex}:is(.pa,.periodic-scope) .pt-facts dl{margin:0}:is(.pa,.periodic-scope) .pt-facts dt{color:var(--soft);font-size:12px;font-weight:700}:is(.pa,.periodic-scope) .pt-facts dd{margin:0}:is(.pa,.periodic-scope) .pt-mass{font-variant-numeric:tabular-nums;font-size:clamp(22px,4cqw,34px);font-weight:800;line-height:1.05}:is(.pa,.periodic-scope) .pt-note{color:var(--soft);margin:0;font-size:11px}:is(.pa,.periodic-scope) .pt-name{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:is(.pa,.periodic-scope) .pt-chips{flex-wrap:wrap;gap:4px;margin:0;display:flex}:is(.pa,.periodic-scope) .pt-chips span{white-space:nowrap;border:1.5px solid #22304d80;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:800}:is(.pa,.periodic-scope) .pt-chips .pt-cat{background:var(--pt-bg)}:is(.pa,.periodic-scope) .pt-key{border-top:1.5px solid var(--line);flex-wrap:wrap;flex:none;gap:4px 14px;margin:0;padding:6px 12px 10px;font-size:12px;font-weight:700;list-style:none;display:flex}:is(.pa,.periodic-scope) .pt-key li{align-items:center;gap:6px;display:inline-flex}:is(.pa,.periodic-scope) .pt-key i{background:var(--pt-bg);border:1.5px solid #22304d8c;border-radius:4px;width:16px;height:16px}:is(.pa,.periodic-scope) .pt-card.is-top{flex:none;grid-area:auto;height:96px;margin:8px 10px 0}:is(.pa,.periodic-scope) .pt-card.is-top:empty{display:none}:is(.pa,.periodic-scope) .pt-card.is-top .pt-tile b{font-size:26px}:is(.pa,.periodic-scope) .pt-card.is-top .pt-tile span{font-size:10px}:is(.pa,.periodic-scope) .pt-card.is-top .pt-mass{font-size:22px}@media (max-width:640px){:is(.pa,.periodic-scope) .pt{border-radius:14px;top:56px;left:8px}:is(.pa,.periodic-scope) .pt-tag{display:none}:is(.pa,.periodic-scope) .pt-card{gap:8px}:is(.pa,.periodic-scope) .pt-tile b{font-size:28px}:is(.pa,.periodic-scope) .pt-mass{font-size:22px}}@media (prefers-reduced-motion:no-preference){:is(.pa,.periodic-scope) .pt:not([hidden]){animation:.14s ease-out pt-in}}@keyframes pt-in{0%{opacity:0;transform:translateY(6px)}}.periodic-scope .pt.pt-inline{z-index:auto;width:100%;max-height:none;position:relative;inset:auto}.periodic-scope .pt-inline .pt-bar{padding:12px 16px}.periodic-scope .pt-inline .pt-title{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.periodic-scope .pt-inline .pt-body{flex:none}
