body.remy-game { background:#f8fbf0; color:#275d64; }
body.remy-game .site-header,body.remy-game > footer { display:none; }
body.remy-game #app { width:min(1100px,calc(100% - 28px)); max-width:1100px; padding:0; margin:0 auto; }
.rt-shell { min-height:100dvh; padding:8px 0 20px; }
.rt-shell * { box-sizing:border-box; letter-spacing:0; }
.rt-shell h1,.rt-shell h2,.rt-shell h3,.rt-shell p { margin-top:0; }
.rt-shell h2:focus { outline:none; }
.rt-shell button,.rt-shell .button,.rt-shell summary { min-width:48px; min-height:48px; border-radius:6px; font:inherit; font-size:17px; line-height:1.3; }
.rt-shell button { cursor:pointer; }.rt-shell button:disabled { cursor:default; }.rt-shell button:focus-visible,.rt-shell a:focus-visible,.rt-shell input:focus-visible,.rt-shell summary:focus-visible { outline:4px solid #ac58a0; outline-offset:3px; }
.rt-shell .rt-primary { background:#278d8d; border:2px solid #216c70; box-shadow:0 3px 0 #1d6167; color:white; padding:11px 18px; font-size:18px; font-weight:750; }.rt-shell .rt-primary:hover { background:#227979; }.rt-shell .rt-primary:disabled { background:#e3ece5; border-color:#b7d0c4; box-shadow:none; color:#69887c; }
.rt-shell .rt-secondary { background:#fffdf4; border:2px solid #b8d4cd; color:#3f6c68; padding:9px 14px; font-size:16px; }
.rt-toolbar { display:grid; grid-template-columns:auto 1fr auto 48px auto; gap:10px; align-items:center; min-height:66px; padding-bottom:8px; }.rt-toolbar h1 { font-family:inherit; font-size:18px; line-height:1.25; margin:0 0 4px; }.rt-toolbar span { font-size:13px; }.rt-toolbar .rt-back { color:#79384b; font-size:14px; padding:8px; white-space:nowrap; }.rt-motion { display:flex; align-items:center; gap:5px; font-size:13px; }.rt-motion input { width:22px; height:22px; accent-color:#278d8d; }.rt-toolbar .rt-sound { padding:0; width:48px; }
.rt-cover { text-align:center; }.rt-cover > span { display:block; margin-top:12px; color:#b3654b; font-size:15px; font-weight:700; }.rt-cover h2 { font-size:32px; color:#297d7b; margin:9px 0 12px; }.rt-cover p { font-size:19px; line-height:1.5; max-width:780px; margin:0 auto 18px; }.rt-cover-image { display:block; width:100%; height:auto; }.rt-cover > .rt-cover-image { max-height:425px; object-fit:contain; margin:20px auto 12px; }.rt-cover .rt-cover-note { font-size:15px; }.card-art .rt-cover-image { height:100%; width:100%; object-fit:cover; }
.rt-task-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:4px 0; }.rt-task-heading span { font-size:14px; color:#a66946; font-weight:700; display:block; margin-bottom:3px; }.rt-task-heading h2 { font-family:inherit; font-size:25px; line-height:1.25; margin:0; }.rt-equation { font-size:33px; line-height:1.3; font-weight:800; color:#267d82; }.rt-instruction { font-family:inherit; font-size:20px; line-height:1.35; margin:7px 0 10px; min-height:27px; }
.rt-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:16px; align-items:stretch; }.rt-board { background:#fffef7; padding:12px 16px; border:2px solid #c5dcd1; border-radius:6px; min-width:0; }.rt-source { display:flex; justify-content:center; gap:14px; min-height:112px; position:relative; }.rt-shell .rt-card { position:relative; flex:0 0 100px; width:100px; height:112px; padding:4px 8px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:0; background:#fffdf0; border:2px solid #d3ba81; box-shadow:0 3px 0 #e1d7b9; color:#2c686c; touch-action:pan-y; user-select:none; }.rt-card svg { width:44px; height:32px; display:block; pointer-events:none; }.rt-card b { font-size:35px; line-height:1.1; }.rt-card span { font-size:12px; line-height:1.4; font-weight:700; }.rt-card:hover:not(:disabled) { background:#fff2bd; border-color:#cf9d45; }.rt-shell .rt-card:disabled { opacity:1; }.rt-card-slot { width:100px; height:112px; flex:0 0 100px; border:2px dashed #d9e3d0; border-radius:6px; display:grid; place-items:center; color:#b4c5b1; background:#f3f6ea; }.rt-card-slot span { width:25px; height:25px; display:grid; place-items:center; border:1px solid #cedbc2; border-radius:50%; font-size:13px; }
.rt-portions { text-align:center; font-size:13px; color:#73897d; margin:8px 0 5px; }.rt-group-row { display:flex; align-items:center; justify-content:center; gap:18px; min-height:150px; }.rt-bowl { width:340px; height:155px; position:relative; flex-shrink:1; min-width:220px; isolation:isolate; }.rt-bowl-art { position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }.rt-bowl-cards { position:absolute; top:1px; left:0; right:0; display:flex; justify-content:center; align-items:center; gap:12px; height:114px; z-index:1; }.rt-bowl .rt-card { height:96px; width:88px; flex-basis:88px; box-shadow:0 2px 0 #437d7766; }.rt-bowl .rt-card svg { width:35px; height:27px; }.rt-bowl .rt-card b { font-size:31px; }.rt-bowl-slot { width:88px; height:96px; border:2px dashed #459c9b; border-radius:6px; display:grid; place-items:center; font-size:24px; color:#499a94; background:#ffffff99; }.rt-bowl-label { position:absolute; bottom:-2px; left:0; right:0; text-align:center; font-size:13px; font-weight:700; color:#235d65; z-index:2; }.rt-valid-pair .rt-bowl-art { filter:drop-shadow(0 2px 3px #63b0a766); }.rt-combined { background:#fff1b9; color:#287779; border:3px solid #d4b35d; border-radius:6px; width:135px; height:92px; display:flex; align-items:center; justify-content:center; flex-direction:column; box-shadow:0 3px 0 #599c8c; }.rt-combined b { font-size:40px; line-height:1.1; }.rt-combined span { font-size:13px; font-weight:700; }
.rt-remainder { width:110px; min-height:110px; padding:6px; text-align:center; display:flex; flex-direction:column; gap:3px; justify-content:center; background:#eef5eb; border:2px solid #bdcfae; border-radius:6px; }.rt-remainder span { font-size:13px; font-weight:700; }.rt-remainder strong { font-size:34px; line-height:1.1; }.rt-remainder small { font-size:12px; }.rt-highlight { outline:4px solid #dcaf45; outline-offset:3px; }.rt-shell .rt-dragging { z-index:30; pointer-events:none; cursor:grabbing; touch-action:none; box-shadow:0 8px 14px #30585233; }
.rt-recipe { position:relative; min-height:300px; border:2px solid #c1d8ca; border-radius:6px; background:#edf6ec; isolation:isolate; }.rt-kitchen { width:100%; height:100%; position:absolute; inset:0; z-index:0; }.rt-recipe-chef { width:46%; height:57%; position:absolute; top:2%; left:0; z-index:1; }.rt-chef { display:block; width:100%; height:100%; }.rt-cooking-dish { position:absolute; width:84%; height:50%; left:11%; bottom:9%; z-index:2; }.rt-dish-art { display:block; height:100%; width:100%; }.rt-recipe-status { position:absolute; bottom:6px; left:5px; right:5px; font-size:13px; text-align:center; font-weight:700; color:#487c6e; background:#fffceddd; border-radius:4px; padding:3px; z-index:4; }
.rt-ingredient-drop { position:absolute; top:25%; left:58%; width:44px; height:44px; z-index:3; animation:rt-drop 1.5s ease-in both; }.rt-ingredient-drop svg { height:100%; width:100%; }.phase-mix .rt-chef-spoon,.phase-mix .rt-spoon-head { transform-origin:174px 180px; animation:rt-stir .4s ease-in-out infinite alternate; }.phase-mix .rt-bowl-cards .rt-card { animation:rt-mix 1.1s ease-in-out; }.phase-mix .rt-bowl-cards .rt-card:nth-child(2) { animation-direction:reverse; }.phase-reorder .rt-bowl-cards { animation:rt-arrange .65s ease-out; }
.phase-cook .dish-soup .rt-steam { animation:rt-steam 1.5s ease-out both; }.phase-cook .dish-pasta .rt-pasta-sauce { animation:rt-sauce 1.5s ease-out both; transform-origin:center; }.phase-cook .rt-cheese { animation:rt-cheese 1.5s ease-out both; }.recipe-pizza.phase-cook .rt-cooking-dish { animation:rt-oven 1.5s ease-in-out; }.phase-cook .rt-ratatouille-slices { animation:rt-pattern 1.5s ease-out both; transform-origin:150px 125px; }.phase-cook .rt-dessert-layer,.phase-cook .rt-dessert-cream { animation:rt-layers 1.5s ease-out both; transform-origin:center bottom; }.phase-cook .rt-dessert-berries { animation:rt-cheese 1.5s ease-out both; }.rt-serving-plate { position:absolute; width:84%; height:50%; left:11%; bottom:9%; z-index:5; animation:rt-serve 1.1s ease-in both; }.phase-serve .rt-cooking-dish { visibility:hidden; }
.rt-feedback { min-height:84px; margin:10px 0; padding:9px 12px; background:#fffdf5; border:1px solid #cbd9c4; border-left:5px solid #ecc45d; border-radius:5px; font-size:18px; line-height:1.4; display:flex; flex-direction:column; justify-content:center; }.rt-feedback strong { color:#946485; font-size:14px; }
.rt-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:56px; }.rt-answer-form { display:flex; align-items:center; gap:10px; }.rt-answer-form label { font-size:26px; font-weight:750; white-space:nowrap; }.rt-answer-form input { width:86px; min-width:60px; height:56px; font-size:30px; font-weight:750; text-align:center; border:2px solid #78ada7; border-radius:5px; background:white; color:#235e65; }.rt-answer-form button { font-size:16px!important; }.rt-help-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; max-width:330px; }.rt-help-actions button { font-size:15px!important; }.rt-wait { min-height:56px; display:flex; align-items:center; font-size:18px; font-weight:700; color:#648955; }
.rt-menu { list-style:none; padding:0; margin:14px 0 0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; }.rt-menu li { display:flex; align-items:center; gap:5px; padding:5px; border-bottom:3px solid #d4e1d2; color:#8a9b8a; min-width:0; }.rt-menu-thumb { flex:0 0 48px; width:48px; height:40px; opacity:.65; }.rt-menu strong { display:block; font-size:13px; line-height:1.3; }.rt-menu li > div > span { display:block; font-size:11px; line-height:1.4; margin-top:2px; }.rt-menu .rt-current { color:#326b70; border-bottom-color:#e9b748; background:#fff6cf; }.rt-menu .rt-served { color:#407956; border-bottom-color:#77ad7e; background:#eef8e6; }.rt-served .rt-menu-thumb { opacity:1; }
.rt-finish { text-align:center; }.rt-finish h2 { font-size:31px; margin:12px 0; color:#247b7a; }.rt-finish > p { font-size:19px; line-height:1.5; margin:0 auto 12px; max-width:850px; }.rt-feast { position:relative; min-height:290px; padding:10px 0 15px; display:grid; grid-template-columns:190px 1fr; align-items:center; gap:12px; background:#edf5df; border-top:5px solid #edcb86; border-bottom:8px solid #cfb486; }.rt-feast-chef { height:250px; }.rt-feast-dishes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; gap:6px 12px; }.rt-feast figure { margin:0; min-width:0; }.rt-feast figure .rt-dish-art { height:115px; }.rt-feast figcaption { font-size:15px; line-height:1.3; font-weight:700; }.rt-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:15px 0; }.rt-stats > div { display:flex; align-items:center; gap:12px; background:#fffdf5; border:1px solid #c0d4c5; border-radius:6px; padding:12px; text-align:left; }.rt-stats strong { font-size:33px; color:#2a8a83; }.rt-stats span { font-size:15px; line-height:1.4; }.rt-finish-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin:18px 0; }.rt-finish details { text-align:left; max-width:850px; margin:14px auto; font-size:18px; line-height:1.5; }.rt-finish summary { padding:10px; cursor:pointer; }.rt-finish details p { padding:0 10px; }
.rt-help { width:min(610px,calc(100% - 24px)); max-height:calc(100dvh - 24px); overflow-y:auto; border:2px solid #9ec7bb; border-radius:8px; padding:24px; background:#fffdf2; color:#275d64; font-size:18px; line-height:1.5; }.rt-help h2 { font-size:25px; }.rt-help::backdrop { background:#224c5c99; }
@keyframes rt-arrange { from { transform:translateY(-10px); }to { transform:translateY(0); } }
@keyframes rt-mix { 50% { transform:translate(13px,7px) rotate(12deg); } }
@keyframes rt-stir { to { transform:rotate(18deg); } }
@keyframes rt-drop { 0% { transform:translateY(-20px); opacity:0; }30% { opacity:1; }80%,100% { transform:translateY(105px) scale(.6); opacity:0; } }
@keyframes rt-steam { from { opacity:0; transform:translateY(12px); }to { opacity:.9; transform:translateY(-10px); } }
@keyframes rt-sauce { from { transform:scale(.25); opacity:0; }to { transform:scale(1); opacity:1; } }
@keyframes rt-cheese { from { transform:translateY(-30px); opacity:0; }to { transform:translateY(0); opacity:1; } }
@keyframes rt-oven { 40%,65% { transform:translate(40px,-25px) scale(.55); filter:brightness(.8); } }
@keyframes rt-pattern { from { transform:rotate(-28deg) scale(.5); opacity:.3; }to { transform:rotate(0) scale(1); opacity:1; } }
@keyframes rt-layers { from { transform:scaleY(.2); opacity:.3; }to { transform:scaleY(1); opacity:1; } }
@keyframes rt-serve { to { transform:translateY(45px) scale(.25); opacity:0; } }
.rt-still *,.rt-paused * { animation:none!important; transition:none!important; }
.rt-shell .rt-card:not(:disabled) { touch-action:none; }
.card-art .rt-cover-image { object-fit:contain; background:#edf6ec; }
@media (max-width:600px) { .rt-menu { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }.rt-menu li { flex-direction:row; text-align:left; padding:6px; }.rt-menu-thumb { display:block; flex:0 0 36px; width:36px; height:36px; }.rt-menu strong { font-size:13px; }.rt-menu li > div > span { font-size:11px; } }
@media (min-width:901px) and (max-height:760px) { .rt-shell { padding-top:4px; }.rt-toolbar { min-height:60px; }.rt-board { padding:8px 14px; }.rt-source { min-height:100px; }.rt-source .rt-card,.rt-card-slot { height:100px; }.rt-group-row { min-height:140px; }.rt-bowl { height:145px; }.rt-feedback { min-height:78px; margin:8px 0; }.rt-recipe { min-height:280px; }.rt-menu { margin-top:10px; }.rt-menu-thumb { height:34px; } }
@media (max-width:1000px) { .rt-layout { grid-template-columns:minmax(0,1fr) 240px; gap:10px; }.rt-toolbar { grid-template-columns:auto 1fr auto 48px; }.rt-motion { grid-column:1/-1; justify-self:end; }.rt-answer-form { flex-wrap:wrap; }.rt-answer-form button { flex-basis:100%; }.rt-help-actions { max-width:230px; }.rt-group-row { gap:8px; }.rt-remainder { width:90px; flex-shrink:0; }.rt-board { padding:10px; }.rt-source { gap:8px; }.rt-source .rt-card,.rt-card-slot { flex-basis:92px; width:92px; }.rt-bowl { min-width:190px; }.rt-bowl .rt-card,.rt-bowl-slot { width:76px; flex-basis:76px; }.rt-bowl-cards { gap:8px; }.rt-menu li { flex-direction:column; text-align:center; }.rt-menu-thumb { flex-basis:36px; } }
@media (max-width:760px) { .rt-layout { grid-template-columns:1fr; }.rt-recipe { min-height:145px; }.rt-recipe-chef { height:130px; width:120px; left:8%; top:0; }.rt-cooking-dish,.rt-serving-plate { width:190px; height:125px; left:auto; right:5%; bottom:15px; }.rt-recipe-status { left:45%; }.rt-task-heading { align-items:start; }.rt-equation { font-size:29px; }.rt-source .rt-card,.rt-card-slot { width:100px; flex-basis:100px; }.rt-board { padding:12px; }.rt-controls { align-items:start; }.rt-menu-thumb { display:none; }.rt-menu strong { font-size:12px; }.rt-menu li > div > span { font-size:10px; }.rt-feedback { min-height:110px; } }
@media (max-width:600px) { body.remy-game #app { width:calc(100% - 14px); }.rt-toolbar { grid-template-columns:1fr auto 48px; gap:7px; }.rt-toolbar > div { grid-row:1; grid-column:1/-1; }.rt-toolbar .rt-back { grid-row:2; }.rt-toolbar [data-rt-action="help"] { grid-row:2; grid-column:2; }.rt-toolbar .rt-sound { grid-row:2; grid-column:3; }.rt-motion { grid-column:1/-1; justify-self:start; margin:2px 0 5px; }.rt-toolbar h1 { font-size:18px; }.rt-task-heading { flex-direction:column; gap:5px; }.rt-task-heading h2 { font-size:23px; }.rt-equation { font-size:29px; }.rt-instruction { font-size:18px; min-height:48px; margin-top:8px; }.rt-source { gap:7px; }.rt-shell .rt-source .rt-card,.rt-card-slot { width:calc((100% - 14px) / 3); flex:1 1 0; height:104px; max-width:100px; min-width:0; }.rt-card b { font-size:32px; }.rt-card span { font-size:11px; }.rt-card svg { height:30px; width:38px; }.rt-board { padding:10px 7px; }.rt-group-row { gap:7px; min-height:158px; }.rt-bowl { min-width:182px; height:151px; flex:1; }.rt-bowl .rt-card,.rt-bowl-slot { width:66px; flex:0 0 66px; height:94px; min-width:48px; }.rt-bowl .rt-card b { font-size:29px; }.rt-bowl .rt-card svg { width:30px; height:26px; }.rt-bowl .rt-card span { font-size:10px; }.rt-bowl-label { font-size:11px; line-height:1.3; bottom:3px; padding:0 10px; }.rt-remainder { width:73px; min-height:101px; padding:4px; }.rt-remainder span,.rt-remainder small { font-size:10px; }.rt-remainder strong { font-size:31px; }.rt-combined { width:110px; height:88px; }.rt-combined b { font-size:36px; }.rt-combined span { font-size:12px; }.rt-portions { font-size:11px; margin:9px 0 2px; }.rt-recipe { min-height:130px; }.rt-recipe-chef { left:2%; height:116px; width:110px; }.rt-cooking-dish,.rt-serving-plate { width:160px; height:111px; right:1%; bottom:15px; }.rt-recipe-status { left:40%; font-size:11px; }.rt-feedback { min-height:134px; font-size:17px; }.rt-controls { flex-direction:column; gap:12px; }.rt-controls > .rt-primary { width:100%; }.rt-help-actions { max-width:100%; justify-content:start; }.rt-answer-form { width:100%; gap:8px; }.rt-answer-form input { width:76px; }.rt-answer-form label { font-size:25px; }.rt-answer-form button { width:100%; flex-basis:100%; }.rt-menu { gap:4px; margin-top:13px; }.rt-menu li { padding:4px 2px; }.rt-menu strong { font-size:10px; overflow-wrap:anywhere; }.rt-menu li > div > span { font-size:9px; }.rt-cover h2 { font-size:27px; }.rt-cover p { font-size:17px; }.rt-cover > .rt-cover-image { margin-top:18px; }.rt-cover .rt-cover-note { font-size:14px; }.rt-finish h2 { font-size:27px; }.rt-finish > p { font-size:17px; }.rt-feast { grid-template-columns:1fr; gap:0; }.rt-feast-chef { height:135px; }.rt-feast-dishes { grid-template-columns:1fr 1fr; gap:12px 0; }.rt-feast figure .rt-dish-art { height:100px; }.rt-feast figcaption { font-size:13px; }.rt-stats { grid-template-columns:1fr; gap:7px; }.rt-finish-actions { flex-direction:column; }.rt-finish-actions > * { width:100%; }.rt-finish details { font-size:17px; } }
@media (prefers-reduced-motion:reduce) { .rt-shell * { animation:none!important; transition:none!important; } }