@import "https://fonts.googleapis.com/css2?family=ZCOOL+KuaiLe&display=swap";.teacher-nav[data-v-f9d69d6a]{padding:8px 0;padding-bottom:env(safe-area-inset-bottom,8px);z-index:100;background:#fff;border-top:1px solid #eee;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 12px #0000000f}.teacher-nav-item[data-v-f9d69d6a]{color:#999;flex-direction:column;flex:1;align-items:center;gap:2px;font-size:.72rem;text-decoration:none;transition:color .2s;display:flex}.teacher-nav-item.active[data-v-f9d69d6a]{color:var(--color-primary)}.nav-icon[data-v-f9d69d6a]{font-size:1.3rem}.nav-label[data-v-f9d69d6a]{font-weight:500}:root{--color-primary:#ff6b9d;--color-primary-light:#ffb3d0;--color-secondary:#7c5cfc;--color-secondary-light:#b8a9ff;--color-success:#4ecdc4;--color-warning:#ffe66d;--color-danger:#ff6b6b;--color-bg:#fff8f0;--color-bg-card:#fff;--color-text:#2d3436;--color-text-muted:#636e72;--color-border:#f0e6d8;--radius:16px;--radius-sm:10px;--radius-full:999px;--shadow:0 4px 16px #ff6b9d26;--shadow-sm:0 2px 8px #0000000f;--font-fun:"ZCOOL KuaiLe", cursive;--font-body:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100vh}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.6}h1,h2,h3{font-family:var(--font-body);font-weight:600}a{color:var(--color-primary);text-decoration:none}button{cursor:pointer;border:none;font-family:inherit}input,textarea{font-family:inherit;font-size:inherit}.btn{border-radius:var(--radius-full);border:none;justify-content:center;align-items:center;gap:6px;padding:12px 24px;font-size:.95rem;font-weight:500;transition:all .2s;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:#fff;box-shadow:0 4px 14px #ff6b9d59}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ff6b9d73}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{color:var(--color-primary);border:2px solid var(--color-primary-light);background:#fff}.btn-secondary:hover{background:var(--color-primary-light);color:#fff}.btn-icon{border-radius:50%;width:44px;height:44px;padding:0;font-size:1.2rem}.card{background:var(--color-bg-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);border:2px solid var(--color-border);padding:20px}.cosmetic-card{isolation:isolate;background-color:var(--color-bg-card);position:relative}.cosmetic-card[class*=cosmetic-frame-]:after{content:"";z-index:3;border-radius:inherit;background:var(--cosmetic-frame-image) center / 100% 100% no-repeat;pointer-events:none;position:absolute;inset:0}.cosmetic-card[class*=cosmetic-frame-]>*{z-index:1;position:relative}.cosmetic-frame-leaf{--cosmetic-frame-image:url(/assets/shop/frame-leaf.png);border-color:#0000!important}.cosmetic-frame-candy{--cosmetic-frame-image:url(/assets/shop/frame-candy.png);border-color:#0000!important}.cosmetic-frame-starlight{--cosmetic-frame-image:url(/assets/shop/frame-starlight.png);border-color:#0000!important}.cosmetic-frame-gold{--cosmetic-frame-image:url(/assets/shop/frame-gold.png);border-color:#0000!important}.cosmetic-background-meadow{background:radial-gradient(circle at 18% 22%,#fffbd8 0 7%,#0000 8%),linear-gradient(160deg,#e9f6d8,#c9ead5)!important}.cosmetic-background-sunset{background:radial-gradient(circle at 78% 20%,#fff3bd 0 9%,#0000 10%),linear-gradient(145deg,#ffe0c5,#f8bad2 55%,#c9b8e8)!important}.cosmetic-background-ocean{background:radial-gradient(circle at 20% 25%,#fff8 0 5%,#0000 6%),radial-gradient(circle at 82% 68%,#fff7 0 7%,#0000 8%),linear-gradient(145deg,#d9fbfa,#9fd7ed)!important}.cosmetic-background-night{color:#fff;background:radial-gradient(circle at 20% 20%,#fff 0 1px,#0000 2px),radial-gradient(circle at 73% 32%,#fff8b0 0 2px,#0000 3px),linear-gradient(145deg,#252b58,#594d91)!important}.cosmetic-background-hidden{box-shadow:none!important;background:0 0!important}.form-group{margin-bottom:16px}.form-label{color:var(--color-text-muted);margin-bottom:6px;font-size:.9rem;font-weight:500;display:block}.form-input{border:2px solid var(--color-border);border-radius:var(--radius-sm);background:#fff;outline:none;width:100%;padding:12px 16px;font-size:1rem;transition:border-color .2s}.form-input:focus{border-color:var(--color-primary)}.progress-bar{background:var(--color-border);border-radius:var(--radius-full);height:10px;overflow:hidden}.progress-fill{border-radius:var(--radius-full);height:100%;transition:width .5s}.bottom-nav{border-top:2px solid var(--color-border);padding:8px 0;padding-bottom:max(8px, env(safe-area-inset-bottom));z-index:100;background:#fff;justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-nav a{color:var(--color-text-muted);border-radius:var(--radius-sm);flex-direction:column;align-items:center;gap:2px;padding:4px 12px;font-size:.7rem;transition:color .2s;display:flex}.bottom-nav a.active{color:var(--color-primary)}.bottom-nav a .nav-icon{font-size:1.4rem}.page{max-width:480px;min-height:100vh;margin:0 auto;padding:16px 16px 80px}.page-title{text-align:center;color:var(--color-primary);margin-bottom:20px;font-size:1.5rem}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes sparkle{0%{opacity:0;transform:scale(0)rotate(0)}50%{opacity:1;transform:scale(1)rotate(180deg)}to{opacity:0;transform:scale(0)rotate(360deg)}}.animate-bounce{animation:2s ease-in-out infinite bounce}.animate-float{animation:3s ease-in-out infinite float}.toast{background:var(--color-text);color:#fff;border-radius:var(--radius-full);z-index:1000;padding:12px 24px;font-size:.9rem;animation:.3s float;position:fixed;top:20px;left:50%;transform:translate(-50%)}:root{--page-width:1600px;--page-gutter:clamp(16px, 3vw, 48px);--sidebar-width:208px}#app .app-shell{min-height:100dvh}#app .app-shell .page,#app .app-shell .create-page,#app .app-shell .admin-page{width:100%;max-width:var(--page-width);min-height:100dvh;padding:24px var(--page-gutter) calc(96px + env(safe-area-inset-bottom));overflow-wrap:anywhere;margin-inline:auto}#app .app-shell .create-page{padding-bottom:32px}#app .app-shell :is(.form-input,.card,.form-group,.task-info,.rank-info,.student-meta,.feed-info,.completion-info){min-width:0}#app .app-shell :is(.header-row,.page-header,.page-title-row,.teacher-header,.admin-header){flex-wrap:wrap;gap:12px}#app .app-shell :is(.student-card,.task-card,.rank-item){gap:12px}#app .app-shell :is(.student-info,.pet-item-info){min-width:0}#app .app-shell :is(.student-avatar,.rank-badge,.class-icon){flex-shrink:0}#app .app-shell .toast{overflow-wrap:anywhere;max-width:calc(100vw - 32px)}#app .app-shell .teacher-nav{padding-bottom:max(8px, env(safe-area-inset-bottom))}#app .app-shell :is(.bottom-nav,.teacher-nav) a{justify-content:center;min-height:44px}#app .app-shell :is(.bottom-nav,.teacher-nav) a:focus-visible{outline:3px solid var(--color-secondary);outline-offset:-3px}#app .app-shell .dialog-overlay{padding:16px;overflow-y:auto}#app .app-shell .dialog-overlay>:is(.dialog,.password-dialog){overscroll-behavior:contain;overflow-wrap:anywhere;max-height:calc(100dvh - 32px);overflow-y:auto}#app .app-shell .dialog-overlay .pet-preview{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#app .app-shell .dialog-overlay .preview-pet{max-width:100%}#app .app-shell .pets-page .pet-list{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}#app .app-shell .settings-page{align-content:start;gap:20px;display:grid}#app .app-shell .settings-page>.page-title{margin-bottom:0}#app .app-shell .create-page .preview-pet{max-width:100%}#app .app-shell .detail-content{overflow-wrap:anywhere}#app .app-shell .detail-image{object-fit:contain;max-height:60vh}@media (width>=768px){#app .app-shell .page-title{text-align:left;font-size:1.8rem}#app .app-shell :is(.diary-list,.feed-list,.task-list,.completion-list,.leaderboard){grid-template-columns:repeat(auto-fill,minmax(300px,1fr));align-items:start;gap:20px;display:grid}#app .app-shell .students-page .student-list{grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:16px;display:grid}#app .app-shell :is(.diary-card,.feed-card){height:100%;margin-bottom:0}#app .app-shell .diary-page .new-diary-btn{width:auto;padding-inline:28px}#app .app-shell .feed-image{object-fit:cover;width:100%;height:220px}#app .app-shell .settings-page{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}#app .app-shell .settings-page>:is(.page-title,.form-error,.form-success){grid-column:1/-1}#app .app-shell .dashboard-page .stat-card{padding:28px}#app .app-shell .dashboard-page .stat-value{font-size:2rem}#app .app-shell .dashboard-page .stat-label{font-size:.95rem}#app .app-shell .profile-page,#app .app-shell .student-detail-page{grid-template-columns:minmax(240px,1fr) minmax(0,2fr);align-content:start;align-items:start;gap:24px;display:grid}#app .app-shell :is(.profile-page,.student-detail-page)>:is(.page-title,.page-header,.loading-state){grid-column:1/-1}#app .app-shell .profile-page .profile-card{grid-area:2/1;margin:0}#app .app-shell .profile-page .badges-section{grid-area:2/2;margin:0}#app .app-shell .profile-page .password-card{grid-area:3/1;margin:0}#app .app-shell .profile-page .pet-info{grid-area:3/2;margin:0}#app .app-shell .profile-page .logout-btn{grid-area:4/1}#app .app-shell .student-detail-page .history-section{grid-column:1/-1}#app .app-shell .home-page{grid-template-columns:300px minmax(340px,490px);place-content:start center;align-items:stretch;gap:72px;display:grid}#app .app-shell .home-page>:is(.pet-switcher,.loading){grid-column:1/-1;margin-bottom:0}#app .app-shell .home-page .pet-display{grid-column:1;width:300px;min-height:480px;margin:0}#app .app-shell .home-page .care-panel{grid-column:2;margin:0}#app .app-shell .home-page .care-panel .stats-grid{margin:0}#app .app-shell .home-page .care-panel .actions-grid{grid-template-columns:1fr;gap:10px}#app .app-shell .home-page .care-panel .action-btn{text-align:left;flex-direction:row;min-height:0;padding:14px 16px}#app .app-shell .home-page .care-panel .action-label{flex:1}#app .app-shell .auth-page{padding:48px var(--page-gutter);grid-template-columns:minmax(0,480px) minmax(0,440px);justify-content:center;gap:clamp(32px,6vw,100px);min-height:100dvh;display:grid}#app .app-shell .auth-header{margin:0}#app .app-shell .auth-header h1{font-size:clamp(2.4rem,4vw,4rem)}#app .app-shell .auth-icon{font-size:clamp(5rem,8vw,8rem)}#app .app-shell .auth-form{max-width:none;padding:32px}#app .app-shell .create-page{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-content:start;align-items:start;gap:24px 32px;display:grid}#app .app-shell .create-page:not(.has-selection){grid-template-columns:minmax(0,1fr);max-width:1200px}#app .app-shell .create-page .create-header{grid-column:1/-1}#app .app-shell .create-page>:is(.species-grid,.section,.form-error,.create-btn){grid-column:1;margin:0}#app .app-shell .create-page .preview{grid-area:2/2/span 5;margin:0;position:sticky;top:24px}#app .app-shell .create-page .species-grid{grid-template-columns:repeat(auto-fill,minmax(135px,1fr))}#app .app-shell .create-page:not(.has-selection) .species-grid{grid-column:1;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;max-width:920px;margin-inline:auto}#app .app-shell .diary-editor-page .editor-form{grid-template-columns:minmax(0,3fr) minmax(240px,2fr);align-items:start;gap:24px;display:grid}#app .app-shell .editor-form .form-group{margin:0}#app .app-shell .editor-form .form-group:first-child{grid-column:1/-1}#app .app-shell .editor-form .form-group:nth-child(2){grid-area:2/1/span 2}#app .app-shell .editor-form .form-group:nth-child(3),#app .app-shell .editor-form .form-group:nth-child(4){grid-column:2}#app .app-shell .editor-form .form-textarea{min-height:360px}#app .app-shell .editor-form .submit-btn{grid-column:1/-1;justify-self:end;width:auto;min-width:180px}#app .app-shell .task-form-page{max-width:1000px}#app .app-shell .task-form{padding:32px}#app .app-shell .diary-detail-page{max-width:1100px}#app .app-shell .detail-card{padding:clamp(24px,4vw,56px)}#app .app-shell .dialog-overlay>.dialog{max-width:560px}#app .app-shell .dialog-overlay>.batch-feed-dialog{max-width:720px}#app .app-shell .batch-pet-list{grid-template-columns:repeat(3,minmax(0,1fr));max-height:40dvh}#app .app-shell .search-bar{max-width:560px}}@media (width>=1024px){#app .app-shell.has-navigation{padding-left:var(--sidebar-width)}#app .app-shell :is(.page,.admin-page){padding-top:36px;padding-bottom:40px}#app .app-shell :is(.bottom-nav,.teacher-nav){width:var(--sidebar-width);border-top:0;border-right:2px solid var(--color-border);box-shadow:none;flex-direction:column;justify-content:flex-start;gap:8px;padding:32px 16px;inset:0 auto 0 0;overflow-y:auto}#app .app-shell :is(.bottom-nav,.teacher-nav):before{content:"🐾 宠物乐园";font-family:var(--font-fun);color:var(--color-primary);text-align:center;padding:8px 4px 28px;font-size:1.4rem}#app .app-shell :is(.bottom-nav,.teacher-nav) a{border-radius:var(--radius-sm);flex-direction:row;flex:none;justify-content:flex-start;gap:14px;padding:14px 18px;font-size:1rem}#app .app-shell :is(.bottom-nav,.teacher-nav) a.active{color:var(--color-primary);background:#fff0f5}#app .app-shell :is(.bottom-nav,.teacher-nav) a:hover{background:#fff8fb}}@media (width>=1600px){:root{--sidebar-width:240px}#app .app-shell .settings-page{grid-template-columns:repeat(3,minmax(0,1fr))}#app .app-shell .create-page .species-grid{grid-template-columns:repeat(4,minmax(0,1fr))}#app .app-shell .create-page:not(.has-selection) .species-grid{grid-template-columns:repeat(5,minmax(0,1fr));max-width:1100px}#app .app-shell .home-page .pet-display{min-height:480px}}@media (width<=767px){#app .app-shell .student-card{flex-wrap:wrap}#app .app-shell .student-card .student-info{flex-basis:160px}#app .app-shell .student-card .student-actions{margin-left:auto}#app .app-shell .admin-page :is(.form-grid,.class-grid,.manage-grid){grid-template-columns:minmax(0,1fr)}#app .app-shell .admin-page .student-row{flex-wrap:wrap}#app .app-shell .auth-page{padding:24px 16px}#app .app-shell .batch-pet-list{grid-template-columns:minmax(0,1fr)}}.cosmetic-card.cosmetic-frame-travel-forest:after,.cosmetic-card.cosmetic-frame-travel-coast:after,.cosmetic-card.cosmetic-frame-travel-stars:after{content:"";border-radius:inherit;pointer-events:none;z-index:3;opacity:1;animation:none;position:absolute;-webkit-mask:none;mask:none;background:0 0!important;inset:-5px!important}.cosmetic-card.cosmetic-frame-travel-forest:after{border:5px double #6b9150;box-shadow:0 0 0 2px #e3e9c7,0 5px 14px #49613918}.cosmetic-card.cosmetic-frame-travel-coast:after{border:5px dotted #d8b67e;box-shadow:0 0 0 2px #e9e1c9,0 5px 14px #4e7f9018}.cosmetic-card.cosmetic-frame-travel-stars:after{border:4px double #b2a0dc;box-shadow:0 0 0 2px #e9e2f5,0 0 16px #a894d53b}.cosmetic-card.cosmetic-background-travel-forest{background:radial-gradient(circle at 18% 30%,#f9ffb5 0 2px,#0000 4px),radial-gradient(circle at 82% 55%,#eaffab 0 2px,#0000 4px),linear-gradient(155deg,#edf0cf,#a6c4a1 65%,#6c9c85)!important}.cosmetic-card.cosmetic-background-travel-coast{background:radial-gradient(at 15% 12%,#fff9ce,#0000 45%),linear-gradient(170deg,#e4f7f5,#96d9df 62%,#d3ebe2 63%,#f1dfb7 76%)!important}.cosmetic-card.cosmetic-background-travel-stars{background:radial-gradient(circle at 20% 20%,#fff 0 1px,#0000 3px),radial-gradient(circle at 80% 35%,#fffbe1 0 2px,#0000 4px),radial-gradient(circle at 62% 12%,#fff 0 1px,#0000 3px),linear-gradient(160deg,#d6daf1,#b4b4da 55%,#969dc7)!important}
