.domino-play{position:fixed;inset:0;z-index:255;isolation:isolate;overflow:hidden;background:#f7f6f0;color:#253d59;font-family:inherit;--domino-blue:#347fa7;--domino-border:#d6e1e5}
.domino-play[hidden]{display:none!important}.domino-play *{box-sizing:border-box}.domino-play button{font:inherit;border:1px solid var(--domino-border);border-radius:14px;min-height:44px;padding:0 16px;background:#fffdf8;color:#253d59;cursor:pointer;touch-action:manipulation;white-space:nowrap;font-weight:650}.domino-play button:hover{background:#edf5f7}.domino-play button:disabled{opacity:.4;cursor:default}.domino-play button:focus-visible,.domino-stage:focus-visible{outline:3px solid #468bb6;outline-offset:4px}.domino-play button[aria-pressed=true]{background:#dceef4;border-color:#87b8cd}
.domino-header{position:absolute;top:max(22px,env(safe-area-inset-top));left:max(30px,env(safe-area-inset-left));right:max(28px,env(safe-area-inset-right));z-index:3;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.domino-header-actions{display:flex;gap:8px;pointer-events:auto}.domino-eyebrow{font-size:10px;font-weight:750;letter-spacing:.18em;color:#698394}.domino-header h2{font-size:32px;font-weight:800;letter-spacing:-.04em;margin:5px 0 4px;line-height:1.15}.domino-header h2 span{font-size:18px;letter-spacing:-5px;color:#e7928c;vertical-align:middle;margin-left:16px}.domino-header p{font-size:13px;color:#70828e;margin:6px 0}.domino-play .domino-icon{border-radius:50%;width:44px;padding:0;font-size:25px;background:#ffffffa8}
.domino-topbar{position:absolute;left:30px;right:30px;top:140px;z-index:3;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.domino-topbar>div{pointer-events:auto}.domino-modes{display:flex;border:1px solid var(--domino-border);border-radius:17px;background:#fffdf8;padding:4px;gap:3px;box-shadow:0 4px 18px #31527206}.domino-modes button{border-color:transparent;border-radius:12px;font-size:14px;min-height:40px}.domino-view{display:flex;gap:6px}.domino-view button{font-size:12px;min-height:38px;padding:0 12px;background:#fffdf8c7}
.domino-stage{position:absolute;inset:185px 0 183px;outline:none;touch-action:none;cursor:grab}.domino-stage canvas{display:block;width:100%;height:100%;touch-action:none}.domino-play[data-mode=push] .domino-stage{cursor:pointer}.domino-stage:active{cursor:grabbing}.domino-selection{position:absolute;left:50%;bottom:187px;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:5px;padding:5px;border:1px solid var(--domino-border);border-radius:17px;background:#fffdf8f2;box-shadow:0 7px 20px #364e5912}.domino-selection[hidden]{display:none}.domino-selection span{font-size:11px;padding:0 7px;color:#6a7e89}.domino-selection button{font-size:12px;min-height:38px;padding:0 10px;border-radius:10px}
.domino-footer{position:absolute;left:24px;right:24px;bottom:max(18px,env(safe-area-inset-bottom));z-index:3;display:flex;flex-direction:column;align-items:center}.domino-feedback{display:flex;align-items:center;gap:12px;margin-bottom:16px;min-height:26px}.domino-count{border-radius:20px;background:#e4edf0;color:#426b85;font-size:12px;font-weight:750;font-variant-numeric:tabular-nums;padding:6px 11px;white-space:nowrap}.domino-feedback p{margin:0;font-size:14px;color:#627785;line-height:1.5}.domino-play[data-state=complete] .domino-feedback p{color:#328574;font-weight:750}.domino-play[data-state=blocked] .domino-feedback p{color:#9b6f3c}.domino-controls{display:flex;gap:10px;align-items:center}.domino-controls button{min-height:54px}.domino-build-tools{display:flex;gap:5px}.domino-controls .domino-primary{background:var(--domino-blue);color:#fff;border:0;min-width:210px;box-shadow:0 4px 0 #246580;font-size:17px}.domino-controls .domino-primary:hover{background:#2e759b}.domino-examples{display:flex;align-items:center;gap:5px;margin-top:18px}.domino-examples>span:first-child{font-size:10px;letter-spacing:.1em;color:#7c919c;margin-right:6px}.domino-examples button{background:transparent;border:0;font-size:12px;min-height:28px;padding:0 10px;font-weight:500;color:#657d8c}.domino-hint{font-size:10px;color:#91a1a8;margin-left:12px}
@media(max-width:700px){.domino-header{left:20px;right:18px;top:max(17px,env(safe-area-inset-top))}.domino-header h2{font-size:28px}.domino-header p{font-size:12px;max-width:240px}.domino-eyebrow{font-size:9px}.domino-header-actions{gap:5px}.domino-play .domino-icon{width:40px;min-height:40px;font-size:23px}.domino-topbar{top:125px;left:16px;right:16px;gap:8px}.domino-modes button{font-size:12px;padding:0 10px;min-height:36px}.domino-view{gap:4px}.domino-view button{font-size:11px;padding:0 9px;min-height:36px}.domino-stage{inset:179px 0 217px}.domino-footer{left:12px;right:12px;bottom:max(14px,env(safe-area-inset-bottom))}.domino-feedback{gap:8px;margin-bottom:12px;max-width:100%;min-height:42px}.domino-feedback p{font-size:12px;max-width:265px}.domino-count{font-size:11px;padding:5px 8px}.domino-controls{display:grid;grid-template-columns:1fr 1fr;gap:9px;width:100%;max-width:430px}.domino-controls .domino-primary{grid-row:1;grid-column:1/-1;min-width:0;min-height:50px;font-size:16px}.domino-build-tools button:first-child{flex:1}.domino-controls button{min-height:40px;font-size:12px;padding:0 12px}.domino-examples{margin-top:10px;gap:2px}.domino-examples button{font-size:11px;padding:0 8px}.domino-hint{display:none}.domino-selection{bottom:218px;max-width:calc(100vw - 20px)}.domino-selection span{display:none}}
@media(max-height:570px) and (min-width:480px){.domino-header{top:12px;left:18px}.domino-header h2{font-size:24px}.domino-header p{display:none}.domino-topbar{top:80px;left:18px;right:190px;flex-wrap:wrap;gap:6px}.domino-stage{inset:147px 180px 18px 10px}.domino-footer{left:auto;right:18px;bottom:14px;width:160px}.domino-feedback{flex-direction:column;gap:6px;text-align:center;margin-bottom:10px}.domino-feedback p{font-size:11px}.domino-controls{display:flex;flex-direction:column;gap:8px}.domino-controls button{min-height:38px;font-size:12px}.domino-controls .domino-primary{min-width:155px;font-size:13px}.domino-examples{flex-wrap:wrap;justify-content:center;margin-top:8px;gap:0}.domino-examples span{display:none}.domino-examples button{font-size:10px;padding:0 6px;min-height:25px}.domino-selection{bottom:7px;left:calc((100% - 180px)/2);max-width:calc(100% - 190px);gap:3px}.domino-selection span{display:none}.domino-selection button{min-height:32px;font-size:10px;padding:0 7px}}

@media(max-width:360px) and (min-height:480px){.domino-header h2{font-size:26px}.domino-header h2 span,.domino-header p{display:none}.domino-topbar{top:112px;flex-wrap:wrap;row-gap:7px}.domino-view{width:100%;justify-content:flex-end}.domino-stage{top:211px}}