:root{--molwerk-bg-primary: #0f1b24;--molwerk-bg-secondary: #14252f;--molwerk-bg-card: #1b2e39;--molwerk-bg-card-hover: #233a47;--molwerk-accent-cyan: #34e1c8;--molwerk-accent-cyan-dim: #239e8d;--molwerk-accent-gold: #ffc65c;--molwerk-accent-gold-dim: #cc9e4a;--molwerk-text-primary: #eaf6f4;--molwerk-text-secondary: #9fb8b5;--molwerk-error: #f87171}html body{background-color:var(--molwerk-bg-primary);color:var(--molwerk-text-primary)}html a{color:var(--molwerk-accent-cyan)}html a:hover{color:var(--molwerk-accent-gold)}.molwerk-app{min-height:100vh;display:flex;flex-direction:column}.screen{flex:1;display:flex;flex-direction:column;padding:var(--space-6) var(--space-4)}.screen[hidden]{display:none}html .btn-home{background-color:var(--molwerk-bg-card);color:var(--molwerk-accent-cyan)}html .btn-home:hover{box-shadow:0 0 20px #34e1c859;color:var(--molwerk-accent-gold)}html .btn{font-family:var(--font-display)}html .btn--primary{background-color:var(--molwerk-accent-cyan);color:var(--molwerk-bg-primary)}html .btn--primary:hover{background-color:var(--molwerk-accent-cyan-dim)}html .btn--secondary{background-color:var(--molwerk-bg-card);color:var(--molwerk-text-primary);border:1px solid var(--molwerk-accent-cyan-dim)}html .btn--secondary:hover{background-color:var(--molwerk-bg-card-hover)}.btn-icon{min-width:var(--touch-min);min-height:var(--touch-min);background:var(--molwerk-bg-card);border:none;border-radius:var(--border-radius-md);font-size:var(--text-xl);cursor:pointer}.select-screen{align-items:center;justify-content:center;text-align:center;gap:var(--space-4)}.select-screen__title{color:var(--molwerk-accent-cyan)}.select-screen__subtitle{color:var(--molwerk-text-secondary);max-width:480px}.mode-select{display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:center;margin-top:var(--space-6)}.mode-btn{min-height:var(--touch-min);padding:var(--space-4) var(--space-8);background-color:var(--molwerk-bg-card);color:var(--molwerk-text-primary);border:2px solid var(--molwerk-accent-cyan-dim);border-radius:var(--border-radius-lg);font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;cursor:pointer;transition:var(--transition-fast)}.mode-btn:hover{background-color:var(--molwerk-bg-card-hover);border-color:var(--molwerk-accent-cyan);box-shadow:0 0 20px #34e1c840}.workshop-header{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-4);padding-left:calc(var(--touch-min) + var(--space-4))}.workshop-layout{flex:1;display:grid;grid-template-columns:1fr;gap:var(--space-4);min-height:0}@media(min-width:900px){.workshop-layout{grid-template-columns:minmax(320px,1.4fr) minmax(280px,1fr) minmax(200px,.7fr);align-items:start}}@media(min-width:1024px){.workshop-layout{grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);grid-template-rows:auto 1fr;grid-template-areas:"table build" "table discovered"}.periodic-table{grid-area:table;max-height:none;align-self:start;gap:3px}.build-panel{grid-area:build}.discovered-panel{grid-area:discovered;align-self:start}.pse-cell__number{font-size:.625rem}.pse-cell__symbol{font-size:1rem}}.periodic-table{display:grid;grid-template-columns:repeat(18,minmax(0,1fr));gap:2px;background-color:var(--molwerk-bg-secondary);border-radius:var(--border-radius-md);padding:var(--space-2);overflow:auto;max-height:60vh}.pse-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border:none;border-radius:var(--border-radius-sm);font-family:var(--font-display);min-width:0;padding:1px}.pse-cell--placeholder{background:transparent;color:var(--molwerk-text-secondary);font-size:.5rem;opacity:.4}.pse-cell--dimmed{background-color:var(--molwerk-bg-card);color:var(--molwerk-text-secondary);opacity:.35;cursor:default}.pse-cell--active{background-color:var(--cpk-color, var(--molwerk-accent-cyan));color:#0f1b24;cursor:pointer;box-shadow:0 0 12px color-mix(in srgb,var(--cpk-color, white) 50%,transparent);transition:transform var(--transition-fast);min-width:var(--touch-min);min-height:var(--touch-min)}.pse-cell--active:hover{transform:scale(1.1)}.pse-cell__number{font-size:.5rem}.pse-cell__symbol{font-size:.75rem;font-weight:700}.build-panel{display:flex;flex-direction:column;gap:var(--space-3);background-color:var(--molwerk-bg-secondary);border-radius:var(--border-radius-md);padding:var(--space-4)}.formula-display{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--molwerk-accent-gold);text-align:center;min-height:2.5rem}.build-area{flex:1;display:flex;flex-wrap:wrap;align-content:flex-start;gap:var(--space-3);background-color:var(--molwerk-bg-card);border-radius:var(--border-radius-md);padding:var(--space-4);min-height:140px}.atom-ball{width:56px;height:56px;border-radius:50%;border:2px solid rgba(0,0,0,.35);background-color:var(--cpk-color, #999);color:#0f1b24;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0006;transition:transform var(--transition-fast)}.atom-ball:hover{transform:scale(1.08)}.atom-ball__symbol{font-family:var(--font-display);font-weight:700;font-size:var(--text-base)}.atom-ball__arms{font-size:.6rem}.feedback-text{min-height:1.5rem;text-align:center;color:var(--molwerk-accent-gold)}.build-controls{display:flex;gap:var(--space-3);justify-content:center}.missions-bar[hidden]{display:none}.missions-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);background-color:var(--molwerk-bg-card);border-radius:var(--border-radius-md);padding:var(--space-3) var(--space-4);flex:1}.missions-bar__progress{font-weight:700;color:var(--molwerk-accent-cyan)}.missions-bar__hint-text{flex:1}.missions-bar__score{font-weight:700;color:var(--molwerk-accent-gold)}.discovered-panel{background-color:var(--molwerk-bg-secondary);border-radius:var(--border-radius-md);padding:var(--space-4)}.discovered-panel__title{font-size:var(--text-lg);margin-bottom:var(--space-2)}.discovered-panel__list{display:flex;flex-direction:column;gap:var(--space-1);color:var(--molwerk-text-secondary)}.result-card{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;border:none;border-radius:var(--border-radius-lg);padding:var(--space-8);max-width:420px;width:90%;max-height:85vh;overflow-y:auto;background-color:var(--molwerk-bg-secondary);color:var(--molwerk-text-primary);box-shadow:0 12px 40px #00000080;z-index:50}.result-card__name{color:var(--molwerk-accent-cyan)}.result-card__formula{font-family:var(--font-display);font-size:var(--text-xl);color:var(--molwerk-accent-gold);margin-bottom:var(--space-4)}.result-card__simplified{font-size:var(--text-sm);font-style:italic;color:var(--molwerk-text-secondary)}.result-card__formation h3{font-size:var(--text-base);margin-top:var(--space-4)}.result-card__safety{margin-top:var(--space-4);padding:var(--space-3);background-color:var(--molwerk-bg-card);border-radius:var(--border-radius-sm)}.result-card #btn-result-close{margin-top:var(--space-4);width:100%}.structure-diagram{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-1);margin:var(--space-4) 0;padding:var(--space-4);background-color:var(--molwerk-bg-card);border-radius:var(--border-radius-md)}.structure-diagram--hub{gap:var(--space-2)}.structure-branches{display:flex;flex-wrap:wrap;gap:var(--space-2)}.structure-atom{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background-color:var(--cpk-color, #999);color:#0f1b24;font-family:var(--font-display);font-weight:700;font-size:var(--text-sm);border:2px solid rgba(0,0,0,.35)}.structure-rod{display:inline-block;width:18px;height:4px;background-color:var(--molwerk-text-secondary);margin:0 2px}.structure-rod--2{box-shadow:0 -4px 0 var(--molwerk-text-secondary)}.structure-rod--3{box-shadow:0 -4px 0 var(--molwerk-text-secondary),0 4px 0 var(--molwerk-text-secondary)}.structure-ion{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:6px;background-color:var(--cpk-color, #999);color:#0f1b24;font-family:var(--font-display);font-weight:700}.structure-diagram--ionic{flex-direction:column}.structure-diagram__note{font-size:var(--text-sm);color:var(--molwerk-text-secondary);text-align:center}#dialog-quit-session{border:none;border-radius:var(--border-radius-lg);padding:var(--space-8);text-align:center;max-width:280px;width:90%;background-color:var(--molwerk-bg-secondary);color:var(--molwerk-text-primary)}#dialog-quit-session::backdrop{background-color:#0009}#dialog-quit-session p{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-6)}.dialog-quit__buttons{display:flex;gap:var(--space-4);justify-content:center}.btn-quit{min-width:80px;padding:var(--space-3) var(--space-6);border:none;border-radius:9999px;font-family:var(--font-display);font-weight:700;cursor:pointer}.btn-quit--confirm{background-color:var(--molwerk-error);color:#fff}.btn-quit--cancel{background-color:var(--molwerk-accent-cyan);color:var(--molwerk-bg-primary)}.summary-screen{align-items:center;justify-content:center;text-align:center;gap:var(--space-4)}.summary-screen__title{color:var(--molwerk-accent-cyan)}.summary-screen__score{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--molwerk-accent-gold)}.summary-screen__list{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-4)}@media(prefers-reduced-motion:reduce){.pse-cell--active:hover,.atom-ball:hover,.mode-btn:hover{transform:none}}