@import url(https://fonts.googleapis.com/css2?family=Comic+Neue:wght@700&family=Fredoka+One&display=swap);#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50;margin-top:60px}.learning-vue[data-v-124c8406]{max-width:1200px;margin:0 auto;padding:20px}.animated-title[data-v-124c8406]{font-family:Fredoka One,cursive;font-size:3.5em;color:#2c3e50;text-align:center;margin-bottom:40px;position:relative;animation:bounce-124c8406 1.5s ease-in-out infinite;text-shadow:2px 2px 4px rgba(0,0,0,.1);background:linear-gradient(135deg,#42b983,#3aa876);-webkit-background-clip:text;-webkit-text-fill-color:transparent}@keyframes bounce-124c8406{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (max-width:768px){.animated-title[data-v-124c8406]{font-size:2.5em;animation:none}}.menu-container[data-v-124c8406]{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:20px}.menu-section[data-v-124c8406]{background:#f8f9fa;border-radius:8px;padding:20px;transition:transform .3s ease}.menu-section[data-v-124c8406]:hover{transform:translateY(-5px);box-shadow:0 4px 12px rgba(0,0,0,.1)}h2[data-v-124c8406]{color:#42b983;font-size:1.5em;margin-bottom:20px;text-align:center}ul[data-v-124c8406]{list-style:none;padding:0}li[data-v-124c8406]{margin-bottom:20px}h3[data-v-124c8406]{color:#2c3e50;font-size:1.2em;margin-bottom:8px}p[data-v-124c8406]{color:#666;font-size:.9em;line-height:1.4}.tool-link[data-v-124c8406]{color:#42b983;text-decoration:none;transition:color .3s ease}.tool-link[data-v-124c8406]:hover{color:#3aa876;text-decoration:underline}.vue-basics[data-v-786a2a01]{max-width:800px;margin:0 auto;padding:20px}h1.animated-title[data-v-786a2a01]{color:#2c3e50;text-align:center;margin-bottom:30px}h2[data-v-786a2a01]{color:#42b983;margin-bottom:20px}.upload-container[data-v-786a2a01]{margin:20px 0}.upload-box[data-v-786a2a01]{border:2px dashed #ddd;border-radius:8px;padding:20px;text-align:center;cursor:pointer;transition:all .3s ease;min-height:200px;display:flex;align-items:center;justify-content:center}.upload-box[data-v-786a2a01]:hover{border-color:#42b983;background-color:#f8f9fa}.upload-placeholder[data-v-786a2a01]{color:#666}.upload-icon[data-v-786a2a01]{font-size:40px;margin-bottom:10px;display:block}.preview-image[data-v-786a2a01]{max-width:100%;max-height:400px;border-radius:4px}.image-info[data-v-786a2a01]{margin-top:20px;text-align:center}.button-group[data-v-786a2a01]{display:flex;justify-content:center;gap:10px;margin-bottom:20px}.clear-btn[data-v-786a2a01],.recognize-btn[data-v-786a2a01],.scan-btn[data-v-786a2a01]{border:none;padding:8px 16px;border-radius:4px;cursor:pointer;transition:all .3s ease;font-weight:500}.clear-btn[data-v-786a2a01]{background-color:#ff4757;color:#fff}.clear-btn[data-v-786a2a01]:hover{background-color:#ff6b81}.scan-btn[data-v-786a2a01]{background-color:#42b983;color:#fff}.scan-btn[data-v-786a2a01]:hover:not(:disabled){background-color:#3aa876}.scan-btn[data-v-786a2a01]:disabled{background-color:#a8d5c2;cursor:not-allowed}.recognize-btn[data-v-786a2a01]{background-color:#7957d5;color:#fff}.recognize-btn[data-v-786a2a01]:hover:not(:disabled){background-color:#6943c8}.recognize-btn[data-v-786a2a01]:disabled{background-color:#b3a3e0;cursor:not-allowed}.recognition-result[data-v-786a2a01],.scan-result[data-v-786a2a01]{margin-top:20px;padding:15px;background-color:#f8f9fa;border-radius:8px;text-align:left}.result-box[data-v-786a2a01]{margin-top:10px;padding:10px;background-color:#fff;border-radius:4px;border:1px solid #eee}h3[data-v-786a2a01]{color:#2c3e50;font-size:1.1em;margin-bottom:10px}.base64-content[data-v-786a2a01]{position:relative;max-height:200px;overflow-y:auto;padding-right:100px}.base64-text[data-v-786a2a01]{word-break:break-all;white-space:pre-wrap;margin:0;font-family:monospace;font-size:.9em;line-height:1.4}.copy-btn[data-v-786a2a01]{position:absolute;top:0;right:0;background-color:#42b983;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.copy-btn[data-v-786a2a01]:hover{background-color:#3aa876}.dish-list[data-v-786a2a01]{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.dish-item[data-v-786a2a01]{display:flex;justify-content:space-between;align-items:flex-start;padding:12px;border-bottom:1px solid #eee;background-color:#fff;border-radius:6px;margin-bottom:8px;transition:all .3s ease}.dish-item[data-v-786a2a01]:hover{box-shadow:0 2px 8px rgba(0,0,0,.1);transform:translateY(-2px)}.dish-info[data-v-786a2a01]{flex:1}.dish-name[data-v-786a2a01]{font-weight:600;color:#2c3e50;font-size:1.1em;display:block;margin-bottom:6px}.dish-details[data-v-786a2a01]{display:flex;gap:16px;align-items:center;margin-top:4px}.dish-calorie[data-v-786a2a01],.dish-probability[data-v-786a2a01]{display:flex;align-items:center;gap:4px;color:#666;font-size:.9em}.calorie-icon[data-v-786a2a01],.info-icon[data-v-786a2a01],.probability-icon[data-v-786a2a01]{font-size:1.2em}.dish-tags[data-v-786a2a01]{display:flex;gap:8px;margin-left:12px}.baike-link[data-v-786a2a01]{display:flex;align-items:center;gap:4px;color:#42b983;text-decoration:none;font-size:.9em;padding:4px 8px;border-radius:4px;background-color:#f0f9f4;transition:all .3s ease}.baike-link[data-v-786a2a01]:hover{background-color:#e0f4e9;color:#3aa876}.dish-calorie[data-v-786a2a01]{display:flex;align-items:center;gap:4px;color:#666;font-size:.9em;position:relative}.unit-hint[data-v-786a2a01]{font-size:.9em;color:#999;cursor:help;margin-left:2px}.upload-hint[data-v-786a2a01]{font-size:.8em;color:#999;margin-top:8px}.compressing-placeholder[data-v-786a2a01]{color:#666;text-align:center}.loading-icon[data-v-786a2a01]{font-size:40px;margin-bottom:10px;display:block;animation:spin-786a2a01 2s linear infinite}@keyframes spin-786a2a01{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vue-basics{max-width:1200px;margin:0 auto;padding:20px}h1{color:#2c3e50;font-size:2.5em;margin-bottom:40px;text-align:center}.content-container{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:20px}.section{background:#f8f9fa;border-radius:8px;padding:20px;transition:transform .3s ease}.section:hover{transform:translateY(-5px);box-shadow:0 4px 12px rgba(0,0,0,.1)}h2{color:#42b983;font-size:1.5em;margin-bottom:20px;text-align:center}.content-box{background:#fff;padding:20px;border-radius:6px;box-shadow:0 2px 4px rgba(0,0,0,.05)}h3{color:#2c3e50;font-size:1.2em;margin:15px 0 10px;padding-left:10px;border-left:3px solid #42b983}ul{list-style:none;padding:0;margin:10px 0}li{margin:12px 0;padding:12px 20px;position:relative;line-height:1.6;background:linear-gradient(145deg,#f0fff4,#e6f9f0);border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.05);transition:all .3s ease}li:hover{transform:translateX(5px);background:linear-gradient(145deg,#e6f9f0,#d8f3e5);box-shadow:0 4px 8px rgba(66,185,131,.2)}li:before{content:"•";color:#42b983;position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:1.5em;text-shadow:0 2px 4px rgba(66,185,131,.2)}.nav-buttons{margin-top:40px;text-align:center}.nav-btn{display:inline-block;padding:12px 24px;background-color:#42b983;color:#fff;text-decoration:none;border-radius:4px;transition:all .3s ease;font-size:1.1em}.nav-btn:hover{background-color:#3aa876;transform:translateY(-2px);box-shadow:0 2px 8px rgba(66,185,131,.3)}@media (max-width:1024px){.content-container{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.content-container{grid-template-columns:1fr}h1{font-size:2em}.section{margin-bottom:20px}}.ai-table[data-v-9ffce13a]{overflow-x:auto}table[data-v-9ffce13a]{width:100%;border-collapse:collapse;margin-top:20px}td[data-v-9ffce13a],th[data-v-9ffce13a]{padding:12px;text-align:left;border-bottom:1px solid #eee}th[data-v-9ffce13a]{background-color:#f8f9fa;font-weight:600}tr[data-v-9ffce13a]:hover{background-color:#f5f5f5}.feature-table[data-v-9ffce13a]{overflow-x:auto}.feature-table table[data-v-9ffce13a]{width:100%;min-width:800px;border-collapse:collapse}.feature-table td[data-v-9ffce13a],.feature-table th[data-v-9ffce13a]{padding:12px;text-align:center;border:1px solid #eee}.feature-table th[data-v-9ffce13a]{background-color:#f8f9fa;font-weight:600}.feature-table tr[data-v-9ffce13a]:hover{background-color:#f5f5f5}.feature-table .platform-link[data-v-9ffce13a]{color:#42b983;text-decoration:none;transition:color .3s ease}.feature-table .platform-link[data-v-9ffce13a]:hover{color:#3aa876;text-decoration:underline}.chart-container[data-v-9ffce13a]{height:300px;position:relative}.chart-container h3[data-v-9ffce13a]{color:#42b983;text-align:center;margin-bottom:20px}canvas[data-v-9ffce13a]{max-width:100%;height:100%!important;width:100%!important;margin:0 auto;display:block}.content-container[data-v-9ffce13a]{display:flex;flex-direction:column;gap:40px}.section[data-v-9ffce13a]{margin-bottom:40px}.content-box[data-v-9ffce13a]{padding:20px;background:#f8f9fa;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.05)}.ai-table[data-v-9ffce13a]{margin-bottom:30px}.chart-container[data-v-9ffce13a]{margin-top:30px;padding-top:20px;border-top:1px solid #eee}.feature-table[data-v-9ffce13a]{margin-top:20px}.section-header[data-v-9ffce13a]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.update-btn[data-v-9ffce13a]{padding:8px 16px;background-color:#42b983;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.update-btn[data-v-9ffce13a]:hover{background-color:#3aa876}.update-btn[data-v-9ffce13a]:active{background-color:#329b6a}.ai-table td[data-v-9ffce13a]:nth-child(3),.ai-table th[data-v-9ffce13a]:nth-child(3){width:20%}.tooltip[data-v-9ffce13a]{position:relative;display:inline-block;cursor:help;margin-left:4px;color:#42b983}.tooltip .tooltiptext[data-v-9ffce13a]{visibility:hidden;width:200px;background-color:#555;color:#fff;text-align:center;border-radius:6px;padding:5px;position:absolute;z-index:1;bottom:125%;left:50%;margin-left:-100px;opacity:0;transition:opacity .3s;font-size:12px;line-height:1.4}.tooltip .tooltiptext[data-v-9ffce13a]:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#555 transparent transparent transparent}.tooltip:hover .tooltiptext[data-v-9ffce13a]{visibility:visible;opacity:1}.animated-title{font-family:Fredoka One,cursive;font-size:3.5em;color:#2c3e50;text-align:center;margin-bottom:40px;position:relative;animation:bounce 1.5s ease-in-out infinite;text-shadow:2px 2px 4px rgba(0,0,0,.1);background:linear-gradient(135deg,#42b983,#3aa876);-webkit-background-clip:text;-webkit-text-fill-color:transparent}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (max-width:768px){.animated-title{font-size:2.5em;animation:none}}