
:root{color-scheme:light;--paper:#f7f4ee;--ink:#343d36;--muted:#777c70;--cherry:#94514f;--line:#deded2;--room:#efeee4}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Georgia,'Times New Roman',serif}.home{max-width:1440px;padding:0 5%;margin:auto}header{height:88px;display:flex;align-items:center;justify-content:space-between;gap:16px}.wordmark{font-size:39px;letter-spacing:-2px;color:var(--ink);text-decoration:none}.wordmark span{font-size:15px;margin-left:5px;color:var(--cherry)}.header-note{font-style:italic;color:var(--muted);font-size:16px}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.sound{border:1px solid var(--line);background:transparent;color:#616758;font:13px Arial;border-radius:30px;padding:10px 17px}.sound>span:first-child{font-size:18px;padding-right:5px}.companion{position:relative;overflow:hidden;border:1px solid #e5e3d9;border-radius:22px;background:var(--room);min-height:710px;isolation:isolate;transition:background 1s}.heading{position:relative;z-index:3;text-align:center;padding:30px 15px 0;pointer-events:none}.eyebrow{font:11px Arial;letter-spacing:3px;color:#7a806f}h1{font-weight:400;font-size:clamp(30px,3.1vw,44px);line-height:1.15;margin:13px 0 9px;letter-spacing:-1.2px}h1 em{color:var(--cherry);font-weight:400}.heading p{font:14px/1.5 Arial;color:var(--muted);margin:0}.corner-note{position:absolute;left:32px;top:220px;font-size:18px;line-height:1.8;color:#858975}.corner-note em{font-size:15px}.mood{position:absolute;top:200px;right:32px;display:flex;align-items:center;gap:8px;color:#6c765e;font:13px Arial;padding:9px 13px;background:#ffffff4d;border-radius:25px}.mood>span:first-child{font-size:19px}.world{position:relative;height:415px;max-width:720px;margin:-7px auto 0;touch-action:pan-y}.glow{position:absolute;inset:0 10%;background:radial-gradient(ellipse,#fffdf67d,transparent 70%);pointer-events:none}.ground-shadow{position:absolute;left:35%;right:35%;height:15px;bottom:27px;background:#72705e20;filter:blur(12px);border-radius:50%}.pet{position:absolute;width:440px;height:440px;max-width:98%;aspect-ratio:1;left:50%;bottom:-12px;transform:translateX(-50%);border:0;background:transparent;padding:0;mix-blend-mode:multiply;isolation:isolate;animation:breathe 5s ease-in-out infinite;transform-origin:50% 86%;touch-action:manipulation}.portrait,.sprite{position:absolute;inset:0;display:block;background-position:center;background-repeat:no-repeat;background-size:contain;transition:opacity .3s}.portrait{background-image:url('./kiraz-portrait.png')}.sprite{background-image:url('./kiraz-states-v2.png');background-size:200% 200%;background-position:0 0;opacity:0}.ready .sprite{opacity:1}.ready .portrait{opacity:0}.pet:hover{filter:brightness(1.015)}.pet:active{filter:brightness(1.035)}.response{position:relative;text-align:center;min-height:67px;padding:0 12px;z-index:4}#message{display:block;font:16px/1.5 Arial;color:#515b4a}#hint{display:block;margin-top:7px;font:12px/1.4 Arial;color:#898c7e}.controls{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:800px;margin:8px auto 23px;padding:0 18px}.controls button{position:relative;display:grid;grid-template-columns:36px auto;grid-template-rows:24px 20px;column-gap:9px;text-align:left;padding:15px 19px;background:#fafaf3;border:1px solid #dadfd0;border-radius:15px;color:#566247;box-shadow:0 3px 0 #64704406;transition:background .2s,transform .2s,border-color .2s}.controls .icon{grid-row:1/3;align-self:center;font-size:34px;line-height:1}.controls button>span:not(.icon){font:15px Arial;align-self:center}.controls small{font:12px Arial;color:#858a7c}.controls button:hover{transform:translateY(-3px);background:#fffdf7}.controls button[aria-pressed=true]{background:#e1e8d7;border-color:#a9b799}.controls button:first-child[aria-pressed=true]{background:#f1e1dc;border-color:#c7aaa3}footer{display:flex;justify-content:space-between;padding:22px 3px;font-size:13px;color:#858a7e}footer b{color:var(--cherry);font-weight:400}#particles{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:hidden}.heart{position:absolute;color:#b77570;font-size:24px;animation:heart 1.9s ease-out forwards;pointer-events:none}.food{position:absolute;left:57%;bottom:34px;font-size:42px;filter:drop-shadow(0 6px 5px #7773);animation:appear .3s ease-out;z-index:6}.yarn{position:absolute;left:72%;top:70%;font-size:42px;padding:7px;border:0;background:transparent;touch-action:none;cursor:grab;z-index:7;filter:drop-shadow(0 6px 4px #7773)}.yarn:active{cursor:grabbing}.yarn[hidden],.food[hidden]{display:none}.sleep-marks{display:none;position:absolute;left:61%;top:35%;color:#7a8190;font-style:italic;font-size:28px;letter-spacing:9px;animation:drift 3s infinite}.sleep-marks span{font-size:20px}.sleep-marks small{font-size:14px}.sleeping{background:#e0e4e3}.sleeping .sleep-marks{display:block}.sleeping .mood{color:#64717b}.sleeping .pet{animation-duration:7s}.loving .pet{animation:nuzzle 2s ease-in-out}.playing .pet{animation:alert 2.6s ease-in-out infinite}.feeding .pet{animation:nuzzle 2.8s ease-in-out infinite}button:focus-visible,a:focus-visible{outline:3px solid #9a6555;outline-offset:4px}.pet:focus-visible{outline-offset:-40px;border-radius:50%}@keyframes breathe{50%{transform:translateX(-50%) scale(1.007,1.012)}}@keyframes nuzzle{50%{transform:translateX(-50%) rotate(-2deg) scale(1.012)}}@keyframes alert{50%{transform:translateX(-48.5%) rotate(1deg)}}@keyframes heart{0%{opacity:0;transform:translateY(0) scale(.7)}20%{opacity:1}100%{opacity:0;transform:translateY(-105px) scale(1.15)}}@keyframes drift{50%{transform:translateY(-10px);opacity:.5}}@keyframes appear{from{transform:translateY(12px);opacity:0}}
@media(max-width:900px){.corner-note{display:none}.mood{top:165px;right:18px;font-size:12px}.controls button{padding:14px 12px;grid-template-columns:28px auto;column-gap:7px}.controls .icon{font-size:28px}}
@media(max-width:600px){.home{padding:0 14px}header{height:72px}.wordmark{font-size:33px}.header-note{display:none}.sound{padding:8px 13px}.companion{border-radius:18px;min-height:0}.heading{padding:26px 12px 0}.eyebrow{font-size:10px;letter-spacing:2.5px}h1{font-size:31px;margin:12px 0 8px}.heading p{font-size:12px}.mood{top:150px;right:13px;padding:6px 9px;font-size:11px}.mood>span:first-child{font-size:14px}.world{height:340px;margin-top:13px}.pet{width:370px;height:auto;bottom:-7px}.ground-shadow{bottom:27px}.response{min-height:67px;padding:0 10px}#message{font-size:14px}#hint{font-size:11px}.controls{grid-template-columns:1fr 1fr;gap:9px;margin:8px auto 17px;padding:0 14px}.controls button{padding:12px 13px;grid-template-columns:29px auto;grid-template-rows:22px 18px}.controls button>span:not(.icon){font-size:14px}.controls small{font-size:11px}.controls .icon{font-size:29px}footer{justify-content:center;font-size:12px;padding:19px 0}footer>span:first-child{display:none}.food{font-size:35px;bottom:28px}.yarn{font-size:35px;left:73%;top:73%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.sprite{clip-path:inset(0 0 4% 0)}
@media(min-width:601px) and (max-height:850px){header{height:68px}.companion{min-height:0}.heading{padding-top:23px}h1{font-size:36px;margin:10px 0 7px}.world{height:320px;margin-top:0}.pet{width:350px;height:350px;bottom:-9px}.response{min-height:57px}.controls{margin:8px auto 19px}.controls button{padding:12px 17px}footer{padding:16px 3px}.corner-note{top:195px}.mood{top:185px}}
/* Playable activities */
.activity{position:relative;z-index:9;max-width:420px;margin:2px auto 14px;padding:13px 18px;background:#ffffff9e;border:1px solid #dce1d3;border-radius:15px;font:13px Arial}.activity[hidden]{display:none}.activity-top{display:flex;justify-content:space-between;gap:15px;color:#64715b}.activity-top strong{color:#43573a}.progress-track{height:5px;background:#e5e9df;border-radius:8px;margin:9px 0 12px;overflow:hidden}.progress-track span{display:block;height:100%;width:0;background:#859c70;transition:width .3s}.activity button{display:block;width:100%;border:0;background:#52684b;border-radius:9px;color:white;font:14px Arial;padding:11px}.activity button:disabled{background:#a4b09c;cursor:default}.response{min-height:64px}.game-ball{padding:0!important;width:46px;height:46px;line-height:46px;transition:none!important}.pet{transform:translateX(-50%) rotate(var(--pet-tilt,0deg))}.world{overflow:visible}.bowl-items{position:absolute;top:2px;left:9px;display:flex;gap:2px;color:#85522d;font:16px Arial;text-shadow:0 1px #482d23}.bowl-items span{transition:opacity .2s}.food{left:calc(50% + 75px);font-size:48px}.flying-bite{position:absolute;z-index:12;color:#965f35;font:25px Arial;text-shadow:0 2px 2px #532e2633;pointer-events:none}.pet.chewing{animation:chew .26s ease-in-out 3!important}@keyframes chew{50%{transform:translateX(-50%) translateY(3px) scaleY(.995)}}.companion:has(.activity:not([hidden])) .world{height:330px}.companion:has(.activity:not([hidden])) .pet{width:350px;height:350px}.companion:has(.activity:not([hidden])) .controls{margin-top:5px}.controls button{min-height:67px}@media(max-width:600px){.activity{margin:0 15px 12px;padding:10px 14px}.companion:has(.activity:not([hidden])) .world{height:270px}.companion:has(.activity:not([hidden])) .pet{width:290px;height:290px}.mood{top:139px}.activity button{padding:10px}.activity-top{font-size:12px}.controls{gap:7px}.food{font-size:41px;left:calc(50% + 55px)}.response{min-height:65px}#hint{max-width:300px;margin-left:auto;margin-right:auto}}@media(min-width:601px) and (max-height:850px){.companion:has(.activity:not([hidden])) .world{height:245px}.companion:has(.activity:not([hidden])) .pet{width:270px;height:270px}.activity{padding:9px 15px;margin-bottom:8px}.activity button{padding:8px}.progress-track{margin:6px 0 8px}.controls button{min-height:62px}.response{min-height:56px}}
/* Consistent toy and bowl materials */
.game-ball{font-size:0!important;border-radius:50%;border:1px solid #b96e61;background:radial-gradient(circle at 30% 24%,#ffffffad 0,transparent 30%),repeating-linear-gradient(125deg,#d9917f 0 13px,#f1d9a7 13px 20px,#8da187 20px 33px);box-shadow:inset -5px -7px 9px #623e4038,0 7px 6px #51443124;filter:none}.food{font-size:0;width:68px;height:33px;border-radius:8px 8px 29px 29px;background:linear-gradient(100deg,#ba7861,#dfac88 45%,#a86753);box-shadow:0 6px 8px #614f3624,inset 0 -3px #88503c44;filter:none}.food:before{content:'';position:absolute;inset:-8px 0 auto;height:20px;border-radius:50%;background:#74503b;border:5px solid #d9a181}.food:after{content:none}.bowl-items{top:-7px;left:15px;z-index:1;color:#bd8853;font-size:16px;gap:3px}

@media(min-width:601px) and (max-width:850px){.controls button{grid-template-columns:25px auto;padding:12px 8px;column-gap:5px}.controls button>span:not(.icon){font-size:13px;white-space:nowrap}.controls small{font-size:10px}.controls .icon{font-size:24px}}

.pet,.loving .pet,.sleeping .pet,.pet.chewing{animation:none!important}
/* Leo joins Kiraz, then they settle down together. */
.leo-call{display:flex;align-items:center;gap:13px;width:calc(100% - 36px);max-width:660px;margin:0 auto 22px;padding:13px 20px;border:1px solid #dbc5a7;border-radius:17px;background:#f8eddb;color:#795732;text-align:left;transition:background .2s,transform .2s}.leo-call:hover{background:#f2e2c9;transform:translateY(-2px)}.leo-call[aria-pressed=true]{background:#edd9b9;border-color:#bc9865}.leo-call strong{display:block;font:600 14px/1.4 Arial}.leo-call small{display:block;font:12px/1.5 Arial;color:#8b7255}.leo-heart{font-size:30px;line-height:1}.leo-arrow{margin-left:auto;font:22px Arial}.leo-scene{position:absolute;inset:0;pointer-events:none;z-index:3;mix-blend-mode:multiply}.leo-scene[hidden]{display:none}.leo-arrival,.pair-pose{position:absolute;background-image:url('./leo-sheet.png');background-size:200% 200%;background-repeat:no-repeat;aspect-ratio:1;bottom:-12px;clip-path:inset(0 0 2% 0)}.leo-arrival{width:230px;left:48%;background-position:0 0;opacity:0;transform:translateX(95px);transition:transform 2s cubic-bezier(.2,.65,.3,1),opacity .8s}.pair-pose{width:400px;max-width:98%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 1.1s}.pair-hug{background-position:100% 0}.pair-sleep{background-position:0 100%;transform-origin:50% 83%}.leo-visiting .leo-arrival{opacity:1;transform:translateX(0)}.leo-visiting .pet{margin-left:-65px;transition:margin-left 1.8s,opacity .9s;pointer-events:none}.leo-hugging .pet,.leo-hugging .leo-arrival{opacity:0}.leo-hugging .pair-hug{opacity:1}.leo-sleeping .pair-hug{opacity:0}.leo-sleeping .pair-sleep{opacity:1;animation:pair-breathe 6s ease-in-out infinite}.leo-sleeping .sleep-marks{z-index:4;top:40%}.pet{transition:margin-left .8s,opacity .6s}
@keyframes pair-breathe{50%{transform:translateX(-50%) scaleY(1.007)}}
@starting-style{.leo-visiting .leo-arrival{opacity:0;transform:translateX(95px)}}
@media(max-width:600px){.leo-call{width:calc(100% - 24px);padding:12px 16px;margin-bottom:17px}.leo-arrival{width:210px;left:42%}.pair-pose{width:360px}.leo-visiting .pet{margin-left:-45px}}
@media(min-width:601px) and (max-height:750px){.leo-arrival{width:195px}.pair-pose{width:290px}.leo-call{padding:10px 17px;margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){.leo-arrival,.pair-pose,.pet{transition:none!important}.pair-sleep{animation:none!important}}
