/* Shared dependency-free demo surface for Appliqué, Stitchline, and Sprint. */
.applique-page .site-header .site-nav .mobile-menu,
.stitchline-page .site-header .site-nav .mobile-menu,
.sprint-page .site-header .site-nav .mobile-menu{display:none;position:relative}
.applique-page .mobile-menu summary,
.stitchline-page .mobile-menu summary,
.sprint-page .mobile-menu summary{list-style:none;cursor:pointer;border:1px solid var(--ink);border-radius:999px;padding:10px 13px;font-size:13px;font-weight:700}
.applique-page .mobile-menu summary::-webkit-details-marker,
.stitchline-page .mobile-menu summary::-webkit-details-marker,
.sprint-page .mobile-menu summary::-webkit-details-marker{display:none}
.applique-page .mobile-menu-panel,
.stitchline-page .mobile-menu-panel,
.sprint-page .mobile-menu-panel{position:absolute;right:0;top:calc(100% + 10px);z-index:20;display:grid;min-width:190px;gap:4px;padding:10px;background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 44px rgba(31,28,20,.16)}
.applique-page .mobile-menu-panel a,
.stitchline-page .mobile-menu-panel a,
.sprint-page .mobile-menu-panel a{display:block!important;padding:10px 12px;border-radius:10px;font-size:14px}
.applique-page .mobile-menu-panel a:hover,
.stitchline-page .mobile-menu-panel a:hover,
.sprint-page .mobile-menu-panel a:hover{background:var(--cloth);color:var(--red)}
.mode-demo{display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:clamp(28px,6vw,88px);align-items:center;margin:88px 0 92px;padding:clamp(28px,5vw,68px);background:var(--navy);color:#fff;border-radius:28px;overflow:hidden}
.mode-demo-copy h2{font-size:clamp(34px,4vw,58px);line-height:.98;letter-spacing:-.06em;margin:0 0 20px}
.mode-demo-copy>p{max-width:450px;color:rgba(255,255,255,.82);font-size:17px;line-height:1.65}
.mode-demo-eyebrow{margin-bottom:18px;color:var(--saffron)}
.mode-demo-eyebrow:before{content:"";display:inline-block;width:28px;height:2px;margin-right:9px;background:var(--saffron);vertical-align:middle}
.mode-demo-steps{display:grid;gap:12px;margin:30px 0 0;padding:0;list-style:none;counter-reset:mode-step}
.mode-demo-steps li{position:relative;padding-left:42px;color:rgba(255,255,255,.76);line-height:1.5}
.mode-demo-steps li:before{counter-increment:mode-step;content:counter(mode-step);position:absolute;left:0;top:-2px;display:grid;place-items:center;width:27px;height:27px;border:1px solid rgba(245,162,58,.8);border-radius:50%;color:var(--saffron);font-size:12px;font-weight:800}
.mode-demo-steps b{color:#fff}
.mode-demo-cta{display:grid;gap:6px;margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2)}
.mode-demo-cta strong{font-size:21px}
.mode-demo-cta span{color:rgba(255,255,255,.72);line-height:1.5}
.mode-demo-store-link{display:inline-flex;justify-self:start;align-items:center;gap:14px;margin-top:10px;padding:13px 18px;border-radius:999px;background:var(--saffron);color:var(--ink);font-size:13px;font-weight:800;text-decoration:none}
.mode-demo-store-link:hover{background:#ffc16a}
.mode-demo-surface{padding:20px;background:var(--paper);color:var(--ink);border-radius:22px;box-shadow:0 24px 60px rgba(0,0,0,.16)}
.mode-demo-surface-header{display:flex;justify-content:space-between;gap:18px;align-items:start;margin:2px 2px 16px}
.mode-demo-surface-header div{display:grid;gap:4px}
.mode-demo-label{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.mode-demo-surface-header strong{font-size:20px;letter-spacing:-.03em}
.mode-demo-progress{color:var(--muted);font-size:12px;font-weight:750;white-space:nowrap}
.mode-demo-hint{margin:10px 2px 0;color:#5f584f;font-size:12px;line-height:1.45}
.mode-demo-status{min-height:48px;margin:16px 2px 0;padding:12px 14px;border-left:3px solid var(--red);background:#fff;color:#4f4942;font-size:14px;line-height:1.45}
.mode-demo-controls{display:flex;flex-wrap:wrap;gap:9px;margin:16px 2px 0;padding:0;border:0}
.mode-demo-controls legend{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mode-demo-button{border:1px solid #9f9487;border-radius:999px;padding:11px 14px;background:transparent;color:var(--ink);font:700 12px/1.1 Arial,sans-serif;cursor:pointer}
.mode-demo-button:hover:not(:disabled){background:#f0e5d6}
.mode-demo-button:focus-visible,.mode-demo-store-link:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.mode-demo-button:disabled{cursor:not-allowed;opacity:.45}
.mode-demo-button-primary{border-color:var(--ink);background:var(--ink);color:#fff}
.mode-demo-button-primary:hover:not(:disabled){background:#39342d}
.mode-demo-button-quiet{margin-left:auto}
.mode-demo-noscript{margin:16px 2px 0;color:#5f584f;font-size:13px;line-height:1.5}
.applique-board{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;padding:9px;aspect-ratio:1;background:#e5dccd;border:4px solid #d0c4b4;border-radius:15px}
.applique-cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border:0;border-radius:7px;background:#fffaf2;color:var(--ink);font:700 clamp(14px,2.8vw,24px)/1 Arial,sans-serif;cursor:pointer;transition:background-color .16s ease,box-shadow .16s ease,transform .16s ease}
.applique-cell:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 9px rgba(23,21,18,.14)}
.applique-cell:focus-visible{z-index:2;outline:3px solid var(--red);outline-offset:-5px}
.applique-cell:disabled{cursor:default}
.applique-cell[data-colour="coral"]{background:#ef806d;color:#fff}
.applique-cell[data-colour="teal"]{background:#61ae9d;color:#fff}
.applique-cell[data-colour="saffron"]{background:#f5b45c;color:var(--ink)}
.applique-cell[data-colour="navy"]{background:#496d87;color:#fff}
.applique-cell.is-selected{box-shadow:inset 0 0 0 4px var(--red),0 0 0 2px #fff}
.applique-cell.is-solved{box-shadow:inset 0 0 0 4px var(--teal),0 0 0 2px #fff}
.applique-cell.is-hint{box-shadow:inset 0 0 0 4px var(--saffron),0 0 0 2px #fff}
.applique-cell:after{content:"";position:absolute;inset:7px;border:1px solid rgba(255,255,255,.4);border-radius:5px;pointer-events:none}
.applique-cell .cell-mark{position:absolute;right:6px;bottom:4px;color:#fff;font-size:13px;font-weight:900}
.applique-cell[data-colour="saffron"] .cell-mark{color:var(--ink)}
.applique-page main{padding-bottom:92px}.applique-page .game-hero img{aspect-ratio:1320 / 2868;height:min(650px,calc(100vh - 150px));object-fit:cover;object-position:top}.applique-page .guide{margin-top:0}.applique-page .related{margin-bottom:0}
.stitchline-board{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:0;aspect-ratio:1;padding:10px;border-radius:15px;background:#e5dccd;overflow:hidden}
.stitchline-svg{position:absolute;inset:10px;width:calc(100% - 20px);height:calc(100% - 20px);pointer-events:none;overflow:visible}
.stitchline-line{fill:none;stroke:var(--teal);stroke-width:13;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.stitchline-line.is-complete{stroke:var(--red)}
.stitchline-node{position:relative;z-index:1;display:grid;place-items:center;min-width:0;min-height:0;margin:8px;padding:0;border:0;border-radius:50%;background:#fffaf2;color:var(--ink);font:700 14px/1 Arial,sans-serif;cursor:pointer;box-shadow:0 0 0 1px rgba(23,21,18,.08);transition:background-color .16s ease,box-shadow .16s ease,transform .16s ease}
.stitchline-node:hover:not(:disabled){transform:scale(1.06)}
.stitchline-node:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.stitchline-node.is-clue{background:#f5d7a2;box-shadow:0 0 0 3px var(--saffron)}
.stitchline-node.is-active{background:#cbe2d9;box-shadow:0 0 0 3px var(--teal)}
.stitchline-node.is-next{box-shadow:0 0 0 3px var(--red)}
.stitchline-node.is-complete{background:#ef806d;color:#fff}
.stitchline-node:disabled{cursor:default}
.stitchline-page main{padding-bottom:92px}.stitchline-page .game-hero img{aspect-ratio:1320 / 2868;height:min(650px,calc(100vh - 150px));object-fit:cover;object-position:top}.stitchline-page .guide{margin-top:0}.stitchline-page .related{margin-bottom:0}
.sprint-board{display:grid;gap:10px;padding:14px;border-radius:15px;background:#e5dccd}
.sprint-board-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;aspect-ratio:1;padding:8px;border-radius:11px;background:#d0c4b4}
.sprint-board-cell{display:grid;place-items:center;border-radius:5px;background:#fffaf2;color:var(--ink);font-size:16px;font-weight:800}
.sprint-board-cell.is-focus{background:#f5d7a2;color:var(--ink);box-shadow:inset 0 0 0 3px var(--saffron)}
.sprint-board-cell.is-quiet{background:#cbe2d9;color:var(--ink)}
.sprint-choices{display:grid;gap:9px}
.sprint-choice{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:center;text-align:left;padding:12px 14px;border:1px solid #b7aa9b;border-radius:13px;background:#fffaf2;color:var(--ink);font:inherit;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,transform .16s ease}
.sprint-choice:hover:not(:disabled){transform:translateX(3px);border-color:var(--red);background:#fff}
.sprint-choice:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.sprint-choice b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px}
.sprint-choice span{font-size:13px;line-height:1.35}
.sprint-choice.is-selected{border-color:var(--red);box-shadow:inset 0 0 0 2px var(--red)}
.sprint-choice.is-correct{border-color:var(--teal);background:#cbe2d9}
.sprint-choice.is-wrong{border-color:var(--red);background:#f7d6ce}
.sprint-choice:disabled{cursor:default}
.sprint-timer{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:800;white-space:nowrap}.sprint-timer strong{display:inline-grid;place-items:center;min-width:48px;padding:7px 8px;border-radius:999px;background:var(--ink);color:#fff;font-variant-numeric:tabular-nums}.sprint-timer.is-low strong{background:var(--red)}
.sprint-page main{padding-bottom:92px}.sprint-page .game-hero img{aspect-ratio:1320 / 2868;height:min(650px,calc(100vh - 150px));object-fit:cover;object-position:top}.sprint-page .guide{margin-top:0}.sprint-page .related{margin-bottom:0}
@media(max-width:900px){.mode-demo{grid-template-columns:1fr}.mode-demo-copy>p{max-width:600px}.applique-page .game-hero img,.stitchline-page .game-hero img,.sprint-page .game-hero img{height:560px;max-width:430px;justify-self:center}}
@media(max-width:760px){.applique-page .site-header .site-nav .mobile-menu,.stitchline-page .site-header .site-nav .mobile-menu,.sprint-page .site-header .site-nav .mobile-menu{display:block}.applique-page .site-header .site-nav>a:not(.nav-cta):not(.nav-store),.stitchline-page .site-header .site-nav>a:not(.nav-cta):not(.nav-store),.sprint-page .site-header .site-nav>a:not(.nav-cta):not(.nav-store){display:none}.applique-page .site-header .site-nav .mobile-menu-panel a,.stitchline-page .site-header .site-nav .mobile-menu-panel a,.sprint-page .site-header .site-nav .mobile-menu-panel a{display:block!important}.applique-page .game-hero img,.stitchline-page .game-hero img,.sprint-page .game-hero img{height:480px}.mode-demo{margin:60px 0 68px;padding:22px 16px;border-radius:21px}.mode-demo-surface{padding:14px;border-radius:17px}.mode-demo-surface-header strong{font-size:17px}.mode-demo-button{padding:12px 11px}.mode-demo-button-quiet{margin-left:0}.mode-demo-progress{white-space:normal}.mode-demo-controls{gap:7px}.stitchline-node{margin:5px}.sprint-choice{padding:11px 12px}.mobile-download-bar{position:sticky;bottom:0;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px;background:var(--ink);color:#fff;box-shadow:0 -10px 28px rgba(23,21,18,.16)}.mobile-download-bar div{display:grid;gap:3px}.mobile-download-bar strong{font-size:12px}.mobile-download-bar span{color:rgba(255,255,255,.65);font-size:11px}.mobile-download-bar a{flex:none;padding:10px 13px;border-radius:999px;background:var(--saffron);color:var(--ink);font-size:12px;font-weight:800;text-decoration:none}.mobile-download-bar a:focus-visible{outline:3px solid #fff;outline-offset:3px}}
@media(prefers-reduced-motion:reduce){.applique-page *,.applique-page *:before,.applique-page *:after,.stitchline-page *,.stitchline-page *:before,.stitchline-page *:after,.sprint-page *,.sprint-page *:before,.sprint-page *:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.applique-cell:hover:not(:disabled),.stitchline-node:hover:not(:disabled),.sprint-choice:hover:not(:disabled){transform:none}}
@media(max-width:480px){.mode-demo-surface-header{display:grid;gap:7px}.mode-demo-controls{gap:7px}.mode-demo-button{font-size:11px}.sprint-timer{white-space:normal}.mobile-download-bar{align-items:flex-start}.mobile-download-bar a{margin-top:1px}}