:root{--c-yellow: #FFD54F;--c-orange: #FFB74D;--c-bg: #FFF8E1;--c-blue: #90CAF9;--c-green: #66BB6A;--c-text: #5D4037;--c-sub: #757575}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Microsoft JhengHei,PingFang TC,sans-serif;background:linear-gradient(160deg,#fffde7,#fff8e1,#fff3e0);color:var(--c-text);min-height:100vh}a{text-decoration:none;color:inherit}.btn{display:inline-block;border:3px solid var(--c-yellow);background:linear-gradient(135deg,#fff8e1,#ffe082);color:var(--c-text);font-weight:700;font-size:1.05rem;padding:12px 24px;border-radius:16px;cursor:pointer;transition:all .2s ease;text-align:center;width:100%}.btn:hover{background:linear-gradient(135deg,#ffe082,#ffd54f);transform:scale(1.03);box-shadow:0 4px 15px #ffb74d66}.btn.primary{background:linear-gradient(135deg,#ffd54f,#ffc107)}.btn.secondary{background:#fff9c4;border-color:#ffd180}.card{background:#fff;border-radius:16px;padding:18px;margin:10px 0;box-shadow:0 2px 8px #0000000f}.cat-card{background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-radius:20px;padding:24px;margin:10px 0;border:2px solid #90CAF9;text-align:center;cursor:pointer}.cat-card:hover{background:linear-gradient(135deg,#bbdefb,#90caf9)}.poem-card{background:linear-gradient(135deg,#fffde7,#fff9c4);border-radius:16px;padding:16px;margin:12px 0;border-left:6px solid #FFD54F}.poem-line{text-align:center;font-size:1.5rem;font-family:STKaiti,KaiTi,serif;padding:6px;line-height:1.9}.explain-box{background:#fffde7;padding:16px;border-radius:12px;border-left:6px solid #FFD54F;font-size:1.05rem;line-height:1.8}.detail-box{background:#e8f5e9;padding:16px;border-radius:12px;border-left:6px solid #66BB6A;font-size:1.05rem;line-height:1.8}.big-emoji{font-size:3rem;text-align:center}.app-container{max-width:900px;margin:0 auto;padding:20px}.sidebar{position:fixed;left:0;top:0;bottom:0;width:200px;background:#fff;border-right:2px solid #FFF3E0;padding:20px 12px;overflow-y:auto}.sidebar.collapsible{padding-top:64px;transition:transform .25s ease;z-index:1000;box-shadow:2px 0 12px #00000014}.sidebar.collapsible.collapsed{transform:translate(-100%)}.sidebar-toggle{position:fixed;top:12px;left:12px;z-index:1100;width:42px;height:42px;border-radius:12px;border:2px solid var(--c-yellow);background:#fff;color:var(--c-text);font-size:1.35rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001f;transition:transform .15s ease}.sidebar-toggle:hover{transform:scale(1.06)}.sidebar-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;z-index:999;display:none}.sidebar .nav-item{display:block;padding:12px;margin:6px 0;border-radius:12px;font-size:1.05rem;cursor:pointer;transition:background .2s}.sidebar .nav-item:hover,.sidebar .nav-item.active{background:#fff8e1;font-weight:700}.main-content{margin-left:200px;padding:24px;min-height:100vh;transition:margin-left .25s ease}.main-content.expanded{margin-left:0;padding-top:64px}.audio-box{margin:10px 0}.audio-box audio{width:100%}.metric{background:#fff;border-radius:12px;padding:16px;text-align:center;margin:6px;box-shadow:0 2px 6px #0000000d}.metric .value{font-size:2rem;font-weight:700;color:var(--c-orange)}.metric .label{font-size:.9rem;color:var(--c-sub)}.input{width:100%;padding:12px;border:2px solid #FFE082;border-radius:12px;font-size:1rem;margin:6px 0}.input:focus{outline:none;border-color:var(--c-orange)}.textarea{width:100%;padding:12px;border:2px solid #FFE082;border-radius:12px;font-size:1rem;margin:6px 0;min-height:100px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media (max-width: 720px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.sidebar-backdrop{display:block}}