@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Outfit:wght@400;500;700;800&display=swap";.layout{display:flex;min-height:100vh;animation:siteZoomIn .3s cubic-bezier(.16,1,.3,1) both}.sidebar{width:var(--sidebar);flex-shrink:0;background:var(--surface);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:32px 20px;position:fixed;inset:0 auto 0 0;transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:4px 0 24px #0003}.logo{font-size:26px;font-weight:800;background:linear-gradient(135deg,#fff,var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;padding:0 12px 36px;letter-spacing:-.5px;display:flex;align-items:center;gap:8px}.logo span{font-size:20px;-webkit-text-fill-color:initial;color:var(--accent)}nav{flex:1;display:flex;flex-direction:column;gap:6px}.nav-item{display:flex;justify-content:space-between;align-items:center;background:transparent;border:1px solid transparent;color:var(--muted);padding:12px 16px;border-radius:12px;font-size:14px;font-weight:500;transition:all .25s cubic-bezier(.4,0,.2,1);text-align:left;position:relative;overflow:hidden}.nav-item:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--surface2);opacity:0;transition:opacity .2s;z-index:-1}.nav-item:hover:before{opacity:1}.nav-item:hover{color:var(--text);transform:translate(4px)}.nav-item.active{background:#7e5cf51a;border-color:#7e5cf533;color:var(--accent2);box-shadow:0 4px 12px #7e5cf50d}.nav-item.active:hover{transform:none}.badge{background:var(--surface2);border-radius:8px;padding:3px 8px;font-size:12px;font-weight:600;color:var(--muted);transition:all .3s}.nav-item.active .badge{background:var(--accent);color:#fff;box-shadow:0 0 10px var(--accent-glow)}.sidebar-foot{padding-top:24px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:12px}.user-row{display:flex;align-items:center;gap:12px;padding:8px 4px;font-size:14px;font-weight:500}.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#fff;flex-shrink:0;box-shadow:0 4px 12px var(--accent-glow)}.main{margin-left:var(--sidebar);flex:1;padding:48px 56px;max-width:1200px;margin-right:auto}.main-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;animation:fadeDown .6s ease-out}.main-head h1{font-size:36px;font-weight:800;letter-spacing:-1px;margin-bottom:6px}.sub{color:var(--muted);font-size:15px}.search-wrap{position:relative;margin-bottom:32px;animation:fadeUp .6s ease-out .1s both}.search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:18px;pointer-events:none}.search-wrap input{width:100%;padding:14px 44px 14px 46px;background:var(--surface);border:1px solid var(--border);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:16px;color:var(--text);font-size:15px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 20px #0000001a}.search-wrap input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #7e5cf533,0 4px 20px #0003;transform:translateY(-1px)}.search-wrap input::placeholder{color:var(--muted)}.clear-btn{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:var(--surface2);border:none;color:var(--text);width:24px;height:24px;border-radius:50%;font-size:12px;display:flex;align-items:center;justify-content:center;transition:all .2s}.clear-btn:hover{background:var(--border);transform:translateY(-50%) scale(1.1)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.card{background:var(--surface);border:1px solid var(--border);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:20px;padding:24px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;animation:fadeUp .5s ease-out both}.grid .card:nth-child(1){animation-delay:.1s}.grid .card:nth-child(2){animation-delay:.15s}.grid .card:nth-child(3){animation-delay:.2s}.grid .card:nth-child(4){animation-delay:.25s}.grid .card:nth-child(5){animation-delay:.3s}.grid .card:nth-child(6){animation-delay:.35s}.grid .card:nth-child(n+7){animation-delay:.4s}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:100%;background:radial-gradient(800px circle at var(--mouse-x, 50%) var(--mouse-y, -20%),rgba(255,255,255,.06),transparent 40%);pointer-events:none;z-index:0;opacity:0;transition:opacity .4s}.card:hover:before{opacity:1}.card:hover{border-color:#ffffff26;transform:translateY(-4px);box-shadow:0 12px 30px #0000004d,0 0 0 1px var(--border-glow)}.card.fading{opacity:0;transform:scale(.95);pointer-events:none}.card>*{position:relative;z-index:1}.card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.status-tag{border:1px solid transparent;border-radius:20px;padding:5px 12px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:6px}.status-tag:hover{filter:brightness(1.2);transform:scale(1.05)}.card-actions{display:flex;gap:6px;opacity:.6;transition:opacity .2s}.card:hover .card-actions{opacity:1}.card-title{font-size:18px;font-weight:600;line-height:1.4;margin-bottom:10px;color:#fff;transition:color .3s}.card-title.struck{text-decoration:line-through;opacity:.4;color:var(--muted)}.card-desc{font-size:14px;color:var(--muted);line-height:1.6;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.card-date{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;font-weight:500}.card-date:before{content:"⏱";font-size:10px}.btn-primary{background:linear-gradient(135deg,var(--accent),#5a3ce0);color:#fff;border:none;box-shadow:0 4px 14px var(--accent-glow),inset 0 1px #fff3;padding:12px 24px;border-radius:12px;font-size:15px;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #7e5cf599,inset 0 1px #ffffff4d;background:linear-gradient(135deg,var(--accent2),var(--accent))}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;filter:grayscale(50%);box-shadow:none}.btn-primary.full{width:100%}.btn-primary.sm{padding:8px 16px;font-size:13px;border-radius:10px}.btn-ghost{background:#ffffff08;border:1px solid var(--border);color:var(--text);padding:12px 24px;border-radius:12px;font-size:15px;font-weight:500;transition:all .2s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.btn-ghost:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-1px)}.btn-ghost.full{width:100%}.btn-ghost.sm{padding:8px 16px;font-size:13px;border-radius:10px}.icon-btn{background:#ffffff0d;border:1px solid transparent;width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--text);transition:all .2s cubic-bezier(.4,0,.2,1)}.icon-btn.edit:hover{background:#7e5cf526;color:var(--accent2);border-color:#7e5cf54d;transform:scale(1.05)}.icon-btn.del:hover{background:#ff4d6d26;color:var(--danger);border-color:#ff4d6d4d;transform:scale(1.05)}.field{margin-bottom:20px}.field label{display:block;font-size:14px;font-weight:500;color:var(--muted);margin-bottom:8px}.field input,.field textarea{width:100%;background:#0003;border:1px solid var(--border);border-radius:12px;padding:12px 16px;color:#fff;font-size:15px;resize:vertical;transition:all .2s}.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent);background:#0006;box-shadow:0 0 0 3px #7e5cf526}.field input::placeholder,.field textarea::placeholder{color:var(--muted)}.status-pills{display:flex;gap:10px;flex-wrap:wrap}.pill{background:#0003;border:1px solid var(--border);border-radius:10px;padding:8px 16px;font-size:14px;font-weight:500;color:var(--text);transition:all .2s;cursor:pointer;display:flex;align-items:center;gap:8px}.pill:hover{border-color:#fff3;background:#ffffff0d}.pill.pill-active{transform:scale(1.05);box-shadow:0 4px 12px #0003}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:24px;animation:fadeIn .3s ease-out}.modal-box{background:var(--bg);border:1px solid var(--border);box-shadow:0 24px 60px #0006,inset 0 1px #ffffff1a;border-radius:24px;padding:32px;width:100%;max-width:500px;animation:slideUp .4s cubic-bezier(.16,1,.3,1)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.modal-head h3{font-size:22px;font-weight:700;letter-spacing:-.5px}.modal-foot{display:flex;gap:12px;justify-content:flex-end;margin-top:32px}.auth-box{background:var(--surface);border:1px solid var(--border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 32px 80px #00000080,inset 0 1px #ffffff1a;border-radius:28px;padding:48px;width:100%;max-width:440px;animation:scaleUp .5s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.auth-box:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:conic-gradient(from 0deg at 50% 50%,transparent 0deg,rgba(126,92,245,.1) 60deg,transparent 120deg);animation:rotate 10s linear infinite;pointer-events:none;z-index:0}.auth-box>*{position:relative;z-index:1}.auth-box .logo{justify-content:center;margin-bottom:24px;padding:0;font-size:32px}.auth-box h2{font-size:28px;font-weight:800;margin-bottom:8px;text-align:center}.auth-box .sub{margin-bottom:32px;text-align:center;font-size:15px}.alert{background:#ff4d6d26;border:1px solid rgba(255,77,109,.3);color:var(--danger);border-radius:12px;padding:12px 16px;font-size:14px;margin-bottom:20px;animation:shake .4s ease-in-out}.switch-text{text-align:center;margin-top:24px;font-size:14px;color:var(--muted)}.link-btn{background:none;border:none;color:var(--accent2);font-size:14px;font-weight:600;margin-left:4px;transition:color .2s}.link-btn:hover{color:#fff;text-decoration:underline}.ghost-link{display:block;width:100%;margin-top:16px;background:none;border:none;color:var(--muted);font-size:14px;text-align:center;transition:color .2s}.ghost-link:hover{color:#fff}.pages{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:40px;animation:fadeIn .5s ease-out .4s both}.pages button{background:var(--surface);border:1px solid var(--border);color:var(--text);padding:10px 20px;border-radius:12px;font-size:14px;font-weight:600;transition:all .2s}.pages button:hover:not(:disabled){border-color:var(--accent);color:var(--accent2);background:#7e5cf51a;transform:translateY(-2px)}.pages button:disabled{opacity:.3;cursor:not-allowed}.pages span{color:var(--muted);font-size:14px;font-weight:500}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:16px;text-align:center;animation:fadeUp .5s ease-out}.empty-icon{font-size:64px;margin-bottom:8px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.3))}.empty h3{font-size:24px;font-weight:700;color:#fff}.empty p{color:var(--muted);font-size:16px;margin-bottom:12px;max-width:300px}.splash{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:20px;color:var(--text);font-size:16px;font-weight:500}.splash.inline{min-height:300px}.splash-fullscreen{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg);background-image:var(--bg-gradient);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999}.splash-logo{font-family:Outfit,sans-serif;font-size:56px;font-weight:800;background:linear-gradient(135deg,#fff,var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:pulseLogo .8s ease-in-out infinite alternate;margin-bottom:32px;letter-spacing:-1px}.splash-loader{width:48px;height:48px;border:4px solid rgba(255,255,255,.05);border-top-color:var(--accent);border-radius:50%;animation:spin .4s cubic-bezier(.4,0,.2,1) infinite}.splash-loader.sm{width:36px;height:36px;border-width:3px}.spin{width:36px;height:36px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent);border-radius:50%;animation:spin .8s cubic-bezier(.4,0,.2,1) infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes fadeDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:none}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:none}}@keyframes scaleUp{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}@keyframes siteZoomIn{0%{opacity:0;transform:scale(.96);filter:blur(4px)}to{opacity:1;transform:scale(1);filter:blur(0)}}@keyframes pulseLogo{0%{transform:scale(1);opacity:.9;filter:drop-shadow(0 0 10px var(--accent-glow))}to{transform:scale(1.03);opacity:1;filter:drop-shadow(0 0 20px var(--accent-glow))}}@media (max-width: 800px){.sidebar{width:80px;padding:24px 12px}.logo span,.nav-item span,.user-row span{display:none}.nav-item{justify-content:center;padding:12px}.badge{position:absolute;top:4px;right:4px;padding:2px 5px;font-size:10px}.main{margin-left:80px;padding:32px 24px}}@media (max-width: 600px){.sidebar{display:none}.main{margin-left:0;padding:24px 16px}.grid{grid-template-columns:1fr}.main-head{flex-direction:column;align-items:flex-start;gap:16px}.main-head h1{font-size:28px}.main-head .btn-primary{width:100%}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #08080a;--bg-gradient: radial-gradient(circle at top left, #12131c, #08080a 70%);--surface: rgba(22, 22, 30, .4);--surface2: rgba(28, 28, 38, .6);--border: rgba(255, 255, 255, .08);--border-glow: rgba(124, 111, 255, .3);--text: #f0f0f5;--muted: #8a8a9e;--accent: #7e5cf5;--accent2: #9e81ff;--accent-glow: rgba(126, 92, 245, .4);--danger: #ff4d6d;--sidebar: 260px}body{font-family:Inter,sans-serif;background:var(--bg);background-image:var(--bg-gradient);background-attachment:fixed;color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,.logo{font-family:Outfit,sans-serif}button{font-family:inherit;cursor:pointer}input,textarea{font-family:inherit}
