@charset "UTF-8";
:root{--paper:#f6f2f8;--ink:#493f57;--muted:#938799;--plum:#756184;--line:#ded5e3;--peach:#ffd6b8;--rose:#df80a7;--green:#4d684d;--lime:#dbeaca;--white:#fffdfd;--display:"KaiTi","STKaiti","Kaiti SC",serif;--body:"Microsoft YaHei","PingFang SC",sans-serif;--digits:"Trebuchet MS",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 var(--body);-webkit-font-smoothing:antialiased}
button,input{font:inherit}button{color:inherit;cursor:pointer}button,a,input{-webkit-tap-highlight-color:transparent}button{border:0}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ba8ebf;outline-offset:4px}button:disabled:not(.course-card){opacity:.48}svg{display:block;flex-shrink:0}[hidden]{display:none!important}
.app-shell{max-width:1456px;margin:auto;padding:0 42px}.topbar{height:102px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line)}.brand{color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:13px}.brand-pig{width:46px;transform:rotate(-9deg)}.brand strong{font:700 29px/1.1 var(--display);display:block;letter-spacing:1px}.brand small{display:block;font:10px/1.8 var(--digits);letter-spacing:3.1px;color:var(--muted);margin-top:5px}.header-note{font:17px var(--display);color:#9c8c9e;margin-left:25px}.topbar nav{margin-left:auto;display:flex;align-items:center;gap:21px}.save-status{font-size:11px;color:#8c8590;white-space:nowrap}.save-status i,.scene-tag i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#9cb48e;margin-right:7px;vertical-align:middle}.nav-button,.icon-button{display:flex;align-items:center;justify-content:center;background:none;gap:8px}.nav-button{font-size:13px;padding:9px 0}.icon-button{width:35px;height:35px;border-radius:50%}.icon-button:hover,.nav-button:hover{color:var(--rose)}.page-heading{display:flex;align-items:center;justify-content:space-between;padding:27px 0 23px;gap:16px}.eyebrow{font-size:10px;color:var(--muted);letter-spacing:2px;margin:0 0 5px}.page-heading h1{font:700 31px/1.25 var(--display);margin:0;display:flex;align-items:center;gap:3px}.inline-edit{padding:8px;margin-left:6px;background:transparent;color:#a498ab;border-radius:50%}.inline-edit svg{width:15px;height:15px}.attendance{display:flex;align-items:center;gap:15px;font-size:11px;color:var(--muted)}#attendance-dots{display:flex;gap:7px}.attendance-dot{height:20px;width:20px;border:1.5px solid #d6cbdc;border-radius:50%;display:grid;place-items:center;color:#879573;transition:background .2s}.attendance-dot.done{background:#dce8cc;border-color:#c5d5b2}.attendance-dot.current{border-style:dashed;border-color:#a285ae;background:#eee1f2}.attendance-dot svg{width:12px;height:12px}.attendance b{font:14px var(--digits);color:var(--ink);white-space:nowrap}
.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;grid-template-areas:"stage notes" "courses notes";gap:23px 26px;align-items:start}.stage{grid-area:stage;position:relative;aspect-ratio:1.69;min-height:360px;background:#f6f0f8;border:1px solid #d7cbde;border-radius:18px;overflow:hidden;isolation:isolate;box-shadow:0 5px 0 #e9e0ed}.room{position:absolute;inset:0}.room svg{width:100%;height:100%}.stage-top{position:absolute;top:19px;left:21px;right:18px;display:flex;justify-content:space-between;align-items:center;z-index:6}.scene-tag{background:#fffdf3ed;border:1px solid #ddd4d6;border-radius:7px;padding:5px 11px;font-size:11px;color:#7b6b7e;box-shadow:0 2px 0 #55466112}.scene-tag i{background:#8d759e}.stage-sound{background:#fffdf2e0;border-radius:50%;height:31px;width:31px;display:grid;place-items:center;color:#8a798f}.stage-sound svg{width:17px;height:17px}.idle-caption{position:absolute;left:27%;right:16%;top:22%;font:22px/1.5 var(--display);text-align:center;z-index:2;transform:rotate(-3deg)}.speech-mark{position:absolute;font:70px var(--display);color:#d7c5df;left:-4%;top:-30px}
.pig-actor{position:absolute;left:29%;bottom:9%;width:42%;aspect-ratio:1;border:0;padding:0;background:none;z-index:3;transform-origin:50% 88%;animation:breathing 4s ease-in-out infinite}.pig-actor:hover{filter:brightness(1.015)}.pig-actor:active{transform:scale(1.07,.92)}.pig-actor::after{content:"摸摸";position:absolute;left:45%;bottom:2%;font-size:10px;color:#7f9673;opacity:0;transition:opacity .2s}.pig-actor:hover::after{opacity:1}.pig-art{width:100%;height:100%;overflow:visible}.pig-medal{display:none}.decorated .pig-medal{display:block}.pig-eyes{transform-origin:95px 130px;animation:blink 6s infinite}.sprite{display:block;width:100%;height:100%;background-image:url("../sprites/piggy-atlas.png");background-size:300% 300%;background-repeat:no-repeat}.sprite-idle{background-position:0 0}.sprite-angry{background-position:50% 0}.sprite-headphones{background-position:100% 0}.sprite-belly{background-position:0 50%}.sprite-game{background-position:50% 50%}.sprite-surprise{background-position:100% 50%}.sprite-dance{background-position:0 100%}.sprite-roll{background-position:50% 100%}.sprite-medal{background-position:100% 100%}
.meme-actor{position:absolute;left:28%;width:44%;aspect-ratio:1;bottom:11%;z-index:3;transform-origin:50% 85%}.meme-actor>div:first-child{width:100%;height:100%}.meme-badge{position:absolute;bottom:4%;left:50%;white-space:nowrap;transform:translateX(-50%) rotate(-5deg);background:#fffcec;color:#917254;border:1px solid #ded0b8;border-radius:5px;padding:2px 11px;font:16px var(--display);box-shadow:2px 3px 0 #c0b2a51a}.meme-actor.motion-rush{animation:rage .18s linear infinite}.meme-actor.motion-balance{animation:balance 2.2s ease-in-out infinite}.meme-actor.motion-team{animation:game-bob .7s ease-in-out infinite}.meme-actor.motion-dance{animation:dance .68s ease-in-out infinite}.meme-actor.motion-tiny{transform:scale(.25);animation:tiny-hop 2.3s ease-in-out infinite}.meme-actor.motion-relax{animation:relax 4s ease-in-out infinite}.meme-actor.motion-nose{transform:scale(1.5)}.meme-actor.cheered{filter:drop-shadow(0 0 18px #fff1b7)}.lesson-caption{position:absolute;top:21%;left:20%;right:14%;font:19px/1.55 var(--display);text-align:center;z-index:4}.training-control{position:absolute;bottom:14%;left:15%;right:15%;text-align:center;z-index:5}.interaction-button{display:inline-flex;align-items:center;gap:8px;padding:10px 17px;background:#fff9e6;border:1.5px solid #c2a968;box-shadow:0 4px 0 #c7b47d;color:#80693c;border-radius:30px;font-size:12px;animation:invite 1.5s ease-in-out infinite}.interaction-button:hover{background:#fff4cb}.interaction-button:active{box-shadow:none;transform:translateY(3px)}.interaction-note{font:17px var(--display);color:#607747;background:#fbfff1e6;display:table;margin:5px auto 0;padding:5px 12px;border-radius:6px}.interaction-note:empty{display:none}.stage[data-phase=training] .meme-actor{bottom:20%;width:38%;left:31%}.stage-bottom{position:absolute;bottom:18px;left:22px;right:22px;display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#7e916f;z-index:4}.stage-number{font-family:var(--display);font-size:13px;white-space:nowrap;letter-spacing:1px}
.pet-hearts{position:absolute;inset:0;z-index:4;pointer-events:none}.pet-heart{position:absolute;left:48%;bottom:47%;color:#d980a4;animation:float-heart 1.3s ease-out both;font-size:25px}.pet-heart:nth-child(2){left:58%;animation-delay:.1s}.pet-heart:nth-child(3){left:39%;animation-delay:.2s}.gain-toast{position:absolute;right:20px;top:64px;padding:12px 17px;border:1px solid #d3ddc4;border-radius:10px;background:#fafff0f5;box-shadow:0 6px 18px #3b583119;z-index:7;animation:gain-in .3s ease-out}.gain-toast strong{display:block;font:17px var(--display);color:#60734d}.gain-toast div{font:12px/1.9 var(--body);color:#86906e;margin-top:3px}.pause-cover{position:absolute;inset:0;background:#f5f1f7ed;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10}.pause-cover>span{color:#b19bbb;margin-bottom:12px}.pause-cover strong{font:30px var(--display)}.pause-cover p{color:var(--muted);font-size:12px}.pause-cover .primary-button{width:175px;margin-top:10px}
.notebook{grid-area:notes;align-self:stretch;min-width:0;padding:0 21px 20px;background:#fffdf9;border:1px solid #ddd3df;border-radius:12px;box-shadow:3px 4px 0 #e7e0e9;position:relative}.notebook-tabs{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed #e1d9df;padding:15px 0 12px}.notebook-tabs .active{font:19px var(--display)}.notebook-number{font:10px var(--digits);letter-spacing:1px;color:#b0a4af}.pig-profile{display:flex;gap:10px;align-items:center;padding:15px 0 10px}.pig-profile>div:first-child{width:49px;height:49px;background:#faefdf;border-radius:50%;flex-shrink:0}.pig-profile>div:first-child .sprite{transform:scale(1.2)}.pig-profile strong{font:700 20px var(--display)}.pig-profile p{margin:2px 0 0;font-size:10px;color:var(--muted)}.profile-stamp{font:12px var(--display);padding:2px 5px;border:1px solid #b9caaa;color:#8f9d7f;margin-left:auto;transform:rotate(-12deg);white-space:nowrap}.stat-list{display:grid;gap:10px;padding:10px 0 22px}.stat-row{display:grid;grid-template-columns:53px 1fr 25px;gap:10px;align-items:center;font-size:11px}.stat-label{display:flex;gap:6px;align-items:center}.stat-label svg{width:15px;height:15px;color:var(--stat)}.stat-track{height:6px;border-radius:8px;background:#eee9ec;overflow:hidden}.stat-track i{display:block;height:100%;width:10%;background:var(--stat);border-radius:8px;transition:width .6s}.stat-row b{font:14px var(--digits);text-align:right}.queue-heading{display:flex;align-items:center;justify-content:space-between;border-top:1px dashed #dfd6df;padding-top:17px}.queue-heading h2{font:18px var(--display);margin:0}.queue-heading>span{font-size:10px;color:var(--muted)}.queue{list-style:none;margin:11px 0 15px;padding:0;display:grid;gap:7px}.queue li{height:38px;border:1px solid #e6dfe7;border-radius:6px;display:flex;align-items:center;padding:0 10px;gap:9px;font-size:11px;background:#fcf9fc}.queue li .q-number{font:10px var(--digits);color:#a79aad}.queue li.empty{border-style:dashed;background:none;color:#bbb0be;font-size:10px}.queue li button{margin-left:auto;background:none;padding:6px;border-radius:50%;color:#aaa0ad}.queue li button:hover{background:#f0e8f1;color:#a0617f}.queue li button svg{width:12px;height:12px}.queue li>svg{width:15px;height:15px;color:#9c829a}.primary-button{background:var(--green);color:#faffee;border:1px solid #3e573f;border-radius:9px;min-height:45px;display:flex;align-items:center;justify-content:center;gap:13px;padding:9px 16px;font-size:13px;font-weight:bold;box-shadow:0 3px 0 #344b34;transition:background .16s,transform .16s}.primary-button:hover:not(:disabled){background:#5f7b53}.primary-button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #344b34}.primary-button svg{width:17px;height:17px}.main-action{width:100%}.main-action:disabled{background:#ced3c5;color:#7b8974;box-shadow:0 3px 0 #bdc3b4;border-color:#c5ccbd;opacity:1!important}.playback{display:flex;justify-content:center;gap:26px;padding:13px 0 0}.playback button{background:none;display:flex;align-items:center;gap:6px;font-size:11px;color:#9c90a0;padding:4px 8px}.playback button svg{width:12px;height:12px}.playback button:hover{color:var(--plum)}.queue-hint{text-align:center;font-size:10px;color:#a69aaa;margin:6px 0 17px}.active-lesson{margin:0 0 12px;padding:8px 9px;background:#f1ebf4;border-radius:6px}.active-lesson>div:first-child{display:flex;justify-content:space-between;font-size:10px}.active-lesson strong{font-weight:normal}.active-lesson span{font-family:var(--digits);color:#a08ba9}.progress-track{height:3px;margin-top:7px;background:#e1d6e7;border-radius:5px;overflow:hidden}.progress-track i{height:100%;display:block;background:#9a7aab;width:0}.coach-note{background:#f5f0d8;position:relative;padding:17px 14px 12px;transform:rotate(-1.7deg);box-shadow:1px 3px 3px #372a3910;margin:25px 0 3px;min-height:107px}.coach-note>span:not(.note-pin){font:12px var(--display);color:#aa986c}.coach-note p{font:17px/1.55 var(--display);color:#867852;margin:8px 0}.coach-note small{font:10px var(--display);display:block;text-align:right;color:#aa9a73}.note-pin{position:absolute;top:-7px;left:38%;width:68px;height:15px;transform:rotate(3deg);background:#d9cfada3}
.courses-section{grid-area:courses}.courses-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 13px}.courses-heading h2{font:20px var(--display);margin:0}.courses-heading h2 span{font:10px var(--body);color:#a093a5;margin-left:13px}.duration-note{font-size:10px;color:#a69aaa;white-space:nowrap}.courses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.course-card{position:relative;text-align:left;display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center;background:#fffdfc;border:1px solid #ddd3e1;border-radius:10px;padding:13px 12px;min-height:98px;box-shadow:0 3px 0 #e6dce9;transition:transform .15s,box-shadow .15s,border-color .15s}.course-card:hover:not(:disabled){transform:translateY(-3px);border-color:#ad95b8;box-shadow:0 6px 0 #e6dce9}.course-card:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 0 #e6dce9}.course-card:disabled{opacity:.6}.course-icon{display:grid;place-items:center;width:36px;height:41px;border-radius:11px;background:var(--tint);color:var(--tone)}.course-card.peach{--tint:#f8e1d6;--tone:#bd8b7c}.course-card.lilac{--tint:#eee0f2;--tone:#aa88b8}.course-card.green{--tint:#e2ebd8;--tone:#91a581}.course-card.yellow{--tint:#f5ebca;--tone:#b5a05d}.course-card.blue{--tint:#e3ebef;--tone:#89a5b4}.course-card.pink{--tint:#f4e1e8;--tone:#bd91a7}.course-card h3{font:700 17px var(--display);margin:0 0 3px}.course-card p{font-size:9px;color:#a393a3;margin:0}.course-gains{display:flex;gap:7px;margin-top:5px;font-size:9px;color:#937ea0}.course-plus{position:absolute;top:9px;right:8px;color:#beafc5}.course-plus svg{width:12px;height:12px}.footer{display:flex;justify-content:space-between;gap:20px;padding:22px 0 25px;font-size:10px;color:#b0a3b5}
.transport-scene{position:absolute;inset:0;background:#989f91;z-index:5;overflow:hidden;transition:filter 1s}.transport-scene::before{content:"";position:absolute;left:0;right:0;bottom:0;height:31%;background:#788270;border-top:5px solid #87917e}.factory{position:absolute;right:-4%;width:66%;height:72%;top:8%;background:#7e877a;border-top:17px solid #697661;border-left:8px solid #697661;box-shadow:inset 0 0 80px #5b675825}.factory-sign{background:#e1dbbf;border:4px solid #626f5d;width:81%;margin:20px auto 0;padding:6px 1px;text-align:center;font:22px var(--display);letter-spacing:3px;color:#64705c}.factory-door{position:absolute;bottom:0;left:20%;right:15%;height:53%;background:repeating-linear-gradient(#596455 0px,#596455 13px,#4e594a 13px,#4e594a 15px);border:7px solid #6d7864}.factory>span{position:absolute;bottom:8%;left:28%;font-size:10px;color:#b4b99f;z-index:1}.truck{position:absolute;bottom:17%;left:0;width:61%;z-index:3;will-change:transform}.truck svg{width:100%;height:auto}.transport-stamp{position:absolute;top:41%;left:40%;font:700 36px var(--display);color:#663b3b;border:4px double #663b3b;padding:4px 15px;transform:rotate(-15deg);opacity:0;z-index:5}.transport-text{position:absolute;bottom:7%;left:8%;right:8%;text-align:center;font:21px var(--display);color:#f0edda;z-index:6;text-shadow:0 2px 2px #435339}.stage[data-phase=transport] .stage-bottom{display:none}.stage[data-phase=transport] .stage-top{opacity:.7}.ceremony-scene{position:absolute;inset:0;background:#faf0ce;z-index:6;overflow:hidden;text-align:center}.ceremony-rays{position:absolute;inset:-60%;background:repeating-conic-gradient(from 0deg,#f5e5b870 0 15deg,#fff8e870 15deg 30deg);animation:rays 70s linear infinite}.ceremony-kicker{position:relative;font:16px var(--display);color:#a68c50;letter-spacing:2px;margin-top:7%}.ceremony-scene h2{position:relative;font:700 40px/1.3 var(--display);color:#816542;letter-spacing:5px;margin:7px 0}.ceremony-pig{position:absolute;width:37%;aspect-ratio:1;left:32%;bottom:8%;animation:proud 2s ease-in-out infinite}.ceremony-mark{position:absolute;bottom:6%;left:10%;right:10%;font:19px var(--display);color:#806a43}.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.confetti i{position:absolute;width:7px;height:13px;top:-20px;animation:confetti 3.4s linear infinite;background:#d8a6ba}.confetti i:nth-child(3n){background:#b6c792}.confetti i:nth-child(3n+1){background:#d8b562}
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#51455bed;color:#fffcff;padding:12px 23px;border-radius:12px;font-size:12px;z-index:100;box-shadow:0 5px 20px #46305018;max-width:90vw;text-align:center;pointer-events:none}.dialog{color:var(--ink);background:#fffdf9;border:1px solid #d4c7dc;border-radius:18px;padding:28px;width:min(500px,calc(100% - 32px));max-height:87dvh;box-shadow:0 20px 80px #46365033;overflow:auto}.dialog::backdrop{background:#4d405767;backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.dialog-heading h2{font:700 27px var(--display);margin:0}.dialog-heading>button{flex-shrink:0}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 0;border-top:1px dashed #e4dae7}.setting-row strong{font-size:13px}.setting-row p{font-size:11px;color:var(--muted);margin:3px 0}.small-button{display:inline-flex;gap:7px;align-items:center;justify-content:center;background:#eee8f2;border:1px solid #d9cde0;border-radius:7px;padding:8px 13px;font-size:11px}.small-button:hover{background:#e5d8ec}.small-button svg{width:15px;height:15px}.settings-actions{display:flex;gap:10px}.settings-info{font-size:12px;line-height:1.9;padding:15px;background:#f5f1f7;border-radius:8px;color:#8d7e98;margin:23px 0}.credits{font:13px/1.8 var(--display);color:#a79aab}.rename-dialog label{display:block;font-size:12px;color:var(--muted);margin:0 0 10px}.rename-dialog input{border:1px solid #d7c9de;background:#fff;border-radius:8px;width:100%;padding:12px 14px;color:var(--ink);font-size:18px;outline-offset:1px}.rename-dialog .primary-button{width:100%;margin-top:20px}
.album-dialog{width:min(730px,calc(100% - 30px))}.album-tabs{display:flex;gap:20px;border-bottom:1px solid #e4dce7;margin-bottom:22px}.album-tabs button{font-size:12px;background:none;padding:10px 4px;border-bottom:2px solid transparent;color:#a797af}.album-tabs button[aria-selected=true]{border-bottom-color:#9170a3;color:#77518e}.album-tabs button span{font-family:var(--digits);margin-left:5px}.empty-album{text-align:center;padding:25px 12px 35px}.empty-album .sprite{height:145px;width:145px;margin:auto}.empty-album h3{font:23px var(--display)}.empty-album p{font-size:12px;color:var(--muted)}.memory-list{display:grid;gap:12px}.memory-card{display:flex;align-items:center;gap:16px;padding:10px 15px;background:#f8f3f8;border:1px solid #e5dce8;border-radius:10px}.memory-sprite{width:72px;height:72px;flex-shrink:0}.memory-card h3{font:19px var(--display);margin:0 0 4px}.memory-card p{font-size:11px;color:#94859c;margin:0}.memory-card small{display:block;font-size:10px;color:#b195a0;margin-top:5px}.sticker-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.sticker{background:#f7f0f8;border:1px solid #e4d9e7;border-radius:10px;text-align:center;padding:8px;min-width:0}.sticker-pig{aspect-ratio:1}.sticker span:last-child{font:15px var(--display);display:block;margin-top:3px}.sticker.locked{filter:grayscale(1);opacity:.35}.sticker.locked .sticker-pig{filter:blur(4px)}.medal-history{display:flex;align-items:center;gap:16px;background:#fcf5e0;border:1px solid #e8dbb4;border-radius:10px;padding:16px;margin-bottom:13px}.medal-history .round-medal{width:48px;height:48px;font-size:23px;flex-shrink:0}.medal-history h3{font:20px var(--display);margin:0}.medal-history p{font-size:11px;color:#a99370;margin:4px 0 0}.medal-history button{margin-left:auto;background:transparent;font-size:11px;color:#9f7f4f;text-decoration:underline}
.award-dialog{width:min(780px,calc(100% - 26px));padding:0;background:#fffaf0;overflow-x:hidden}.award-close{position:absolute;right:15px;top:15px;z-index:3;background:#fffdf0a6}.award-top{position:relative;text-align:center;padding:24px 30px 21px;background:radial-gradient(ellipse at 50% 70%,#fff9e5,#f6e5b9);overflow:hidden}.award-kicker{font:13px var(--display);color:#a68a51;letter-spacing:3px;margin:0 0 4px}.award-top h2{font:700 35px/1.25 var(--display);margin:5px 0;color:#7b613d}.award-hero{display:flex;align-items:center;justify-content:center;gap:16px}.award-pig{width:175px;height:175px}.round-medal{width:74px;height:74px;border:4px double #c7a14e;border-radius:50%;display:grid;place-items:center;font:700 39px var(--digits);color:#a87b21;background:#ffe396;box-shadow:0 3px 0 #d6b664;position:relative}.award-grade p{font-size:10px;color:#a38a5c;margin:7px 0 0}.award-title{font:23px var(--display);color:#8b6d44;margin:0}.award-description{font:15px var(--display);color:#ae9066;margin:4px 0 0}.award-body{padding:20px 29px 25px}.award-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;border-bottom:1px dashed #e0d5bd;padding-bottom:20px}.award-stat{text-align:center}.award-stat>span{font-size:11px;color:#a4957c}.award-stat strong{display:block;font:700 30px var(--digits);color:#86714f}.award-stat small{font-size:10px;color:#b6a58a}.award-body h3{font:20px var(--display);margin:20px 0 11px}.award-highlights{display:grid;gap:10px}.award-memory{display:flex;gap:13px;align-items:center;border-bottom:1px solid #efe6d2;padding:0 0 10px}.award-memory .memory-sprite{width:56px;height:56px}.award-memory p{font:16px var(--display);margin:0;color:#8a785c}.award-memory small{font-size:10px;color:#b2a18c}.award-return{width:100%;margin-top:20px}.award-footnote{text-align:center;font-size:10px;color:#b4a58b;margin:10px 0 0}
@keyframes breathing{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.015,.99)}}@keyframes blink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.08)}}@keyframes rage{0%,100%{transform:translate(0) rotate(-2deg)}25%{transform:translate(-3px,-2px) rotate(0)}75%{transform:translate(3px) rotate(2deg)}}@keyframes balance{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}@keyframes game-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px) rotate(2deg)}}@keyframes dance{0%,100%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(8deg) translateY(-13px)}}@keyframes tiny-hop{0%,100%{transform:translate(0,20%) scale(.25)}50%{transform:translate(50%,5%) scale(.2)}}@keyframes relax{0%,100%{transform:scale(1.08,.94)}50%{transform:scale(1.12,.9)}}@keyframes invite{0%,100%{box-shadow:0 4px 0 #c7b47d}50%{box-shadow:0 4px 0 #c7b47d,0 0 0 5px #fff7d75c}}@keyframes float-heart{from{opacity:0;transform:translateY(10px) rotate(-15deg)}20%{opacity:1}to{opacity:0;transform:translateY(-90px) rotate(20deg)}}@keyframes gain-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes rays{to{transform:rotate(360deg)}}@keyframes proud{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes confetti{to{top:110%;transform:rotate(420deg)}}
.sprite{filter:url("#pig-cutout")}
.stage{min-width:0;scroll-margin-top:12px}
.training-prop{position:absolute;z-index:2;bottom:23%;left:28%;width:44%;height:10%}
.training-prop svg{width:100%;height:100%;overflow:visible}
.sticker-tiny .sprite{transform:scale(.3)}
.sticker-nose{overflow:hidden}.sticker-nose .sprite{transform:scale(1.8)}
.sticker-many{position:relative}.sticker-many .sprite{position:absolute;width:66%;height:66%;left:0;bottom:2%}.sticker-many .sprite:nth-child(2){left:35%;bottom:3%}.sticker-many .sprite:nth-child(3){left:17%;bottom:32%}
.prop-rush .belt-marks{animation:belt .36s linear infinite}
.prop-balance{animation:balance 2.2s ease-in-out infinite;transform-origin:50% 85%}
@keyframes belt{to{transform:translateX(-50px)}}
@media(max-width:600px){.stage{aspect-ratio:auto;height:310px;min-height:0;width:100%}.page-heading{display:block}.page-heading h1{display:block;word-break:keep-all}.inline-edit{display:inline-flex;vertical-align:middle}.attendance{max-width:none;margin-top:12px;justify-content:flex-start;gap:7px}.attendance>div{order:0}.training-prop{left:20%;width:60%;bottom:24%}}
@media(min-width:1500px){.app-shell{padding:0 36px}.stage{aspect-ratio:1.78}.course-card{padding-top:16px;padding-bottom:16px}}
@media(max-width:1150px){.app-shell{padding:0 26px}.topbar{height:88px}.header-note{display:none}.game-layout{grid-template-columns:minmax(0,1fr) 285px;gap:19px}.stage{aspect-ratio:1.55;min-height:340px}.course-card{grid-template-columns:27px 1fr;gap:8px;padding:13px 9px}.course-icon{width:27px;height:35px}.course-icon svg{width:18px}.course-card h3{font-size:15px}.course-card p{font-size:8px}.courses{gap:8px}.notebook{padding-left:16px;padding-right:16px}.idle-caption{font-size:20px;top:23%}.lesson-caption{font-size:17px;top:23%}.stage-number{display:none}.courses-heading h2 span{display:none}.coach-note{min-height:100px}.page-heading{padding:22px 0}.ceremony-scene h2{font-size:33px}.factory-sign{font-size:18px}}
@media(max-width:900px){.game-layout{grid-template-columns:1fr;grid-template-areas:"stage" "notes" "courses";gap:22px}.stage{aspect-ratio:1.8;min-height:320px}.notebook{display:grid;grid-template-columns:1fr 1fr;gap:0 25px;padding:0 22px 17px;align-items:start}.notebook-tabs{grid-column:1/-1}.pig-profile{grid-column:1;grid-row:2}.stat-list{grid-column:1;grid-row:3 / span 3;padding-bottom:0}.queue-heading{grid-column:2;grid-row:2;border:0;padding:16px 0 0}.queue{grid-column:2;grid-row:3;margin:7px 0 13px}.active-lesson{grid-column:2}.main-action{grid-column:2}.playback{grid-column:1;grid-row:6;justify-content:flex-start;padding:2px 0 0}.queue-hint{grid-column:2;margin-bottom:0}.coach-note{display:none}.attendance{gap:10px}.footer{padding-bottom:24px}.stage-bottom{font-size:11px}.idle-caption{font-size:23px}.course-card{grid-template-columns:36px 1fr;padding:15px}.course-icon{width:36px;height:41px}.course-card h3{font-size:18px}.course-card p{font-size:10px}.course-gains{font-size:10px}.lesson-caption{font-size:20px}.ceremony-scene h2{font-size:40px}}
@media(max-width:600px){.app-shell{padding:0 16px}.topbar{height:76px;gap:10px}.brand{gap:7px}.brand-pig{width:36px}.brand strong{font-size:24px;letter-spacing:0}.brand small{font-size:8px;letter-spacing:2px;margin-top:3px}.topbar nav{gap:10px}.nav-button{font-size:10px;gap:4px}.nav-button svg{width:16px;height:16px}.topbar .icon-button{width:27px;height:30px}.topbar .icon-button svg{width:17px}.save-status{display:none}.page-heading{padding:21px 0 16px;align-items:flex-start}.eyebrow{font-size:8px;letter-spacing:1px}.page-heading h1{font-size:26px;gap:0}.inline-edit{padding:5px;margin-left:4px}.inline-edit svg{width:12px}.attendance{flex-wrap:wrap;gap:5px 6px;justify-content:flex-end;max-width:105px}.attendance>span{font-size:9px}.attendance b{font-size:11px}.attendance>div{order:3}#attendance-dots{gap:3px}.attendance-dot{height:10px;width:10px;border-width:1px}.attendance-dot svg{width:7px;height:7px}.stage{aspect-ratio:1.17;min-height:290px;border-radius:13px}.room svg{width:150%;margin-left:-25%}.stage-top{top:12px;left:13px;right:12px}.scene-tag{font-size:9px;padding:4px 8px}.stage-sound{width:27px;height:27px}.stage-sound svg{width:15px;height:15px}.idle-caption{font-size:21px;left:17%;right:10%;top:26%}.pig-actor{left:19%;width:62%;bottom:9%}.speech-mark{font-size:50px;top:-20px}.stage-bottom{bottom:13px;left:13px;right:13px;font-size:9px;text-align:center;justify-content:center}.stage[data-phase=training] .meme-actor{width:56%;left:22%;bottom:23%}.lesson-caption{top:23%;left:13%;right:13%;font-size:17px}.training-control{left:5%;right:5%;bottom:15%}.interaction-button{font-size:11px;padding:9px 15px}.interaction-note{font-size:14px}.meme-badge{font-size:13px}.gain-toast{top:50px;right:10px;padding:8px 12px}.gain-toast strong{font-size:15px}.gain-toast div{font-size:10px}.notebook{padding:0 14px 13px;gap:0 15px;border-radius:10px}.notebook-tabs{padding:12px 0 9px}.notebook-tabs .active{font-size:17px}.pig-profile{gap:7px;padding:12px 0 7px}.pig-profile>div:first-child{width:37px;height:37px}.pig-profile strong{font-size:18px}.pig-profile p{font-size:8px;line-height:1.5;max-width:85px}.profile-stamp{display:none}.stat-list{gap:11px;padding-top:12px}.stat-row{grid-template-columns:43px 1fr 21px;gap:6px;font-size:10px}.stat-label{gap:4px}.stat-label svg{width:12px}.stat-row b{font-size:12px}.stat-track{height:5px}.queue-heading{padding-top:15px}.queue-heading h2{font-size:16px}.queue-heading>span{font-size:8px}.queue li{height:31px;padding:0 6px;gap:6px;font-size:10px}.queue li.empty{font-size:9px}.queue li>svg{display:none}.queue li .q-number{font-size:8px}.queue li button{padding:4px}.queue{gap:5px;margin:7px 0 10px}.primary-button{min-height:40px;font-size:11px;padding:8px 10px;gap:7px}.main-action svg{width:14px}.playback{gap:8px;margin-top:12px;grid-row:6}.playback button{font-size:10px;padding:4px}.queue-hint{font-size:8px;margin-top:8px}.active-lesson{padding:6px}.active-lesson>div:first-child{font-size:8px}.courses-heading{margin-bottom:12px}.courses-heading h2{font-size:20px}.duration-note{font-size:9px}.courses{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.course-card{grid-template-columns:31px 1fr;gap:9px;min-height:90px;padding:12px 10px}.course-icon{width:31px;height:37px}.course-card h3{font-size:17px}.course-card p{font-size:8px}.course-gains{font-size:9px;gap:6px}.footer{display:block;text-align:center;font-size:9px;line-height:1.9;padding:23px 0}.footer span{display:block}.factory{width:83%;right:-16%;top:18%;height:59%}.factory-sign{font-size:15px;letter-spacing:1px;margin-top:14px}.factory>span{font-size:8px;left:24%}.truck{width:84%;bottom:19%;left:-8%}.transport-text{font-size:18px;bottom:7%}.transport-stamp{font-size:25px;left:31%;top:47%}.ceremony-kicker{margin-top:14%;font-size:13px}.ceremony-scene h2{font-size:30px;margin-top:12px}.ceremony-pig{width:49%;left:26%;bottom:8%}.ceremony-mark{font-size:16px;bottom:7%}.dialog{padding:22px}.dialog-heading h2{font-size:24px}.sticker-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.memory-card{padding:8px 10px;gap:10px}.memory-sprite{width:54px;height:54px}.memory-card h3{font-size:17px}.memory-card p{font-size:10px}.award-dialog{padding:0}.award-top{padding:23px 20px 19px}.award-top h2{font-size:29px}.award-pig{width:140px;height:140px}.round-medal{width:62px;height:62px;font-size:30px}.award-body{padding:18px 19px 22px}.award-stat strong{font-size:26px}.award-stat>span{font-size:10px}.award-stat small{font-size:9px}.award-memory p{font-size:15px}.award-body h3{font-size:19px}.award-title{font-size:21px}.award-description{font-size:13px}.medal-history{padding:12px;gap:10px}.medal-history h3{font-size:17px}}
@media(max-width:360px){.app-shell{padding:0 11px}.brand strong{font-size:22px}.brand-pig{width:30px}.topbar nav{gap:5px}.nav-button{font-size:9px}.page-heading h1{font-size:23px}.notebook{gap:0 11px;padding-left:11px;padding-right:11px}.queue-heading h2{font-size:14px}.queue-heading>span{font-size:7px}.course-card{grid-template-columns:25px 1fr;gap:7px;padding:11px 8px}.course-icon{width:25px;height:33px}.course-card h3{font-size:15px}.course-card p{font-size:7px}.course-gains{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.meme-actor.motion-tiny{transform:scale(.25)}.pet-heart{opacity:1}.confetti{display:none}}
.stage[data-phase=training] .meme-actor{bottom:11%}
.training-control{bottom:7%}
.training-prop{bottom:12%}
@media(max-width:600px){
  .stage[data-phase=training] .meme-actor{width:48%;left:26%;bottom:15%}
  .lesson-caption{top:18%;font-size:15px;line-height:1.45}
  .training-control{bottom:5%}
  .training-prop{bottom:14%;width:54%;left:23%}
  .stage[data-phase=training] .stage-bottom,.meme-badge{display:none}
  .meme-actor.motion-nose{transform:scale(1.05)}
  .ceremony-kicker{margin-top:12%}
  .ceremony-scene h2{font-size:24px;letter-spacing:2px}
  .ceremony-scene h2 br{display:none}
  .ceremony-pig{bottom:14%}
}

#site-home small{font:12px/1.5 var(--body);letter-spacing:0;color:var(--muted)}#site-home:hover small{color:var(--rose)}#site-home:focus-visible{outline:2px solid var(--rose);outline-offset:5px;border-radius:4px}
