:root{--cream:#f5efe5;--paper:#fffaf2;--ink:#29241f;--muted:#776e64;--yolk:#f4ad32;--yolk-dark:#d98718;--line:#ded4c6;--shadow:0 22px 55px rgba(72,53,36,.09)}
*{box-sizing:border-box}html{min-height:100%;background:var(--cream)}body{min-height:100vh;margin:0;color:var(--ink);font-family:"DM Sans",sans-serif;background:radial-gradient(circle at 10% 15%,rgba(255,255,255,.7),transparent 28%),linear-gradient(135deg,#f8f2e9,#eee5d7);display:flex;flex-direction:column}.app-shell{width:min(1120px,calc(100% - 40px));min-height:680px;margin:28px auto 10px;padding:32px 54px 42px;background:rgba(255,250,242,.88);border:1px solid rgba(255,255,255,.8);border-radius:28px;box-shadow:var(--shadow);position:relative;overflow:hidden}.app-shell:before,.app-shell:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.app-shell:before{width:260px;height:260px;right:-130px;top:-130px;background:rgba(244,173,50,.08)}.app-shell:after{width:180px;height:180px;left:-100px;bottom:-100px;border:34px solid rgba(90,64,49,.035)}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px;position:relative;z-index:3}.brand__mark{width:24px;height:29px;background:var(--ink);border-radius:55% 55% 48% 48%/65% 65% 38% 38%;transform:rotate(8deg);position:relative}.brand__mark:after{content:"";width:7px;height:7px;background:var(--yolk);border-radius:50%;position:absolute;left:9px;top:12px}.screen{display:none;position:relative;z-index:1;animation:fadeUp .55s cubic-bezier(.2,.7,.2,1)}.screen--active{display:block}.intro{text-align:center;max-width:720px;margin:44px auto 32px}.eyebrow{display:inline-block;font-size:11px;letter-spacing:.19em;text-transform:uppercase;color:var(--yolk-dark);font-weight:700;margin-bottom:13px}.intro h1,.timer-copy h2,.done-screen h2{font-family:"Playfair Display",serif;font-size:clamp(42px,5vw,64px);line-height:.98;margin:0;font-weight:600;letter-spacing:-.035em}.intro h1 em,.timer-copy h2 em,.done-screen h2 em{font-weight:600;color:var(--yolk-dark)}.intro p{color:var(--muted);max-width:560px;margin:20px auto 0;line-height:1.7;font-size:14px}.cooking-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:920px;margin:0 auto}.cooking-card{font:inherit;color:inherit;text-align:left;border:1px solid var(--line);background:rgba(255,255,255,.58);min-height:210px;border-radius:18px;padding:24px;cursor:pointer;display:flex;align-items:center;gap:20px;position:relative;transition:.25s ease}.cooking-card:hover,.cooking-card:focus-visible{transform:translateY(-6px);border-color:var(--yolk);box-shadow:0 18px 32px rgba(91,66,39,.1);outline:none}.cooking-card--featured{border-color:rgba(244,173,50,.8);background:#fffaf0}.badge{position:absolute;right:15px;top:13px;background:var(--yolk);padding:5px 9px;border-radius:20px;text-transform:uppercase;font-size:8px;letter-spacing:.12em;font-weight:700}.egg{width:82px;height:108px;min-width:82px;border-radius:52% 52% 47% 47%/62% 62% 40% 40%;background:#fffdf8;box-shadow:inset -9px -8px 20px rgba(114,87,57,.08),0 9px 15px rgba(73,53,34,.1);display:grid;place-items:center;transform:rotate(-5deg)}.egg i{display:block;border-radius:50%;background:var(--yolk);box-shadow:inset -3px -4px 4px rgba(179,104,7,.15)}.egg--soft i{width:36px;height:43px}.egg--medium i{width:35px;height:35px}.egg--hard i{width:31px;height:31px;background:#e5a031}.cooking-card__content{display:flex;flex-direction:column}.cooking-card strong{font-family:"Playfair Display",serif;font-size:24px}.cooking-card small{font-size:11px;color:var(--muted);line-height:1.5;margin:6px 0 22px}.duration{font-weight:700;font-size:12px;color:var(--yolk-dark)}.duration b{margin-left:7px;font-size:16px}.tip{text-align:center;color:var(--muted);font-size:11px;margin:25px 0 0}.tip span{color:var(--yolk-dark);margin-right:6px}.back-button{position:absolute;top:-1px;left:0;border:0;background:transparent;color:var(--muted);font:600 11px "DM Sans";cursor:pointer;padding:10px}.back-button:hover{color:var(--ink)}.timer-screen{text-align:center;padding-top:32px}.timer-copy{margin:16px 0 20px}.timer-copy h2{font-size:40px}.timer-copy p{font-size:12px;color:var(--muted);margin:10px 0}.timer-wrap{position:relative;width:350px;height:350px;margin:8px auto 16px;display:grid;place-items:center}.progress-ring{position:absolute;width:100%;height:100%;transform:rotate(-90deg)}.progress-ring circle{fill:none;stroke-width:5}.progress-ring__track{stroke:#e5dbce;stroke-dasharray:3 8;stroke-linecap:round}.progress-ring__value{stroke:var(--yolk);stroke-linecap:round;stroke-dasharray:892.21;stroke-dashoffset:0;transition:stroke-dashoffset .8s linear}.timer-egg{position:absolute;width:190px;height:245px;border-radius:52% 52% 47% 47%/62% 62% 40% 40%;background:linear-gradient(145deg,#fffefb,#f6ecdf);box-shadow:inset -18px -14px 30px rgba(114,87,57,.07),0 22px 30px rgba(73,53,34,.1);display:grid;place-items:center}.timer-egg span{width:75px;height:75px;border-radius:50%;background:radial-gradient(circle at 38% 35%,#ffc85a,var(--yolk) 60%,#dc8e19);box-shadow:0 7px 10px rgba(174,101,7,.18);animation:breathe 2.2s ease-in-out infinite}.time-display{position:relative;z-index:2;margin-top:2px;display:flex;flex-direction:column;color:#563a27}.time-display>span{font:600 42px "DM Sans";letter-spacing:-.04em}.time-display small{text-transform:uppercase;letter-spacing:.13em;font-size:7px;font-weight:700;margin-top:4px}.pause-button,.restart-button{border:1px solid var(--line);background:#fffaf4;border-radius:30px;padding:12px 20px;font:600 11px "DM Sans";color:var(--ink);cursor:pointer;transition:.2s}.pause-button:hover,.restart-button:hover{border-color:var(--yolk);transform:translateY(-2px)}.pause-icon{margin-right:8px;color:var(--yolk-dark)}.done-screen{text-align:center;padding-top:88px;min-height:570px}.done-egg{width:145px;height:185px;border-radius:52% 52% 47% 47%/62% 62% 40% 40%;background:#fffdf8;box-shadow:inset -14px -12px 24px rgba(114,87,57,.07),0 18px 28px rgba(73,53,34,.11);margin:0 auto 25px;position:relative;animation:eggPop .7s cubic-bezier(.17,.67,.3,1.4)}.done-egg:before,.done-egg:after{content:"";position:absolute;width:6px;height:7px;background:var(--ink);border-radius:50%;top:75px}.done-egg:before{left:48px}.done-egg:after{right:48px}.done-egg__face{position:absolute;left:50%;top:82px;transform:translateX(-50%);font-size:28px;color:var(--yolk-dark)}.done-screen h2{font-size:58px}.done-screen p{color:var(--muted);font-size:13px;line-height:1.65}.restart-button{background:var(--ink);color:#fff;border-color:var(--ink);margin-top:12px;padding:14px 24px}.restart-button span{margin-left:8px;color:var(--yolk)}.confetti{position:absolute;inset:20px 12% auto;height:260px;pointer-events:none;background-image:radial-gradient(circle,var(--yolk) 0 3px,transparent 4px),radial-gradient(circle,#8eaf88 0 2px,transparent 3px),radial-gradient(circle,#c97a5c 0 2px,transparent 3px);background-size:103px 97px,127px 113px,83px 109px;animation:confetti 1.5s ease-out both}footer{text-align:center;font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:#8f8578;padding:9px 20px 18px}@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes breathe{50%{transform:scale(1.06)}}@keyframes eggPop{from{opacity:0;transform:translateY(50px) scale(.75)}to{opacity:1;transform:none}}@keyframes confetti{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:none}}
.game-link{width:min(390px,100%);margin:22px auto 0;padding:11px 13px;display:flex;align-items:center;gap:11px;text-align:left;text-decoration:none;color:var(--ink);background:#fffaf2;border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 22px rgba(72,53,36,.06);transition:.2s}.game-link:hover{border-color:var(--yolk);transform:translateY(-2px)}.game-link__icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--ink);color:var(--yolk);font-size:20px}.game-link>span:nth-child(2){display:flex;flex-direction:column;flex:1}.game-link strong{font-size:11px}.game-link small{font-size:9px;color:var(--muted);margin-top:2px}.game-link b{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--yolk-dark)}
@media(max-width:800px){.app-shell{width:calc(100% - 24px);padding:25px 20px 35px;margin:12px auto;min-height:calc(100vh - 48px)}.intro{margin-top:36px}.cooking-grid{grid-template-columns:1fr;max-width:430px}.cooking-card{min-height:145px;padding:18px 22px}.egg{width:67px;height:88px;min-width:67px}.cooking-card small{margin-bottom:11px}.timer-wrap{width:min(330px,90vw);height:min(330px,90vw)}.timer-egg{width:170px;height:220px}.done-screen{padding-top:70px}.back-button span{display:none}}@media(max-width:390px){.app-shell{padding-left:15px;padding-right:15px}.intro h1{font-size:38px}.intro p{font-size:12px}.timer-wrap{width:285px;height:285px}.timer-egg{width:145px;height:190px}.timer-egg span{width:62px;height:62px}.time-display>span{font-size:35px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}