.element-display.svelte-yy59yh .atomic-number:where(.svelte-yy59yh){font-size:3rem;padding:.5rem;background:#fff;color:var(--bg);top:0;left:0;width:3ch;text-align:right;aspect-ratio:1;border-radius:0 0 1rem;display:flex;align-items:center;justify-content:flex-end}.element-display.svelte-yy59yh .atomic-name:where(.svelte-yy59yh){font-size:2rem;bottom:0rem;left:0;right:0;position:absolute;background:#fff;border:1rem solid var(--bg);color:var(--bg);text-align:center;font-weight:700;border-radius:1rem}.element-display.svelte-yy59yh .atomic-symbol:where(.svelte-yy59yh){font-size:6rem;font-weight:800}.element-display.svelte-yy59yh{view-transition-name:element-display;color:#fff;aspect-ratio:4/3;background:var(--bg);width:100%;display:grid;place-items:center;position:relative;transition:background 5s;box-shadow:#63636333 0 2px 8px;border-radius:1rem}.periodic-reviewer.svelte-yy59yh{display:flex;flex-direction:column;justify-content:space-between;gap:1rem;background-color:var(--color-primary)}.periodic-table-container.svelte-yy59yh{display:grid;place-items:center;flex-grow:1;gap:1rem;box-shadow:#63636333 0 2px 8px;border-radius:1rem;padding:1rem .5rem}.quiz-options.svelte-yy59yh{display:flex;flex-direction:column;gap:1.2rem;flex-grow:1}.quiz-options-sequence.svelte-yy59yh{display:flex;justify-content:space-between;gap:1rem}.button-toggle.svelte-yy59yh{all:unset;position:relative;top:0;height:2rem;aspect-ratio:1;border-radius:1rem;display:grid;place-items:center;font-size:1rem;font-weight:600;letter-spacing:.08rem;padding:1rem 1.6rem;background:var(--color-primary);color:#fff;box-shadow:0 16px 5px navy;transition:top .1s,box-shadow .06s}.button-toggle.svelte-yy59yh:hover{background:#7740e8}.element.svelte-yy59yh{all:unset;border:1px solid #eee;box-sizing:border-box;display:grid;place-items:center;position:relative}.element.svelte-yy59yh:hover{background:#f6f6f6}.element.svelte-yy59yh:focus{border:4px solid #ddd}.atomic-element.svelte-yy59yh{all:unset;inset:0}.atomic-number.svelte-yy59yh{position:absolute;left:.2rem;top:.2rem}.atomic-symbol.svelte-yy59yh{font-size:1rem}.legend.svelte-yy59yh{display:flex;flex-wrap:wrap;gap:.2rem;font-size:1rem}.legend-item.svelte-yy59yh{font-family:Anonymous Pro;font-weight:400;background:var(--bg);border-radius:4px;color:#fff;padding:.5rem;flex-grow:1;text-align:center}.legend-item__label.svelte-yy59yh{flex-grow:1}