.renew-btn[data-v-c6a630ab]{background:none;border:1px solid var(--accent2);color:var(--accent2);border-radius:8px;padding:5px 12px;margin-left:12px;cursor:pointer;font-size:13px}.renew-btn[data-v-c6a630ab]:hover{background:var(--accent2);color:#fff}.mask[data-v-c6a630ab]{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;z-index:999;display:flex;align-items:center;justify-content:center}.renew-dialog[data-v-c6a630ab]{width:360px;max-width:90%;padding:24px}.dialog-title[data-v-c6a630ab]{font-size:16px;font-weight:600}.dialog-user[data-v-c6a630ab]{font-size:13px;color:var(--text-dim);margin-top:6px}.err[data-v-c6a630ab]{color:var(--accent);font-size:13px;margin-top:10px}.ok[data-v-c6a630ab]{color:var(--green);font-size:13px;margin-top:10px}.dialog-btns[data-v-c6a630ab]{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f1115;--panel: #1a1d24;--panel2: #22262f;--border: #2c313c;--text: #e6e9ef;--text-dim: #8b93a1;--accent: #fe2c55;--accent2: #5ac8fa;--green: #34c759;--warn: #ff9500;--radius: 12px}body{font-family:-apple-system,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}#app{min-height:100vh}.app-root{display:flex;flex-direction:column;min-height:100vh}.topbar{display:flex;align-items:center;gap:24px;padding:0 24px;height:56px;background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}.brand{font-size:18px;font-weight:700}.nav{display:flex;gap:8px;flex:1}.nav-link{padding:8px 16px;border-radius:8px;color:var(--text-dim);text-decoration:none;font-size:14px;transition:all .2s}.nav-link:hover{color:var(--text);background:var(--panel2)}.nav-link.active{color:#fff;background:var(--accent)}.user-area{display:flex;align-items:center;gap:10px}.user-name{font-size:14px;color:var(--text-dim)}.badge{font-size:12px;padding:2px 8px;border-radius:20px}.badge.admin{background:var(--accent);color:#fff}.badge.manager{background:#5ac8fa26;color:var(--accent2)}.badge.soon{background:#ff95002e;color:#ff9800;animation:badge-pulse 1.2s ease-in-out infinite}@keyframes badge-pulse{0%,to{opacity:1}50%{opacity:.55}}.badge.ok{background:#34c75926;color:var(--green)}.badge.warn{background:#ff950026;color:var(--warn)}.logout{background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:6px 12px;border-radius:8px;cursor:pointer;font-size:13px}.logout:hover{color:var(--accent);border-color:var(--accent)}.main{flex:1;padding:20px;max-width:1100px;width:100%;margin:0 auto}.btn{background:var(--accent);color:#fff;border:none;padding:10px 20px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:600;transition:all .2s}.btn:hover{filter:brightness(1.1)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn.secondary{background:var(--panel2);color:var(--text);border:1px solid var(--border)}.btn.danger{background:#fe2c551f;color:var(--accent);border:1px solid var(--accent)}.input{width:100%;background:var(--panel2);border:1px solid var(--border);color:var(--text);padding:10px 14px;border-radius:10px;font-size:14px;outline:none;transition:border-color .2s}.input:focus{border-color:var(--accent2)}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px;position:relative;overflow:hidden;transition:transform .22s ease,box-shadow .22s ease}@property --ca{syntax: "<angle>"; initial-value: 0deg; inherits: false;}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--ca),transparent 0deg,transparent 20deg,#8a6d1f 36deg,#ffd700 55deg,#fff2b0 80deg,#ffffff 105deg,#ffffff 118deg,transparent 140deg,transparent 360deg) border-box;border:2px solid transparent;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:card-rotate 3.4s linear infinite;opacity:.9}@keyframes card-rotate{to{--ca: 360deg}}.card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none}.empty{text-align:center;color:var(--text-dim);padding:60px 20px;font-size:15px}.empty .icon{font-size:40px;margin-bottom:12px}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:20px;height:20px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}.flow-text{background:linear-gradient(90deg,#fe2c55,#5ac8fa,#ffd53d,#34c759,#fe2c55);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:flow-shift 4s linear infinite}@keyframes flow-shift{0%{background-position:0% 0}to{background-position:300% 0}}.brand-logo{font-size:18px;margin-right:8px;display:inline-block;animation:logo-breathe 2.6s ease-in-out infinite}@keyframes logo-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}.login-logo{font-size:52px;animation:logo-breathe 3s ease-in-out infinite;filter:drop-shadow(0 0 12px rgba(254,44,85,.4))}.tag.admin,.badge.admin{background:linear-gradient(135deg,#ff4d70,#fe2c55,#d81b40)!important;color:#fff!important;font-weight:800;box-shadow:0 2px 8px #fe2c5580}.tag.manager,.badge.manager{background:linear-gradient(135deg,#ff6b8a,#fe2c55)!important;color:#fff!important;font-weight:700;box-shadow:0 2px 8px #fe2c5566}.tag.user,.badge.ok{background:linear-gradient(135deg,#ff8099,#f43f5e)!important;color:#fff!important;font-weight:600;box-shadow:0 2px 6px #fe2c5559}.btn-flow{position:relative;overflow:hidden}.btn-flow:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skew(-20deg);animation:btn-shine 2.8s ease-in-out infinite}@keyframes btn-shine{0%{left:-60%}60%,to{left:130%}}.card:hover{transform:translateY(-2px);box-shadow:0 10px 28px #00000059}.expiry-banner.danger{animation:banner-pulse .9s ease-in-out infinite}@keyframes banner-pulse{0%,to{box-shadow:0 0 4px #fe2c554d}50%{box-shadow:0 0 16px #fe2c55b3}}@keyframes msg-flash{0%{background:transparent}40%{background:#5ac8fa24}to{background:transparent}}.msg-new{animation:msg-flash 1.2s ease-out}@media (max-width: 768px){.topbar{gap:12px;padding:0 14px}.brand-text{font-size:15px}.user-area{gap:6px}.user-name{display:none}.main{padding:14px}}@media (max-width: 480px){.topbar{height:50px;padding:0 12px;gap:8px;flex-wrap:nowrap}.brand{font-size:15px}.brand-logo{font-size:16px}.nav{gap:4px}.nav-link{padding:6px 10px;font-size:13px}.user-area .badge{font-size:11px;padding:1px 6px}.main,.card{padding:12px}}
