{"id":5027,"date":"2026-09-29T16:37:14","date_gmt":"2026-09-29T13:37:14","guid":{"rendered":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/?page_id=5027"},"modified":"2026-09-29T16:46:33","modified_gmt":"2026-09-29T13:46:33","slug":"fg","status":"publish","type":"page","link":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/?page_id=5027","title":{"rendered":"\u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03b8\u03ad\u03c3\u03b7 \u03c3\u03c4\u03bf\u03bd \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc \u03a0\u03af\u03bd\u03b1\u03ba\u03b1 (applet)"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"el\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1, viewport-fit=cover\">\n<title>\u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u0394\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc\u03c2 \u03a0\u03af\u03bd\u03b1\u03ba\u03b1\u03c2<\/title>\n<style>\n:root{\n  --bg:#faf8f4; --surface:#ffffff; --ink:#20262b; --muted:#6b7480; --line:#e2ddd3;\n  --s-col:#c85a3a; --s-bg:#f7e2da; --p-col:#276e8a; --p-bg:#dcecf2; --d-col:#5a4a8a; --d-bg:#e4ddf2;\n  --f-col:#8a7a3a; --f-bg:#f0ecda; --good:#3f8f5f; --good-bg:#e2f2e7; --bad:#c8483f; --bad-bg:#f7e0dd;\n  --disabled:#fbe58a; --disabled-ink:#5c4813;\n  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);\n  box-sizing:border-box;\n}\n@media (prefers-color-scheme: dark){\n  :root:not([data-theme=\"light\"]){\n    --bg:#1b1a17; --surface:#242220; --ink:#ece7dd; --muted:#a39c8d; --line:#3a362f;\n    --s-bg:#3a231b; --p-bg:#1c2f38; --d-bg:#2a2338; --f-bg:#332e1a; --disabled:#7a6a1f; --disabled-ink:#fbe58a;\n  }\n}\n:root[data-theme=\"dark\"]{\n  --bg:#1b1a17; --surface:#242220; --ink:#ece7dd; --muted:#a39c8d; --line:#3a362f;\n  --s-bg:#3a231b; --p-bg:#1c2f38; --d-bg:#2a2338; --f-bg:#332e1a; --disabled:#7a6a1f; --disabled-ink:#fbe58a;\n}\n*{box-sizing:border-box}\nhtml{scroll-padding-top:env(safe-area-inset-top,0px)}\nbody{\n  margin:0; background:var(--bg); color:var(--ink);\n  font-family:Charter,\"Iowan Old Style\",Georgia,\"Times New Roman\",serif;\n  line-height:1.5; padding:32px 16px 60px;\n}\n.wrap{max-width:760px; margin:0 auto}\nh1{\n  font-size:clamp(22px,4.5vw,30px); font-weight:600; margin:0 0 4px;\n  letter-spacing:.2px;\n}\n.sub{color:var(--muted); margin:0 0 28px; font-size:15px; max-width:60ch}\n.card{\n  background:var(--surface); border:1px solid var(--line); border-radius:10px;\n  padding:22px 24px; margin-bottom:18px;\n}\n.card.locked{pointer-events:none}\n.vivid-card{color:#fff; border-width:2px; border-style:solid}\n.vivid-card .step-label{color:rgba(255,255,255,.78)}\n.vivid-card label.field-label{color:rgba(255,255,255,.85)}\n.vivid-card .electrons-left{color:rgba(255,255,255,.85)}\n.vivid-card .electrons-left b{color:#fff}\n.acc-amber{background:#c97a1f; border-color:#a35f13}\n.acc-teal{background:#1f7a6c; border-color:#155f54}\n.acc-blue{background:#2a5d9f; border-color:#1e4576}\n.acc-purple{background:#7a3b8f; border-color:#5c2c6c}\n.acc-rose{background:#b5384f; border-color:#8c2a3c}\n.step-label{\n  font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; font-size:18px; font-weight:700;\n  color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin:0 0 12px;\n}\nlabel.field-label{display:block; font-size:14px; color:var(--muted); margin-bottom:6px}\ninput[type=number]{\n  font:inherit; font-size:16px; padding:9px 12px; border-radius:7px;\n  border:1px solid var(--line); background:var(--surface); color:var(--ink); width:100%;\n}\nselect{\n  font:inherit; font-size:16px; padding:9px 12px; border-radius:7px;\n  border:1px solid #e0c455; background:#fbeeae; color:#3a2e05; width:100%;\n}\nselect:focus, input:focus, button:focus-visible{outline:2px solid var(--p-col); outline-offset:2px}\n.row{display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap}\n.row > *{flex:1 1 160px}\nbutton{\n  font:inherit; font-size:15px; font-weight:600; padding:9px 18px; border-radius:7px;\n  border:1px solid var(--ink); background:var(--ink); color:var(--bg); cursor:pointer;\n}\n.vivid-card button:not(.secondary){border-color:#fff; background:#fff; color:var(--ink)}\nbutton.secondary{background:transparent; color:var(--ink); border:1px solid var(--line); font-weight:500}\nbutton:disabled{opacity:.4; cursor:not-allowed}\n.msg{margin-top:12px; padding:9px 12px; border-radius:7px; font-size:14px; display:none}\n.msg.good{display:block; background:var(--good-bg); color:var(--good)}\n.msg.bad{display:block; background:var(--bad-bg); color:var(--bad)}\n.config-line{\n  font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; font-size:17px; font-weight:600;\n  min-height:26px; padding:14px 16px; border-radius:9px; word-break:break-word;\n  background:linear-gradient(135deg,#8b4bc4,#5f2f96); border:2px solid #4a2277; color:#fff;\n}\n.config-line .used{padding:2px 6px; border-radius:5px; background:rgba(255,255,255,.2); display:inline-block; margin:2px 1px}\n.electrons-left{font-size:13px; color:var(--muted); margin-bottom:14px}\n.electrons-left b{color:var(--ink)}\n.subshell-grid{display:grid; grid-template-columns:repeat(4,88px); gap:6px; margin-bottom:6px}\n.sub-cell{width:88px; height:22px; visibility:hidden}\n.sub-btn{\n  font:inherit; font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; font-size:16px; font-weight:700;\n  width:88px; height:22px; border-radius:5px; border:1px solid var(--line); cursor:pointer; visibility:visible;\n  display:flex; align-items:center; justify-content:center; transition:transform .12s ease;\n  -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent;\n}\n.sub-btn:active{transform:scale(.94)}\n.sub-btn.s{background:var(--s-col); color:#fff}\n.sub-btn.p{background:var(--p-col); color:#fff}\n.sub-btn.d{background:var(--d-col); color:#fff}\n.sub-btn.f{background:var(--f-col); color:#fff}\n.sub-btn:disabled{background:var(--disabled) !important; color:var(--disabled-ink) !important; border-color:var(--disabled) !important; opacity:1 !important; -webkit-text-fill-color:var(--disabled-ink); cursor:default}\n.sub-btn:disabled:active{transform:none}\n.subshell-scroll{overflow-x:auto; padding:12px 10px; background:rgba(255,255,255,.14); border-radius:10px}\n@media (max-width:480px){\n  body{padding:20px 10px 60px}\n  .card{padding:16px 14px}\n  .subshell-grid{grid-template-columns:repeat(4,68px); gap:5px}\n  .sub-cell{width:68px; height:20px}\n  .sub-btn{width:68px; height:20px; font-size:13px}\n}\n.config-sticky{\n  position:sticky; top:calc(env(safe-area-inset-top,0px) + 8px); z-index:5; margin-bottom:18px;\n  background:var(--bg); padding:6px 0 2px;\n}\n.config-caption{\n  font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; font-size:11px; color:var(--muted);\n  text-transform:uppercase; letter-spacing:.06em; margin:0 0 6px;\n}\n.result{\n  display:flex; gap:20px; align-items:center; flex-wrap:wrap; margin-bottom:6px;\n}\n.result-tile{\n  width:76px; height:76px; border-radius:9px; display:flex; flex-direction:column;\n  align-items:center; justify-content:center; font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace;\n  flex-shrink:0;\n}\n.result-tile .z{font-size:11px; align-self:flex-start; margin:4px 0 0 6px}\n.result-tile .sym{font-size:26px; font-weight:700; margin-top:-8px}\n.result-info{font-size:14.5px; color:var(--muted)}\n.result-info strong{color:var(--ink)}\n.result-config{\n  font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; font-size:14px; margin-top:10px;\n  background:var(--d-bg); border:1px solid var(--d-col); border-radius:9px; padding:12px 14px;\n}\n.result-config .cfg-tag{font-family:Charter,Georgia,serif; font-size:12.5px; color:var(--muted); font-weight:600}\n.table-scroll{overflow-x:auto; padding-bottom:6px; margin-top:6px}\n.ptable{display:grid; grid-template-columns:repeat(18,minmax(30px,1fr)); gap:3px; min-width:640px}\n.cell{\n  aspect-ratio:1; border-radius:5px; display:flex; align-items:center; justify-content:center;\n  font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; font-size:11px; font-weight:600;\n  background:transparent; color:var(--muted);\n}\n.cell.el{background:var(--bg); border:1px solid var(--line); color:var(--muted)}\n.cell.hi{\n  color:#fff; font-size:13px; box-shadow:0 0 0 2px var(--surface),0 0 0 4px currentColor;\n}\n@media (prefers-reduced-motion: no-preference){\n  .cell.hi{animation:pop .5s ease}\n}\n@keyframes pop{0%{transform:scale(.7)}60%{transform:scale(1.12)}100%{transform:scale(1)}}\n.legend{display:flex; gap:16px; flex-wrap:wrap; font-size:12.5px; color:var(--muted); margin-top:10px}\n.legend span{display:inline-flex; align-items:center; gap:6px}\n.legend i{width:10px; height:10px; border-radius:3px; display:inline-block}\n.grp-head{\n  display:flex; flex-direction:column; align-items:center; justify-content:flex-end;\n  font-family:ui-monospace,\"SF Mono\",Menlo,Consolas,monospace; line-height:1.15; padding:2px 0 4px;\n}\n.grp-head .new{font-weight:800; font-size:13px}\n.grp-head .old{font-weight:700; font-size:10px; margin-top:1px}\n.hidden{display:none !important}\n<\/style>\n<\/head>\n<body>\n<div class=\"wrap\">\n  <h1>\u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03b8\u03ad\u03c3\u03b7 \u03c3\u03c4\u03bf\u03bd \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc \u03a0\u03af\u03bd\u03b1\u03ba\u03b1<\/h1>\n  <p class=\"sub\">\u0394\u03ce\u03c3\u03b5 \u03ad\u03bd\u03b1\u03bd \u03b1\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc (\u0396 \u03ad\u03c9\u03c2 95) \u03ba\u03b1\u03b9 \u03c7\u03c4\u03af\u03c3\u03b5 \u03b2\u03ae\u03bc\u03b1\u2011\u03b2\u03ae\u03bc\u03b1 \u03c4\u03b7\u03bd \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7, \u03bc\u03b5\u03c4\u03ac \u03b2\u03c1\u03b5\u03c2 \u03c4\u03bf\u03bc\u03ad\u03b1, \u03c0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf \u03ba\u03b1\u03b9 \u03bf\u03bc\u03ac\u03b4\u03b1 \u03c4\u03bf\u03c5 \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf\u03c5.<\/p>\n\n  <div class=\"config-sticky\">\n    <p class=\"config-caption\">\u0397 \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03c3\u03bf\u03c5 \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7<\/p>\n    <div class=\"config-line\" id=\"configLine\">\u2014<\/div>\n  <\/div>\n\n  <div class=\"card vivid-card acc-amber\" id=\"card-start\">\n    <p class=\"step-label\">\u039e\u03b5\u03ba\u03af\u03bd\u03b1<\/p>\n    <div class=\"row\">\n      <div>\n        <label class=\"field-label\" for=\"zInput\">\u0391\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc\u03c2 \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc\u03c2 \u0396 (1\u201395)<\/label>\n        <input type=\"number\" id=\"zInput\" min=\"1\" max=\"95\" placeholder=\"\u03c0.\u03c7. 26\">\n      <\/div>\n      <button id=\"startBtn\">\u0388\u03bd\u03b1\u03c1\u03be\u03b7<\/button>\n    <\/div>\n    <div class=\"msg\" id=\"startMsg\"><\/div>\n  <\/div>\n\n  <div class=\"card locked vivid-card acc-teal\" id=\"card-1\">\n    <p class=\"step-label\">\u0392\u03ae\u03bc\u03b1 1 \u00b7 \u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7<\/p>\n    <div class=\"electrons-left\" id=\"electronsLeft\"><\/div>\n    <div class=\"subshell-scroll\"><div class=\"subshell-grid\" id=\"subshellGrid\"><\/div><\/div>\n    <div class=\"msg\" id=\"step1Msg\"><\/div>\n  <\/div>\n\n  <div class=\"card locked vivid-card acc-blue\" id=\"card-2\">\n    <p class=\"step-label\">\u0392\u03ae\u03bc\u03b1 2 \u00b7 \u03a4\u03bf\u03bc\u03ad\u03b1\u03c2 \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03bf\u03cd \u03a0\u03af\u03bd\u03b1\u03ba\u03b1<\/p>\n    <div class=\"row\">\n      <select id=\"blockSelect\">\n        <option value=\"\">\u2014 \u03b5\u03c0\u03af\u03bb\u03b5\u03be\u03b5 \u03c4\u03bf\u03bc\u03ad\u03b1 \u2014<\/option>\n        <option value=\"s\">s<\/option><option value=\"p\">p<\/option>\n        <option value=\"d\">d<\/option><option value=\"f\">f<\/option>\n      <\/select>\n      <button id=\"checkBlockBtn\">\u0388\u03bb\u03b5\u03b3\u03c7\u03bf\u03c2<\/button>\n    <\/div>\n    <div class=\"msg\" id=\"step2Msg\"><\/div>\n  <\/div>\n\n  <div class=\"card locked vivid-card acc-purple\" id=\"card-3\">\n    <p class=\"step-label\">\u0392\u03ae\u03bc\u03b1 3 \u00b7 \u03a0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf\u03c2<\/p>\n    <div class=\"row\">\n      <select id=\"periodSelect\"><\/select>\n      <button id=\"checkPeriodBtn\">\u0388\u03bb\u03b5\u03b3\u03c7\u03bf\u03c2<\/button>\n    <\/div>\n    <div class=\"msg\" id=\"step3Msg\"><\/div>\n  <\/div>\n\n  <div class=\"card locked vivid-card acc-rose\" id=\"card-4\">\n    <p class=\"step-label\">\u0392\u03ae\u03bc\u03b1 4 \u00b7 \u039f\u03bc\u03ac\u03b4\u03b1<\/p>\n    <div class=\"row\">\n      <select id=\"groupSelect\"><\/select>\n      <button id=\"checkGroupBtn\">\u0388\u03bb\u03b5\u03b3\u03c7\u03bf\u03c2<\/button>\n    <\/div>\n    <div class=\"msg\" id=\"step4Msg\"><\/div>\n  <\/div>\n\n  <div class=\"card hidden\" id=\"card-result\">\n    <p class=\"step-label\">\u03a4\u03bf \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf<\/p>\n    <div class=\"result\" id=\"resultRow\"><\/div>\n    <div class=\"result-config\" id=\"resultConfig\"><\/div>\n    <div class=\"table-scroll\">\n      <div class=\"ptable\" id=\"ptable\"><\/div>\n    <\/div>\n    <div class=\"legend\">\n      <span>\u03a0\u03ac\u03bd\u03c9: \u03bd\u03ad\u03b1 \u03b1\u03c1\u03af\u03b8\u03bc\u03b7\u03c3\u03b7 (1\u201318) \u00b7 \u039a\u03ac\u03c4\u03c9: \u03ba\u03bb\u03b1\u03c3\u03b9\u03ba\u03ae \u03b1\u03c1\u03af\u03b8\u03bc\u03b7\u03c3\u03b7<\/span>\n      <span><i style=\"background:var(--s-col)\"><\/i> s\u2011block<\/span>\n      <span><i style=\"background:var(--p-col)\"><\/i> p\u2011block<\/span>\n      <span><i style=\"background:var(--d-col)\"><\/i> d\u2011block<\/span>\n      <span><i style=\"background:var(--f-col)\"><\/i> f\u2011block<\/span>\n    <\/div>\n    <div class=\"row\" style=\"margin-top:16px\">\n      <button class=\"secondary\" id=\"restartBtn\">\u039d\u03ad\u03bf \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\nconst NAMES = {1:\"\u03a5\u03b4\u03c1\u03bf\u03b3\u03cc\u03bd\u03bf\",2:\"\u0389\u03bb\u03b9\u03bf\",3:\"\u039b\u03af\u03b8\u03b9\u03bf\",4:\"\u0392\u03b7\u03c1\u03cd\u03bb\u03bb\u03b9\u03bf\",5:\"\u0392\u03cc\u03c1\u03b9\u03bf\",6:\"\u0386\u03bd\u03b8\u03c1\u03b1\u03ba\u03b1\u03c2\",7:\"\u0386\u03b6\u03c9\u03c4\u03bf\",8:\"\u039f\u03be\u03c5\u03b3\u03cc\u03bd\u03bf\",\n9:\"\u03a6\u03b8\u03cc\u03c1\u03b9\u03bf\",10:\"\u039d\u03ad\u03bf\u03bd\",11:\"\u039d\u03ac\u03c4\u03c1\u03b9\u03bf\",12:\"\u039c\u03b1\u03b3\u03bd\u03ae\u03c3\u03b9\u03bf\",13:\"\u0391\u03c1\u03b3\u03af\u03bb\u03b9\u03bf\",14:\"\u03a0\u03c5\u03c1\u03af\u03c4\u03b9\u03bf\",15:\"\u03a6\u03c9\u03c3\u03c6\u03cc\u03c1\u03bf\u03c2\",16:\"\u0398\u03b5\u03af\u03bf\",17:\"\u03a7\u03bb\u03ce\u03c1\u03b9\u03bf\",\n18:\"\u0391\u03c1\u03b3\u03cc\",19:\"\u039a\u03ac\u03bb\u03b9\u03bf\",20:\"\u0391\u03c3\u03b2\u03ad\u03c3\u03c4\u03b9\u03bf\",21:\"\u03a3\u03ba\u03ac\u03bd\u03b4\u03b9\u03bf\",22:\"\u03a4\u03b9\u03c4\u03ac\u03bd\u03b9\u03bf\",23:\"\u0392\u03b1\u03bd\u03ac\u03b4\u03b9\u03bf\",24:\"\u03a7\u03c1\u03ce\u03bc\u03b9\u03bf\",25:\"\u039c\u03b1\u03b3\u03b3\u03ac\u03bd\u03b9\u03bf\",26:\"\u03a3\u03af\u03b4\u03b7\u03c1\u03bf\u03c2\",\n27:\"\u039a\u03bf\u03b2\u03ac\u03bb\u03c4\u03b9\u03bf\",28:\"\u039d\u03b9\u03ba\u03ad\u03bb\u03b9\u03bf\",29:\"\u03a7\u03b1\u03bb\u03ba\u03cc\u03c2\",30:\"\u03a8\u03b5\u03c5\u03b4\u03ac\u03c1\u03b3\u03c5\u03c1\u03bf\u03c2\",31:\"\u0393\u03ac\u03bb\u03bb\u03b9\u03bf\",32:\"\u0393\u03b5\u03c1\u03bc\u03ac\u03bd\u03b9\u03bf\",33:\"\u0391\u03c1\u03c3\u03b5\u03bd\u03b9\u03ba\u03cc\",34:\"\u03a3\u03b5\u03bb\u03ae\u03bd\u03b9\u03bf\",\n35:\"\u0392\u03c1\u03ce\u03bc\u03b9\u03bf\",36:\"\u039a\u03c1\u03c5\u03c0\u03c4\u03cc\",37:\"\u03a1\u03bf\u03c5\u03b2\u03af\u03b4\u03b9\u03bf\",38:\"\u03a3\u03c4\u03c1\u03cc\u03bd\u03c4\u03b9\u03bf\",39:\"\u038e\u03c4\u03c4\u03c1\u03b9\u03bf\",40:\"\u0396\u03b9\u03c1\u03ba\u03cc\u03bd\u03b9\u03bf\",41:\"\u039d\u03b9\u03cc\u03b2\u03b9\u03bf\",42:\"\u039c\u03bf\u03bb\u03c5\u03b2\u03b4\u03b1\u03af\u03bd\u03b9\u03bf\",\n43:\"\u03a4\u03b5\u03c7\u03bd\u03ae\u03c4\u03b9\u03bf\",44:\"\u03a1\u03bf\u03c5\u03b8\u03ae\u03bd\u03b9\u03bf\",45:\"\u03a1\u03cc\u03b4\u03b9\u03bf\",46:\"\u03a0\u03b1\u03bb\u03bb\u03ac\u03b4\u03b9\u03bf\",47:\"\u0386\u03c1\u03b3\u03c5\u03c1\u03bf\u03c2\",48:\"\u039a\u03ac\u03b4\u03bc\u03b9\u03bf\",49:\"\u038a\u03bd\u03b4\u03b9\u03bf\",50:\"\u039a\u03b1\u03c3\u03c3\u03af\u03c4\u03b5\u03c1\u03bf\u03c2\",\n51:\"\u0391\u03bd\u03c4\u03b9\u03bc\u03cc\u03bd\u03b9\u03bf\",52:\"\u03a4\u03b5\u03bb\u03bb\u03bf\u03cd\u03c1\u03b9\u03bf\",53:\"\u0399\u03ce\u03b4\u03b9\u03bf\",54:\"\u039e\u03ad\u03bd\u03bf\",55:\"\u039a\u03b1\u03af\u03c3\u03b9\u03bf\",56:\"\u0392\u03ac\u03c1\u03b9\u03bf\",57:\"\u039b\u03b1\u03bd\u03b8\u03ac\u03bd\u03b9\u03bf\",58:\"\u0394\u03b7\u03bc\u03ae\u03c4\u03c1\u03b9\u03bf\",\n59:\"\u03a0\u03c1\u03b1\u03c3\u03b5\u03bf\u03b4\u03cd\u03bc\u03b9\u03bf\",60:\"\u039d\u03b5\u03bf\u03b4\u03cd\u03bc\u03b9\u03bf\",61:\"\u03a0\u03c1\u03bf\u03bc\u03ae\u03b8\u03b5\u03b9\u03bf\",62:\"\u03a3\u03b1\u03bc\u03ac\u03c1\u03b9\u03bf\",63:\"\u0395\u03c5\u03c1\u03ce\u03c0\u03b9\u03bf\",64:\"\u0393\u03b1\u03b4\u03bf\u03bb\u03af\u03bd\u03b9\u03bf\",65:\"\u03a4\u03ad\u03c1\u03b2\u03b9\u03bf\",\n66:\"\u0394\u03c5\u03c3\u03c0\u03c1\u03cc\u03c3\u03b9\u03bf\",67:\"\u038c\u03bb\u03bc\u03b9\u03bf\",68:\"\u0388\u03c1\u03b2\u03b9\u03bf\",69:\"\u0398\u03bf\u03cd\u03bb\u03b9\u03bf\",70:\"\u03a5\u03c4\u03c4\u03ad\u03c1\u03b2\u03b9\u03bf\",71:\"\u039b\u03bf\u03c5\u03c4\u03ae\u03c4\u03b9\u03bf\",72:\"\u03a7\u03ac\u03c6\u03bd\u03b9\u03bf\",73:\"\u03a4\u03b1\u03bd\u03c4\u03ac\u03bb\u03b9\u03bf\",\n74:\"\u0392\u03bf\u03bb\u03c6\u03c1\u03ac\u03bc\u03b9\u03bf\",75:\"\u03a1\u03ae\u03bd\u03b9\u03bf\",76:\"\u038c\u03c3\u03bc\u03b9\u03bf\",77:\"\u0399\u03c1\u03af\u03b4\u03b9\u03bf\",78:\"\u039b\u03b5\u03c5\u03ba\u03cc\u03c7\u03c1\u03c5\u03c3\u03bf\u03c2\",79:\"\u03a7\u03c1\u03c5\u03c3\u03cc\u03c2\",80:\"\u03a5\u03b4\u03c1\u03ac\u03c1\u03b3\u03c5\u03c1\u03bf\u03c2\",81:\"\u0398\u03ac\u03bb\u03bb\u03b9\u03bf\",\n82:\"\u039c\u03cc\u03bb\u03c5\u03b2\u03b4\u03bf\u03c2\",83:\"\u0392\u03b9\u03c3\u03bc\u03bf\u03cd\u03b8\u03b9\u03bf\",84:\"\u03a0\u03bf\u03bb\u03ce\u03bd\u03b9\u03bf\",85:\"\u0386\u03c3\u03c4\u03b1\u03c4\u03bf\",86:\"\u03a1\u03b1\u03b4\u03cc\u03bd\u03b9\u03bf\",87:\"\u03a6\u03c1\u03ac\u03bd\u03ba\u03b9\u03bf\",88:\"\u03a1\u03ac\u03b4\u03b9\u03bf\",89:\"\u0391\u03ba\u03c4\u03af\u03bd\u03b9\u03bf\",\n90:\"\u0398\u03cc\u03c1\u03b9\u03bf\",91:\"\u03a0\u03c1\u03c9\u03c4\u03b1\u03ba\u03c4\u03af\u03bd\u03b9\u03bf\",92:\"\u039f\u03c5\u03c1\u03ac\u03bd\u03b9\u03bf\",93:\"\u03a0\u03bf\u03c3\u03b5\u03b9\u03b4\u03ce\u03bd\u03b9\u03bf\",94:\"\u03a0\u03bb\u03bf\u03c5\u03c4\u03ce\u03bd\u03b9\u03bf\",95:\"\u0391\u03bc\u03b5\u03c1\u03af\u03ba\u03b9\u03bf\"};\nconst SYM = {1:\"H\",2:\"He\",3:\"Li\",4:\"Be\",5:\"B\",6:\"C\",7:\"N\",8:\"O\",9:\"F\",10:\"Ne\",11:\"Na\",12:\"Mg\",13:\"Al\",14:\"Si\",\n15:\"P\",16:\"S\",17:\"Cl\",18:\"Ar\",19:\"K\",20:\"Ca\",21:\"Sc\",22:\"Ti\",23:\"V\",24:\"Cr\",25:\"Mn\",26:\"Fe\",27:\"Co\",28:\"Ni\",\n29:\"Cu\",30:\"Zn\",31:\"Ga\",32:\"Ge\",33:\"As\",34:\"Se\",35:\"Br\",36:\"Kr\",37:\"Rb\",38:\"Sr\",39:\"Y\",40:\"Zr\",41:\"Nb\",42:\"Mo\",\n43:\"Tc\",44:\"Ru\",45:\"Rh\",46:\"Pd\",47:\"Ag\",48:\"Cd\",49:\"In\",50:\"Sn\",51:\"Sb\",52:\"Te\",53:\"I\",54:\"Xe\",55:\"Cs\",56:\"Ba\",\n57:\"La\",58:\"Ce\",59:\"Pr\",60:\"Nd\",61:\"Pm\",62:\"Sm\",63:\"Eu\",64:\"Gd\",65:\"Tb\",66:\"Dy\",67:\"Ho\",68:\"Er\",69:\"Tm\",\n70:\"Yb\",71:\"Lu\",72:\"Hf\",73:\"Ta\",74:\"W\",75:\"Re\",76:\"Os\",77:\"Ir\",78:\"Pt\",79:\"Au\",80:\"Hg\",81:\"Tl\",82:\"Pb\",\n83:\"Bi\",84:\"Po\",85:\"At\",86:\"Rn\",87:\"Fr\",88:\"Ra\",89:\"Ac\",90:\"Th\",91:\"Pa\",92:\"U\",93:\"Np\",94:\"Pu\",95:\"Am\"};\n\nconst MAX_Z = 95;\nconst ORDER = [\"1s\",\"2s\",\"2p\",\"3s\",\"3p\",\"4s\",\"3d\",\"4p\",\"5s\",\"4d\",\"5p\",\"6s\",\"4f\",\"5d\",\"6p\",\"7s\",\"5f\"];\nconst CAP = {s:2,p:6,d:10,f:14};\n\/\/ \u03a0\u03c1\u03b1\u03b3\u03bc\u03b1\u03c4\u03b9\u03ba\u03ac \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03b1-\u03b5\u03be\u03b1\u03b9\u03c1\u03ad\u03c3\u03b5\u03b9\u03c2 \u03cc\u03c0\u03bf\u03c5 \u03b7 \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u0394\u0395\u039d \u03ba\u03b1\u03c4\u03b1\u03bb\u03ae\u03b3\u03b5\u03b9 \u03ba\u03b1\u03b8\u03b1\u03c1\u03ac \u03c3\u03b5 4f^x\u00b76s\u00b2 (\u03bb\u03b1\u03bd\u03b8\u03b1\u03bd\u03af\u03b4\u03b5\u03c2)\n\/\/ \u03ae \u03c3\u03b5 5f^x\u00b77s\u00b2 (\u03b1\u03ba\u03c4\u03b9\u03bd\u03af\u03b4\u03b5\u03c2), \u03bf\u03c0\u03cc\u03c4\u03b5 \u03b1\u03c0\u03bf\u03ba\u03bb\u03b5\u03af\u03bf\u03bd\u03c4\u03b1\u03b9 \u03b1\u03c0\u03cc \u03c4\u03b7\u03bd \u03ac\u03c3\u03ba\u03b7\u03c3\u03b7.\nconst EXCLUDED = new Set([57,58,64,71, 89,90,91,92,93]);\n\nfunction buildConfig(Z){\n  let remaining = Z, cfg = [];\n  for (const sub of ORDER){\n    if (remaining <= 0) break;\n    const type = sub[sub.length-1];\n    const n = Math.min(CAP[type], remaining);\n    cfg.push({sub, n});\n    remaining -= n;\n  }\n  return cfg;\n}\nfunction blockOf(cfg){ return cfg[cfg.length-1].sub.slice(-1); }\nfunction periodOf(cfg){ return Math.max(...cfg.map(e=>parseInt(e.sub))); }\nfunction groupOf(Z, cfg){\n  if (Z === 2) return 18;\n  const block = blockOf(cfg);\n  const lastEntry = cfg[cfg.length-1];\n  const last = lastEntry.n;\n  if (block === \"s\") return last;\n  if (block === \"p\") return 12 + last;\n  if (block === \"d\"){\n    const sSub = (parseInt(lastEntry.sub)+1)+\"s\";\n    const sEntry = cfg.find(e=>e.sub===sSub);\n    return last + (sEntry ? sEntry.n : 0);\n  }\n  return 3; \/\/ \u03bb\u03b1\u03bd\u03b8\u03b1\u03bd\u03af\u03b4\u03b5\u03c2\/\u03b1\u03ba\u03c4\u03b9\u03bd\u03af\u03b4\u03b5\u03c2 (\u03c4\u03bf\u03bc\u03ad\u03b1\u03c2 f): \u03b1\u03c0\u03bf\u03b4\u03b5\u03ba\u03c4\u03ae \u03bf\u03bc\u03ac\u03b4\u03b1 \u03b7 3, \u03ba\u03b1\u03c4\u03ac \u03c3\u03cd\u03bc\u03b2\u03b1\u03c3\u03b7\n}\nconst NOBLE = [2,10,18,36,54,86];\nfunction energyOrderString(Z, cfg){\n  \/\/ \u03a0\u03c1\u03bf\u03b7\u03b3\u03bf\u03cd\u03bc\u03b5\u03bd\u03bf \u03b5\u03c5\u03b3\u03b5\u03bd\u03ad\u03c2 \u03b1\u03ad\u03c1\u03b9\u03bf (\u03b1\u03c5\u03c3\u03c4\u03b7\u03c1\u03ac \u03bc\u03b9\u03ba\u03c1\u03cc\u03c4\u03b5\u03c1\u03bf \u03c4\u03bf\u03c5 Z)\n  const core = NOBLE.filter(g=>g<Z).pop() || 0;\n  const coreSubs = new Set(core ? buildConfig(core).map(e=>e.sub) : []);\n  const beyond = cfg.filter(e=>!coreSubs.has(e.sub));\n  \/\/ \u03a4\u03b5\u03bb\u03b9\u03ba\u03ae \u03b5\u03bd\u03b5\u03c1\u03b3\u03b5\u03b9\u03b1\u03ba\u03ae \u03c3\u03b5\u03b9\u03c1\u03ac: f < d < s < p\n  const rank = {f:0, d:1, s:2, p:3};\n  beyond.sort((a,b)=>rank[a.sub.slice(-1)]-rank[b.sub.slice(-1)]);\n  const sup = n => String(n).replace(\/\\d\/g,d=>\"\u2070\u00b9\u00b2\u00b3\u2074\u2075\u2076\u2077\u2078\u2079\"[d]);\n  return (core ? `[${SYM[core]}] ` : '') + beyond.map(e=>e.sub+sup(e.n)).join(' ');\n}\nfunction colorFor(block){\n  return {s:[\"var(--s-col)\",\"var(--s-bg)\"], p:[\"var(--p-col)\",\"var(--p-bg)\"],\n          d:[\"var(--d-col)\",\"var(--d-bg)\"], f:[\"var(--f-col)\",\"var(--f-bg)\"]}[block];\n}\n\nlet Z=null, target=null, config=[], remaining=0, answers={};\n\nconst zInput=document.getElementById('zInput'), startMsg=document.getElementById('startMsg');\ndocument.getElementById('startBtn').onclick = ()=>{\n  const v = parseInt(zInput.value,10);\n  if(!v || v<1 || v>MAX_Z){ startMsg.className='msg bad'; startMsg.textContent=`\u0394\u03ce\u03c3\u03b5 \u03ad\u03bd\u03b1\u03bd \u03b1\u03ba\u03ad\u03c1\u03b1\u03b9\u03bf \u03b1\u03c0\u03cc 1 \u03ad\u03c9\u03c2 ${MAX_Z}.`; return; }\n  if(EXCLUDED.has(v)){\n    startMsg.className='msg bad';\n    startMsg.textContent=`\u03a4\u03bf \u0396=${v} (${NAMES[v]}) \u03ad\u03c7\u03b5\u03b9 \u03c0\u03c1\u03b1\u03b3\u03bc\u03b1\u03c4\u03b9\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u03c0\u03bf\u03c5 \u03b4\u03b5\u03bd \u03b1\u03ba\u03bf\u03bb\u03bf\u03c5\u03b8\u03b5\u03af \u03c4\u03b7\u03bd \u03b1\u03c0\u03bb\u03ae \u03c3\u03b5\u03b9\u03c1\u03ac \u03c0\u03bb\u03ae\u03c1\u03c9\u03c3\u03b7\u03c2 (\u03b5\u03be\u03b1\u03af\u03c1\u03b5\u03c3\u03b7). \u0394\u03bf\u03ba\u03af\u03bc\u03b1\u03c3\u03b5 \u03ac\u03bb\u03bb\u03bf\u03bd \u03b1\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc.`;\n    return;\n  }\n  Z=v; target=buildConfig(Z); remaining=Z; config=[]; answers={};\n  startMsg.className='msg'; startMsg.textContent='';\n  ['card-2','card-3','card-4'].forEach(id=>document.getElementById(id).classList.add('locked'));\n  document.getElementById('card-result').classList.add('hidden');\n  ['step1Msg','step2Msg','step3Msg','step4Msg'].forEach(id=>{const m=document.getElementById(id); m.className='msg'; m.textContent='';});\n  document.getElementById('card-1').classList.remove('locked');\n  document.getElementById('configLine').textContent='\u2014';\n  buildSubshellGrid();\n  updateElectronsLeft();\n};\n\nconst TYPES = ['s','p','d','f'];\nfunction buildSubshellGrid(){\n  const grid=document.getElementById('subshellGrid');\n  grid.innerHTML='';\n  const maxN = Math.max(...ORDER.map(s=>parseInt(s)));\n  for(let n=1; n<=maxN; n++){\n    TYPES.forEach(type=>{\n      const sub = n+type;\n      if(ORDER.includes(sub)){\n        const btn=document.createElement('button');\n        btn.className='sub-btn '+type;\n        btn.textContent=sub;\n        btn.onclick=()=>trySubshell(sub);\n        grid.appendChild(btn);\n      } else {\n        const ph=document.createElement('div');\n        ph.className='sub-cell';\n        grid.appendChild(ph);\n      }\n    });\n  }\n}\nfunction updateElectronsLeft(){\n  document.getElementById('electronsLeft').innerHTML = `\u03a0\u03b1\u03c1\u03b1\u03bc\u03ad\u03bd\u03bf\u03c5\u03bd <b>${remaining}<\/b> \u03b1\u03c0\u03cc \u03c4\u03b1 <b>${Z}<\/b> \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03cc\u03bd\u03b9\u03b1.`;\n}\nfunction trySubshell(sub){\n  const msg = document.getElementById('step1Msg');\n  const expected = target[config.length].sub;\n  if(sub !== expected){\n    msg.className='msg bad'; msg.textContent=`\u0397 \u03c5\u03c0\u03bf\u03c3\u03c4\u03b9\u03b2\u03ac\u03b4\u03b1 ${sub} \u03b4\u03b5\u03bd \u03b5\u03af\u03bd\u03b1\u03b9 \u03b7 \u03b5\u03c0\u03cc\u03bc\u03b5\u03bd\u03b7 \u03c3\u03c4\u03b7 \u03c3\u03b5\u03b9\u03c1\u03ac \u03c0\u03bb\u03ae\u03c1\u03c9\u03c3\u03b7\u03c2. \u0394\u03bf\u03ba\u03af\u03bc\u03b1\u03c3\u03b5 \u03be\u03b1\u03bd\u03ac.`;\n    return;\n  }\n  const type = sub[sub.length-1];\n  const n = Math.min(CAP[type], remaining);\n  config.push({sub,n});\n  remaining -= n;\n  const line = document.getElementById('configLine');\n  const sup = String(n).replace(\/\\d\/g,d=>\"\u2070\u00b9\u00b2\u00b3\u2074\u2075\u2076\u2077\u2078\u2079\"[d]);\n  line.innerHTML = (line.textContent==='\u2014'?'':line.innerHTML+' ') + `<span class=\"used\">${sub}${sup}<\/span>`;\n  updateElectronsLeft();\n  [...document.getElementById('subshellGrid').querySelectorAll('.sub-btn')].forEach(b=>{\n    if(b.textContent===sub){\n      b.disabled=true;\n      void b.offsetHeight; \/\/ force iOS Safari to repaint the disabled style\n    }\n  });\n  if(remaining === 0){\n    msg.className='msg good'; msg.textContent='\u03a3\u03c9\u03c3\u03c4\u03cc! \u0397 \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u03bf\u03bb\u03bf\u03ba\u03bb\u03b7\u03c1\u03ce\u03b8\u03b7\u03ba\u03b5.';\n    document.getElementById('card-1').classList.add('locked');\n    document.getElementById('card-2').classList.remove('locked');\n    populatePeriodGroupSelects();\n  } else {\n    msg.className='msg good'; msg.textContent='\u03a3\u03c9\u03c3\u03c4\u03cc, \u03c3\u03c5\u03bd\u03ad\u03c7\u03b9\u03c3\u03b5.';\n  }\n}\n\nfunction populatePeriodGroupSelects(){\n  const ps=document.getElementById('periodSelect'), gs=document.getElementById('groupSelect');\n  ps.innerHTML='<option value=\"\">\u2014 \u03b5\u03c0\u03af\u03bb\u03b5\u03be\u03b5 \u03c0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf \u2014<\/option>'+[1,2,3,4,5,6,7].map(p=>`<option value=\"${p}\">${p}<\/option>`).join('');\n  gs.innerHTML='<option value=\"\">\u2014 \u03b5\u03c0\u03af\u03bb\u03b5\u03be\u03b5 \u03bf\u03bc\u03ac\u03b4\u03b1 \u2014<\/option>'+Array.from({length:18},(_,i)=>i+1).map(g=>`<option value=\"${g}\">${g}<\/option>`).join('');\n}\n\ndocument.getElementById('checkBlockBtn').onclick=()=>{\n  const val=document.getElementById('blockSelect').value, msg=document.getElementById('step2Msg');\n  if(!val) return;\n  if(val===blockOf(config)){\n    msg.className='msg good'; msg.textContent='\u03a3\u03c9\u03c3\u03c4\u03cc\u03c2 \u03c4\u03bf\u03bc\u03ad\u03b1\u03c2!'; answers.block=val;\n    document.getElementById('card-2').classList.add('locked');\n    document.getElementById('card-3').classList.remove('locked');\n  } else { msg.className='msg bad'; msg.textContent='\u039e\u03b1\u03bd\u03b1\u03ba\u03bf\u03af\u03c4\u03b1\u03be\u03b5 \u03c0\u03bf\u03b9\u03b1 \u03c5\u03c0\u03bf\u03c3\u03c4\u03b9\u03b2\u03ac\u03b4\u03b1 \u03b3\u03ad\u03bc\u03b9\u03c3\u03b5 \u03c4\u03b5\u03bb\u03b5\u03c5\u03c4\u03b1\u03af\u03b1.'; }\n};\ndocument.getElementById('checkPeriodBtn').onclick=()=>{\n  const val=parseInt(document.getElementById('periodSelect').value,10), msg=document.getElementById('step3Msg');\n  if(!val) return;\n  if(val===periodOf(config)){\n    answers.period=val;\n    msg.className='msg good'; msg.textContent='\u03a3\u03c9\u03c3\u03c4\u03ae \u03c0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf\u03c2!';\n    document.getElementById('card-3').classList.add('locked');\n    document.getElementById('card-4').classList.remove('locked');\n  } else { msg.className='msg bad'; msg.textContent='\u03a3\u03ba\u03ad\u03c8\u03bf\u03c5 \u03c4\u03bf\u03bd \u03bc\u03b5\u03b3\u03b1\u03bb\u03cd\u03c4\u03b5\u03c1\u03bf \u03ba\u03cd\u03c1\u03b9\u03bf \u03ba\u03b2\u03b1\u03bd\u03c4\u03b9\u03ba\u03cc \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc n \u03c3\u03c4\u03b7 \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7.'; }\n};\ndocument.getElementById('checkGroupBtn').onclick=()=>{\n  const val=parseInt(document.getElementById('groupSelect').value,10), msg=document.getElementById('step4Msg');\n  if(!val) return;\n  const correct=groupOf(Z,config);\n  if(val===correct){\n    msg.className='msg good'; msg.textContent='\u03a3\u03c9\u03c3\u03c4\u03ae \u03bf\u03bc\u03ac\u03b4\u03b1!'; answers.group=val;\n    document.getElementById('card-4').classList.add('locked');\n    showResult();\n  } else { msg.className='msg bad'; msg.textContent='\u0394\u03bf\u03ba\u03af\u03bc\u03b1\u03c3\u03b5 \u03be\u03b1\u03bd\u03ac \u2014 \u03c3\u03ba\u03ad\u03c8\u03bf\u03c5 \u03c4\u03b1 \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03cc\u03bd\u03b9\u03b1 \u03c3\u03b8\u03ad\u03bd\u03bf\u03c5\u03c2.'; }\n};\n\nfunction showResult(){\n  const block=blockOf(config), [col,bg]=colorFor(block);\n  const row=document.getElementById('resultRow');\n  row.innerHTML = `\n    <div class=\"result-tile\" style=\"background:${bg};color:${col}\">\n      <span class=\"z\">${Z}<\/span><span class=\"sym\">${SYM[Z]}<\/span>\n    <\/div>\n    <div class=\"result-info\">\n      <strong>${NAMES[Z]} (${SYM[Z]})<\/strong><br>\n      \u03a0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf\u03c2 ${periodOf(config)}${groupOf(Z,config)!==null ? ' \u00b7 \u039f\u03bc\u03ac\u03b4\u03b1 '+groupOf(Z,config) : ' \u00b7 \u03c7\u03c9\u03c1\u03af\u03c2 \u03ba\u03b1\u03b8\u03bf\u03c1\u03b9\u03c3\u03bc\u03ad\u03bd\u03b7 \u03bf\u03bc\u03ac\u03b4\u03b1'} \u00b7 \u03c4\u03bf\u03bc\u03ad\u03b1\u03c2 ${block}\n    <\/div>`;\n  const fillStr = config.map(e=>e.sub+String(e.n).replace(\/\\d\/g,d=>\"\u2070\u00b9\u00b2\u00b3\u2074\u2075\u2076\u2077\u2078\u2079\"[d])).join(' ');\n  document.getElementById('resultConfig').innerHTML =\n    `<div><span class=\"cfg-tag\">\u03a3\u03b5\u03b9\u03c1\u03ac \u03c0\u03bb\u03ae\u03c1\u03c9\u03c3\u03b7\u03c2 (\u03ba\u03b1\u03bd\u03cc\u03bd\u03b1\u03c2 Aufbau, n+l):<\/span> ${fillStr}<\/div>\n     <div style=\"margin-top:8px\"><span class=\"cfg-tag\">\u0394\u03cc\u03bc\u03b7\u03c3\u03b7 \u03ba\u03b1\u03c4\u03ac \u03b1\u03c5\u03be\u03b1\u03bd\u03cc\u03bc\u03b5\u03bd\u03b7 \u03b5\u03bd\u03ad\u03c1\u03b3\u03b5\u03b9\u03b1 (\u03bc\u03b5 \u03b2\u03ac\u03c3\u03b7 \u03c4\u03bf \u03c0\u03c1\u03bf\u03b7\u03b3\u03bf\u03cd\u03bc\u03b5\u03bd\u03bf \u03b5\u03c5\u03b3\u03b5\u03bd\u03ad\u03c2 \u03b1\u03ad\u03c1\u03b9\u03bf):<\/span> ${energyOrderString(Z, config)}<\/div>`;\n  buildTable();\n  document.getElementById('card-result').classList.remove('hidden');\n  document.getElementById('card-result').scrollIntoView({behavior:'smooth',block:'nearest'});\n}\n\nfunction buildTable(){\n  const el=document.getElementById('ptable');\n  el.innerHTML='';\n  const OLD_GROUP=[\"I\u0391\",\"II\u0391\",\"III\u0392\",\"IV\u0392\",\"V\u0392\",\"VI\u0392\",\"VII\u0392\",\"VIII\",\"VIII\",\"VIII\",\"I\u0392\",\"II\u0392\",\"III\u0391\",\"IV\u0391\",\"V\u0391\",\"VI\u0391\",\"VII\u0391\",\"VIII\u0391\"];\n  const colForGroup = g => g<=2 ? \"var(--s-col)\" : g<=12 ? \"var(--d-col)\" : \"var(--p-col)\";\n  const mainGrid={}, lnGrid={}, anGrid={};\n  for(let z=1; z<=MAX_Z; z++){\n    if(z===57 || z===89){\n      mainGrid[(z===57?6:7)+'-3']=z;               \/\/ La, Ac: \u03b5\u03ba\u03c0\u03c1\u03cc\u03c3\u03c9\u03c0\u03bf\u03b9 \u03c4\u03b7\u03c2 \u03bf\u03bc\u03ac\u03b4\u03b1\u03c2 3\n    } else if(z>=58 && z<=71){\n      lnGrid[z-57]=z;                               \/\/ Ce..Lu, \u03b8\u03ad\u03c3\u03b5\u03b9\u03c2 1..14\n    } else if(z>=90 && z<=103){\n      anGrid[z-89]=z;                                \/\/ Th..Lr, \u03b8\u03ad\u03c3\u03b5\u03b9\u03c2 1..14\n    } else {\n      const c=buildConfig(z);\n      mainGrid[periodOf(c)+'-'+groupOf(z,c)]=z;\n    }\n  }\n  function makeCell(z){\n    const cell=document.createElement('div');\n    if(z){\n      cell.className='cell el';\n      cell.textContent=SYM[z];\n      cell.title=NAMES[z]+' (Z='+z+')';\n      if(z===Z){\n        const c=buildConfig(z), [col,bg]=colorFor(blockOf(c));\n        cell.className='cell hi';\n        cell.style.background=col; cell.style.color=bg;\n      }\n    } else { cell.className='cell'; }\n    return cell;\n  }\n  for(let group=1; group<=18; group++){\n    const head=document.createElement('div');\n    head.className='grp-head';\n    head.style.color=colForGroup(group);\n    head.innerHTML=`<span class=\"new\">${group}<\/span><span class=\"old\">${OLD_GROUP[group-1]}<\/span>`;\n    el.appendChild(head);\n  }\n  for(let period=1; period<=7; period++){\n    for(let group=1; group<=18; group++){\n      el.appendChild(makeCell(mainGrid[period+'-'+group]));\n    }\n  }\n  const spacer=document.createElement('div');\n  spacer.style.cssText='grid-column:1\/-1;height:10px';\n  el.appendChild(spacer);\n  [[lnGrid,'Ln'],[anGrid,'An']].forEach(([rowMap,label])=>{\n    const lab=document.createElement('div');\n    lab.className='cell'; lab.style.cssText='grid-column:span 2;font-size:10px';\n    lab.textContent=label;\n    el.appendChild(lab);\n    for(let fcount=1; fcount<=14; fcount++) el.appendChild(makeCell(rowMap[fcount]));\n    el.appendChild(makeCell(null)); el.appendChild(makeCell(null));\n  });\n}\n\ndocument.getElementById('restartBtn').onclick=()=>{\n  zInput.value='';\n  document.getElementById('configLine').textContent='\u2014';\n  document.getElementById('subshellGrid').innerHTML='';\n  document.getElementById('card-result').classList.add('hidden');\n  ['card-1','card-2','card-3','card-4'].forEach(id=>document.getElementById(id).classList.add('locked'));\n  window.scrollTo({top:0,behavior:'smooth'});\n};\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u0394\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc\u03c2 \u03a0\u03af\u03bd\u03b1\u03ba\u03b1\u03c2 \u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03b8\u03ad\u03c3\u03b7 \u03c3\u03c4\u03bf\u03bd \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc \u03a0\u03af\u03bd\u03b1\u03ba\u03b1 \u0394\u03ce\u03c3\u03b5 \u03ad\u03bd\u03b1\u03bd \u03b1\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc (\u0396 \u03ad\u03c9\u03c2 95) \u03ba\u03b1\u03b9 \u03c7\u03c4\u03af\u03c3\u03b5 \u03b2\u03ae\u03bc\u03b1\u2011\u03b2\u03ae\u03bc\u03b1 \u03c4\u03b7\u03bd \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7, \u03bc\u03b5\u03c4\u03ac \u03b2\u03c1\u03b5\u03c2 \u03c4\u03bf\u03bc\u03ad\u03b1, \u03c0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf \u03ba\u03b1\u03b9 \u03bf\u03bc\u03ac\u03b4\u03b1 \u03c4\u03bf\u03c5 \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf\u03c5. \u0397 \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03c3\u03bf\u03c5 \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u2014 \u039e\u03b5\u03ba\u03af\u03bd\u03b1 \u0391\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc\u03c2 \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc\u03c2 \u0396 (1\u201395) \u0388\u03bd\u03b1\u03c1\u03be\u03b7 \u0392\u03ae\u03bc\u03b1 1 \u00b7 \u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u0392\u03ae\u03bc\u03b1 2 \u00b7 \u03a4\u03bf\u03bc\u03ad\u03b1\u03c2 \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03bf\u03cd \u03a0\u03af\u03bd\u03b1\u03ba\u03b1&hellip; <br \/> <a class=\"read-more\" href=\"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/?page_id=5027\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","footnotes":""},"class_list":["post-5027","page","type-page","status-publish","hentry"],"featured_image_src":null,"featured_image_src_square":null,"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"ab-block-post-grid-landscape":false,"ab-block-post-grid-square":false,"post-thumbnail":false,"mesmerize-full-hd":false},"uagb_author_info":{"display_name":"\u039c\u03b9\u03c7\u03ac\u03bb\u03b7\u03c2 \u039c\u03b1\u03c1\u03b1\u03b3\u03ba\u03ac\u03ba\u03b7\u03c2","author_link":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/?author=1"},"uagb_comment_info":0,"uagb_excerpt":"\u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u0394\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc\u03c2 \u03a0\u03af\u03bd\u03b1\u03ba\u03b1\u03c2 \u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 &amp; \u03b8\u03ad\u03c3\u03b7 \u03c3\u03c4\u03bf\u03bd \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03cc \u03a0\u03af\u03bd\u03b1\u03ba\u03b1 \u0394\u03ce\u03c3\u03b5 \u03ad\u03bd\u03b1\u03bd \u03b1\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc (\u0396 \u03ad\u03c9\u03c2 95) \u03ba\u03b1\u03b9 \u03c7\u03c4\u03af\u03c3\u03b5 \u03b2\u03ae\u03bc\u03b1\u2011\u03b2\u03ae\u03bc\u03b1 \u03c4\u03b7\u03bd \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7, \u03bc\u03b5\u03c4\u03ac \u03b2\u03c1\u03b5\u03c2 \u03c4\u03bf\u03bc\u03ad\u03b1, \u03c0\u03b5\u03c1\u03af\u03bf\u03b4\u03bf \u03ba\u03b1\u03b9 \u03bf\u03bc\u03ac\u03b4\u03b1 \u03c4\u03bf\u03c5 \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf\u03c5. \u0397 \u03b7\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03c3\u03bf\u03c5 \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u2014 \u039e\u03b5\u03ba\u03af\u03bd\u03b1 \u0391\u03c4\u03bf\u03bc\u03b9\u03ba\u03cc\u03c2 \u03b1\u03c1\u03b9\u03b8\u03bc\u03cc\u03c2 \u0396 (1\u201395) \u0388\u03bd\u03b1\u03c1\u03be\u03b7 \u0392\u03ae\u03bc\u03b1 1 \u00b7 \u0397\u03bb\u03b5\u03ba\u03c4\u03c1\u03bf\u03bd\u03b9\u03b1\u03ba\u03ae \u03b4\u03cc\u03bc\u03b7\u03c3\u03b7 \u0392\u03ae\u03bc\u03b1 2 \u00b7 \u03a4\u03bf\u03bc\u03ad\u03b1\u03c2 \u03a0\u03b5\u03c1\u03b9\u03bf\u03b4\u03b9\u03ba\u03bf\u03cd \u03a0\u03af\u03bd\u03b1\u03ba\u03b1&hellip;&hellip;","_links":{"self":[{"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=\/wp\/v2\/pages\/5027","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5027"}],"version-history":[{"count":2,"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=\/wp\/v2\/pages\/5027\/revisions"}],"predecessor-version":[{"id":5032,"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=\/wp\/v2\/pages\/5027\/revisions\/5032"}],"wp:attachment":[{"href":"https:\/\/users.sch.gr\/mimaragkak\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5027"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}