@font-face{font-family:Fredoka;src:url(/fonts/Fredoka.ttf)}html:has(body.dominos-page),body.dominos-page{background:#153b3e;overflow:hidden}body.dominos-page{background:#153b3e url(/images/jeux/bricolo-fond.webp) 50%/cover no-repeat;margin:0}.dominos{--paper:#f3efe4;--ink:#153b3e;--left:#b84d27;--right:#236caa;color:var(--paper);height:100dvh;font:16px/1.25 Fredoka,sans-serif}.dominos *{box-sizing:border-box}.dominos main{grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:12px;max-width:1500px;height:100%;margin:auto;padding:16px 28px 10px;display:grid}.dominos h1,.dominos h2,.dominos h3{letter-spacing:normal;margin:0;font-family:inherit;font-style:normal;font-weight:500}.dominos h1{font-size:26px;font-weight:600}.dominos p{margin:0}.dominos header,.dominos .board-head,.dominos .workshop-head,.dominos .sheet-footer{justify-content:space-between;align-items:center;gap:12px;display:flex}.dominos .return-link{color:var(--paper);text-underline-offset:3px;align-items:center;min-height:44px;text-decoration:underline;display:flex}.dominos button,.dominos input{font:inherit}.dominos button{cursor:pointer;background:var(--paper);min-height:44px;color:var(--ink);border:0;border-radius:10px}.dominos button:hover:not(:disabled){background:#ffe3b6}.dominos button:disabled{opacity:.45;cursor:default}.dominos button:focus-visible,.dominos input:focus-visible,.dominos a:focus-visible{outline-offset:3px;outline:3px solid #e6ae2e}.dominos ::selection{color:var(--ink);background:#edc854}.dominos nav{grid-template-columns:repeat(9,52px);gap:8px;display:grid}.dominos nav button{font-size:24px}.dominos nav button[aria-pressed=true]{color:#fff;background:#b34b2c}.dominos .intro{justify-content:center;align-items:center;gap:24px;min-height:0;display:flex}.dominos .robot{object-fit:contain;width:92px;height:104px}.dominos .target{text-align:center;min-width:100px;font-size:82px;font-weight:600;line-height:1}.dominos .intro h2{margin-bottom:6px;font-size:28px}.dominos .intro p{color:#d8e5e1;font-size:17px}.dominos .workspace{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;min-height:0;display:grid}.dominos .workshop,.dominos .board{background:var(--paper);color:var(--ink);border-radius:16px;min-width:0;min-height:0;padding:20px}.dominos .workshop{grid-template-rows:auto minmax(70px,1fr) auto auto minmax(80px,.6fr);gap:12px;display:grid}.dominos .workshop-head h3,.dominos .board h3{font-size:23px}.dominos #help{border:1px solid #8a9c90;padding:6px 12px;font-size:15px}.dominos #help[aria-pressed=true]{background:#dce4d8}.dominos .editor,.dominos .mini-domino{background:#fffdf8;border:2px solid #506a65;border-radius:12px;grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.dominos .editor{justify-self:center;width:min(100%,460px)}.dominos .half{place-items:center;min-width:0;padding:10px;display:grid;position:relative}.dominos .half+.half{border-left:2px solid #506a65}.dominos .face{width:min(100%,150px);height:100%;min-height:0;max-height:150px;position:relative}.dominos .pip{--pip-color:var(--ink);aspect-ratio:1;background:var(--pip-color);width:clamp(12px,2.2vh,22px);left:calc(20% + var(--x)*30%);top:calc(20% + var(--y)*30%);border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.dominos .half.colored[data-half="0"] .pip{--pip-color:var(--left)}.dominos .half.colored[data-half="1"] .pip{--pip-color:var(--right)}.dominos .half.hint{background:#e4ebdf}.dominos .numeral{outline-offset:0;width:100%;height:100%;color:var(--ink);text-align:center;appearance:textfield;background:0 0;border:0;padding:0;font-size:clamp(38px,8vh,72px);display:block}.dominos .numeral::-webkit-inner-spin-button{appearance:none}.dominos .controls{grid-template-columns:1fr 1fr;justify-self:center;gap:12px;width:min(100%,460px);display:grid}.dominos .stepper{justify-content:center;gap:12px;display:flex}.dominos .stepper button{background:#dce4d8;width:52px;font-size:26px}.dominos .actions{justify-content:center;gap:12px;display:flex}.dominos .primary{color:#fff;background:#b34b2c;min-width:170px;padding:8px 20px}.dominos .primary:hover:not(:disabled){background:#96391f}.dominos .red-cross{color:#b53030;background:#f9dfd7;width:44px;padding:8px}.dominos .red-cross svg{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;width:100%;height:100%}.dominos .counting{flex-direction:column;justify-content:center;gap:10px;min-height:0;display:flex}.dominos .counting h3{font-size:18px}.dominos .count-line{align-items:center;gap:4px;min-height:28px;display:flex}.dominos .count-cell{aspect-ratio:1;border:1px solid #0000;flex:1 1 0;place-items:center;min-width:0;max-width:32px;display:grid;position:relative}.dominos .count-cell.missing{border:2px dashed #506a65;border-radius:4px}.dominos .count-dot,.dominos .flying-token{aspect-ratio:1;background:var(--left);border-radius:50%;width:78%}.dominos .count-dot.right,.dominos .flying-token.right{background:var(--right)}.dominos .count-cell.excess:after{content:"";background:linear-gradient(45deg,#0000 calc(50% - 1.5px),#b53030 calc(50% - 1.5px) calc(50% + 1.5px),#0000 calc(50% + 1.5px)),linear-gradient(-45deg,#0000 calc(50% - 1.5px),#b53030 calc(50% - 1.5px) calc(50% + 1.5px),#0000 calc(50% + 1.5px));position:absolute;inset:-2px}.dominos .message{color:#254e42;min-height:40px;font-size:16px}.dominos .board{flex-direction:column;gap:12px;display:flex}.dominos .board-head p{white-space:nowrap;font-size:19px}.dominos .sheet-instruction,.dominos .sheet-footer p{color:#506a65;font-size:14px}.dominos .grid{grid-template-columns:repeat(var(--columns),minmax(0,1fr));flex:1;grid-template-rows:repeat(2,minmax(0,1fr));gap:14px 10px;min-height:0;display:grid}.dominos .entry{grid-template-rows:minmax(20px,1fr) 24px;gap:5px;min-height:0;display:grid}.dominos .solution{background:0 0;border-radius:8px;flex-direction:column;justify-content:center;min-height:0;padding:0;display:flex}.dominos .mini-domino{border-radius:8px;width:100%;height:clamp(40px,11vh,90px)}.dominos .mini-domino .half{padding:3px}.dominos .mini-domino .face{width:100%;height:100%}.dominos .mini-domino .numeral{place-items:center;font-size:clamp(16px,2vw,32px);display:grid}.dominos .entry.selected .mini-domino{outline-offset:2px;outline:3px solid #b34b2c}.dominos .entry.found .mini-domino{background:#e7efdf;border-color:#2f6b4e}.dominos .entry-tools{justify-content:center;align-items:center;gap:4px;min-height:0;font-size:13px;display:flex}.dominos .sheet-footer{margin-top:auto}.dominos #reset{border:1px solid #8a9c90;padding:6px 10px;font-size:14px}.dominos footer{color:#d8e5e1;font-size:13px}.dominos .flying-token,.dominos .flying-domino{z-index:100;pointer-events:none;position:fixed}.dominos .flying-domino{transform-origin:0 0;background:#fffdf8;border:2px solid #506a65;border-radius:12px;grid-template-columns:1fr 1fr;display:grid}@media (width<=800px){.dominos main{gap:8px;padding:10px 16px}.dominos h1{font-size:22px}.dominos nav{grid-template-columns:repeat(9,minmax(0,1fr))}.dominos .robot{width:68px;height:77px}.dominos .target{min-width:78px;font-size:68px}.dominos .intro{gap:16px}.dominos .intro h2{font-size:23px}.dominos .intro p{font-size:15px}.dominos .workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}.dominos .workshop,.dominos .board{gap:8px;padding:14px}.dominos .workshop-head{flex-wrap:wrap;gap:4px}.dominos .workshop-head h3,.dominos .board h3{font-size:20px}.dominos .board-head{flex-wrap:wrap;gap:4px}.dominos .grid{gap:10px 7px}}@media (width<=560px){.dominos main{gap:6px;padding:8px 12px}.dominos header{gap:8px}.dominos h1{font-size:19px}.dominos .return-link{white-space:nowrap;min-height:32px;font-size:13px}.dominos nav{gap:4px}.dominos nav button{min-height:36px;font-size:20px}.dominos .intro{justify-content:flex-start;gap:12px}.dominos .robot{width:45px;height:51px}.dominos .target{min-width:54px;font-size:52px}.dominos .intro h2{margin-bottom:3px;font-size:19px}.dominos .intro p{font-size:12px}.dominos .workspace{grid-template-rows:minmax(240px,1.3fr) minmax(160px,1fr);grid-template-columns:1fr;gap:8px}.dominos .workshop{grid-template-rows:auto minmax(54px,1fr) auto auto minmax(56px,.5fr);gap:5px;padding:10px}.dominos .workshop-head{flex-wrap:nowrap}.dominos .workshop-head h3,.dominos .board h3{font-size:17px}.dominos #help{min-height:32px;padding:4px 8px;font-size:13px}.dominos .editor{width:min(100%,310px)}.dominos .half{padding:6px}.dominos .pip{width:12px}.dominos .controls{width:min(100%,310px)}.dominos .stepper{gap:12px}.dominos .stepper button{width:44px;min-height:36px;font-size:22px}.dominos .primary,.dominos .actions>.red-cross{height:36px;min-height:36px}.dominos .counting{gap:3px}.dominos .counting h3{font-size:14px}.dominos .count-line{gap:2px;min-height:18px}.dominos .count-cell{max-width:24px}.dominos .message{min-height:30px;font-size:13px}.dominos .board{gap:5px;padding:10px}.dominos .board-head{flex-wrap:nowrap}.dominos .board-head p{font-size:15px}.dominos .sheet-instruction,.dominos .sheet-footer p{font-size:12px}.dominos .grid{gap:5px 8px}.dominos .entry{grid-template-rows:minmax(24px,1fr) 20px;gap:2px}.dominos .mini-domino{height:100%;min-height:22px;max-height:52px}.dominos .mini-domino .pip{width:4px}.dominos .entry-tools{font-size:11px}.dominos .entry-tools .red-cross{width:20px;height:20px;min-height:20px}.dominos #reset{min-height:30px;padding:3px 8px;font-size:12px}.dominos footer{font-size:11px}}@media (height<=650px) and (width>=561px){.dominos main{gap:5px;padding:8px 16px}.dominos .robot{width:55px;height:62px}.dominos .target{font-size:58px}.dominos .intro h2{font-size:23px}.dominos .workshop,.dominos .board{gap:6px;padding:12px}.dominos .workshop{grid-template-rows:auto minmax(60px,1fr) auto auto minmax(64px,.5fr)}.dominos .workshop-head h3,.dominos .board h3{font-size:20px}.dominos .message{min-height:32px;font-size:14px}}@media (prefers-reduced-motion:reduce){.dominos *{scroll-behavior:auto}}.dominos .solution:disabled{opacity:1;cursor:default}@media (height<=650px) and (width>=561px){.dominos .workshop{grid-template-rows:auto minmax(60px,1fr) auto auto 88px}.dominos .counting{gap:6px}.dominos .counting h3{font-size:16px}.dominos .count-cell{max-width:24px}.dominos .count-line{min-height:24px}.dominos .message{min-height:32px}}@media (width<=560px){.dominos .workspace{grid-template-rows:minmax(272px,1.3fr) minmax(160px,1fr)}.dominos .workshop{grid-template-rows:auto minmax(54px,1fr) auto auto minmax(74px,.5fr)}.dominos .counting h3{font-size:13px}.dominos .count-cell{max-width:20px}.dominos .count-line{min-height:20px}.dominos .entry{grid-template-rows:minmax(18px,1fr) 20px}.dominos .mini-domino{min-height:20px}.dominos .grid[style*="--columns: 5"] .entry-tools>span,.dominos .grid[style*="--columns: 6"] .entry-tools>span{display:none}}@media (width<=350px){.dominos h1{font-size:16px}}.dominos .editor-space{place-items:center;min-width:0;min-height:0;display:grid;container-type:size}.dominos .editor{aspect-ratio:2;width:min(100%,460px,200cqh);height:auto}.dominos .solution{place-items:center;display:grid;container-type:size}.dominos .mini-domino{aspect-ratio:2;width:min(100%,200cqh);height:auto;min-height:0;max-height:none}.dominos .editor .pip,.dominos .flying-domino .pip{width:min(24%,36px)}.dominos .count-dot{width:90%}@media (width>=801px) and (height>=651px){.dominos main{gap:8px;padding-top:12px}.dominos .robot{width:68px;height:77px}.dominos .target{font-size:72px}}@media (width<=1000px){.dominos .grid[style*="--columns: 5"] .entry-tools>span,.dominos .grid[style*="--columns: 6"] .entry-tools>span{display:none}}@media (width<=350px){.dominos .intro h2{font-size:16px}.dominos .intro p{font-size:11px}.dominos .sheet-instruction{display:none}}.dominos .solution{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr);width:100%;height:100%}.dominos .editor-space{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}.dominos .editor .numeral{font-size:clamp(22px,52cqh,72px)}.dominos .flying-domino .numeral{font-size:var(--digit-size,48px)}.dominos main{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);column-gap:24px}.dominos header,.dominos footer{grid-column:1/-1}.dominos nav{grid-area:2/1;grid-template-columns:repeat(9,minmax(0,1fr))}.dominos .intro{grid-area:3/1}.dominos .workspace{display:contents}.dominos .workshop{grid-area:4/1}.dominos .board{grid-area:2/2/5;gap:10px;padding:16px 18px}.dominos .grid{flex-direction:column;gap:8px;display:flex}.dominos .opposite-row{border-bottom:1px solid #d4dacf;flex:1;grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr);align-items:stretch;min-height:0;max-height:104px;padding-bottom:5px;display:grid}.dominos .opposite-row:last-child{border-bottom:0}.dominos .opposite-row .entry{grid-template-rows:minmax(0,1fr) 22px;gap:3px;min-width:0}.dominos .opposite-row .entry:first-child{grid-column:1}.dominos .opposite-row .entry:last-child{grid-column:3}.dominos .opposite-row.single .entry{grid-column:1/4;justify-self:center;width:calc(50% - 15px)}.dominos .opposite-link{color:#506a65;justify-content:center;align-items:center;padding-bottom:24px;display:flex}.dominos .opposite-link svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.dominos .mini-domino .numeral{font-size:clamp(24px,22cqw,40px)}.dominos .mini-domino .pip{width:min(24%,20px)}.dominos .sheet-footer{flex-wrap:wrap;gap:8px}.dominos .sheet-footer p{flex:1;min-width:90px}.dominos #demo-toggle{border:1px solid #8a9c90;min-height:36px;padding:5px 10px;font-size:13px}.dominos #reset{min-height:36px}.dominos .mockup-label{color:#d8e5e1;font-size:15px}@media (width<=1050px){.dominos main{gap:8px;padding:12px 16px}.dominos .intro{gap:12px}.dominos .intro h2{font-size:23px}.dominos .intro p{font-size:14px}.dominos .robot{width:60px;height:68px}.dominos .target{min-width:70px;font-size:64px}.dominos .board{padding:12px}.dominos .opposite-row{max-height:98px}.dominos .sheet-instruction{font-size:13px}.dominos .entry-tools{font-size:14px}}.dominos .opposite-row{max-height:92px}.dominos .opposite-row .entry{grid-template-rows:minmax(0,1fr) 18px;gap:2px}.dominos .entry-tools{font-size:14px}.dominos .entry-tools .red-cross{width:18px;height:18px;min-height:18px;padding:2px}.dominos nav button[aria-pressed=true]:hover{color:#fff;background:#96391f}.dominos .stepper{gap:6px}.dominos .quantity{width:50px;min-width:0;height:44px;color:var(--ink);text-align:center;background:#fffdf8;border:1px solid #8a9c90;border-radius:8px;font-size:24px}.dominos .quantity:invalid{border-color:#b53030}.dominos .half.colored[data-half="0"] .numeral{color:var(--left)}.dominos .half.colored[data-half="1"] .numeral{color:var(--right)}.dominos .number-pad{z-index:110;width:258px;color:var(--ink);background:#fffdf8;border-radius:12px;padding:12px;position:fixed;box-shadow:0 8px 24px #0005}.dominos .number-pad[hidden]{display:none}.dominos .pad-head{justify-content:space-between;align-items:center;gap:8px;font-size:14px;display:flex}.dominos .pad-head button{min-height:32px;padding:4px 8px;font-size:12px}.dominos .pad-sides{grid-template-columns:1fr 1fr;gap:6px;margin:8px 0;display:grid}.dominos .pad-sides button{min-height:32px;font-size:14px}.dominos .pad-sides button[aria-pressed=true]{color:#fff;background:#b34b2c}.dominos .pad-keys{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.dominos .pad-keys button{background:#dce4d8;min-height:44px;font-size:24px}.dominos .pad-keys [data-pad-clear]{color:#b53030;background:#f9dfd7;font-size:13px}@media (width<=700px){.dominos main{grid-template-rows:auto auto auto minmax(272px,1.3fr) minmax(160px,1fr) auto;grid-template-columns:1fr;column-gap:0}.dominos header{grid-row:1}.dominos nav{grid-area:2/1}.dominos .intro{grid-area:3/1}.dominos .workshop{grid-area:4/1}.dominos .board{grid-area:5/1;gap:5px;padding:10px}.dominos footer{grid-area:6/1}.dominos .grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:4px 6px;display:grid}.dominos .opposite-row{border:0;grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr);max-height:none;padding:0}.dominos .opposite-row.single{grid-column:1/-1}.dominos .opposite-row.single .entry{width:calc(25% - 9px)}.dominos .opposite-link{padding:0 0 18px}.dominos .opposite-link svg{width:12px}.dominos .opposite-row .entry{grid-template-rows:minmax(0,1fr) 16px;gap:0}.dominos .entry-tools{font-size:10px}.dominos .entry-tools>span{display:none}.dominos .entry-tools .red-cross{width:16px;height:16px;min-height:16px}.dominos .mini-domino .numeral{font-size:clamp(10px,24cqw,22px)}.dominos .quantity{width:44px;height:36px;font-size:21px}.dominos .stepper button{width:36px}.dominos .sheet-footer p,.dominos .sheet-instruction{font-size:11px}.dominos .intro h2{font-size:19px}.dominos .intro p{font-size:12px}.dominos .target{min-width:54px;font-size:52px}.dominos .robot{width:45px;height:51px}.dominos .sheet-footer{flex-wrap:nowrap}.dominos #reset{min-height:30px}}@media (width<=350px){.dominos .intro h2{font-size:16px}.dominos .intro p{font-size:11px}}.dominos .controls{min-width:min(100%,344px)}@media (width<=700px){.dominos .controls{min-width:min(100%,268px)}.dominos .opposite-row.single{grid-column:auto}.dominos .opposite-row.single .entry{width:calc(50% - 6px)}}.dominos .opposite-row{grid-template-rows:minmax(0,1fr)}@media (width<=700px){.dominos .mini-domino .half{padding:1px}.dominos .mini-domino .numeral{font-size:clamp(9px,24cqw,22px);line-height:1}}.dominos .mini-domino .face{container-type:size}.dominos .mini-domino .numeral{font-size:min(40px,85cqh,70cqw);line-height:1}@media (height<=650px) and (width>=701px){.dominos main{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.dominos .grid{grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.dominos .opposite-row{max-height:92px}.dominos .controls{min-width:min(100%,300px)}.dominos .stepper button{width:44px}.dominos .quantity{width:44px;font-size:21px}}
