:root{color-scheme:light;--primary-pink: #ff9eb5;--primary-blue: #7ec8e3;--light-pink: #fff0f3;--light-blue: #e8f4f8;--gradient-main: linear-gradient(135deg, #ff9eb5 0%, #7ec8e3 100%);--gradient-soft: linear-gradient(135deg, #fff0f3 0%, #e8f4f8 100%);--text-primary: #2d3748;--text-secondary: #718096;--white: #ffffff;--surface-muted: rgba(255, 255, 255, .78);--surface-panel: #f8fbfd;--line-soft: rgba(126, 200, 227, .18);--app-canvas: #f3f7fb;--danger-soft: #fee2e2;--danger-strong: #dc2626;--page-gradient-day: linear-gradient(135deg, #fff4f7 0%, #e9f6fb 56%, #f7fbff 100%);--page-gradient-night: linear-gradient(135deg, #050b14 0%, #0f172a 48%, #12253d 100%);--shadow-sm: 0 10px 24px rgba(126, 200, 227, .14);--shadow-md: 0 18px 38px rgba(255, 158, 181, .18);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px}:root[data-theme=night]{color-scheme:dark;--primary-pink: #ff8ca8;--primary-blue: #89d8ff;--light-pink: #162133;--light-blue: #1d3047;--gradient-main: linear-gradient(135deg, #ff8ca8 0%, #89d8ff 100%);--gradient-soft: linear-gradient(135deg, #162133 0%, #1d3047 100%);--text-primary: #edf2fb;--text-secondary: #92a1b9;--white: #0f172a;--surface-muted: rgba(15, 23, 42, .82);--surface-panel: #162133;--line-soft: rgba(148, 163, 184, .18);--app-canvas: #09111d;--danger-soft: rgba(127, 29, 29, .38);--danger-strong: #f87171;--shadow-sm: 0 12px 28px rgba(2, 8, 23, .34);--shadow-md: 0 20px 44px rgba(2, 8, 23, .42)}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}img{max-width:100%;height:auto;display:block}button{font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#ff9eb5,#7ec8e3);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#ff8aa3,#6bb8d3)}::selection{background:#ff9eb54d;color:inherit}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--app-canvas);color:var(--text-primary);min-height:100vh;position:relative}body:before,body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;transition:opacity .65s ease,transform .75s ease,filter .65s ease}body:before{opacity:1;transform:scale(1);background:var(--page-gradient-day)}body:after{opacity:0;transform:scale(1.04);background:var(--page-gradient-night);filter:saturate(1.08)}:root[data-theme=night] body:before{opacity:0;transform:scale(1.02)}:root[data-theme=night] body:after{opacity:1;transform:scale(1)}.app{max-width:1200px;margin:0 auto;padding-bottom:90px;position:relative}.app-personalized-background:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-color:var(--home-background-color);background-image:var(--home-background-image);background-size:var(--home-background-size);transition:background-color .3s ease,background-image .3s ease}.meteor-burst{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:80}.meteor-burst,.meteor-burst *{transition:none!important}.meteor{--meteor-top: 12vh;--meteor-length: 180px;--meteor-duration: 1.15s;--meteor-delay: 0s;position:absolute;top:var(--meteor-top);right:-24vw;width:var(--meteor-length);height:3px;border-radius:999px;opacity:0;transform:translateZ(0) rotate(146deg);transform-origin:right center;background:linear-gradient(90deg,#ffd86000,#ffd8602e 24%,#fff3b0f0);filter:drop-shadow(0 0 14px rgba(255,210,92,.42));animation:meteor-fall var(--meteor-duration) ease-out forwards;animation-delay:var(--meteor-delay)}.meteor-core{position:absolute;top:50%;right:-2px;width:12px;height:12px;border-radius:50%;transform:translate(50%,-50%);background:radial-gradient(circle,#fff8c7,#ffe177,#fbbf24);box-shadow:0 0 12px #ffd457e0,0 0 20px #ffd45757}.meteor-glow{position:absolute;top:50%;right:-1px;width:26px;height:26px;transform:translate(50%,-50%)}.meteor-glow:before,.meteor-glow:after{content:"";position:absolute;left:50%;top:50%;border-radius:999px;transform:translate(-50%,-50%);background:linear-gradient(90deg,#fffad100,#fffad1f2,#fffad100)}.meteor-glow:before{width:24px;height:2px}.meteor-glow:after{width:2px;height:24px}.meteor-1{--meteor-top: 10vh;--meteor-length: 150px;--meteor-duration: 1.02s;--meteor-delay: .02s}.meteor-2{--meteor-top: 18vh;--meteor-length: 190px;--meteor-duration: 1.18s;--meteor-delay: .16s}.meteor-3{--meteor-top: 8vh;--meteor-length: 165px;--meteor-duration: 1.08s;--meteor-delay: .28s}.meteor-4{--meteor-top: 24vh;--meteor-length: 210px;--meteor-duration: 1.24s;--meteor-delay: .4s}@keyframes meteor-fall{0%{opacity:0;transform:translate3d(14vw,-8vh,0) rotate(146deg) scaleX(.72)}10%{opacity:1}68%{opacity:.96}to{opacity:0;transform:translate3d(-124vw,72vh,0) rotate(146deg) scaleX(1.04)}}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:flex-end;background:var(--surface-muted);border-top:1px solid var(--line-soft);-webkit-backdrop-filter:blur(20px) saturate(1.08);backdrop-filter:blur(20px) saturate(1.08);padding:8px 0 12px;box-shadow:var(--shadow-sm);z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;border:none;background:none;cursor:pointer;padding:8px 16px;border-radius:var(--radius-sm);transition:all .3s ease;color:var(--text-secondary)}.nav-item.active{background:var(--gradient-soft);color:var(--primary-pink)}.nav-item:hover{color:var(--primary-pink)}.nav-text{font-size:.7rem}.nav-item.active .nav-text{font-weight:600}@media(min-width:768px){.app{padding-bottom:20px}.bottom-nav{display:none}}.page-loading{display:flex;align-items:center;justify-content:center;min-height:60vh}.loading-spinner{width:40px;height:40px;border:3px solid var(--light-pink);border-top-color:var(--primary-pink);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}:root[data-theme=night] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),:root[data-theme=night] textarea,:root[data-theme=night] select{color:var(--text-primary);border-color:var(--line-soft);background:var(--surface-panel)}:root[data-theme=night] input::placeholder,:root[data-theme=night] textarea::placeholder{color:#92a1b9d1}:root[data-theme=night] .share-modal,:root[data-theme=night] .feedback-modal,:root[data-theme=night] .comic-modal,:root[data-theme=night] .chapter-modal,:root[data-theme=night] .process-modal,:root[data-theme=night] .user-edit-modal,:root[data-theme=night] .confirm-modal,:root[data-theme=night] .mail-modal,:root[data-theme=night] .edituser{background:var(--surface-panel);color:var(--text-primary);border:1px solid var(--line-soft);box-shadow:var(--shadow-md)}:root[data-theme=night] .modal-overlay,:root[data-theme=night] .share-modal-overlay,:root[data-theme=night] .mail-modal-overlay,:root[data-theme=night] .edituser-overlay{background:#020817ad}html.theme-animating *,html.theme-animating *:before,html.theme-animating *:after{transition:background-color .45s ease,border-color .45s ease,color .38s ease,box-shadow .45s ease,opacity .45s ease}.confirm-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.confirm-modal{background:var(--white);border-radius:var(--radius-lg);padding:24px;width:90%;max-width:340px;position:relative;box-shadow:var(--shadow-md);animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.confirm-modal-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s}.confirm-modal-close:hover{background:var(--light-pink);color:var(--primary-pink)}.confirm-modal-title{font-size:18px;font-weight:600;color:var(--text-primary);margin:0 0 12px;text-align:center}.confirm-modal-message{font-size:14px;color:var(--text-secondary);text-align:center;margin:0 0 24px;line-height:1.6}.confirm-modal-actions{display:flex;gap:12px}.confirm-modal-btn{flex:1;padding:12px 20px;border:none;border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.confirm-modal-btn.cancel{background:var(--light-blue);color:var(--text-secondary)}.confirm-modal-btn.cancel:hover{background:var(--light-pink);color:var(--text-primary)}.confirm-modal-btn.confirm{background:var(--gradient-main);color:var(--white)}.confirm-modal-btn.confirm:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ff9eb566}.confirm-modal-btn.confirm.danger{background:linear-gradient(135deg,#ff6b6b,#ee5a5a)}.confirm-modal-btn.confirm.danger:hover{box-shadow:0 4px 12px #ee5a5a66}.toast-container{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}.toast-item{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--radius-md);background:var(--white);box-shadow:0 4px 20px #00000026;pointer-events:auto;animation:toastSlideIn .3s cubic-bezier(.16,1,.3,1);min-width:280px;max-width:400px}.toast-item.toast-success{border-left:4px solid #c3acd8}.toast-item.toast-success .toast-icon{color:#b99ac3}.toast-item.toast-error{border-left:4px solid #ef4444}.toast-item.toast-error .toast-icon{color:#ef4444}.toast-item.toast-warning{border-left:4px solid #f59e0b}.toast-item.toast-warning .toast-icon{color:#f59e0b}.toast-item.toast-info{border-left:4px solid var(--primary-blue)}.toast-item.toast-info .toast-icon{color:var(--primary-blue)}.toast-icon{flex-shrink:0;display:flex;align-items:center}.toast-message{flex:1;font-size:14px;color:var(--text-primary);line-height:1.4}.toast-close{flex-shrink:0;width:24px;height:24px;border:none;background:transparent;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:all .2s}.toast-close:hover{background:var(--light-pink);color:var(--primary-pink)}@keyframes toastSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:480px){.toast-container{left:16px;right:16px;transform:none}.toast-item{min-width:auto;max-width:none}}.app-header{display:none;align-items:center;justify-content:space-between;padding:16px 20px;background:var(--surface-muted);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:100;border-radius:20px;border:1px solid var(--line-soft);-webkit-backdrop-filter:blur(18px) saturate(1.08);backdrop-filter:blur(18px) saturate(1.08)}.app-header .header-left{display:flex;align-items:center}.app-header .logo{display:flex;align-items:center;gap:6px;font-size:1.4rem;font-weight:700;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;cursor:pointer}.app-header .logo svg{color:var(--primary-pink);flex-shrink:0}.app-header .header-nav{display:flex;align-items:center;gap:8px}.app-header .nav-link{display:flex;align-items:center;gap:6px;padding:10px 20px;border:none;background:none;font-size:.95rem;color:var(--text-secondary);cursor:pointer;border-radius:20px;transition:all .3s ease}.app-header .nav-link:hover{color:var(--primary-pink);background:var(--light-pink)}.app-header .nav-link.active{color:var(--primary-pink);background:var(--light-pink);font-weight:600}.app-header .nav-link svg{flex-shrink:0}.app-header .header-right{display:flex;align-items:center;gap:14px}.app-header .icon-btn{width:40px;height:40px;border:1px solid var(--line-soft);background:var(--light-pink);border-radius:16px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;color:var(--primary-pink);position:relative}.app-header .icon-btn:hover{background:var(--primary-pink);color:#fff;transform:translateY(-1px) scale(1.03)}.app-header .mail-btn .unread-dot{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;background:#ef4444;color:#fff;font-size:11px;font-weight:600;border-radius:9px;display:flex;align-items:center;justify-content:center;border:2px solid var(--white)}.app-header .theme-btn{width:48px;height:48px;color:var(--primary-pink);box-shadow:0 12px 28px #7ec8e338;overflow:hidden}.app-header .theme-btn:after{content:"";position:absolute;inset:2px;border-radius:16px;background:linear-gradient(135deg,#ffffff24,#ffffff0a)}.app-header .theme-btn:hover{background:var(--gradient-main);color:#fff}.app-header .theme-btn .theme-icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1;transition:transform .45s ease,opacity .35s ease}.app-header .theme-btn.day .sun-icon,.app-header .theme-btn.night .moon-icon{opacity:1;transform:translateY(0) rotate(0) scale(1)}.app-header .theme-btn.day .moon-icon{opacity:0;transform:translateY(12px) rotate(-24deg) scale(.7)}.app-header .theme-btn.night .sun-icon{opacity:0;transform:translateY(-12px) rotate(24deg) scale(.7)}.app-header .avatar-btn{background:var(--gradient-main);color:#fff;display:flex;align-items:center;justify-content:center}.app-header .avatar-btn:hover{transform:scale(1.1);background:var(--gradient-main)}.app-header .avatar-btn.active{box-shadow:0 0 0 3px var(--light-pink)}.user-menu{display:flex;align-items:center;gap:8px}.user-menu .avatar-btn{padding:0;overflow:hidden}.user-menu .avatar-btn{width:40px;height:40px;border-radius:50%;object-fit:cover;display:block;vertical-align:middle}.user-menu .user-name{font-size:.9rem;color:var(--text-primary);font-weight:500;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-menu .logout-btn{background:var(--danger-soft);color:var(--danger-strong)}.user-menu .logout-btn:hover{background:var(--danger-strong);color:#fff}.login-btn{padding:10px 24px;background:var(--gradient-main);color:#fff;border:none;border-radius:20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.login-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #6366f14d}@media(min-width:768px){.app-header{display:flex}}@media(min-width:1024px){.app-header{padding:16px 48px}.app-header .header-nav{gap:8px}.app-header .nav-link{padding:12px 24px}}.home-background-default{--home-background-color: #f3f7fb;--home-background-image: linear-gradient(135deg, #fff4f7 0%, #e9f6fb 56%, #f7fbff 100%);--home-background-size: auto}.home-background-sakura{--home-background-color: #fff4f6;--home-background-image: repeating-linear-gradient(132deg, rgba(230, 112, 143, .06) 0 1px, transparent 1px 46px), linear-gradient(145deg, #fff7f8 0%, #ffe6ec 48%, #eef8fb 100%);--home-background-size: 66px 66px, auto}.home-background-sky{--home-background-color: #eaf7fb;--home-background-image: repeating-linear-gradient(90deg, rgba(37, 99, 135, .05) 0 1px, transparent 1px 72px), linear-gradient(155deg, #dff4ff 0%, #f7fcff 54%, #eef1fa 100%);--home-background-size: 72px 72px, auto}.home-background-mint{--home-background-color: #eef9f3;--home-background-image: repeating-linear-gradient(45deg, rgba(33, 117, 91, .045) 0 1px, transparent 1px 42px), linear-gradient(145deg, #e4f7ee 0%, #f7fcf8 52%, #fff4df 100%);--home-background-size: 60px 60px, auto}.home-background-lavender{--home-background-color: #f3efff;--home-background-image: repeating-linear-gradient(126deg, rgba(107, 70, 193, .06) 0 1px, transparent 1px 54px), linear-gradient(145deg, #f7f2ff 0%, #e9e1ff 48%, #e7f5fb 100%);--home-background-size: 70px 70px, auto}.home-background-coral{--home-background-color: #fff1ed;--home-background-image: repeating-linear-gradient(138deg, rgba(201, 77, 66, .055) 0 1px, transparent 1px 50px), linear-gradient(145deg, #ffe7df 0%, #ffd8dc 48%, #ede6ff 100%);--home-background-size: 68px 68px, auto}.home-background-amber{--home-background-color: #fff8e8;--home-background-image: repeating-linear-gradient(45deg, rgba(153, 101, 21, .05) 0 1px, transparent 1px 48px), linear-gradient(145deg, #fff2c7 0%, #fffaf0 52%, #e7f4ed 100%);--home-background-size: 64px 64px, auto}.home-background-night{--home-background-color: #11151d;--home-background-image: repeating-linear-gradient(118deg, rgba(255, 214, 112, .055) 0 1px, transparent 1px 58px), linear-gradient(150deg, #11151d 0%, #1d2330 56%, #24211d 100%);--home-background-size: 74px 74px, auto}.home-background-fill{background-color:var(--home-background-color);background-image:var(--home-background-image);background-size:var(--home-background-size)}:root[data-theme=night] .home-background-default{--home-background-color: #09111d;--home-background-image: linear-gradient(135deg, #050b14 0%, #0f172a 48%, #12253d 100%)}:root[data-theme=night] .home-background-sakura{--home-background-color: #1c121c;--home-background-image: repeating-linear-gradient(132deg, rgba(255, 140, 168, .08) 0 1px, transparent 1px 46px), linear-gradient(145deg, #17111a 0%, #2b1724 50%, #17242c 100%)}:root[data-theme=night] .home-background-sky{--home-background-color: #0c1822;--home-background-image: repeating-linear-gradient(90deg, rgba(137, 216, 255, .07) 0 1px, transparent 1px 72px), linear-gradient(155deg, #0b1822 0%, #112738 54%, #171d2b 100%)}:root[data-theme=night] .home-background-mint{--home-background-color: #0f1b18;--home-background-image: repeating-linear-gradient(45deg, rgba(117, 213, 171, .065) 0 1px, transparent 1px 42px), linear-gradient(145deg, #0d1d18 0%, #172821 52%, #282419 100%)}:root[data-theme=night] .home-background-lavender{--home-background-color: #171222;--home-background-image: repeating-linear-gradient(126deg, rgba(185, 153, 255, .075) 0 1px, transparent 1px 54px), linear-gradient(145deg, #15101e 0%, #281d3d 48%, #172633 100%)}:root[data-theme=night] .home-background-coral{--home-background-color: #211313;--home-background-image: repeating-linear-gradient(138deg, rgba(255, 139, 123, .07) 0 1px, transparent 1px 50px), linear-gradient(145deg, #211211 0%, #351b22 50%, #231d36 100%)}:root[data-theme=night] .home-background-amber{--home-background-color: #1e1910;--home-background-image: repeating-linear-gradient(45deg, rgba(255, 205, 112, .065) 0 1px, transparent 1px 48px), linear-gradient(145deg, #211a0e 0%, #2b2518 52%, #172720 100%)}:root[data-theme=night] .home-background-night{--home-background-color: #080a0e;--home-background-image: repeating-linear-gradient(118deg, rgba(255, 214, 112, .055) 0 1px, transparent 1px 58px), linear-gradient(150deg, #080a0e 0%, #141820 56%, #201c16 100%)}
