@import"https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{height:auto;min-height:100vh;overflow-x:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,"Noto Serif SC",Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f9f8f4;color:#2c2c2c;line-height:1.6}#app{width:100%;min-height:100vh;display:flex;flex-direction:column;max-width:600px;margin:0 auto;background-color:#fff;box-shadow:0 0 20px #0000000d;position:relative}.main-content{flex:1}h1{font-size:26px;color:#3e3222;text-align:center;margin-bottom:24px;font-weight:600;font-family:"Noto Serif SC",serif;letter-spacing:1px}h2{font-size:20px;color:#3e3222;margin-bottom:18px;font-weight:600;font-family:"Noto Serif SC",serif}h3{font-size:16px;color:#3e3222;margin-bottom:12px;font-weight:600}.btn-primary{padding:12px 24px;background:linear-gradient(135deg,#DFBE82 0%,#C5A059 100%);color:#fff;border:none;border-radius:24px;font-size:16px;font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.25,.8,.25,1);box-shadow:0 4px 12px #c5a0594d;min-width:200px;height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;letter-spacing:1px}.btn-primary:hover{background:linear-gradient(135deg,#EAD0A0 0%,#D4B26C 100%);transform:translateY(-2px);box-shadow:0 6px 16px #c5a05966}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{background:#E0E0E0;box-shadow:none;color:#999;cursor:not-allowed;transform:none}.btn-secondary{padding:10px 20px;background:#FFFFFF;color:#c5a059;border:1px solid #DFBE82;border-radius:24px;font-size:14px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #c5a0590d;min-width:150px;height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn-secondary:hover{background:#FCF9F2;border-color:#c5a059;transform:translateY(-2px);box-shadow:0 4px 8px #c5a05926}.btn-small{padding:8px 16px;background:#FCF9F2;color:#8c754a;border:1px solid #EAD0A0;border-radius:18px;font-size:14px;cursor:pointer;transition:all .3s ease;width:80px;height:36px}.btn-small:hover{background:#F3E8D0;transform:translateY(-2px)}.form-group{margin-bottom:15px}label{display:block;margin-bottom:5px;font-weight:500;color:#5c4d3c;font-size:14px}input,select,textarea{width:100%;padding:12px 16px;border:1px solid #E6DFD3;border-radius:12px;font-size:14px;background-color:#fafafa;color:#3e3222;transition:all .3s ease;min-width:200px;height:44px;display:block}input:focus,select:focus,textarea:focus{outline:none;border-color:#c5a059;background-color:#fff;box-shadow:0 0 0 3px #c5a0591a}::placeholder{color:#bdb5a9}textarea{min-height:100px;resize:vertical}.card{background:#FFFFFF;border-radius:16px;box-shadow:0 4px 16px #c5a05914;padding:24px;margin-bottom:20px;border:1px solid #F6F1E5}.list{margin-bottom:20px}.list-item{background:#FFFFFF;border-radius:12px;box-shadow:0 2px 8px #c5a0590d;padding:16px;margin-bottom:12px;border:1px solid #F6F1E5;transition:all .3s ease}.list-item:hover{transform:translateY(-2px);box-shadow:0 6px 16px #c5a0591a;border-color:#ead0a0}a{color:#c5a059;text-decoration:none;transition:color .3s ease}a:hover{color:#b28d46;text-decoration:underline}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:20px}.flex{display:flex;gap:10px;margin-bottom:15px}.flex-between{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.empty-state{text-align:center;padding:50px;background:#FFFFFF;border-radius:12px;box-shadow:0 2px 12px #00000014;color:#999;border:1px solid #F0F0F0}.loading{text-align:center;padding:50px;color:#666}.error{text-align:center;padding:50px;background:#FFF5F5;border-radius:12px;box-shadow:0 2px 12px #ff44441a;color:#dc2626;border:1px solid #FECACA}.success{text-align:center;padding:50px;background:#F0FDF4;border-radius:12px;box-shadow:0 2px 12px #4caf501a;color:#16a34a;border:1px solid #BBF7D0}.navbar{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:#FFFFFF;border-bottom:1px solid #F0F0F0;margin-bottom:20px;border-radius:0}.navbar-title{font-size:18px;font-weight:600;color:#333;text-align:center;flex:1}.navbar-icon{width:24px;height:24px;color:#666;cursor:pointer}.divider{display:flex;align-items:center;margin:30px 0;position:relative}.divider:before{content:"";flex:1;height:1px;background:linear-gradient(to right,transparent,#E0E0E0,transparent)}.divider-text{position:absolute;left:50%;transform:translate(-50%);background:#FFFFFF;padding:0 20px;font-size:14px;color:#999;white-space:nowrap}.compliance-text{font-size:12px;color:#999;text-align:center;margin-top:20px}.member-badge{background:linear-gradient(to right,#FFC107,#FF9800);color:#000;padding:2px 8px;border-radius:10px;font-size:12px;font-weight:700}.icon{width:24px;height:24px;color:#999;transition:color .3s ease}.icon:hover,.icon.active{color:#ffc107}.highlight{color:#1e88e5;font-weight:700}.error-message{color:#f44;font-size:12px;margin-top:5px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-overlay:has(.date-time-modal){align-items:flex-end;padding:0}.modal-content{background:#FFFFFF;border:1px solid #F0F0F0;border-radius:12px;padding:30px;max-width:300px;width:100%;text-align:center;box-shadow:0 4px 24px #00000026}.modal-content h3{margin-bottom:15px;color:#333;font-size:18px}.modal-content p{margin-bottom:25px;color:#666;font-size:14px;line-height:1.6}.modal-buttons{display:flex;gap:10px;justify-content:center}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:#FFFFFF;border-top:1px solid #F0F0F0;display:flex;justify-content:space-around;align-items:center;padding:12px 0;z-index:99}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#999;cursor:pointer;transition:all .3s ease;padding:8px 20px}.nav-item.active{color:gold}.nav-item svg{width:20px;height:20px}.nav-item span{font-size:12px}@media screen and (max-width: 480px){#app{padding:0;max-width:100%;width:100%;overflow-x:hidden}.btn-primary,.btn-secondary,input,select,textarea{min-width:100%}.bottom-nav{padding:10px 0}.nav-item{padding:6px 15px}.nav-item svg{width:18px;height:18px}.nav-item span{font-size:11px}}