.piece-dialog.is-tactile{width:min(940px,calc(100% - 24px));max-height:94svh;padding:0;background:#fbf7ec;border:1px solid #d8d8bf}
.piece-dialog.is-tactile[open]{display:block}.is-tactile .dialog-art,.is-tactile .story-thread,.is-tactile .practice-picker,.is-tactile .practice-actions{display:none!important}.is-tactile .dialog-copy{padding:24px 28px 19px}.is-tactile .dialog-copy>h2{font:500 34px/1.05 var(--serif);margin:0 50px 10px 0}.is-tactile .dialog-copy>.eyebrow{margin-bottom:7px}.is-tactile .practice-intro{font-size:12px;line-height:1.6;margin:0 45px 12px 0}.is-tactile .practice-body{margin:0;min-height:0}
.reflect-workspace{position:relative;aspect-ratio:900/670;overflow:hidden;border:1px solid #dce0ca;border-radius:9px;background:radial-gradient(ellipse at 50% 32%,#f9fae9,#e7edda 68%,#dfe4cc);box-shadow:inset 0 -24px 30px #b8c59a20}
.reflect-workspace>canvas{display:block;width:100%;height:100%;touch-action:none;outline:0}.reflect-workspace>canvas:focus-visible{outline:2px solid #ab8a48;outline-offset:-4px}
.reflect-leaf-targets,.reflect-twig-targets{position:absolute;inset:0;pointer-events:none}.reflect-leaf-targets>button,.reflect-twig-targets>button{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);padding:0;background:transparent;border:0;pointer-events:none;border-radius:50%}.reflect-leaf-targets>button:focus-visible,.reflect-twig-targets>button:focus-visible{outline:1px dashed #a58034;outline-offset:0;background:#fff2bb20}
.reflect-shears{position:absolute;pointer-events:none;width:90px;height:90px;object-fit:contain;transform:translate(-12%,-13%);filter:drop-shadow(2px 3px 2px #2a382b40)}.reflect-loading{position:absolute;top:45%;left:10%;width:80%;text-align:center;font:500 25px var(--serif);color:#667950}
.tactile-toolbar{display:flex;justify-content:center;align-items:center;gap:9px;margin:13px 0 0}.tactile-toolbar button{width:46px;height:44px;border:1px solid #d9ddc7;background:#f6f5e9;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#657553}.tactile-toolbar button:hover,.tactile-toolbar button[aria-pressed=true]{background:#e6ecd8;border-color:#a8b98c}.tactile-toolbar button svg{width:21px;height:21px}.tactile-toolbar button:disabled{opacity:.35}
.sand-reflect{background:radial-gradient(ellipse,#e2e5cf,#f5f1e1);border-color:#d7d5bf}.reflect-sand-tool{position:absolute;height:0;pointer-events:none;transform:translate(-50%,0) rotate(var(--tool-angle,-35deg));transform-origin:50% 0}.reflect-sand-tool img{display:block;width:100%;height:auto;max-width:none;transform:translateY(-99%);filter:drop-shadow(3px 6px 3px #4c402d38);user-select:none}.reflect-sand-tool.is-drawing img{filter:drop-shadow(1px 2px 1px #4c402d55)}.sand-reflect canvas{cursor:crosshair}.sand-reflect:has(.reflect-sand-tool:not([hidden])) canvas{cursor:none}
.stone-touch-targets{position:absolute;inset:0;pointer-events:none}.stone-touch-targets button{position:absolute;min-width:44px;min-height:44px;padding:0;background:transparent;border:0;border-radius:40%;touch-action:none;pointer-events:auto;cursor:grab}.stone-touch-targets button[aria-grabbed=true]{cursor:grabbing;outline:1px dashed #fff8d6;outline-offset:4px}.stone-touch-targets button:focus-visible{outline:2px solid #ad8b43;outline-offset:4px}.stones-reflect{aspect-ratio:900/430;background:radial-gradient(ellipse at 50% 10%,#f9faed,#e9ecdc 70%,#e4dfca)}
@media(max-width:700px){.piece-dialog.is-tactile{width:calc(100% - 14px);max-height:94svh}.is-tactile .dialog-copy{padding:21px 13px 15px}.is-tactile .dialog-copy>h2{font-size:30px;margin-left:4px;margin-right:36px}.is-tactile .dialog-copy>.eyebrow{margin-left:4px}.is-tactile .practice-intro{font-size:12px;margin:0 28px 13px 4px}.reflect-workspace{aspect-ratio:900/770;background:radial-gradient(ellipse at 50% 40%,#f7f9e7,#e5ebd5)}.reflect-shears{width:73px;height:73px}.tactile-toolbar{gap:9px;margin-top:12px}.tactile-toolbar button{min-height:44px;min-width:44px}.is-tactile .dialog-close{top:12px;right:12px}}
@media(prefers-reduced-motion:reduce){.reflect-workspace *{animation:none!important;transition:none!important}}
@media(max-width:700px){.stones-reflect{aspect-ratio:900/650}}

.sand-width-control{display:flex;align-items:center;gap:9px;font-size:12px;color:#43523c;min-height:44px;flex-wrap:nowrap}
.sand-width-control input{width:125px;min-height:36px;accent-color:#707857}
.sand-width-control output{min-width:48px;font-size:11px}
@media(max-width:600px){.piece-dialog.reflect-dialog:has(.sand-width-control) .reflect-workspace{max-height:calc(100dvh - 240px)}.sand-width-control{flex-basis:100%;justify-content:center}}