@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--paper:#f7f6f2;--white:#fffefb;--ink:#252e2d;--muted:#717973;--line:#dedfd6;--accent:#de654b;--accent-soft:#f6e4dc;--serif:Georgia,'Times New Roman',serif;--radius:16px;--font:'DM Sans',system-ui,sans-serif;color:var(--ink);font-family:var(--font);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.42}button{border:0}a{color:inherit;text-underline-offset:4px}a:hover{color:var(--accent)}input,select{border:1px solid var(--line);border-radius:8px;background:var(--white);padding:10px 12px;max-width:100%}select{cursor:pointer}input:focus,select:focus{outline:2px solid var(--accent);outline-offset:2px}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip{position:fixed;left:16px;top:-90px;background:white;padding:14px;z-index:99}.skip:focus{top:10px}.header{display:flex;align-items:center;gap:40px;max-width:1700px;margin:auto;padding:25px 38px;border-bottom:1px solid var(--line)}.brand{font-family:'Manrope',var(--font);font-weight:800;font-size:27px;letter-spacing:-1.3px;display:flex;align-items:center;text-decoration:none;white-space:nowrap}.brand-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--ink);color:var(--paper);border-radius:10px;font-family:var(--serif);font-size:31px;line-height:1;margin-right:10px;font-weight:400}.brand-icon span{position:absolute;right:4px;top:0;color:#e89674}.brand-dot,.coral{color:var(--accent)}.nav{display:flex;gap:6px;flex:1}.nav-item{background:none;padding:10px 13px;border-radius:8px;color:var(--muted);font-size:14px;font-weight:600;white-space:nowrap}.nav-item.active{background:#e9ebe2;color:var(--ink)}.nav-item:hover{background:#eeeee7}.nav-icon{margin-right:7px}.global-controls{display:flex;gap:8px}.global-controls select{background:transparent;font-size:12px;padding:9px 7px;max-width:195px}main{max-width:1700px;margin:auto;padding:0 38px 60px}h1,h2,h3,p{margin-top:0}h1{font-family:'Manrope',var(--font);font-size:clamp(36px,4vw,58px);line-height:1.13;letter-spacing:-2.5px;font-weight:600;margin-bottom:20px}h1 em{font-family:var(--serif);color:var(--accent);font-weight:400;letter-spacing:-1.6px}h2{font-family:'Manrope',var(--font);font-weight:600;font-size:24px;letter-spacing:-.7px}h3{font-size:17px}p{line-height:1.65}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.7px;line-height:1.4;color:var(--muted)}.hero{display:flex;justify-content:space-between;align-items:center;gap:50px;padding:54px 0 44px}.hero-copy{max-width:760px}.hero .eyebrow{display:flex;gap:9px;align-items:center;margin-bottom:18px}.hero .eyebrow>span{height:6px;width:6px;background:var(--accent);border-radius:50%}.intro{max-width:540px;color:var(--muted);font-size:15px;margin-bottom:23px}.hero-actions{display:flex;gap:14px;align-items:center}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:12px 18px;border-radius:8px;font-size:13px;font-weight:600;text-decoration:none;min-height:43px}.button:hover{filter:brightness(.96)}.primary{background:var(--accent);color:white}.subtle{background:#eeeee6;border:1px solid var(--line)}.text-button{background:none}.wide{display:flex;width:100%;margin-top:10px}.path-card{padding:22px 25px;min-width:310px;width:350px;border:1px solid var(--line);background:#efefe7;border-radius:var(--radius)}.path-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.path-head .eyebrow{margin:0}.level-badge{border:1px solid #bcc2b4;border-radius:50%;height:33px;width:33px;display:inline-flex;align-items:center;justify-content:center;font-size:11px}.path-card h2{font-size:19px;margin-bottom:4px}.path-card p{font-size:12px;color:var(--muted);margin-bottom:18px}.mini-elements{display:flex;align-items:center;gap:6px}.mini-elements button{width:32px;height:36px;background:var(--tile);border-radius:5px;font-weight:700;font-size:13px;border:1px solid #00000009}.mini-elements>span{font-size:10px;margin-left:4px;color:var(--muted)}.progress-track{height:4px;background:#daddd1;border-radius:3px;overflow:hidden;margin-top:23px}.progress-track i{display:block;height:100%;background:var(--accent);transition:width .3s}.path-bottom{display:flex;justify-content:space-between;margin-top:11px;font-size:10px}.inline-link{background:transparent;padding:0;border:0;text-decoration:underline;text-underline-offset:4px;font-size:inherit}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 22px}.section-heading .eyebrow{margin-bottom:8px}.section-heading h2{font-size:27px;margin-bottom:5px}.section-heading p{font-size:12px;color:var(--muted);margin:0}.search-box{display:flex;align-items:center;border:1px solid var(--line);border-radius:9px;background:var(--white);padding:0 13px;min-width:270px}.search-box>span{font-size:22px;color:var(--muted)}.search-box input{width:100%;border:0;background:transparent;padding:12px 8px;font-size:12px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:18px;align-items:start}.table-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:19px 17px 0;min-width:0}.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;font-size:10px}.table-toolbar>label{display:flex;align-items:center;gap:9px;white-space:nowrap}.table-toolbar select{font-size:11px;padding:7px}.toggles{display:flex;align-items:center;gap:13px}.toggles label{display:flex;align-items:center;gap:5px;line-height:1.2}.toggles input{appearance:none;width:25px;height:14px;padding:0;border-radius:9px;background:#d9dcd2;position:relative;flex-shrink:0}.toggles input:checked{background:var(--ink)}.toggles input:before{content:'';position:absolute;width:10px;height:10px;border-radius:50%;background:white;top:1px;left:1px;transition:transform .2s}.toggles input:checked:before{transform:translateX(11px)}.periodic-scroll{overflow-x:auto;padding:3px 3px 14px;scrollbar-width:thin}.periodic-grid{display:grid;grid-template-columns:14px repeat(18,minmax(34px,1fr));grid-template-rows:16px repeat(7,minmax(55px,1fr)) 12px repeat(2,minmax(55px,1fr));gap:4px;min-width:750px;position:relative}.group-number,.period-number{font-size:9px;color:var(--muted);align-self:center;text-align:center}.element{background:var(--tile);padding:4px 3px 5px;min-width:0;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;border:1px solid #00000008;transition:transform .14s,opacity .15s,box-shadow .15s;overflow:visible}.element:hover{transform:translateY(-3px);z-index:2;box-shadow:0 5px 15px #26312c25}.element.selected{outline:2px solid var(--ink);outline-offset:2px;z-index:3}.element.out-level{opacity:.48}.element.out-level:hover,.element.out-level.selected{opacity:1}.element.filtered{opacity:.1!important}.element.filtered:hover{opacity:.7!important}.tile-top{display:flex;justify-content:space-between;width:100%;font-size:8px;line-height:1;margin-bottom:3px;opacity:.8}.tile-top>span:last-child{font-size:8px}.element strong{font-family:'Manrope',var(--font);font-size:20px;font-weight:700;line-height:1.15;letter-spacing:-.4px}.element-name{font-size:7px;line-height:1.3;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;margin-top:4px}.table-key{grid-column:5 / 8;grid-row:2 / 4;border:1px solid var(--line);border-radius:8px;width:90px;align-self:center;justify-self:start;margin-left:16px;padding:9px 12px;display:flex;flex-direction:column;position:relative}.table-key>strong{font-size:34px;line-height:1.1}.table-key>span{font-size:10px}.table-key>span.key-number{font-size:11px;margin-bottom:4px}.table-key>div{position:absolute;left:100px;top:9px;display:flex;flex-direction:column;gap:14px;white-space:nowrap;font-size:9px;color:var(--muted)}.table-key b{font-weight:400}.block-placeholder{border:1px dashed #c5c5b8;display:flex;justify-content:center;align-items:center;text-align:center;border-radius:5px;font-size:10px;line-height:1.7;color:var(--muted)}.fblock-label{font-size:10px;align-self:center;color:var(--muted);padding-left:3px}.legend{display:flex;gap:7px 13px;flex-wrap:wrap;padding-top:10px;margin-top:2px}.legend-item{display:flex;align-items:center;gap:6px;font-size:9px;white-space:nowrap;border:0;background:none;padding:3px 0;color:var(--muted)}button.legend-item:hover,button.legend-item.selected{color:var(--ink);text-decoration:underline;text-underline-offset:3px}.legend-item i{display:inline-block;width:9px;height:9px;border-radius:2px;flex-shrink:0}.legend-item i.electro-gradient{background:linear-gradient(90deg,hsl(190 35% 86%),hsl(280 35% 60%));width:200px;height:12px}.micro-note{font-size:10px;line-height:1.6;color:var(--muted);margin:13px 0}.table-foot{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);margin-top:16px;padding:12px 0;font-size:9px;color:var(--muted)}.family-explainer{display:flex;align-items:center;gap:12px;background:#f3f3ed;border:1px solid var(--line);border-radius:8px;padding:12px;font-size:11px;line-height:1.5;margin-top:10px}.family-explainer b{white-space:nowrap}.family-explainer button{margin-left:auto;background:transparent;font-size:21px}.element-panel{background:#eeeFE7;border:1px solid var(--line);border-radius:var(--radius);padding:20px;overflow:hidden}.element-heading{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-bottom:19px}.element-heading .eyebrow{font-size:8px}.pill{font-size:9px;border-radius:5px;padding:4px 7px;display:inline-flex;align-items:center;background:#e8eae0}.element-identity{display:flex;gap:13px;align-items:center}.big-symbol{position:relative;min-width:61px;height:71px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:600;padding-top:10px}.big-symbol small{position:absolute;top:6px;left:8px;font-size:10px;font-weight:400}.element-identity h2{font-size:25px;margin:0 0 3px;overflow-wrap:anywhere}.element-identity p{font-size:9px;color:var(--muted);margin:0 0 5px}.state-badge,.radio-badge{font-size:9px;display:inline-block;margin:2px 6px 0 0}.radio-badge{color:#8c4735}.preview-atom{text-align:center;margin:10px 0 0}.atom{max-width:100%;display:inline-block}.stat-list{margin:0}.stat-list>div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #d5d9ce}.stat-list dt{font-size:11px;color:var(--muted)}.stat-list dd{font-size:12px;margin:0;font-weight:600;text-align:right;max-width:60%}.element-summary{font-size:11px;line-height:1.65;margin:15px 0 17px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.element-panel .button{font-size:11px}.source-link{text-align:center;font-size:10px;margin:16px 0 0}.page-intro{padding:48px 0 30px;max-width:850px}.page-intro h1{font-size:43px;margin:16px 0 16px}.page-intro>p:last-child{color:var(--muted);font-size:14px}.learning-grid{display:grid;grid-template-columns:265px minmax(0,1fr);gap:35px;max-width:1220px}.learning-sidebar{background:#efefe7;border:1px solid var(--line);padding:23px;border-radius:var(--radius);align-self:start;position:sticky;top:15px}.learning-sidebar>label{font-size:11px;color:var(--muted);display:block;margin-bottom:8px}.learning-sidebar>select{width:100%;font-size:12px}.learning-symbol{display:flex;flex-direction:column;align-items:center;background:var(--tile);padding:24px 15px;border-radius:10px;margin-top:18px;position:relative}.learning-symbol>small{position:absolute;top:12px;left:14px;font-size:13px}.learning-symbol>strong{font-family:'Manrope',var(--font);font-size:72px;line-height:1.3;font-weight:600}.learning-symbol>h2{font-size:22px;margin-bottom:6px}.learning-symbol>span{font-size:10px}.lesson-steps{display:flex;flex-direction:column;gap:5px;margin:22px -9px}.lesson-steps button{display:flex;align-items:center;gap:10px;text-align:left;padding:10px 9px;background:transparent;border-radius:7px;font-size:11px;color:var(--muted)}.lesson-steps button.current{color:var(--ink);background:#dfe3d7;font-weight:600}.lesson-steps button b{margin-left:auto;font-weight:400}.lesson-steps button span{font-size:9px}.lesson-bar{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-bottom:20px;color:var(--muted)}.segmented{display:flex;background:#e9ebe3;border:1px solid var(--line);padding:4px;border-radius:9px}.segmented button{background:none;padding:8px 12px;border-radius:6px;font-size:11px}.segmented button.active{background:var(--white);box-shadow:0 2px 4px #00000008;color:var(--ink)}.lesson-card{padding:32px 35px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:18px;min-height:280px}.lesson-card h2{font-size:31px;margin-bottom:23px}.lesson-card h3{margin-top:26px}.lesson-card>p{font-size:14px;line-height:1.8}.lesson-card .stat-list{max-width:620px}.lesson-card .stat-list dt,.lesson-card .stat-list dd{font-size:13px}.photo{margin:27px 0 0;background:#f3f3ee;border-radius:12px;overflow:hidden;border:1px solid var(--line)}.photo img{display:block;width:100%;height:290px;object-fit:contain;background:#eaeae3}.photo figcaption{padding:12px 15px;font-size:11px;line-height:1.6}.photo figcaption small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.no-photo{border:1px dashed #d8dacc;border-radius:10px;padding:20px;text-align:center;color:var(--muted);font-size:11px;margin:20px 0 0}.no-photo>span{font-size:27px}.no-photo p{margin:8px 0}.lesson-nav{display:flex;justify-content:space-between}.lesson-source{display:flex;justify-content:space-between;gap:20px;margin-top:23px;font-size:12px}.atom-stage{display:flex;justify-content:center;background:radial-gradient(ellipse,#f2f0e6 10%,transparent 65%);margin:-10px 0 0}.particles{display:flex;gap:14px;justify-content:center;margin:0 auto 20px;max-width:540px}.particles>span{display:flex;flex-direction:column;align-items:center;flex:1;background:#f0f2ea;border-radius:10px;padding:16px 10px;font-size:12px;position:relative}.particles b{font-size:28px;margin-bottom:5px}.particles i{position:absolute;right:8px;top:8px;font-style:normal;font-size:10px;color:var(--muted)}.config{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--line);font-size:13px}.config code{font-size:15px;overflow-wrap:anywhere}.config span{color:var(--muted)}.concept-strip{margin-top:45px}.concept-strip h2{font-size:21px}.mini-concepts{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:18px 0}.mini-concepts article{border-top:2px solid #ced3c7;padding:18px 5px}.concept-icon{display:inline-flex;align-items:center;justify-content:center;width:31px;height:31px;border:1px solid var(--line);border-radius:50%;font-family:var(--serif);font-style:italic;font-size:14px;color:var(--accent);margin-bottom:12px}.mini-concepts h3{font-size:14px}.mini-concepts p{font-size:11px;color:var(--muted)}.concept-strip>.inline-link{font-size:12px}.glossary-tools{display:flex;align-items:center;justify-content:space-between;margin:0 0 25px;font-size:12px}.concept-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.concept-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);padding:26px;display:flex;flex-direction:column}.concept-card[hidden]{display:none}.concept-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.concept-icon{margin-bottom:0}.concept-top .pill{font-size:8px}.concept-card h2{font-size:23px}.concept-card>p{font-size:13px;color:#57615a;flex:1}.example{border-left:2px solid #b4c6b3;padding:6px 0 6px 13px;margin:10px 0 22px}.example>span{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.example p{font-size:12px;margin:7px 0 0}.concept-card>a{font-size:10px;color:var(--muted)}.source-method{display:flex;gap:23px;padding:27px;background:#e9ede2;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:38px}.source-method>.concept-icon{flex-shrink:0}.source-method h2{font-size:21px}.source-method p{font-size:13px;margin-bottom:8px;max-width:1050px}.curriculum-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.curriculum-card{padding:25px;border:1px solid var(--line);background:var(--white);border-radius:var(--radius)}.curriculum-card h2{font-size:23px;margin:16px 0}.curriculum-card p,.curriculum-card li{font-size:12px;line-height:1.7}.curriculum-card ul{padding-left:17px}.curriculum-card li{margin-bottom:10px}.symbol-list{display:flex;flex-wrap:wrap;gap:5px}.symbol-list span{padding:4px;background:#e7ebe0;border-radius:3px;font-size:10px}.sources-list{margin-top:40px;padding:28px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow-wrap:anywhere}.sources-list h3{font-size:14px}.sources-list p{font-size:12px}.source-entry{border-top:1px solid var(--line);padding:15px 0 0;margin-top:15px;font-size:12px}.source-entry .source-entry{margin-left:15px}.local-data{margin-top:35px}.local-data h2{font-size:17px}.footer{max-width:1624px;margin:0 auto;padding:28px 0;border-top:1px solid var(--line);display:flex;align-items:center;gap:25px;font-size:11px;color:var(--muted)}.footer .brand{font-size:22px;color:var(--ink)}.footer>.inline-link{margin-left:auto}.footer-local{font-size:9px;max-width:210px}.loading,.error-state{max-width:750px;margin:120px auto;text-align:center}.loading{font-size:42px;font-weight:700}.loading span{color:var(--accent)}.muted{color:var(--muted)}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 320px;gap:23px}.element-panel{padding:24px}.periodic-grid{grid-template-rows:16px repeat(7,65px) 12px repeat(2,65px)}.element strong{font-size:24px}.element-name{font-size:8px}.table-panel{padding:22px 22px 0}.table-toolbar{font-size:11px}.legend-item{font-size:10px}.hero{padding-top:60px;padding-bottom:50px}.preview-atom{margin:15px 0}.element-summary{font-size:12px}}
@media(max-width:1250px){.header{gap:18px;padding:20px 24px}.nav-item{font-size:12px;padding:9px}.global-controls{gap:5px}.global-controls select{font-size:11px;max-width:158px}.nav-icon{display:none}main{padding-left:24px;padding-right:24px}.workspace{grid-template-columns:minmax(0,1fr) 260px}.table-toolbar{flex-wrap:wrap}.table-panel{padding-left:12px;padding-right:12px}.element-panel{padding:17px}.hero{padding-top:42px;gap:25px}.path-card{min-width:280px;width:310px}.footer{margin:0 24px}.concept-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1000px){.header{flex-wrap:wrap;gap:15px}.brand{font-size:25px}.nav{order:3;flex-basis:100%;justify-content:center}.nav-item{flex:1;font-size:13px}.nav-icon{display:inline}.global-controls{margin-left:auto}.workspace{grid-template-columns:1fr}.element-panel{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}.element-panel .element-heading{grid-column:1/-1;margin-bottom:12px}.element-panel .preview-atom{grid-column:2;grid-row:2/5;margin:0}.element-panel .stat-list{grid-column:1}.element-panel .element-summary{grid-column:1}.element-panel .source-link{grid-column:1/-1}.hero{padding-top:30px}.hero h1{font-size:43px}.hero .intro{font-size:13px}.path-card{min-width:260px;max-width:290px;padding:20px}.path-card h2{font-size:16px}.table-toolbar{flex-wrap:nowrap}.learning-grid{grid-template-columns:230px minmax(0,1fr);gap:22px}.lesson-card{padding:25px}.mini-concepts{grid-template-columns:1fr}.mini-concepts article{padding:15px 0}.mini-concepts article>.concept-icon{float:left;margin-right:12px}.mini-concepts p{margin-bottom:0}.curriculum-grid{grid-template-columns:1fr}.curriculum-card .symbol-list{max-width:700px}.footer-local{display:none}}
@media(max-width:700px){.header{padding:16px;gap:13px}.brand{font-size:23px}.brand-icon{width:30px;height:30px;font-size:27px;margin-right:7px}.global-controls select{max-width:140px;font-size:10px;padding:7px 4px}.global-controls select:first-of-type{max-width:92px}.nav{gap:2px;overflow-x:auto}.nav-item{font-size:11px;padding:9px 5px;white-space:nowrap}.nav-icon{margin-right:4px}.hero{display:block;padding:29px 0 30px}.hero h1{font-size:39px;letter-spacing:-1.8px}.hero .eyebrow{font-size:8px}.hero .intro{font-size:13px}.hero-actions{gap:6px}.hero-actions .button{font-size:11px;padding:11px 12px}.path-card{display:none}main{padding:0 16px 35px}.section-heading{align-items:stretch;flex-direction:column;gap:15px}.section-heading h2{font-size:24px}.section-heading .eyebrow{font-size:8px}.search-box{min-width:0;width:100%}.section-heading p{font-size:11px}.table-toolbar{align-items:flex-start;flex-direction:column;margin-bottom:15px;gap:13px}.toggles{gap:20px}.table-panel{padding:14px 9px 0;border-radius:12px}.periodic-grid{min-width:740px}.table-key{margin-left:6px}.element-panel{border-radius:12px;padding:18px;column-gap:14px}.element-identity h2{font-size:23px}.element-identity{gap:10px}.big-symbol{min-width:50px;height:62px;font-size:29px}.element-panel .element-summary{grid-column:1/-1}.element-panel .button{font-size:10px;padding:10px 8px}.preview-atom .atom{width:140px}.stat-list dt{font-size:10px}.stat-list dd{font-size:11px}.element-panel .stat-list{grid-column:1/-1}.element-panel .preview-atom{grid-row:2;grid-column:2}.element-panel .element-identity{grid-column:1;grid-row:2}.family-explainer{flex-wrap:wrap;font-size:10px}.family-explainer span{flex-basis:100%;order:3}.family-explainer button{margin-left:auto}.page-intro{padding:29px 0 20px}.page-intro h1{font-size:33px;letter-spacing:-1.4px}.page-intro>p:last-child{font-size:12px}.learning-grid{display:flex;flex-direction:column;gap:20px}.learning-sidebar{position:static;width:100%;padding:15px;display:grid;grid-template-columns:100px 1fr;column-gap:15px}.learning-sidebar>label{grid-column:2;font-size:10px}.learning-sidebar>select{grid-column:2}.learning-symbol{grid-column:1;grid-row:1/5;margin:0;padding:8px}.learning-symbol>strong{font-size:43px;margin-top:8px}.learning-symbol>h2{font-size:16px}.learning-symbol>span{font-size:8px;text-align:center}.learning-symbol>small{top:4px;left:6px;font-size:10px}.lesson-steps{grid-column:1/-1;display:none}.learning-sidebar .button{grid-column:2;font-size:11px;padding:9px;min-height:35px}.learning-sidebar .micro-note{grid-column:2;margin:8px 0 0;font-size:9px}.learning-main{min-width:0;width:100%}.lesson-bar{font-size:10px;margin-bottom:13px}.segmented button{padding:7px 9px;font-size:10px}.lesson-card{padding:21px;border-radius:12px;min-height:230px}.lesson-card h2{font-size:26px}.lesson-card>p{font-size:13px}.lesson-card .stat-list dt,.lesson-card .stat-list dd{font-size:11px}.photo img{height:230px}.lesson-source{font-size:11px}.config{font-size:11px}.config code{font-size:12px;max-width:55%}.particles{gap:8px}.particles>span{font-size:10px;padding:14px 7px}.concept-grid{grid-template-columns:1fr;gap:14px}.concept-card{padding:22px}.glossary-tools{gap:20px}.glossary-tools>span{white-space:nowrap;font-size:10px}.source-method{padding:20px;gap:15px}.source-method p{font-size:12px}.sources-list{padding:20px}.footer{margin:0 16px;gap:13px;flex-wrap:wrap;padding:22px 0}.footer>.brand{font-size:20px}.footer>span{font-size:9px}.footer>.inline-link{font-size:10px}.error-state{padding:20px}h1{overflow-wrap:break-word}}
.group-number{background:transparent;padding:0;border-radius:3px}.group-number:hover,.group-number.active{background:var(--ink);color:var(--white)}.no-results{padding:14px;background:var(--accent-soft);border-radius:8px;font-size:12px;margin:8px 0}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
/* Compact page headers and the lesson layout. */
.page-intro.compact{padding:18px 0 12px}
.page-intro.compact .eyebrow{margin:0}
.learning-grid{grid-template-columns:240px minmax(0,1fr);gap:26px;max-width:1500px}
.learning-sidebar{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;padding:16px;scrollbar-width:thin}
.element-stepper{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.element-stepper .button{min-height:34px;padding:6px 8px;font-size:12px;gap:6px}
.lesson-steps{margin:14px -6px 10px;gap:2px}
.lesson-steps button{padding:8px 8px}
.learning-sidebar .micro-note{margin:10px 0 0}
.lesson-title{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:14px}
.lesson-title>div:first-child{flex:1;min-width:0}
.lesson-title h1{font-size:34px;letter-spacing:-1.2px;margin:0 0 4px;line-height:1.1}
.lesson-title p{margin:0 0 12px;font-size:12px;color:var(--muted)}
.lesson-title .lesson-bar{margin:0}
.title-symbol{min-width:88px;height:96px;font-size:40px;flex-direction:column;padding-top:8px;flex-shrink:0}
.title-symbol span{font-size:10px;font-weight:400;margin-top:2px}
.lesson-card{padding:22px 26px;min-height:0;margin-bottom:14px}
.lesson-card h2{font-size:22px;margin-bottom:14px}
.lesson-card>p{font-size:14px;line-height:1.7;max-width:900px}
.lesson-card .stat-list{max-width:760px}
.lesson-card h3{margin:20px 0 8px}
.stat-list dd{display:flex;align-items:center;justify-content:flex-end;gap:12px;max-width:70%}
.spark-wrap{display:inline-flex;color:var(--ink)}
.spark{display:block}
.photo img{height:240px}
.photo figcaption{position:relative;display:flex;align-items:center;gap:6px}
.photo figcaption .info{margin-left:auto}
.section-atom{float:right;width:240px;margin:4px 0 14px 24px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-align:center}
.section-atom-stage{padding:16px}
.section-atom-stage .atom{width:200px;height:200px;margin:0 auto}
.section-atom figcaption{padding:8px 10px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--line)}
@media(max-width:700px){.section-atom{float:none;width:100%;margin:0 0 14px}}
.overview-layout{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap}
.overview-text{flex:1;min-width:0}
.overview-layout .photo{flex:0 0 340px;margin:0}
.overview-layout .photo img{height:auto;max-height:280px;width:100%;object-fit:cover;border-radius:var(--radius)}
@media(max-width:700px){.overview-layout{flex-direction:column}.overview-layout .photo{flex:0 0 auto;width:100%;max-width:100%}}
.structure-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:center;margin-bottom:16px}
.atom-stage{margin:0}
.shell-ring{cursor:pointer}
.shell-ring:focus{outline:none}.shell-ring:focus-visible circle:first-child{stroke:var(--accent);stroke-opacity:1}
.shell-table{border-collapse:collapse;width:100%;font-size:13px}
.shell-table th,.shell-table td{padding:7px 10px;border-bottom:1px solid var(--line);text-align:left}
.shell-table thead th{font-size:11px;color:var(--muted);font-weight:600}
.shell-table tbody tr{cursor:pointer}
.shell-table tbody tr:hover{background:#f3f3ed}
.shell-table tbody tr.active{background:var(--accent-soft)}
.shell-table tbody th{font-family:'Manrope',var(--font)}
.shell-detail{margin-top:12px;padding:12px 14px;border-radius:10px;background:#f3f3ed;border:1px solid var(--line);font-size:13px}
.shell-detail h3{margin:0 0 6px;font-size:15px}
.shell-detail p{margin:4px 0}
.particles{margin-bottom:12px}
.particles>span{padding:10px}
.concept-strip{margin-top:30px}
@media(max-width:1000px){.structure-grid{grid-template-columns:1fr}.atom-stage{justify-content:center}}
@media(max-width:700px){.learning-sidebar{position:static;max-height:none;display:block}.lesson-steps{display:flex;flex-direction:row;flex-wrap:wrap}.lesson-title h1{font-size:26px}.title-symbol{min-width:64px;height:72px;font-size:28px}.lesson-card{padding:16px}.stat-list dd{max-width:65%}.spark{width:80px}}
.stat-list dd>span:last-child{min-width:104px;text-align:right}
@media(max-width:700px){.learning-sidebar .element-stepper .button{grid-column:auto;margin:0}.element-stepper{grid-template-columns:1fr 1fr}}
/* Tooltips, info icons and fact lists. */
.term{border-bottom:1.5px dotted #8c9a8f;cursor:help;text-decoration:none}
.term:hover,.term:focus{border-bottom-color:var(--accent);outline:none;color:var(--accent)}
.info{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid #b9bfb2;background:transparent;color:var(--muted);font:italic 600 11px/1 var(--serif);padding:0;vertical-align:middle;cursor:help;margin-left:4px}
.info:hover,.info:focus-visible{border-color:var(--accent);color:var(--accent)}
.tooltip{position:absolute;z-index:100;background:#26302d;color:#f7f6f2;font-size:12.5px;line-height:1.5;padding:10px 12px;border-radius:8px;box-shadow:0 6px 24px #0003;pointer-events:none}
.tooltip b{display:block;margin-bottom:3px;font-size:13px}
.facts{margin:0 0 12px;padding-left:20px;max-width:900px}
.facts li{font-size:14px;line-height:1.65;margin:5px 0}
.facts li::marker{color:var(--accent)}
.section-heading.compact{align-items:center;margin:16px 0 14px}
.section-heading.compact .eyebrow{margin:0}
.glossary-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.glossary-head .search-box{min-width:260px}
.concept-top h2{margin:0;font-size:21px}
.concept-definition{font-size:14px;font-weight:500;color:var(--ink)!important}
.concept-card .facts li{font-size:12.5px;line-height:1.55;margin:3px 0}
.mini-concepts .facts li{font-size:11.5px;color:var(--muted)}
.legend .info{margin-left:6px}
.concept-card>p.concept-definition{flex:none;margin-bottom:8px}.concept-card .example{margin-top:auto}
/* Larger reading text, full-width lines, illustrations beside the text. */
.lesson-card>p,.lesson-card .facts li{font-size:15.5px;line-height:1.7}
.lesson-card .facts,.lesson-card>p{max-width:none}
.lesson-card .stat-list dt,.lesson-card .stat-list dd{font-size:14px}
.lesson-card h2{font-size:24px}
.lesson-card h3{font-size:18px}
.stat-list dt{font-size:12.5px}.stat-list dd{font-size:13.5px}
.lesson-steps button{font-size:12.5px}
.concept-card .facts li,.mini-concepts .facts li{font-size:13px}
.mini-concepts p{font-size:12.5px}
.side-figure{float:right;width:300px;margin:4px 0 14px 24px;background:#f3f3ee;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.side-figure+.side-figure{clear:right}
.side-figure img{display:block;width:100%;height:auto;max-height:240px;object-fit:cover;background:#eaeae3}
.side-figure figcaption{padding:8px 10px;font-size:11.5px;line-height:1.45}
.side-figure figcaption small{display:block;color:var(--muted);font-size:9.5px;margin-top:3px;overflow-wrap:anywhere}
.lesson-card::after{content:'';display:block;clear:both}
.lesson-card .stat-list{overflow:hidden}
.person-link{white-space:nowrap}
@media(max-width:700px){.side-figure{float:none;width:100%;margin:0 0 14px}.lesson-card>p,.lesson-card .facts li{font-size:15px}.facts{padding-left:18px}}
/* Phone: compact lesson navigation above the content. */
@media(max-width:700px){
 .learning-sidebar{padding:10px 12px;display:grid;grid-template-columns:1fr auto auto;gap:6px;align-items:center}
 .learning-sidebar>label{display:none}
 .learning-sidebar>select{grid-column:1;font-size:13px;padding:8px}
 .learning-sidebar .element-stepper{display:contents}
 .learning-sidebar .element-stepper .button{min-height:36px;padding:6px 10px}
 .lesson-steps{grid-column:1/-1;flex-wrap:nowrap;overflow-x:auto;margin:4px 0 0;gap:4px;scrollbar-width:none}
 .lesson-steps button{flex-shrink:0;white-space:nowrap;padding:7px 10px;border:1px solid var(--line);background:var(--white)}
 .lesson-steps button span,.lesson-steps button b{display:none}
 .learning-sidebar #mark-known{grid-column:1/-1;margin:2px 0 0;min-height:34px;padding:6px}
 .lesson-title{margin-top:4px}
 .lesson-title .lesson-bar{flex-wrap:wrap;gap:8px}
 .concept-strip .mini-concepts{grid-template-columns:1fr}
}
@media(max-width:700px){.header{flex-wrap:wrap;row-gap:10px}.global-controls{margin-left:auto;flex-shrink:1;min-width:0}.global-controls select{max-width:118px}.global-controls select:first-of-type{max-width:78px}.brand{font-size:21px}.section-heading.compact{flex-direction:row;align-items:center}}
.section-heading.compact .eyebrow{white-space:nowrap}
.lesson-card .stat-list{margin-bottom:16px}
.table-wrap{overflow-x:auto;margin:6px 0 10px}
.iso-table{border-collapse:collapse;width:100%;font-size:14px}
.iso-table th,.iso-table td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.iso-table thead th{font-size:11.5px;color:var(--muted);font-weight:600}
.iso-table tbody th{font-family:'Manrope',var(--font);white-space:nowrap}
.iso-table tr.radio td:nth-child(3){color:#8c4735}

/* Mobile: fix discoverer names overlapping in History */
@media(max-width:700px){
.stat-list>div{flex-wrap:wrap}
.stat-list dt{min-width:45%;margin-bottom:2px}
.stat-list dd{max-width:100%!important;text-align:left;padding-left:50%}
.person-link{white-space:normal}
}

/* Magnifier hover effect on periodic table tiles */
.periodic-grid .element{transition:transform .15s ease,box-shadow .15s ease;z-index:1}
.periodic-grid .element:hover{transform:scale(1.35);box-shadow:0 6px 20px #00000030;z-index:10;border-radius:8px}
/* Rotating electron shells */
@keyframes shell-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.shell-ring{animation:shell-spin linear infinite;transform-origin:115px 115px}
.shell-ring:nth-child(1){animation-duration:12s}
.shell-ring:nth-child(2){animation-duration:18s}
.shell-ring:nth-child(3){animation-duration:25s}
.shell-ring:nth-child(4){animation-duration:32s}
.shell-ring:nth-child(5){animation-duration:40s}
.shell-ring:nth-child(6){animation-duration:48s}
.shell-ring:nth-child(7){animation-duration:55s}
/* Alternate direction for even shells */
.shell-ring:nth-child(even){animation-direction:reverse}
/* Pause on hover for interactive shells */
.shell-ring:hover{animation-play-state:paused}
/* Preview atom in explore panel also rotates */
.preview-atom .atom .shell-ring{animation:shell-spin linear infinite;transform-origin:115px 115px}
.preview-atom .atom .shell-ring:nth-child(1){animation-duration:12s}
.preview-atom .atom .shell-ring:nth-child(2){animation-duration:18s}
.preview-atom .atom .shell-ring:nth-child(3){animation-duration:25s}
.preview-atom .atom .shell-ring:nth-child(4){animation-duration:32s}
.preview-atom .atom .shell-ring:nth-child(5){animation-duration:40s}
.preview-atom .atom .shell-ring:nth-child(6){animation-duration:48s}
.preview-atom .atom .shell-ring:nth-child(7){animation-duration:55s}
.preview-atom .atom .shell-ring:nth-child(even){animation-direction:reverse}
/* Respect reduced motion */
@media(prefers-reduced-motion:reduce){.shell-ring,.preview-atom .atom .shell-ring{animation:none!important}}