/* A profile owns the grid; viewport changes never reflow its cells. */
body[data-level] #grid {grid-template-columns:repeat(var(--stable-cols,4),minmax(0,1fr))!important;grid-auto-rows:minmax(var(--stable-size,130px),auto)!important;gap:var(--stable-gap,10px)!important;align-content:start!important;max-width:none!important;width:100%!important}
body[data-level] #core {display:grid!important;grid-template-columns:repeat(var(--core-cols,6),minmax(0,1fr))!important;gap:var(--stable-gap,10px)!important}
body[data-level] #grid .tile img {width:min(75%,130px)!important;height:auto!important;max-height:120px;object-fit:contain}
body[data-level] #grid .tile .sym {font-size:clamp(2rem,8vw,4rem)!important}
body[data-level] #grid .tile {font-size:clamp(.9rem,2.5vw,1.3rem);min-width:0;overflow-wrap:anywhere}
.tile.ghost {visibility:hidden;pointer-events:none}
.core-ghost {visibility:hidden;pointer-events:none}
.holding {outline:5px solid var(--focus)!important;outline-offset:-5px}
body.calm *,body.no-motion * {animation:none!important;transition:none!important;scroll-behavior:auto!important}
body.no-feedback .flash {box-shadow:none!important;outline:none!important;filter:none!important}
#tmView {position:static!important;inset:auto!important;z-index:auto!important;padding:12px!important;background:var(--panel)!important;color:var(--ink)!important;border-radius:16px;gap:10px!important}
#tmView .breath {display:none!important}
#tmView.on {display:flex!important}
#tmActions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:600px}
#tmActions button {font:inherit;font-size:1.15rem;min-height:70px;border:2px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink)}
.settings-extra {margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.settings-extra h3 {margin-top:0}
.settings-extra label {display:block;margin-top:12px}
.settings-extra select,.settings-extra input:not([type=checkbox]):not([type=range]),.settings-extra textarea {width:100%;max-width:100%;font:inherit;padding:9px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.settings-extra .sbtns {flex-wrap:wrap}
.settings-extra p {line-height:1.5}
.preview-grid {display:grid;gap:6px;margin:12px 0}
.preview-grid div {border:1px solid var(--line);border-radius:8px;padding:8px;min-height:45px;overflow-wrap:anywhere;text-align:center}
.preview-grid .empty {opacity:.3}
.preview-interactive {margin:20px 0}
.preview-speech-button {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:120px;padding:14px;border:2px solid var(--line);border-radius:16px;background:var(--panel);color:var(--ink);font:inherit;font-size:1.1rem;cursor:pointer;touch-action:manipulation}
.preview-speech-button img {width:72px;height:72px;object-fit:contain}
.preview-speech-button .sym {font-size:3rem;line-height:1}
.preview-speech-button:focus-visible {outline:4px solid var(--focus)}
.preview-empty {min-height:120px;opacity:.4}
#gFoot {position:sticky;bottom:0;background:var(--bg);padding:12px 0 max(12px,env(safe-area-inset-bottom));z-index:2}
#gFoot button {touch-action:manipulation}
@media (max-width:520px) {#gFoot:has(#inlinePreviewSave080){display:flex;flex-direction:column;gap:10px}#gFoot:has(#inlinePreviewSave080) button{width:100%}.preview-speech-button{min-height:100px;padding:10px}.preview-speech-button img{width:58px;height:58px}}
#cropCanvas {width:min(100%,320px);height:auto;display:block;margin:12px auto;border:2px solid var(--line);border-radius:12px}
.crop-controls {display:grid;gap:8px}
#touchTrial {min-height:100px;width:100%;font-size:1.4rem;border-radius:14px;background:var(--focus);color:white;border:0;touch-action:none}
#obsDlg .score,#obsDlg #oItems {display:none!important}
.ver-note {border-left:4px solid var(--focus);padding:10px}
.intro-body {max-width:720px;font-size:1.08rem;line-height:1.65}
.intro-body p {margin:14px 0}
.intro-body details {padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.intro-body summary {cursor:pointer;font-weight:700}
.intro-example {display:flex;align-items:center;justify-content:center;gap:24px;margin:24px 0}
.intro-example>div {display:flex;flex-direction:column;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:20px;min-width:120px}
.intro-example img,.intro-demo img {width:76px;height:76px;object-fit:contain}
.intro-example .sym,.intro-voice,.intro-demo .sym {font-size:3.5rem;line-height:1.2}
.intro-demo {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0}
.intro-demo-button,.intro-static>div {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:160px;border:2px solid var(--line);border-radius:20px;background:var(--panel);color:var(--ink);font:inherit;font-size:1.2rem;padding:16px;touch-action:manipulation}
.intro-demo-button {cursor:pointer}
.intro-demo-button:focus-visible {outline:4px solid var(--focus);outline-offset:3px}
.intro-feedback {background:var(--bg);padding:12px 16px;border-radius:12px;min-height:52px}
.intro-story {background:var(--panel);border:1px solid var(--line);border-left:5px solid var(--focus);border-radius:16px;padding:18px;margin:20px 0}
.intro-story p {margin-bottom:0}
.intro-final {display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}
#gSkip {max-width:180px;white-space:normal;font-size:.9rem}
#gFoot .pbtn {min-height:52px}
@media (max-width:520px) {.intro-body{font-size:1rem}.intro-example{gap:12px}.intro-example>div{min-width:100px;padding:16px}.intro-demo{gap:8px}.intro-demo-button,.intro-static>div{min-height:135px;padding:10px;font-size:1rem}.intro-demo img{width:62px;height:62px}.intro-final{width:100%;flex-direction:column}.intro-final .pbtn{width:100%}}
@media print {body.pboard #printArea .pgrid {grid-template-columns:repeat(var(--print-cols,4),minmax(0,1fr))!important;break-inside:avoid}body.pboard #printArea .pgrid>div {min-height:90px}body.pboard #printArea img {max-width:75px;max-height:75px}body.pboard #printArea .blank {border:1px dashed #ccc}}