:root{color-scheme:light;font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:#34422d;background:#e9e6cc;--leaf-color:#6c8c48;--leaf-dark:#365a37;--coat-color:#a8ae7d;--coat-dark:#586346}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 35%,#f7f3db 0,#e9e6cc 65%);min-height:100vh}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;min-height:44px;border:0;background:none;padding:8px 12px}button:focus-visible{outline:3px solid #8a4d30;outline-offset:3px}button:disabled{cursor:default;opacity:.45}button[hidden],[hidden]{display:none!important}main{max-width:900px;margin:auto;padding:22px 24px 12px}header{display:flex;align-items:center;justify-content:space-between;gap:16px}h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;line-height:1.25;font-size:29px;font-weight:800;letter-spacing:.04em;margin:0}h1 span{margin-left:9px}.utility{display:flex;gap:8px;font-size:13px;white-space:nowrap}.utility button{border-bottom:1px solid #9ca17d;padding:5px 9px}nav{display:flex;margin:19px 0 10px;gap:4px;border-bottom:1px solid #a6ad87}nav button{font-size:14px;position:relative;flex:1;padding:10px 4px}nav button[aria-current=true]{font-weight:800;border-bottom:4px solid #4a623c}nav .clear{font-size:12px;margin-left:4px;color:#506d38}.scene-top{display:flex;justify-content:space-between;align-items:center;padding:8px 6px 0}.scene-top span{font-size:12px;color:#6a7055}h2{font-size:17px;margin:2px 0 0}#progress{font-size:14px;font-variant-numeric:tabular-nums}.picture{position:relative;margin-top:0;overflow:hidden}#scene{display:block;width:100%;height:auto;overflow:visible}#bird{transition:transform .1s linear;transform-origin:630px 80px}#chameleon{transform-origin:350px 290px}#chameleon.success{animation:exhale .7s ease-out}#chameleon.lost{transform:translateY(-5px)}@keyframes exhale{50%{transform:translateY(3px) scaleY(.98)}}.bird-note{position:absolute;right:3%;top:2%;display:flex;flex-direction:column;text-align:center;color:#66513b;font-size:12px;line-height:1.45}.bird-note strong{font-size:29px;font-family:Georgia,serif;font-weight:400;font-variant-numeric:tabular-nums}.bird-note strong span{font-size:12px;margin-left:3px}#leaf-label{position:absolute;left:3%;bottom:9%;font-size:14px;background:#f4efd7ed;padding:5px 10px;border-left:3px solid #6c8c48}.mark{font-size:20px;vertical-align:middle;font-weight:800}.cover{position:absolute;inset:0;display:grid;place-items:center;background:#ede7cd24;padding:15px}.cover>div{padding:22px 28px;text-align:center;background:#f6f0dbeF;box-shadow:0 7px 0 #6b754022;max-width:370px;border-top:2px solid #768152;border-bottom:2px solid #768152}.cover p{font-size:14px;line-height:1.8;margin:9px 0 15px}.cover h3{font-family:"Yu Mincho",serif;font-size:23px;margin:0}.cover #cover-kicker{font-size:12px;color:#746c4e;margin:0 0 8px}.primary{background:#415c35;color:#fff7df;min-width:160px;font-weight:700;border-radius:3px;box-shadow:0 3px 0 #283d25}.primary:active{transform:translateY(2px);box-shadow:0 1px 0 #283d25}#next{background:#415c35;color:#fff7df;font-weight:bold;margin-left:6px;border-radius:3px}#primary:has(+ #next:not([hidden])){min-width:auto;background:transparent;box-shadow:none;color:#415c35;font-weight:400}.status-line{display:flex;align-items:center;gap:10px;min-height:52px;border-bottom:1px solid #b2b796;margin-top:-8px;padding:0 6px}.status-line p{margin:0;font-size:14px;line-height:1.65;flex:1}#pause{font-size:13px;white-space:nowrap;text-decoration:underline}.hourglasses{display:flex;justify-content:center;gap:32px;padding-top:15px}.glass-button{position:relative;display:flex;align-items:center;flex-direction:column;width:130px;min-height:150px;padding:0 10px 6px;color:#53633a;border-radius:48% 48% 8px 8px;transition:background .12s}.glass-button:hover{background:#faf5dc}.glass-button[aria-pressed=true]{background:#f7f0d5;box-shadow:inset 0 -3px 0 currentColor}.glass-button svg{display:block;width:80px;height:105px;filter:drop-shadow(0 4px 1px #7e754b22)}.glass-button .glass-label{font-size:15px;font-weight:700;margin-top:3px}.glass-button .glass-time{font-size:12px;min-height:17px;color:#6b6d52}.glass-button.turning svg{animation:turn .55s ease-in-out}.glass-button:active{background:#e1dec0}@keyframes turn{to{transform:rotate(180deg)}}.below{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#676f51;padding:4px 6px 0;gap:10px}#retry{text-decoration:underline;white-space:nowrap}footer{font-size:11px;color:#71765b;padding:14px 6px 8px;border-top:1px solid #c2c4a5;margin-top:4px;line-height:1.7}dialog{border:1px solid #859263;background:#f5f0da;color:#34422d;max-width:480px;width:calc(100% - 30px);padding:25px;box-shadow:0 15px 60px #22311a44}dialog::backdrop{background:#26331f88}dialog h2{font-size:21px;margin:12px 0 22px}dialog li,dialog p{line-height:1.85;font-size:14px}dialog ol{padding-left:22px}.close{float:right;text-decoration:underline}.small{font-size:12px!important;color:#656e52}@media(max-width:600px){main{padding:14px 12px 8px}h1{font-size:23px}h1 span{display:block;margin:0}.utility{gap:1px;font-size:12px}.utility button{padding:3px 7px}nav{margin-top:12px}nav button{font-size:13px}h2{font-size:15px}.scene-top{padding-top:5px}#progress{font-size:12px}.bird-note{font-size:10px;right:0;top:3%}.bird-note strong{font-size:24px}#leaf-label{font-size:12px;bottom:4%;padding:2px 7px}.mark{font-size:17px}.status-line{margin-top:3px;min-height:64px;padding:5px 3px}.status-line p{font-size:13px}.hourglasses{gap:4px;padding-top:12px}.glass-button{width:100px;min-height:148px;padding:0 4px 6px}.glass-button svg{width:72px;height:96px}.glass-button .glass-label{font-size:14px}.cover>div{padding:12px 17px}.cover h3{font-size:19px}.cover p{font-size:12px;line-height:1.6;margin:7px 0 9px}.cover #cover-kicker{font-size:11px;margin-bottom:4px}.primary{min-height:44px;padding:8px 18px}.below{padding-top:0;font-size:11px;align-items:flex-start}.below span{padding-top:12px}footer{padding-top:9px;margin-top:0}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* The opening instruction sits below the animal, so the first screen shows its face and curled tail. */
.cover.intro{align-items:end;justify-items:end;background:none;pointer-events:none;padding:0 8px 0}
.cover.intro>div{pointer-events:auto;text-align:left;max-width:355px;padding:10px 17px;border-top:0;border-bottom:0;box-shadow:none;background:#f5efdbe8;display:grid;grid-template-columns:1fr auto;column-gap:15px;align-items:center}
.cover.intro #cover-kicker,.cover.intro h3{display:none}
.cover.intro #cover-copy{margin:0;font-size:13px;line-height:1.75}
.cover.intro .primary{min-width:100px;grid-column:2;grid-row:1}
@media(max-width:600px){.cover.intro{position:static;padding:0;display:block;margin-top:-8px}.cover.intro>div{max-width:none;background:none;border-top:1px solid #b2b796;padding:10px 2px 7px;column-gap:5px}.cover.intro #cover-copy{font-size:12px}.cover.intro .primary{min-width:100px;padding:8px 12px}.cover.intro + *{margin-top:0}}
@media(min-width:601px){#scene{height:min(43vh,340px);min-height:270px;width:100%}.bird-note{right:4%;top:1%}#leaf-label{left:15%;bottom:7%}.cover.intro{padding-right:4%;padding-bottom:0}}
.cover.result{position:static;display:block;background:none;padding:0 6px 4px}
.cover.result>div{max-width:none;text-align:left;padding:14px 16px;background:#f5efd9;border-top:2px solid #82905b;border-bottom:0;box-shadow:none;display:grid;grid-template-columns:1fr auto;column-gap:18px;align-items:center}
.cover.result #cover-kicker{grid-column:1;margin:0 0 3px}.cover.result h3{grid-column:1;font-size:23px}.cover.result #cover-copy{grid-column:1;margin:5px 0 0}.cover.result .primary{grid-column:2;grid-row:1/4;min-width:130px}.cover.result #next{grid-column:2;grid-row:2/4;margin:0;min-width:120px}.cover.result #primary:has(+ #next:not([hidden])){grid-row:1;font-size:12px;min-height:30px}.cover.result + *{margin-top:0}
@media(max-width:600px){.cover.result{padding:2px 0}.cover.result>div{padding:12px;column-gap:8px;grid-template-columns:1fr}.cover.result #cover-kicker{font-size:10px}.cover.result h3{font-size:20px}.cover.result #cover-copy{font-size:12px;margin-bottom:10px}.cover.result .primary{grid-column:1;grid-row:auto;justify-self:start}.cover.result #next{grid-column:1;grid-row:auto;justify-self:start}.cover.result #primary:has(+ #next:not([hidden])){grid-row:auto}}
/* Pin the leaf label to the SVG, independent of the result band's height. */
@media(min-width:601px){#leaf-label{top:max(240px,calc(min(43vh,340px) - 30px));bottom:auto}}
@media(max-width:600px){#leaf-label{top:calc((100vw - 24px)*.618421 - 28px);bottom:auto}}
.status-line.result{position:absolute;width:1px;height:1px;min-height:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0;padding:0;border:0}
.ready #coat-state{display:none}.ready .below{justify-content:flex-end}
@media(max-width:600px){main{padding-top:10px}header{gap:8px}h1{font-size:21px}nav{margin:8px 0 6px}nav button{padding:7px 4px}.scene-top{padding-top:2px}.hourglasses{padding-top:8px}.glass-button{min-height:133px}.glass-button svg{height:84px;width:63px}.cover.intro{margin-top:0}.cover.intro>div{padding:9px 2px;min-height:58px}.cover.intro #cover-copy{font-size:12px}.below{min-height:44px}footer{padding:6px 3px;font-size:10px}#leaf-label{top:calc((100vw - 24px)*.618421 - 31px);font-size:11px;padding:2px 5px}.scene-top span{font-size:11px}}
/* Keep timing information above the illustration, outside the bird's flight path. */
.scene-top{align-items:center;gap:12px;min-height:58px;padding-bottom:2px}.scene-heading{min-width:0}.stage-meta{display:flex;align-items:baseline;gap:12px}.stage-meta #progress{font-size:12px}.bird-note{position:static;inset:auto;flex:0 0 104px;text-align:right;align-items:flex-end;font-size:11px;line-height:1.25}.bird-note strong{font-size:28px;line-height:1.1;margin-top:2px}.bird-note strong span{font-size:11px}
@media(max-width:600px){.scene-top{min-height:55px;gap:8px}.bird-note{position:static;flex-basis:92px;font-size:10px}.bird-note strong{font-size:25px}.stage-meta{gap:10px}.stage-meta #progress{font-size:11px}}
/* The result already has its retry action and cause; omit the repeated lower caption. */
.finished .below{display:none}