/* Functional GCSE periodic-practice layout; preserves existing site styles. */
.periodic-activity,.halogen-activity {max-width:1070px;margin:26px 0 45px;min-width:0}
.periodic-activity .practice-top,.halogen-activity .practice-top {display:flex;align-items:start;justify-content:space-between;gap:22px;flex-wrap:wrap}
.periodic-activity select,.halogen-activity select {max-width:100%}
.periodic-controls,.halogen-controls {display:flex;gap:16px;flex-wrap:wrap;align-items:end}
.periodic-controls label,.halogen-controls label {display:grid;gap:7px;flex:1 1 175px}
.periodic-controls select,.halogen-controls select {width:100%;min-height:44px}
.periodic-activity .small,.halogen-activity .small {font-size:.9rem;color:#3c5862}
.periodic-activity [data-scenario-scope],.halogen-activity [data-scenario-scope] {max-width:80ch;color:#45616b;font-size:.94rem}
.periodic-reference {margin:22px 0 26px;padding:14px 17px;border:1px solid #c1d4d9;border-radius:4px;background:#fbfdfd}
.periodic-reference>summary {font-weight:600;cursor:pointer;padding:3px 0}
.ptable-viewport {max-width:100%;overflow-x:auto;padding-bottom:6px}
.ptable-grid {display:grid;grid-template-columns:repeat(8,minmax(37px,1fr));gap:5px;min-width:350px;max-width:630px;margin:13px 0}
.ptable-label {text-align:center;font-size:.78rem;color:#354f5a;line-height:1.3;align-self:center}
.ptable-element {min-height:47px!important;min-width:0!important;font-size:.95rem!important;background:#fff!important;color:#0a505f!important;border:1px solid #9bbbc1!important;padding:5px!important;border-radius:3px!important}
.ptable-element:hover,.ptable-element:focus {background:#e6f3f4!important;outline-offset:2px}
.ptable-empty {background:#f0f5f6;min-height:45px}
.periodic-reference [data-periodic-info] {min-height:22px;margin:9px 0}
.periodic-question,.halogen-evidence,.halogen-lab-work,.halogen-rank {border-top:1px solid #c8d7da;margin-top:20px;padding-top:20px}
.periodic-question h3,.halogen-activity h3 {font-size:1.1rem}
.periodic-question fieldset {border:0;padding:0;min-width:0}
.periodic-question legend {font-size:1.08rem;font-weight:600;line-height:1.45;margin:9px 0 18px}
.periodic-choice {display:flex;gap:12px;align-items:start;margin:9px 0;padding:12px 14px;border:1px solid #ccdade;border-radius:4px;background:#fcfdfd;min-width:0;cursor:pointer;overflow-wrap:anywhere}
.periodic-choice:hover {border-color:#448d98}
.periodic-choice input[type=radio] {width:18px;height:18px;flex:0 0 18px;margin:3px 0 0}
.periodic-activity .actions,.halogen-activity .actions {display:flex;gap:10px;flex-wrap:wrap}
.periodic-activity .actions button,.halogen-activity .actions button {min-height:44px}
.periodic-activity [data-periodic-feedback]:not(:empty),.halogen-activity [data-halogen-feedback]:not(:empty),.periodic-activity [data-periodic-hint]:not([hidden]),.halogen-activity [data-halogen-hint]:not([hidden]){border-left:3px solid #438a94;background:#edf5f5;padding:12px 15px;margin:15px 0;max-width:83ch}
.periodic-activity [data-periodic-explanation]:not([hidden]) {border-left:3px solid #819ca5;margin:12px 0 20px;padding:10px 15px;max-width:80ch}
.periodic-activity .periodic-round-controls {padding-top:18px;border-top:1px solid #c8d7da;margin-top:20px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.periodic-activity [data-periodic-round-status] {flex:1 1 250px}
.halogen-lab-grid {display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,1fr);gap:20px}
.halogen-lab-work {margin-top:15px}
.halogen-evidence {border:1px solid #c4d6da;background:#f7fafb;padding:16px 19px;align-self:start;margin-top:15px;border-radius:4px;min-width:0}
.halogen-evidence ol {padding-left:22px;margin:0}
.halogen-evidence li {margin:0 0 16px;overflow-wrap:break-word}
.halogen-evidence li p {font-size:.92rem;margin:7px 0}
.halogen-evidence details {margin:10px 0}
.halogen-predict {display:grid;gap:12px;margin:15px 0}
.halogen-predict button {justify-self:start}
.halogen-rank .halogen-controls {margin:15px 0}
.halogen-rank .halogen-controls label {flex:1 1 155px}
.halogen-method {max-width:1000px;border:1px solid #c4d6da;padding:18px 20px;margin:24px 0;background:#fcfdfd;border-radius:4px}
.halogen-method textarea {box-sizing:border-box;width:100%;min-height:100px;max-width:100%;font:inherit}
.halogen-method ul {list-style:none;padding-left:0}
.halogen-method li {margin:8px 0}
.halogen-method label {display:flex;align-items:start;gap:9px;overflow-wrap:break-word}
.halogen-method label input {margin:5px 0 0;flex:0 0 17px}
.halogen-method label span {min-width:0}
.halogen-method .actions {margin:12px 0}
.halogen-activity [data-halogen-answer]:not([hidden]) {background:#edf5f5;padding:12px 16px;margin:16px 0;border-left:3px solid #438a94}
@media(max-width:780px){.halogen-lab-grid {grid-template-columns:1fr}}
@media(max-width:540px){.periodic-controls,.halogen-controls {display:grid;grid-template-columns:1fr}.halogen-activity .actions button,.periodic-activity .actions button {width:100%}.halogen-evidence,.halogen-method {padding:13px}.periodic-reference {padding:12px}.periodic-choice {padding:10px}}