:root{color:#172033;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--page:#f7f8fc;--surface:#fff;--surface-raised:#fff;--text:#172033;--muted:#5f6879;--border:#dfe3eb;--border-strong:#b9c1cf;--accent:#6552b8;--accent-soft:#6552b82e;--input-bg:#fff;--countdown-purple:#5a2583;--countdown-yellow:#ffe25c;--danger:#a72536;--danger-soft:#ffe9ec;--success-soft:#e2f7eb;--shadow-md:0 18px 50px #272d411a;--shadow-lg:0 28px 70px #272d412e;background:#f7f8fc;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}:root[data-theme=dark]{color:#f4f6fb;--page:#11141c;--surface:#191e29;--surface-raised:#202633;--text:#f4f6fb;--muted:#b2bac9;--border:#303848;--border-strong:#566176;--accent:#b8a7ff;--accent-soft:#b8a7ff2e;--input-bg:#121722;--danger:#ff9aa7;--danger-soft:#3d2027;--success-soft:#173a2a;--shadow-md:0 18px 50px #00000047;--shadow-lg:0 28px 70px #0006;background:#11141c}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:4.5rem}body{background:var(--page);min-width:320px;min-height:100vh;color:var(--text);margin:0}button,input{font:inherit}button,a{color:inherit}.countdown{flex-wrap:wrap;gap:.75rem;margin:1.75rem 0;display:flex}.countdown-unit{border:2px solid var(--countdown-yellow);background:var(--countdown-purple);min-width:5.25rem;color:var(--countdown-yellow);text-align:center;border-radius:1rem;padding:.8rem 1rem;box-shadow:0 12px 30px #461c6e2e}.countdown-unit strong{font-variant-numeric:tabular-nums;font-size:clamp(1.4rem,3vw,2rem);line-height:1;display:block}.countdown-unit span{letter-spacing:.12em;text-transform:uppercase;margin-top:.35rem;font-size:.7rem;font-weight:800;display:block}:root{--pt-gap:5px;--pt-radius:.55rem;--pt-cell-text:#172033;--pt-assigned-bg:#aeb4bd;--pt-focus:#6552b8;--fam-alkali:#f4d2d4;--fam-alkaline:#cbf6f8;--fam-transition:#cbd5f8;--fam-post:#f7f7be;--fam-metalloid:#c6f4d4;--fam-nonmetal:#bcf975;--fam-halogen:#f0d875;--fam-noble:#f6add5;--fam-lanthanide:#a3d2f1;--fam-actinide:#f8bf8a}.periodic-wrapper{width:100%;max-width:1500px;margin:0 auto}.periodic-scroll-region{border-radius:1rem;width:100%;padding:.25rem .25rem 1.25rem;overflow-x:auto}.periodic-scroll-region:focus-visible{outline:3px solid var(--accent-soft)}.periodic-canvas{min-width:1060px}.periodic-group-labels{gap:var(--pt-gap);color:var(--muted);grid-template-columns:repeat(18,minmax(52px,1fr));margin-bottom:.45rem;font-size:.7rem;font-weight:750;display:grid}.periodic-group-labels span{text-align:center}.periodic-grid{gap:var(--pt-gap);grid-template-rows:repeat(9,64px);grid-template-columns:repeat(18,minmax(52px,1fr));display:grid}.cell{border-radius:var(--pt-radius);min-width:0;color:var(--pt-cell-text);-webkit-user-select:none;user-select:none;border:1px solid #17203329;grid-template-rows:auto 1fr auto;padding:.4rem .5rem;transition:transform .15s,box-shadow .15s,filter .15s;display:grid;position:relative;overflow:hidden}.cell.clickable{cursor:pointer}.cell.clickable:hover{z-index:2;transform:translateY(-3px)scale(1.04);box-shadow:0 10px 22px #141d312e}.cell:focus-visible{z-index:3;outline:3px solid var(--pt-focus);outline-offset:2px}.cell.family-alkali{background:var(--fam-alkali)}.cell.family-alkaline{background:var(--fam-alkaline)}.cell.family-transition{background:var(--fam-transition)}.cell.family-post-transition{background:var(--fam-post)}.cell.family-metalloid{background:var(--fam-metalloid)}.cell.family-nonmetal{background:var(--fam-nonmetal)}.cell.family-halogen{background:var(--fam-halogen)}.cell.family-noble{background:var(--fam-noble)}.cell.family-lanthanide{background:var(--fam-lanthanide)}.cell.family-actinide{background:var(--fam-actinide)}.cell.assigned{color:#4c5360;filter:grayscale(.75);background:var(--pt-assigned-bg)!important}.cell.assigned:after{content:"";pointer-events:none;background:linear-gradient(to bottom right,#0000 48.5%,#484e5980 49% 51%,#0000 51.5%);position:absolute;inset:0}.number{font-size:.68rem;font-weight:700}.symbol{place-self:center;font-size:1.2rem;line-height:1}.name{text-overflow:ellipsis;white-space:nowrap;font-size:.58rem;font-weight:650;overflow:hidden}.row-label{color:var(--muted);align-items:center;gap:.3rem;padding-left:.25rem;font-size:.72rem;font-weight:700;display:flex}.spacer{opacity:0}.periodic-key{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:1.2rem;margin-bottom:1.5rem;font-size:.82rem;font-weight:750;display:flex}.periodic-key-item{align-items:center;gap:.45rem;display:flex}.key-swatch{border:1px solid #1720332e;border-radius:.28rem;width:1rem;height:1rem}.available-swatch{background:var(--fam-nonmetal)}.assigned-swatch{background:var(--pt-assigned-bg)}:root[data-theme=dark] .cell.assigned{color:#2f3540}.claim-layout{grid-template-columns:minmax(180px,.65fr) minmax(0,1.35fr);align-items:center;gap:clamp(2rem,6vw,5rem);max-width:900px;margin:0 auto;display:grid}.selected-element{aspect-ratio:1;background:var(--accent);color:#fff;border:1px solid var(--accent);box-shadow:var(--shadow-lg);border-radius:1rem;grid-template-rows:auto 1fr auto;padding:1.25rem;display:grid}.selected-element strong{place-self:center;font-size:clamp(4rem,10vw,7rem);line-height:1}.selected-element span:last-child{font-weight:800}.claim-form{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-md);border-radius:1.5rem;padding:clamp(1.5rem,4vw,2.5rem)}.claim-form h2{margin:.25rem 0 .75rem}.claim-form>p{color:var(--muted)}.claim-form label{gap:.45rem;margin-top:1.15rem;font-weight:750;display:grid}.claim-form input{box-sizing:border-box;border:1px solid var(--border-strong);background:var(--input-bg);width:100%;color:var(--text);font:inherit;border-radius:.75rem;padding:.8rem .9rem}.claim-form input:focus{border-color:var(--accent);outline:3px solid var(--accent-soft)}.claim-form input[aria-invalid=true]{border-color:var(--danger)}.field-error{color:var(--danger);font-size:.82rem;font-weight:650}.form-actions{flex-wrap:wrap;justify-content:flex-end;gap:.75rem;margin-top:1.5rem;display:flex}.form-message{border-radius:.85rem;margin-top:1.25rem;padding:1rem}.form-message.error{background:var(--danger-soft);color:var(--danger)}.form-message.success{background:var(--success-soft);color:var(--text)}@media (width<=680px){.claim-layout{grid-template-columns:1fr}.selected-element{justify-self:center;width:min(70vw,250px)}}#root{min-height:100vh}.app-shell{background:var(--page);min-height:100vh}.site-nav{z-index:100;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--page) 88%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);justify-content:space-between;align-items:center;gap:1rem;min-height:3.6rem;padding:.55rem clamp(1rem,4vw,3rem);display:flex;position:sticky;top:0}.brand-button,.nav-link,.theme-toggle{cursor:pointer;background:0 0;border:0}.brand-button{align-items:center;gap:.65rem;font-weight:850;display:flex}.brand-mark{aspect-ratio:1;background:var(--countdown-purple);width:2rem;color:var(--countdown-yellow);border-radius:.55rem;place-items:center;font-size:.72rem;display:grid}.nav-actions{align-items:center;gap:.35rem;display:flex}.nav-link,.theme-toggle{border-radius:.65rem;padding:.55rem .75rem;font-weight:700}.nav-link:hover,.theme-toggle:hover{background:var(--accent-soft)}.theme-toggle{align-items:center;gap:.4rem;display:flex}.hero-section{grid-template-columns:minmax(0,1fr) minmax(350px,.9fr);align-items:center;gap:clamp(2rem,7vw,7rem);max-width:1500px;min-height:calc(100vh - 3.6rem);margin:0 auto;padding:clamp(3rem,8vw,7rem) clamp(1.25rem,5vw,5rem);display:grid}.eyebrow{color:var(--accent);letter-spacing:.15em;text-transform:uppercase;margin:0;font-size:.76rem;font-weight:900}h1,h2,h3,p{overflow-wrap:break-word}h1{letter-spacing:-.055em;max-width:780px;margin:.6rem 0 1rem;font-size:clamp(3rem,8vw,6.8rem);line-height:.94}h2{letter-spacing:-.04em;font-size:clamp(2rem,5vw,3.6rem);line-height:1}.hero-intro{max-width:650px;color:var(--muted);font-size:clamp(1.05rem,2vw,1.3rem)}.primary-button,.secondary-button{cursor:pointer;border-radius:.8rem;padding:.8rem 1rem;font-weight:850}.primary-button{border:1px solid var(--accent);background:var(--accent);color:var(--page)}:root[data-theme=dark] .primary-button{color:#15121d}.primary-button:hover{transform:translateY(-1px)}.primary-button:disabled{cursor:wait;opacity:.7}.secondary-button{border:1px solid var(--border-strong);color:var(--text);background:0 0}.hero-banner{border:1px solid var(--border);background:var(--surface);min-height:0;box-shadow:var(--shadow-lg);border-radius:2rem;position:relative;overflow:hidden}.hero-banner img{width:100%;height:auto;display:block}.table-section,.claim-section{padding:clamp(4rem,9vw,8rem) clamp(1rem,4vw,4rem)}.table-section{border-top:1px solid var(--border);background:var(--surface)}.claim-section{border-top:1px solid var(--border)}.section-heading{text-align:center;max-width:760px;margin:0 auto 2.5rem}.section-heading h2{margin:.45rem 0 1rem}.section-heading p:last-child,.status-message{color:var(--muted)}.status-message{text-align:center}.site-footer{border-top:1px solid var(--border);color:var(--muted);justify-content:space-between;gap:1rem;padding:2rem clamp(1rem,4vw,4rem);font-size:.85rem;display:flex}@media (width<=900px){.hero-section{grid-template-columns:1fr;min-height:auto}.hero-banner{max-height:650px}}@media (width<=620px){.nav-link,.theme-label{display:none}.hero-section{padding-top:3rem}.hero-banner{border-radius:1.25rem}.site-footer{flex-direction:column}}