:root{color-scheme:dark;--bg:#080d19;--panel:#141e30;--ink:#eef3fc;--muted:#aab8ce;--mint:#a8d9c4;--cream:#fffcf4;--brown:#4b5145;--line:#b6cbea24;font-family:ui-rounded,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 83% 5%,#1e25413d,transparent 50%),radial-gradient(ellipse at 3% 65%,#15313830,transparent 50%),var(--bg);color:var(--ink);min-height:100vh}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button,a{touch-action:manipulation}button{border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #b393e4;outline-offset:5px}button:disabled{cursor:default}.brand-mark svg,.settings-button svg,.soft-badge svg,.primary-button svg,.card-icon svg,.hero-footer svg,.site-footer svg,#speak-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-library{position:absolute;width:0;height:0;overflow:hidden}[hidden]{display:none!important}.skip{position:fixed;top:-100px;left:20px;padding:15px;background:var(--cream);color:#111;z-index:50}.skip:focus{top:10px}.page-wrap{position:relative;max-width:1320px;margin:auto;padding:28px 42px 0}.sky{position:fixed;inset:0;overflow:hidden;pointer-events:none;background-image:radial-gradient(#b7d9fa55 1px,transparent 1px);background-size:163px 173px;mask-image:linear-gradient(black,transparent)}.sky i{position:absolute;width:4px;height:4px;border-radius:50%;background:#b9d4ff69;box-shadow:0 0 14px #d9e8ff;top:20%;left:4%}.sky i:nth-child(2){left:40%;top:9%}.sky i:nth-child(3){left:90%;top:27%}.sky i:nth-child(4){left:72%;top:63%}.sky i:nth-child(5){left:14%;top:77%}.sky i:nth-child(6){left:96%;top:82%}.sky i:nth-child(7){left:54%;top:48%}.sky i:nth-child(8){left:24%;top:40%}.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid var(--line);background:linear-gradient(130deg,#22334b9a,#121d30b0);padding:18px 23px;border-radius:19px;box-shadow:0 8px 35px #0001;backdrop-filter:blur(12px)}.brand{display:flex;gap:12px;align-items:center;font-size:17px;font-weight:750;letter-spacing:1.4px}.brand b{font-size:12px;font-weight:600;letter-spacing:2px;color:#bcdacb}.brand small{display:block;font-size:10px;letter-spacing:.5px;color:#9aaac0;margin-top:5px;font-weight:400}.brand-mark{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#bddbcb;color:#314e48;transform:rotate(-6deg)}.brand-mark svg{width:24px;height:24px;fill:currentColor;stroke:none}.topbar nav{display:flex;gap:7px}.nav-button{background:transparent;color:var(--muted);border-radius:10px;padding:11px 20px;font-size:13px}.nav-button:hover,.nav-button.active{background:#c6e2ff10;color:#e6edf7}.nav-button.active:after{content:"";display:block;margin:6px auto -9px;background:#badbc9;width:16px;height:2px;border-radius:2px}.settings-button{display:flex;align-items:center;gap:8px;background:none;color:#b5c1d3;font-size:12px;padding:10px 0 10px 10px}.settings-button svg{width:18px;height:18px}.settings-button circle{fill:#1a273a}.page-heading{display:flex;justify-content:space-between;align-items:center;margin:37px 1px 25px;gap:20px}.eyebrow{font-size:10px;letter-spacing:2.6px;color:#9eafc6;font-weight:600;margin:0 0 10px}h1{font-size:28px;letter-spacing:-1.5px;margin:0;font-weight:650;line-height:1.5}.tiny-star{display:inline-block;color:#dbca8b;font-weight:400;font-size:32px;margin-left:12px;vertical-align:middle}.online-pill{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:20px;background:#b6dfc30c;border:1px solid #b6dfc319;color:#b9d3c7;font-size:11px;white-space:nowrap}.online-pill i{height:5px;width:5px;border-radius:50%;background:#afd4b2;box-shadow:0 0 10px #9eddab44}.hero-window{border-radius:22px;overflow:hidden;background:var(--cream);color:var(--brown);border:1px solid #ffffff24;box-shadow:0 22px 80px #0003}.window-bar{display:flex;align-items:center;justify-content:space-between;background:#f1f0e9;border-bottom:1px solid #746a4b11;padding:14px 23px;color:#8c9083;font-size:10px;letter-spacing:.6px}.window-dots{display:flex;gap:6px}.window-dots i{width:8px;height:8px;border-radius:50%;background:#e7b7a5}.window-dots i:nth-child(2){background:#e4d296}.window-dots i:nth-child(3){background:#b5cbb5}.window-spark{font-size:16px;color:#a7b7a0}.hero-body{display:grid;grid-template-columns:1fr 1.04fr;align-items:center;min-height:365px;padding:26px 35px 13px 43px;gap:12px;overflow:hidden}.soft-badge{display:inline-flex;align-items:center;gap:6px;background:#e9f0df;color:#6d8060;padding:6px 10px;border-radius:6px;font-size:11px;font-weight:550}.soft-badge svg{height:14px;width:14px}.hero-copy h2{font-size:37px;line-height:1.4;letter-spacing:-2.2px;margin:18px 0 13px;font-weight:750;color:#3b4e43}.hero-copy h2>span{color:#609376}.hero-copy>p{font-size:13px;line-height:1.9;color:#84887b;margin:0}.hero-actions{display:flex;align-items:center;gap:10px;margin-top:24px}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(110deg,#c0e5ff,#c8bff0);color:#23344c;min-height:47px;padding:12px 18px;border:1px solid #34465814;border-radius:11px;font-size:13px;font-weight:700;box-shadow:0 4px 9px #6463830a;transition:transform .18s,box-shadow .18s}.hero-actions .primary-button{background:#547e68;color:#fff;border-color:#547e68;box-shadow:0 4px 0 #3f62531a}.primary-button:hover{transform:translateY(-2px);box-shadow:0 7px 15px #33333319}.primary-button svg{width:17px;height:17px}.secondary-button{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:44px;padding:10px 15px;border:1px solid #b1b6a848;border-radius:10px;background:transparent;color:#727e6c;font-size:12px;font-weight:550}.secondary-button:hover{background:#b5c7a31c}.hero-hints{display:flex;gap:13px;margin-top:18px;font-size:10px;color:#959b8e}.hero-art{position:relative;align-self:center;padding:13px 0 0;max-width:560px;width:100%;margin:auto}.hero-art>img{width:100%;height:auto;display:block;transform:scale(1.04);filter:saturate(.9)}.hello-bubble{position:absolute;left:28%;top:8px;background:#fffefa;padding:10px 15px;border-radius:13px;box-shadow:0 5px 20px #5e735414;color:#6d775f;font-size:12px;z-index:1;transform:rotate(-5deg)}.hello-bubble:after,.game-bubble:after{content:"";position:absolute;bottom:-6px;left:45%;width:12px;height:12px;background:inherit;transform:rotate(45deg)}.party-sticker{position:absolute;right:-9px;bottom:31px;display:flex;gap:8px;align-items:center;background:#fff9e9;padding:12px 17px;border:1px solid #e9d9ac;border-radius:13px;transform:rotate(8deg);font-size:10px;line-height:1.7;color:#a48b54;box-shadow:0 4px 12px #82734313}.party-sticker strong{display:block;font-size:13px;color:#846f45}.party-sticker svg{width:29px;height:29px;fill:#efd080;stroke:#e4bd60}.hero-footer{display:flex;align-items:center;justify-content:space-between;margin:0 28px;padding:14px 5px;border-top:1px dashed #c3c5b961;color:#9a9f91;font-size:10px}.hero-footer>span:first-child{display:flex;align-items:center;gap:6px}.hero-footer svg{height:12px;width:12px;stroke:#a7b397}.hero-footer b{color:#b5bf9e;font-weight:400;margin-left:7px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin:29px 0 17px}.section-kicker{font-size:9px;font-weight:600;letter-spacing:2px;color:#96abae;display:block;margin-bottom:7px}.section-heading h2{font-size:17px;font-weight:600;margin:0;letter-spacing:-.6px}.section-heading>p{font-size:11px;color:#7f90a8;margin:0}.game-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.game-card{position:relative;text-align:left;min-height:164px;padding:22px 20px;border-radius:16px;background:linear-gradient(120deg,#203733,#182a29);border:1px solid #a0b4a420;color:var(--ink);overflow:hidden;transition:transform .2s,border-color .2s}.game-card:hover{transform:translateY(-4px);border-color:#b9d5c883}.card-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:8px;background:#b0d5bf15;color:#bbd8c4;margin-bottom:14px}.card-icon svg{height:17px;width:17px}.card-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:7px}.level{font-size:9px;letter-spacing:.3px;color:#99b4a2}.card-copy strong{font-size:17px;font-weight:650;letter-spacing:-.7px}.card-copy>span:last-child{font-size:10px;color:#9aada6}.game-card>.friend-portrait{position:absolute;right:8px;top:7px;width:95px;height:105px;opacity:.96;transform:rotate(9deg)}.round-arrow{position:absolute;right:18px;bottom:21px;color:#b5c8ba;font-size:21px}.peach{background:linear-gradient(120deg,#3d302b,#2b2427);border-color:#e1c3a320}.peach .card-icon{background:#dfad9a16;color:#e8c7a6}.peach .level{color:#c3a597}.peach .card-copy>span:last-child{color:#b7a39a}.lilac{background:linear-gradient(120deg,#2f2c45,#252338);border-color:#c3b1e620}.lilac .card-icon{background:#b6a2e31b;color:#cebee9}.lilac .level{color:#b3a5ca}.lilac .card-copy>span:last-child{color:#a99cbf}.bottom-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;margin-top:23px}.friends-preview,.progress-card{background:linear-gradient(130deg,#1b2a3b9a,#111b2b9a);border:1px solid var(--line);border-radius:16px;padding:20px 23px}.compact{margin:0 0 14px;align-items:center}.compact h2{font-size:14px}.compact p{font-size:10px;color:#8e9bb1;margin:6px 0 0}.text-button{background:none;color:#a9bbd0;padding:8px 0;font-size:11px}.text-button span{margin-left:5px}.mini-friends{display:flex;justify-content:space-between;gap:10px}.mini-friend{display:flex;align-items:center;flex-direction:column;background:none;color:#aab8ca;gap:4px;font-size:10px;padding:0 6px}.mini-friend .friend-portrait{width:61px;height:67px;transition:transform .2s}.mini-friend:hover .friend-portrait{transform:translateY(-5px) rotate(-7deg)}.progress-card-title{display:flex;align-items:center;gap:8px}.small-icon{color:#d3bd82;font-size:20px}.progress-card h2{font-size:14px;font-weight:600;margin:0}.progress-card>p{font-size:10px;color:#9aa8b9;margin:7px 0 15px}.home-stars{display:flex;gap:12px}.home-star{background:#ffffff06;border:1px dashed #e9d79e33;color:#aa9d7b;width:37px;height:37px;border-radius:11px;display:grid;place-items:center;font-size:21px}.home-star.filled{background:#dcc68c29;color:#efd28d;border-style:solid}.progress-meta{display:flex;justify-content:space-between;color:#8a99b1;font-size:9px;margin-top:14px}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 0;color:#5e718b;font-size:9px}.site-footer b{font-weight:550;letter-spacing:1px;margin-right:11px;color:#8e9db3}.site-footer>span:last-child{display:flex;align-items:center;gap:5px}.site-footer svg{width:12px;height:12px}.view-description{color:var(--muted);font-size:14px;line-height:1.8}.all-friends{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}.friend-card{position:relative;background:linear-gradient(130deg,#22334be8,#121d30eb);border:1px solid var(--line);border-radius:20px;color:var(--ink);padding:20px 12px;transition:transform .2s;text-align:center}.friend-card:hover{transform:translateY(-5px);border-color:#c0e5ff66}.friend-card .friend-portrait{display:block;width:100%;max-width:155px;height:170px;object-fit:contain;margin:0 auto 8px}.friend-card strong{display:block;font-size:19px}.friend-card .species{color:#aab8ce;font-size:12px;display:block;margin-top:6px}.friend-card .friend-star{position:absolute;top:13px;right:14px;color:#718198}.friend-card.met .friend-star{color:#e8cb7c}.friend-card .friend-cta{display:block;margin-top:15px;color:#bfdbc9;font-size:11px}.storage-note{text-align:center;color:#8b9bb3;font-size:12px;line-height:1.8;margin:25px 0}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.guide-card{background:linear-gradient(130deg,#22334ba0,#121d30eb);border:1px solid var(--line);border-radius:20px;padding:28px}.guide-number{font-size:12px;letter-spacing:2px;color:#b6d4c1}.guide-card h2{font-size:20px;font-weight:600;margin:15px 0}.guide-card p,.guide-card li{font-size:14px;line-height:1.9;color:#b1bfd2}.guide-card ol{padding-left:20px}.guide-card .secondary-button{color:#bfd7c9}.game-dialog,.settings-dialog{color-scheme:light;color:#4d584d;background:var(--cream);padding:0;border:1px solid #ffffff80;border-radius:23px;box-shadow:0 25px 130px #0009;max-height:calc(100dvh - 30px);width:min(620px,calc(100% - 28px));overflow-y:auto}.game-dialog::backdrop,.settings-dialog::backdrop{background:#050a16c9;backdrop-filter:blur(9px)}.game-window-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 19px;background:#efefe6;color:#8b9584;font-size:11px}.close-button{background:none;width:34px;height:34px;color:#88927d;font-size:25px;line-height:1;border-radius:9px}.close-button:hover{background:#73826918}.game-inner{padding:14px 28px 24px;text-align:center}.game-header{display:flex;justify-content:space-between;align-items:center}.game-header .text-button{color:#8a9583;font-size:11px}.progress-dot{font-size:21px;color:#d7d4c6;margin-left:4px}.progress-dot.filled{color:#d6ae50}#game-title{font-size:25px;letter-spacing:-1px;margin:8px 0}#game-subtitle{font-size:12px;color:#939c88;margin:0}.character-stage{position:relative;max-width:390px;height:250px;margin:10px auto 0;overflow:hidden;background:radial-gradient(ellipse at 50% 75%,#e5eddb 0%,#f0f3e6 52%,transparent 72%)}#game-character{position:absolute;height:205px;width:186px;object-fit:contain;left:calc(50% - 93px);bottom:3px;z-index:2;animation:float-friend 3s ease-in-out infinite}.stage-ground{position:absolute;left:17%;right:17%;bottom:8px;border-radius:50%;height:22px;background:#cbd9b7;opacity:.45}.stage-cloud{width:49px;height:15px;border-radius:25px;background:#dfe7d29e;position:absolute;left:25px;top:80px;transform:rotate(-7deg)}.stage-cloud:before{content:"";position:absolute;left:12px;bottom:0;background:inherit;width:27px;height:29px;border-radius:50%}.cloud-two{left:auto;right:17px;top:117px;width:60px;opacity:.6}.stage-flower{position:absolute;color:#e7bb9b;font-size:30px;bottom:20px;left:35px;transform:rotate(-12deg)}.flower-two{left:auto;right:35px;bottom:30px;color:#c5ba91;font-size:23px}.game-bubble{position:absolute;top:2px;left:50%;white-space:nowrap;transform:translateX(-50%) rotate(-2deg);border-radius:11px;background:white;font-size:12px;padding:10px 16px;box-shadow:0 3px 15px #4764370a;z-index:3}.prompt-row{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:0}#game-prompt{font-size:30px;letter-spacing:-1px;font-weight:750;margin:5px 0;color:#517961}#speak-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#eaf0df;color:#799167}#speak-btn svg{width:17px;height:17px}#game-status{font-size:13px;margin:8px 0 0;line-height:1.6;min-height:21px;color:#7e8c77}#game-transcript{font-size:11px;color:#909889;margin:4px 0 8px;min-height:14px}.answer-area{min-height:49px;display:flex;justify-content:center}.answer-area .primary-button{min-width:225px;background:#638b70;color:#fff;border:0}.touch-options{display:flex;justify-content:center;gap:10px;width:100%}.answer-option{border:1px solid #c2d1b9;background:#f2f5e9;color:#607255;border-radius:12px;padding:13px 15px;min-width:80px;min-height:49px;font-size:16px;font-weight:650}.answer-option:hover{background:#dce8cc}.input-toggle{background:none;color:#94a088;font-size:11px;text-decoration:underline;text-underline-offset:4px;margin:13px 0 0;padding:7px}.listening{animation:mic-pulse 1.1s infinite}.celebrate{animation:jump-friend .6s ease 3!important}.party-eyebrow{display:block;color:#a18c52;font-size:10px;letter-spacing:2px;margin-top:26px}#party-title{font-size:28px;line-height:1.4;letter-spacing:-1px;color:#62744e;margin:10px 0}#party-panel>p{color:#8e9a80;font-size:13px;line-height:1.8}.party-animals{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;padding:20px 0;background:radial-gradient(ellipse at center,#e6ecd5,transparent 70%);margin:15px 0}.party-friend{margin:0;animation:party-dance 1.2s ease-in-out infinite alternate}.party-friend:nth-child(2n){animation-direction:alternate-reverse}.party-friend img{width:100%;height:100px;object-fit:contain}.party-friend figcaption{font-size:10px;color:#82906e}.party-actions{display:flex;gap:12px;justify-content:center}.party-rest{font-size:11px!important}.settings-dialog{max-width:450px;padding:26px}.settings-heading{display:flex;align-items:center;justify-content:space-between}.settings-heading .eyebrow{color:#889378;margin:0}.settings-dialog h2{font-size:25px;letter-spacing:-1px;margin:10px 0}.settings-dialog p{color:#8b9583;font-size:12px;line-height:1.7}.settings-dialog fieldset{border:1px solid #d8ddca;border-radius:13px;padding:16px;margin:26px 0 20px}.settings-dialog legend{font-size:13px;padding:0 7px}.settings-dialog fieldset label{display:inline-flex;gap:6px;align-items:center;margin-right:15px;font-size:14px}.settings-dialog fieldset label span{font-size:10px;color:#91997d}.settings-dialog input{accent-color:#6b8965;width:16px;height:16px}.switch-row{display:flex;justify-content:space-between;align-items:center}.switch-row strong{font-size:13px;font-weight:600;display:block}.switch-row small{display:block;font-size:10px;color:#919b86;margin-top:5px}.settings-storage{margin-top:22px}.settings-dialog .primary-button{width:100%;margin:10px 0}.settings-dialog #reset-progress{color:#9c8b79;text-decoration:underline;width:100%;text-align:center}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:14px 20px;color:#35483d;background:#e2eddb;box-shadow:0 5px 35px #0004;border-radius:12px;font-size:13px;z-index:100;max-width:90%;white-space:nowrap}.view{animation:arrive .3s ease}@keyframes float-friend{50%{transform:translateY(-4px)}}@keyframes jump-friend{40%{transform:translateY(-15px) rotate(-5deg)}70%{transform:translateY(-6px) rotate(4deg)}}@keyframes party-dance{from{transform:rotate(-6deg) translateY(0)}to{transform:rotate(6deg) translateY(-12px)}}@keyframes mic-pulse{50%{box-shadow:0 0 0 8px #8fab6a30}}@keyframes arrive{from{opacity:.7;transform:translateY(7px)}to{opacity:1;transform:none}}body.modal-open{overflow:hidden}
@media(min-width:1500px){.page-wrap{padding-top:34px}.hero-body{min-height:400px}.hero-copy h2{font-size:41px}.hero-art{max-width:515px}}
@media(max-width:1050px){.page-wrap{padding:22px 25px 0}.topbar{padding:16px}.nav-button{padding:10px 13px}.hero-body{padding:26px 25px 15px;grid-template-columns:1.1fr 1fr}.hero-copy h2{font-size:31px}.hero-copy>p{font-size:12px}.hero-actions{gap:8px}.hero-actions .secondary-button{padding:10px;font-size:11px}.hero-actions .primary-button{padding:12px;font-size:12px}.hero-hints{gap:9px;font-size:9px}.hello-bubble{font-size:10px;top:-6px}.party-sticker{right:-12px;bottom:10px;padding:8px 11px}.game-card{padding:18px 15px}.card-copy strong{font-size:15px}.card-copy>span:last-child{font-size:9px}.game-card>.friend-portrait{width:83px;height:92px;right:2px}.bottom-grid{gap:15px}.friends-preview,.progress-card{padding:18px}.mini-friend{padding:0}.mini-friend .friend-portrait{width:53px;height:58px}.all-friends{grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){.page-wrap{padding:15px 16px 0}.topbar{gap:12px;flex-wrap:wrap;border-radius:16px;padding:14px 15px}.brand{font-size:15px}.brand small{font-size:9px}.brand-mark{width:35px;height:35px}.topbar nav{order:3;justify-content:center;width:100%;border-top:1px solid #ffffff0a;padding-top:10px}.nav-button{flex:1;font-size:12px;padding:9px}.settings-button{margin-left:auto}.settings-button>span{display:none}.page-heading{margin-top:25px;margin-bottom:18px}.page-heading .online-pill{display:none}h1{font-size:25px}.eyebrow{font-size:8px;letter-spacing:2px}.tiny-star{font-size:26px}.hero-body{grid-template-columns:1fr;padding:24px 22px 0;gap:0}.hero-copy{text-align:center}.hero-copy h2{font-size:33px;line-height:1.4;margin:16px 0 12px}.hero-copy>p{font-size:12px}.hero-actions{justify-content:center;margin-top:21px;gap:10px}.hero-actions .primary-button{padding:12px 15px}.hero-actions .secondary-button{padding:10px 12px}.hero-hints{justify-content:center;font-size:9px;margin-top:16px}.hero-art{max-width:370px;padding-top:28px;margin-top:10px}.hello-bubble{top:6px;left:26%}.party-sticker{right:0;bottom:21px}.hero-footer{margin:0 18px;justify-content:center;font-size:9px;padding:13px 0}.hero-footer>span:last-child{display:none}.window-bar{padding:12px 16px;font-size:9px}.hero-window{border-radius:18px}.section-heading{margin-top:26px;margin-bottom:14px}.section-heading h2{font-size:16px}.section-heading>p{display:none}.game-cards{grid-template-columns:1fr;gap:10px}.game-card{display:flex;align-items:center;gap:14px;min-height:112px;padding:18px 17px}.card-icon{width:34px;height:34px;margin:0}.card-copy{gap:6px}.card-copy strong{font-size:16px}.card-copy>span:last-child{font-size:10px}.game-card>.friend-portrait{width:92px;height:101px;right:10px;top:8px}.round-arrow{display:none}.game-card .level{font-size:9px}.bottom-grid{grid-template-columns:1fr;margin-top:20px}.mini-friend .friend-portrait{width:56px;height:62px}.compact{margin-top:0}.home-stars{justify-content:space-between}.progress-meta{font-size:10px}.progress-card>p{font-size:11px}.site-footer{padding:23px 0;justify-content:center;text-align:center}.site-footer>span:last-child{display:none}.site-footer b{display:block;margin:0 0 7px}.all-friends{grid-template-columns:repeat(2,1fr);gap:12px}.friend-card{padding:15px 10px}.friend-card .friend-portrait{height:140px}.friend-card strong{font-size:17px}.view-description{font-size:12px}.guide-grid{grid-template-columns:1fr;gap:14px}.guide-card{padding:22px}.guide-card p,.guide-card li{font-size:13px}.game-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);border-radius:19px}.game-inner{padding:12px 16px 16px}#game-title{font-size:22px;margin-top:8px}.character-stage{height:230px}#game-character{height:189px;width:172px;left:calc(50% - 86px)}.game-bubble{font-size:11px}.touch-options{gap:7px}.answer-option{font-size:14px;min-width:75px;padding:12px 9px;flex:1}#game-status{font-size:12px}#game-prompt{font-size:28px}.party-friend img{height:75px}.party-animals{gap:1px}.party-actions{flex-direction:column}.party-actions button{width:100%}#party-title{font-size:25px}}
@media(max-width:360px){.hero-actions{flex-direction:column}.hero-hints{gap:6px}.game-card>.friend-portrait{width:75px;height:85px;top:13px;right:0}.game-card{gap:10px;padding:16px 12px}.card-copy>span:last-child{font-size:9px}.mini-friend .friend-portrait{width:43px;height:48px}.hero-copy h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* A soft storybook garden for the articulated animal friends. */
.pet-garden{height:352px;padding:0;border-radius:45% 45% 25px 25px;background:linear-gradient(#f6e6dd,#f9eee2 58%,#edf0d8);overflow:hidden;isolation:isolate;max-width:470px;margin:0 auto}.garden-sky{position:absolute;inset:0}.garden-sun{position:absolute;top:30px;right:40px;width:45px;height:45px;background:#f0d394;border-radius:50%;box-shadow:0 0 0 11px #f0d39420}.garden-cloud{position:absolute;left:20px;top:80px;width:75px;height:19px;background:#fffaf1;border-radius:50px;opacity:.9}.garden-cloud:before{content:'';position:absolute;left:19px;bottom:0;width:34px;height:35px;background:inherit;border-radius:50%}.garden-cloud.c2{left:auto;right:12px;top:136px;transform:scale(.65)}.garden-hill{position:absolute;width:140%;height:120px;left:-10%;bottom:-26px;background:#d1ddba;border-radius:50%;transform:rotate(-9deg);z-index:-1}.hill-back{background:#dce5c8;bottom:25px;left:-26%;transform:rotate(13deg)}.hero-pet{position:absolute!important;width:260px;height:286px;left:calc(50% - 130px);top:51px;z-index:2}.pet-garden .hello-bubble{top:16px;left:50%;transform:translateX(-50%) rotate(-3deg);font-size:11px;max-width:90%;width:max-content;text-align:center;z-index:5}.garden-caption{position:absolute;bottom:8px;width:100%;text-align:center;color:#7f8c70;font-size:9px;z-index:3}.garden-flower{position:absolute;bottom:40px;font-size:29px;color:#e9aeac;left:24px}.gf2{left:auto;right:25px;color:#f1ce80;bottom:26px;font-size:36px}.gf3{left:85px;bottom:24px;color:#f5f5df;font-size:21px}.pet-tools{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 31px 5px}.pet-selector{display:flex;gap:3px;flex-wrap:wrap}.pet-select{padding:0;border:1px solid transparent;border-radius:11px;background:transparent;width:35px;height:38px}.pet-select .friend-portrait{width:31px;height:35px;object-fit:contain}.pet-select.selected{border-color:#acb897;background:#e9eedf}.pet-action-buttons{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.pet-action-buttons button{padding:8px 10px;border-radius:8px;background:#eee8df;color:#7f7b6d;font-size:10px;border:1px solid #c9c0ad20}.pet-action-buttons button:hover{background:#e4ead9}.gesture-guide{display:flex;justify-content:center;gap:24px;font-size:10px;color:#919781;padding:9px 15px 14px}.game-pet-hint{margin:0 0 3px;color:#98a08b;font-size:9px}#game-character{animation:none;bottom:0}.character-stage{background:radial-gradient(ellipse at 50% 75%,#e8e2d2 0%,#f7eee1 52%,transparent 72%)}.game-bubble{max-width:96%;white-space:normal;width:max-content;line-height:1.5}.party-rig{width:100%;height:115px}.party-friend{animation:none}.party-animals{background:radial-gradient(ellipse at center,#e1e6cb,#faf0dd 60%,transparent 76%);border-radius:24px}.pet-widget>.animal-rig{width:100%;height:100%}
@media(max-width:1050px){.pet-tools{flex-direction:column;gap:10px}.pet-garden{height:330px}.hero-pet{height:270px;width:245px;left:calc(50% - 122px);top:50px}}
@media(max-width:760px){.pet-garden{height:315px;margin-top:24px;max-width:345px}.hero-pet{width:243px;height:268px;left:calc(50% - 121px);top:41px}.pet-garden .hello-bubble{top:14px;font-size:10px}.pet-tools{padding:14px 12px 4px}.pet-selector{justify-content:center;gap:3px}.pet-select{width:28px;height:35px}.pet-select .friend-portrait{width:26px;height:31px}.pet-action-buttons button{padding:8px 9px}.gesture-guide{font-size:9px;gap:12px}.party-rig{height:86px}.game-pet-hint{font-size:9px}.character-stage{height:220px}#game-character{height:185px;width:169px;left:calc(50% - 84px)}}
/* Keep the six-friend row inside narrow mobile grids. */
.bottom-grid>section{min-width:0}.mini-friends{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.mini-friend{min-width:0;padding:0}.mini-friend .friend-portrait{width:100%;max-width:61px;height:auto;aspect-ratio:400/440}.skip:focus:not(:focus-visible){top:-100px}
/* Face-first discovery makes the colorful cast easy to recognise at a glance. */
.all-friends{gap:18px;padding:24px;background:#fff4c6;border-radius:25px;border:1px solid #fff4c633}.friend-card{background:color-mix(in srgb,var(--friend-color,#ffe899) 12%,#fffdf6);border:1px solid #e2d8b348;color:#514938;padding:18px 12px 17px;border-radius:19px;box-shadow:0 3px 0 #cfbd8d12}.friend-card:hover{background:color-mix(in srgb,var(--friend-color,#ffe899) 22%,#fffdf6);border-color:#cfbd8d70;box-shadow:0 8px 20px #9e814c14}.friend-card .friend-portrait{max-width:200px;width:100%;height:155px;object-fit:contain;margin:2px auto 12px}.friend-card strong{font-size:19px;font-weight:700}.friend-card .species{color:#7e725e;font-size:12px}.friend-card .friend-star{color:#d2c6ab}.friend-card.met .friend-star{color:#d79528}.friend-card .friend-cta{color:#7b8654}.mini-friend .friend-portrait{aspect-ratio:400/320;max-width:64px}.pet-selector{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;max-width:470px;width:100%}.pet-select{width:100%;height:40px;border-radius:10px}.pet-select .friend-portrait{width:100%;max-width:38px;height:34px;object-fit:contain}.pet-select.selected{background:#fff0b6;border-color:#e7ba50}.pet-tools{gap:22px}.pet-action-buttons{max-width:360px}.pet-garden{background:linear-gradient(#fff3c5,#fff4d9 58%,#e5f0cd)}.garden-sun{background:#ffda64;box-shadow:0 0 0 11px #ffdf7726}.hill-back{background:#d7eab5}.hill-front{background:#c5dfa0}.party-rig{height:85px}.party-animals{padding:14px 0;gap:6px;background:radial-gradient(ellipse at center,#fff0b6,#edf2d0 65%,transparent 85%)}.party-friend figcaption{font-size:9px}.game-card>.friend-portrait{object-fit:contain;height:93px;width:103px;top:15px;right:7px}.friend-card .friend-cta{margin-top:10px}
@media(max-width:1050px){.all-friends{padding:18px;gap:14px}.friend-card .friend-portrait{height:140px}.pet-action-buttons{max-width:none}.pet-selector{max-width:450px}}
@media(max-width:760px){.all-friends{padding:12px;gap:10px;border-radius:18px}.friend-card{padding:12px 8px}.friend-card .friend-portrait{height:114px;margin-bottom:9px}.friend-card strong{font-size:17px}.friend-card .species{font-size:11px}.friend-card .friend-cta{font-size:10px}.pet-tools{gap:12px}.pet-selector{gap:3px;max-width:340px}.pet-select{height:34px}.pet-select .friend-portrait{max-width:30px;height:28px}.party-rig{height:72px}.party-animals{gap:5px 2px;padding:8px 0}.party-friend figcaption{font-size:8px}.game-card>.friend-portrait{width:84px;height:85px;right:7px;top:14px}.page-heading h1{line-height:1.35}}
@media(max-width:360px){.friend-card .friend-portrait{height:96px}.all-friends{padding:9px;gap:7px}.pet-select .friend-portrait{max-width:26px;height:25px}.game-card>.friend-portrait{width:70px}}

/* All portraits use the very same illustrated head as the interactive friend. */
.friend-portrait{display:block;flex-shrink:0;line-height:0;pointer-events:none}
.friend-portrait>.animal-portrait{display:block;width:100%;height:100%;overflow:visible;fill:initial;stroke:none}
.friend-card .friend-portrait{max-width:225px;height:175px;margin:0 auto 10px}
.friend-card{background:#fffaf0;color:#514638;border-color:#e7ddc7;box-shadow:0 4px 0 #b2986c0d}
.friend-card:hover{background:#fff6e6;border-color:#d3bb91}
.mini-friend .friend-portrait{width:100%;height:58px;max-width:68px;aspect-ratio:auto}
.pet-select .friend-portrait{width:100%;height:35px;max-width:42px;margin:auto}
@media(max-width:760px){.friend-card .friend-portrait{height:145px;max-width:200px}.pet-select .friend-portrait{height:29px;max-width:34px}.mini-friend .friend-portrait{height:48px}}
@media(max-width:390px){.friend-card .friend-portrait{height:120px}.pet-select .friend-portrait{height:26px;max-width:30px}.mini-friend .friend-portrait{height:40px}}