.area-switch{display:flex;padding:4px;background:#e3ece7;border-radius:12px}.area-button{min-width:110px;min-height:44px;padding:8px 18px;border:0;border-radius:9px;background:transparent;color:#52635a;font-weight:800;cursor:pointer}.area-button.active{background:var(--green);color:#fff}.practice-area[hidden],#game-area[hidden]{display:none}.practice-home{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 16px}.practice-choice{display:grid;gap:5px;padding:18px;text-align:left;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--text);cursor:pointer}.practice-choice strong{font-size:17px}.practice-choice span{color:var(--muted)}.practice-choice.active{border-color:var(--mid);box-shadow:0 0 0 2px #147a5122}.practice-view{display:none;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden}.practice-view.active{display:block}.builder-heading,.practice-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid var(--line)}.builder-heading h2,.practice-section-heading h2{margin:0}.builder-heading p,.practice-section-heading p{margin:4px 0 0;color:var(--muted)}.builder-actions{display:flex;gap:8px}.builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:16px;padding:16px}.board-column{display:grid;align-content:start;gap:10px;min-width:0}.board-wrap{position:relative;min-width:0;background:#163c2c;border-radius:14px;overflow:hidden}#drill-board{display:block;width:100%;aspect-ratio:3/2;touch-action:none;user-select:none}#drill-board.drawing{cursor:crosshair}.drill-object{cursor:grab}.drill-object.selected>*:first-child{filter:drop-shadow(0 0 6px #fff) drop-shadow(0 0 5px #f5b941)}.player-number{font:900 18px system-ui;fill:#123a2a}.object-label{font:800 14px system-ui;fill:#fff;paint-order:stroke;stroke:#123a2a;stroke-width:5px}.board-zoom{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;gap:4px;padding:4px;border-radius:10px;background:#fff}.board-zoom button{min-width:38px;height:38px;border:0;border-radius:7px;background:#edf2ef;font-weight:800}.board-zoom span{min-width:48px;text-align:center;font-size:12px;font-weight:800}.builder-sidebar{display:grid;align-content:start;gap:12px}.builder-sidebar label,.planner-meta label,.planner-item label{display:grid;gap:5px;font-weight:700}.builder-sidebar input,.builder-sidebar select,.builder-sidebar textarea,.planner-meta input,.planner-meta textarea,.planner-add select,.planner-item input{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px;font:inherit}.builder-sidebar textarea,.planner-meta textarea{resize:vertical}.object-editor{padding:14px;border-radius:12px;background:#f0f4f1}.object-editor h3{margin:0 0 10px}.object-editor>div{display:flex;gap:8px;margin-top:10px}.object-editor button,.tool-tray button,.drill-card button,.planner-item button{min-height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text);font-weight:700;cursor:pointer}.tool-tray{display:grid;grid-template-columns:repeat(9,minmax(80px,1fr)) 1fr repeat(3,minmax(70px,auto));gap:7px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#f0f4f1;overflow-x:auto}.tool-tray button{padding:8px}.tool-tray button.active{background:var(--mid);color:#fff}.player-options{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto auto;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#f8faf8}.player-options[hidden]{display:none}.option-label{font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.number-options,.colour-options,.shape-options{display:flex;gap:5px;overflow-x:auto}.player-options button{flex:0 0 auto;min-width:42px;min-height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--text);font-weight:800}.player-options button.active{box-shadow:0 0 0 3px #147a5140;border-color:var(--mid)}.colour-options button{width:42px;background:var(--swatch)}.practice-message{min-height:22px;margin:0;padding:5px 20px 14px;color:var(--mid);font-weight:700}.saved-drills{padding:12px}.drill-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px;border-bottom:1px solid var(--line)}.drill-card>div:first-child{display:grid;gap:3px}.drill-card span,.drill-card small{color:var(--muted)}.drill-card>div:last-child{display:flex;gap:6px}.planner-meta{display:grid;grid-template-columns:1fr 180px;gap:12px;padding:18px}.planner-meta label:last-child{grid-column:1/-1}.planner-add{display:flex;gap:8px;padding:0 18px 18px}.planner-add select{flex:1}.planner-item{display:grid;grid-template-columns:34px minmax(130px,1fr) 110px minmax(160px,1fr) auto;align-items:end;gap:10px;padding:12px 18px;border-top:1px solid var(--line)}.planner-order{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--gold);font-weight:900}.planner-item>div{display:flex;gap:4px}.planner-item button{width:40px}.planner-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:#f0f4f1}
@media(max-width:800px){.topbar{align-items:center}.area-button{min-width:90px}.practice-home{grid-template-columns:1fr}.builder-heading{align-items:flex-start;flex-direction:column}.builder-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.builder-actions .primary{grid-column:1/-1;grid-row:1}.builder-layout{grid-template-columns:1fr;padding:8px}.board-column{order:0}.board-wrap{order:0}.builder-sidebar{order:1}.tool-tray{position:static;grid-template-columns:repeat(11,minmax(88px,auto));padding:8px}.player-options{grid-template-columns:1fr;gap:6px}.number-options,.colour-options,.shape-options{padding-bottom:2px}.player-options button{min-width:44px;min-height:44px}.planner-item{grid-template-columns:34px 1fr 100px}.planner-item label:nth-of-type(2){grid-column:2/-1}.planner-item>div{grid-column:2/-1}.drill-card{align-items:flex-start;flex-direction:column}.planner-meta{grid-template-columns:1fr}.planner-meta label:last-child{grid-column:auto}}
.app-version{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:99px;background:#e5f4eb;color:var(--mid);font-size:11px;font-weight:900;letter-spacing:.06em}
.animation-panel{display:grid;gap:9px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#f8faf8}.playback-controls,.step-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.playback-controls button,.step-actions button,.step-list button{min-height:42px;padding:8px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--text);font-weight:800}.playback-controls button:first-child{background:var(--gold);color:var(--green)}.playback-controls label{display:flex;align-items:center;gap:6px;font-weight:700}.playback-controls select{min-height:40px;border:1px solid var(--line);border-radius:8px;background:#fff}.step-row{display:grid;gap:8px}.step-list{display:flex;gap:6px;overflow-x:auto;padding:2px}.step-list button{flex:0 0 auto}.step-list button.active{background:var(--mid);color:#fff}.step-actions button:disabled{opacity:.4}.step-actions button:last-child{color:#a12c2c}
@media(max-width:800px){.animation-panel{padding:8px}.playback-controls{display:grid;grid-template-columns:repeat(3,1fr)}.playback-controls label{min-height:44px}.step-actions{display:grid;grid-template-columns:repeat(3,1fr)}.step-actions button{min-height:44px}}
.drill-viewer{width:min(96vw,1200px);max-width:none;height:min(94vh,900px);max-height:none;padding:0;border:0;border-radius:18px;background:#102e23;color:#fff;box-shadow:0 24px 90px #071b14aa}.drill-viewer::backdrop{background:#071b14dd}.drill-viewer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:#fff;color:var(--text)}.drill-viewer-head small{color:var(--mid);font-weight:900;letter-spacing:.1em}.drill-viewer-head h2{margin:2px 0 0}.drill-viewer-head>button{width:46px;height:46px;border:0;border-radius:50%;background:#edf2ef;font-size:28px}.drill-viewer-board{display:grid;place-items:center;height:calc(100% - 142px);padding:12px}.drill-viewer-board svg{display:block;max-width:100%;max-height:100%;aspect-ratio:3/2}.drill-viewer-controls{display:flex;align-items:center;justify-content:center;gap:8px;min-height:72px;padding:10px 14px;background:#fff;color:var(--text)}.drill-viewer-controls button,.drill-viewer-controls select{min-height:44px;border:1px solid var(--line);border-radius:9px;background:#fff;font-weight:800}.drill-viewer-controls button{padding:8px 14px}.drill-viewer-controls button:first-child{background:var(--gold);color:var(--green)}.drill-viewer-controls label{display:flex;align-items:center;gap:6px;font-weight:700}#viewer-step-label{min-width:90px;color:var(--mid);font-weight:900;text-align:center}
@media(max-width:800px){.drill-viewer{width:100vw;height:100dvh;border-radius:0}.drill-viewer-board{height:calc(100% - 206px);padding:6px}.drill-viewer-controls{display:grid;grid-template-columns:repeat(3,1fr);min-height:136px}.drill-viewer-controls label{justify-content:center}#viewer-step-label{grid-column:1/-1}.drill-viewer-controls button{padding:6px}}
/* v23 Practice Studio polish */
.practice-area{--practice-shadow:0 14px 38px #123a2a12}.practice-home{gap:10px}.practice-choice{position:relative;min-height:92px;padding:16px 18px;overflow:hidden;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.practice-choice::after{content:'→';position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#147a5166;font-size:22px}.practice-choice:hover{transform:translateY(-1px);border-color:#a8cab8;box-shadow:0 8px 22px #123a2a12}.practice-choice.active{background:linear-gradient(135deg,#fff,#edf7f1);box-shadow:var(--practice-shadow)}.practice-choice.active::after{color:var(--mid)}.practice-view{box-shadow:var(--practice-shadow)}.builder-heading{background:linear-gradient(135deg,#fff 45%,#eef7f2)}.section-kicker{display:block;margin-bottom:4px;color:var(--mid);font-size:10px;font-weight:900;letter-spacing:.13em}.board-wrap{border:5px solid #143d2d;box-shadow:0 12px 30px #123a2a20}.tool-tray{scrollbar-width:thin}.tool-tray button{transition:background .14s ease,color .14s ease,transform .14s ease}.tool-tray button:active,.player-options button:active{transform:scale(.97)}.animation-panel{border-color:#bed9ca;background:linear-gradient(135deg,#f7fbf8,#eaf5ef);box-shadow:inset 0 1px #fff}.playback-controls{padding-bottom:8px;border-bottom:1px solid #cfe2d7}.playback-controls button:first-child{min-width:100px;box-shadow:0 5px 12px #d39d2529}.step-list button{position:relative}.step-list button.active::after{content:'';position:absolute;left:10px;right:10px;bottom:4px;height:3px;border-radius:3px;background:var(--gold)}.builder-sidebar{padding:14px;border:1px solid var(--line);border-radius:14px;background:#f8faf8}.builder-sidebar>label{padding-bottom:2px}.builder-sidebar input:focus,.builder-sidebar select:focus,.builder-sidebar textarea:focus{outline:3px solid #147a5125;border-color:var(--mid)}.saved-drills{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;padding:18px;background:#f4f7f5}.drill-card{display:grid;align-content:start;gap:12px;padding:0;border:1px solid var(--line);border-radius:15px;background:#fff;overflow:hidden;box-shadow:0 7px 18px #123a2a0d;transition:transform .16s ease,box-shadow .16s ease}.drill-card:hover{transform:translateY(-2px);box-shadow:0 13px 30px #123a2a18}.drill-preview{position:relative;aspect-ratio:3/2;padding:10px;background:#153f2e;overflow:hidden}.drill-preview svg{display:block;width:100%;height:100%;pointer-events:none}.drill-preview>span{position:absolute;top:14px;right:14px;padding:5px 8px;border-radius:99px;background:#ffffffeb;color:var(--mid);font-size:9px;font-weight:900;letter-spacing:.09em}.drill-card-copy{display:grid;gap:8px;padding:0 15px}.drill-card-copy>strong{font-size:17px}.drill-meta{display:flex;gap:6px;flex-wrap:wrap}.drill-meta span{padding:5px 8px;border-radius:99px;background:#edf3ef;color:#53655b;font-size:11px;font-weight:750}.drill-card-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:7px!important;padding:0 15px 15px}.drill-card-actions button{min-height:44px}.drill-card-actions .view-drill{background:var(--mid);border-color:var(--mid);color:#fff}.drill-card-actions .delete-drill{color:#9d3030}.saved-empty{display:grid;justify-items:center;gap:6px;grid-column:1/-1;padding:55px 20px;color:var(--muted);text-align:center}.saved-empty strong{color:var(--text);font-size:18px}
@media(min-width:801px){.builder-sidebar{position:sticky;top:12px}.drill-viewer-head{padding:16px 22px}}
@media(max-width:800px){.practice-home{display:flex;overflow-x:auto;padding-bottom:4px}.practice-choice{flex:0 0 82%;min-height:80px}.builder-heading{padding:15px}.builder-heading p{font-size:13px}.board-wrap{border-width:3px}.builder-sidebar{padding:12px}.saved-drills{grid-template-columns:1fr;padding:10px}.playback-controls{padding-bottom:9px}.step-list button{min-width:88px}.drill-card:hover{transform:none}}

.cone-options,.goal-options{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff8e8}.cone-options[hidden],.goal-options[hidden]{display:none}.cone-options>div,.goal-options>div{display:flex;gap:6px;overflow-x:auto}.cone-options button,.goal-options button{min-width:76px;min-height:42px;padding:7px 10px;border:1px solid #ead493;border-radius:9px;background:#fff;color:var(--text);font-weight:800}.cone-options button.active,.goal-options button.active{background:var(--gold);border-color:#dba72c;color:var(--green)}.board-text{font:900 24px/1 system-ui;paint-order:stroke;stroke:#123a2a;stroke-width:5px;stroke-linejoin:round}.object-editor #object-size-label{grid-template-columns:1fr auto}.object-editor #object-size-label input{grid-column:1/-1;padding:0;accent-color:var(--mid)}.object-editor select{width:100%;min-height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:8px;font:inherit}
@media(max-width:800px){.cone-options,.goal-options{display:grid;gap:6px}.cone-options>div,.goal-options>div{padding-bottom:2px}.cone-options button,.goal-options button{min-width:88px;min-height:44px}}
/* v26: direct object selection and iPhone editing sheet */
#object-done{background:var(--mid);border-color:var(--mid);color:#fff}
@media(max-width:800px){.object-editor:not([hidden]){position:fixed;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:30;max-height:min(68dvh,560px);overflow:auto;padding:16px;border:1px solid #aacbbb;border-radius:16px;background:#f8faf8;box-shadow:0 18px 60px #071b1466}.object-editor:not([hidden])::before{content:'EDIT OBJECT';display:block;margin-bottom:5px;color:var(--mid);font-size:10px;font-weight:900;letter-spacing:.12em}.object-editor>div{display:grid;grid-template-columns:1fr 1fr}.object-editor #object-done{grid-column:1/-1;min-height:48px}.object-editor input,.object-editor select{min-height:44px}}
/* v27: keep object editing inline with the placement controls */
.board-column>.object-editor{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#f8faf8}.board-column>.object-editor h3{display:flex;align-items:center;gap:8px;margin:0 0 10px}.board-column>.object-editor h3::before{content:'EDIT';padding:4px 7px;border-radius:99px;background:#e3f1e9;color:var(--mid);font-size:9px;letter-spacing:.1em}.board-column>.object-editor>label{display:grid;gap:5px;margin-top:9px;font-weight:750}.board-column>.object-editor>div{display:flex;gap:8px;margin-top:12px}.board-column>.object-editor button{min-height:42px;padding:8px 14px;border:1px solid var(--line);border-radius:9px;background:#fff;font-weight:800}
@media(max-width:800px){.board-column>.object-editor:not([hidden]){position:static;inset:auto;z-index:auto;max-height:none;overflow:visible;padding:12px;border:1px solid #bed9ca;border-radius:12px;background:#f8faf8;box-shadow:none}.board-column>.object-editor:not([hidden])::before{display:none}.board-column>.object-editor>div{display:grid;grid-template-columns:1fr 1fr}.board-column>.object-editor #object-done{grid-column:1/-1}.board-column>.object-editor input,.board-column>.object-editor select{min-height:44px}}
.board-column>.object-editor>label[hidden],.board-column>.object-editor[hidden]{display:none!important}
