.hc-wrap{--hc-border:#dfe7e4;--hc-soft:#f6faf8;--hc-ink:#17231f;--hc-accent:#136b55;--hc-accent2:#0f5746;--hc-radius:20px}.hc-head{margin-bottom:20px}.hc-app{display:grid;gap:18px}.hc-panel,.hc-output,.hc-element-card,.hc-periodic-toolbar{background:#fff;border:1px solid var(--hc-border);border-radius:var(--hc-radius);padding:20px;box-shadow:0 8px 30px rgba(16,45,36,.05)}.hc-panel{display:grid;gap:16px}.hc-label{display:grid;gap:8px;font-weight:800;color:var(--hc-ink)}.hc-label span{font-weight:500;color:#6b7773;font-size:.85em}.hc-label input,.hc-label select,.hc-label textarea,.hc-search input,.hc-element-picker input{width:100%;border:1px solid #cfdad6;border-radius:13px;padding:12px 14px;background:#fff;color:#17231f;font:inherit;outline:none}.hc-label input:focus,.hc-label textarea:focus,.hc-search input:focus,.hc-element-picker input:focus,.hc-formula-box input:focus{border-color:var(--hc-accent);box-shadow:0 0 0 3px rgba(19,107,85,.11)}.hc-two,.hc-grid3{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.hc-grid3{grid-template-columns:repeat(3,minmax(0,1fr))}.hc-primary,.hc-secondary{border:0;border-radius:13px;padding:12px 18px;font:inherit;font-weight:900;cursor:pointer}.hc-primary{background:var(--hc-accent);color:#fff}.hc-primary:hover{background:var(--hc-accent2)}.hc-secondary{background:#edf4f1;color:var(--hc-ink)}.hc-help{margin:0;color:#66736e}.hc-formula-field{display:grid;gap:8px}.hc-formula-field>label{font-weight:900}.hc-formula-box{display:flex;gap:8px}.hc-formula-box input{min-width:0;flex:1;border:1px solid #cfdad6;border-radius:14px;padding:13px 15px;font:600 18px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;direction:ltr;text-align:left;outline:none}.hc-open-pad{white-space:nowrap;border:1px solid #b9d4ca;background:#eff8f4;color:#145c4b;border-radius:14px;padding:10px 14px;font:inherit;font-weight:900;cursor:pointer}.hc-formula-preview{min-height:46px;padding:10px 14px;border-radius:12px;background:#f8fbfa;border:1px dashed #cbd9d4;font-size:22px;direction:ltr;text-align:center;color:#20312b}.hc-formula-preview sub,.hc-answer sub{font-size:.65em;vertical-align:-.25em}.hc-formula-preview sup,.hc-answer sup{font-size:.65em}.hc-output{min-height:110px}.hc-empty{text-align:center;color:#74817c;padding:22px}.hc-error{border:1px solid #f0c7c7;background:#fff6f6;border-radius:14px;padding:14px;color:#7c2525}.hc-error p{margin:6px 0 0}.hc-answer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid #edf1ef}.hc-answer:last-child{border-bottom:0}.hc-answer span{color:#66736e}.hc-answer strong{font-size:1.15rem;text-align:left}.hc-answer small{display:block;color:#76817e}.hc-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.hc-stat-grid .hc-answer{display:grid;align-content:start;background:#f8fbfa;border:1px solid #e4ece9;border-radius:13px;padding:12px}.hc-stat-grid .hc-answer strong{font-size:1rem;overflow-wrap:anywhere}.hc-table{overflow:auto;margin-top:14px}.hc-table table{width:100%;border-collapse:collapse;min-width:520px}.hc-table th,.hc-table td{padding:10px 12px;border-bottom:1px solid #e7eeeb;text-align:right}.hc-table th{background:#f4f8f6}.hc-arrow{padding:0 10px;color:var(--hc-accent)}
.hc-periodic-toolbar{display:grid;gap:12px}.hc-search{display:flex;align-items:center;gap:8px}.hc-search>span{font-size:22px}.hc-search button{border:0;background:#eef4f1;border-radius:10px;padding:9px 11px;cursor:pointer}.hc-filter-chips,.hc-periodic-legend{display:flex;gap:7px;flex-wrap:wrap}.hc-filter-chips button{border:1px solid #d8e3df;background:#fff;border-radius:999px;padding:7px 10px;cursor:pointer}.hc-filter-chips button.is-active{background:#173c32;color:#fff;border-color:#173c32}.hc-periodic-scroll{overflow-x:auto;padding:4px 0 10px}.hc-periodic{min-width:1050px;display:grid;grid-template-columns:repeat(18,1fr);grid-template-rows:repeat(10,74px);gap:6px;direction:ltr}.hc-el{position:relative;border:1px solid #d8e3df;background:#fff;border-radius:12px;min-height:74px;padding:18px 4px 8px;cursor:pointer;display:grid;grid-template-rows:1fr auto;justify-items:center;align-items:center;align-content:center;gap:4px;transition:.16s;direction:rtl;overflow:hidden;line-height:1.1}.hc-el:hover{transform:translateY(-2px);border-color:#6eaa96;box-shadow:0 6px 15px rgba(20,77,59,.1)}.hc-el.is-muted{opacity:.16}.hc-el small{position:absolute;top:5px;left:6px;display:block;font-size:10px;line-height:1;font-weight:800;color:#75817d;z-index:1}.hc-el b{display:block;margin:0;font-size:20px;line-height:1;font-weight:900;color:#123f32;direction:ltr}.hc-el span{display:block;width:100%;margin:0;font-size:10px;line-height:1.2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 2px}.hc-element-card{margin-top:2px}.hc-element-hero{display:flex;align-items:center;gap:16px;margin-bottom:16px}.hc-element-tile{width:98px;height:98px;border-radius:18px;background:#eff8f4;border:1px solid #bfd9d0;display:grid;place-items:center;align-content:center;position:relative}.hc-element-tile small{position:absolute;top:8px;right:9px}.hc-element-tile b{font-size:32px;direction:ltr}.hc-element-tile span{font-size:12px}.hc-element-hero h2{margin:0 0 6px}.hc-element-hero h2 small{direction:ltr;display:inline-block}.hc-element-hero p{margin:0;color:#6f7b77}
.hc-element-picker{position:relative}.hc-element-picker [data-hc-element-suggest]{position:absolute;z-index:10;right:0;left:0;top:calc(100% + 5px);background:#fff;border:1px solid #dce5e2;border-radius:13px;box-shadow:0 12px 35px rgba(15,45,35,.13);overflow:hidden}.hc-element-picker [data-hc-element-suggest]:empty{display:none}.hc-element-picker [data-hc-element-suggest] button{width:100%;display:grid;grid-template-columns:50px 1fr 35px;gap:8px;text-align:right;border:0;border-bottom:1px solid #edf1ef;background:#fff;padding:9px 12px;cursor:pointer}.hc-element-picker [data-hc-element-suggest] button:hover{background:#f5faf8}.hc-element-picker [data-hc-element-suggest] b{direction:ltr}.hc-builder-actions{display:flex;gap:9px;flex-wrap:wrap}
.hc-pad[hidden]{display:none}.hc-pad{position:fixed;inset:0;z-index:99999;display:grid;align-items:end}.hc-pad-backdrop{position:absolute;inset:0;background:rgba(8,25,20,.52);backdrop-filter:blur(2px)}.hc-pad-sheet{position:relative;background:#fff;border-radius:24px 24px 0 0;max-height:min(78vh,700px);overflow:auto;padding:18px;box-shadow:0 -16px 50px rgba(0,0,0,.18)}.hc-pad-sheet>header{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:12px}.hc-pad-sheet>header strong{display:block;font-size:1.1rem}.hc-pad-sheet>header small{display:block;color:#71807a;margin-top:3px}.hc-pad-sheet>header button{width:40px;height:40px;border:0;border-radius:12px;background:#eef3f1;font-size:25px;cursor:pointer}.hc-pad-tabs{display:flex;gap:7px;border-bottom:1px solid #e5ece9;padding-bottom:10px;margin-bottom:12px}.hc-pad-tabs button{border:0;background:#eff4f2;border-radius:999px;padding:8px 12px;font:inherit;font-weight:800;cursor:pointer}.hc-pad-tabs button.is-active{background:#163e33;color:#fff}.hc-pad-grid{display:grid;grid-template-columns:repeat(8,minmax(55px,1fr));gap:7px}.hc-pad-grid.is-elements{grid-template-columns:repeat(12,minmax(45px,1fr))}.hc-pad-grid button,.hc-pad-ops button{border:1px solid #d5e0dc;background:#fff;border-radius:11px;min-height:44px;font:700 16px/1.2 inherit;cursor:pointer}.hc-pad-grid button:hover{background:#eef8f4}.hc-pad-ops{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}.hc-pad-ops button{padding:9px 13px}.hc-pad-ops [data-hc-done]{background:var(--hc-accent);color:#fff;border-color:var(--hc-accent)}
@media(max-width:820px){.hc-two,.hc-grid3,.hc-stat-grid{grid-template-columns:1fr}.hc-panel,.hc-output,.hc-element-card,.hc-periodic-toolbar{padding:15px}.hc-formula-box{display:grid;grid-template-columns:1fr}.hc-open-pad{width:100%}.hc-pad-grid,.hc-pad-grid.is-elements{grid-template-columns:repeat(6,1fr)}.hc-periodic{min-width:900px}.hc-element-hero{align-items:flex-start}.hc-element-tile{width:82px;height:82px;flex:none}.hc-pad-sheet{padding:14px}.hc-pad-ops{display:grid;grid-template-columns:1fr 1fr}.hc-pad-ops [data-hc-done]{grid-column:1/-1}}
@media(max-width:480px){.hc-pad-grid,.hc-pad-grid.is-elements{grid-template-columns:repeat(5,1fr)}.hc-formula-preview{font-size:19px}.hc-search{display:grid;grid-template-columns:auto 1fr}.hc-search button{grid-column:1/-1}.hc-element-hero{display:grid;grid-template-columns:82px 1fr}}
.hc-compound{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:13px 0;border-bottom:1px solid #e8efec}.hc-compound:last-child{border-bottom:0}.hc-compound>div{display:grid;gap:4px}.hc-compound>div:last-child{text-align:left}.hc-compound span{font-size:1.15rem;direction:ltr}.hc-compound small{color:#75817d}@media(max-width:560px){.hc-compound{align-items:flex-start}.hc-compound>div:last-child{min-width:118px}}

@media(max-width:820px){.hc-periodic{min-width:980px;grid-template-rows:repeat(10,72px)}}

/* v17.6.0 — chemistry formula entry mobile UX */
.hc-mobile-entry{display:none;gap:8px;align-items:center}
.hc-mobile-entry button{border:1px solid #cfdad6;background:#fff;border-radius:10px;min-height:40px;padding:0 11px;font:800 12px inherit;color:#145c4b}
.hc-mobile-entry button.is-active{background:#eff8f4;border-color:#75aa95}.hc-mobile-entry small{color:#6b7773;line-height:1.7}
@media(max-width:820px){
 .hc-mobile-entry{display:grid;grid-template-columns:auto 1fr}
 .hc-formula-field{scroll-margin-top:70px}
 .hc-formula-box{position:sticky;top:8px;z-index:18;background:#fff;padding:6px;border-radius:14px;box-shadow:0 5px 16px rgba(15,23,42,.05);grid-template-columns:1fr auto}
 .hc-open-pad{width:auto;min-width:110px}
 .hc-pad-sheet{max-height:52vh;padding:12px}
 .hc-pad-sheet>header{position:sticky;top:0;background:#fff;z-index:4;padding-bottom:8px}
 .hc-pad-tabs{position:sticky;top:58px;background:#fff;z-index:3;padding-top:4px;overflow-x:auto;white-space:nowrap}
 .hc-pad-grid,.hc-pad-grid.is-elements{grid-template-columns:repeat(5,minmax(0,1fr))}
 .hc-pad-grid button{min-height:44px}
}
@media(max-width:480px){.hc-mobile-entry{grid-template-columns:1fr}.hc-mobile-entry small{font-size:11px}.hc-formula-box{grid-template-columns:1fr}.hc-open-pad{width:100%}}