*{margin:0;padding:0;box-sizing:border-box}html::-webkit-scrollbar,.pool-scrollbar::-webkit-scrollbar{height:8px;width:8px}html::-webkit-scrollbar-thumb,.pool-scrollbar::-webkit-scrollbar-thumb{background-color:#8b5cf6;border-radius:0;padding:1px 0;scroll-behavior:auto}html::-webkit-scrollbar-track,.pool-scrollbar::-webkit-scrollbar-track{background:var(--surface)}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}:root{--bg: #0a0a0a;--surface: #1a1a1a;--surface-hover: #252525;--border: #2a2a2a;--text: #ffffff;--text-dim: #9a9a9a;--primary: #6366f1;--primary-glow: rgba(99, 102, 241, .3);--success: #10b981;--success-glow: rgba(16, 185, 129, .1);--warning: #f59e0b;--danger: #ef4444;--max-width: 600px}@keyframes gradientRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,sans-serif;background:var(--bg);color:var(--text);user-select:none;-webkit-user-select:none;min-height:100vh;overflow-x:hidden;position:relative}body:before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 20% 50%,var(--primary-glow) 0%,transparent 50%),radial-gradient(circle at 80% 80%,var(--success-glow) 0%,transparent 50%);animation:gradientRotate 20s linear infinite;pointer-events:none;z-index:0}input,textarea{user-select:text;-webkit-user-select:text}#app{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;position:relative;z-index:1}.header{background:var(--surface);border-bottom:1px solid var(--border);padding:16px;position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1a1ae6}.header-content{max-width:var(--max-width);margin:0 auto;display:flex;justify-content:space-between;align-items:center}.header h1{font-size:20px;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-actions{display:flex;gap:8px;align-items:center}.lang-btn{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--surface-hover),var(--surface));border:1px solid var(--border);color:var(--text);font-size:12px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.lang-btn:hover{transform:scale(1.1);background:linear-gradient(135deg,var(--primary),#8b5cf6);border-color:var(--primary)}.lang-btn:active{transform:scale(.95)}.premium-badge{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#000;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:700;animation:shimmer 3s infinite}@keyframes shimmer{0%,to{opacity:1}50%{opacity:.8}}.nav-container{background:var(--surface);padding:8px;position:sticky;top:60px;z-index:90;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1a1ae6}.nav-container::-webkit-scrollbar{display:none}.nav-tabs{max-width:var(--max-width);margin:0 auto;display:flex;gap:10px;min-width:fit-content}.nav-tab{flex:0 1 auto;min-width:0;padding:10px 12px;background:transparent;border:none;color:var(--text-dim);font-weight:600;font-size:13px;cursor:pointer;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}.nav-tab.active{background:linear-gradient(135deg,var(--primary),#8b5cf6);color:#fff;transform:scale(1.05)}.nav-tab:not(.active):hover{background:var(--surface-hover)}.content-wrapper{flex:1;position:relative;overflow:hidden}.content-slider{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1);height:100%;width:100%}.content-area{flex:0 0 100%;width:100%;padding:16px 16px 80px;overflow-y:auto;overflow-x:hidden;position:relative}.content-area>*{max-width:var(--max-width);margin-left:auto;margin-right:auto}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-enter-active,.fade-leave-active{transition:opacity .5s ease}.fade-enter-from,.fade-leave-to{opacity:0}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scaleOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}.new-item{animation:slideUp .5s cubic-bezier(.4,0,.2,1)}.guest-banner{position:fixed;z-index:10000;background:linear-gradient(135deg,#6366f1,#8b5cf6);padding:12px 24px;display:flex;justify-content:space-between;align-items:center;min-width:90%;border-bottom-left-radius:25px;border-bottom-right-radius:25px;margin-left:5%;margin-right:5%;box-shadow:0 4px 12px #6366f140}.guest-banner span{color:#fff;font-size:14px}.guest-banner button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 16px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.guest-banner button:active{transform:scale(.95)}.home-screen-banner{background:linear-gradient(135deg,#6366f1,#8b5cf6);padding:12px 16px;margin-bottom:16px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 12px var(--primary-glow)}.home-screen-text{color:#fff;font-size:14px;font-weight:500;flex:1}.home-screen-actions{display:flex;gap:8px}.home-screen-btn,.dismiss-btn{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 16px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:6px}.dismiss-btn{padding:8px 12px}.home-screen-btn:active,.dismiss-btn:active{transform:scale(.95)}.habit-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;cursor:pointer;transition:all .2s}.habit-card:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 4px 12px #6366f11a}.habit-card:active{transform:scale(.98)}.habit-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.habit-title{font-weight:600;font-size:16px}.habit-meta{font-size:12px;color:var(--text-dim);margin-top:4px}.streak-section{display:flex;align-items:center;gap:8px}.streak-badge{display:flex;align-items:center;gap:4px;padding:6px 10px;background:var(--surface-hover);border-radius:20px;font-size:14px;font-weight:600}.streak-badge.active{background:linear-gradient(135deg,var(--success),#22c55e);color:#fff}.share-btn{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--surface-hover),var(--surface));border:1px solid var(--border);color:var(--text-dim);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:16px}.share-btn:hover{background:linear-gradient(135deg,var(--primary),#8b5cf6);color:#fff;border-color:var(--primary)}.share-btn:active{transform:scale(.9)}.progress-section{background:var(--bg);border-radius:8px;padding:12px;margin-bottom:12px}.progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.progress-label{font-size:12px;font-weight:600;color:var(--primary);text-transform:uppercase}.progress-date{font-size:12px;color:var(--text-dim)}.progress-bar{height:8px;background:var(--surface-hover);border-radius:4px;overflow:hidden;margin-bottom:8px}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),#8b5cf6);transition:width .3s}.progress-fill.complete,.progress-fill.overcompleted{background:linear-gradient(90deg,var(--success),#22c55e)}.progress-info{display:flex;justify-content:space-between;align-items:center}.progress-text{font-size:14px;font-weight:600}.progress-buttons{display:flex;gap:8px}.progress-btn{padding:8px 16px;background:linear-gradient(135deg,var(--surface-hover),var(--surface));border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:4px}.progress-btn:hover{background:linear-gradient(135deg,var(--primary),#8b5cf6);color:#fff;border-color:var(--primary)}.progress-btn:active{transform:scale(.95)}.progress-btn:disabled{opacity:.5;cursor:not-allowed}.progress-btn.minus:hover:not(:disabled){background:linear-gradient(135deg,var(--danger),#dc2626);border-color:var(--danger)}.history-days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:12px}.history-day{aspect-ratio:1;border:2px solid var(--border);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--surface-hover);position:relative;overflow:hidden}.history-day.complete{background:linear-gradient(135deg,var(--success),#22c55e);border-color:var(--success);color:#fff}.history-day.partial{border-color:var(--warning)}.history-progress{position:absolute;bottom:0;left:0;right:0;background:#6366f14d;transition:height .3s}.history-num{font-size:14px;font-weight:600;position:relative;z-index:1}.history-label{font-size:9px;opacity:.7;position:relative;z-index:1}.habit-stats{display:flex;gap:12px;font-size:12px;color:var(--text-dim)}.entry-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:start;transition:all .2s}.entry-card.memo{background:linear-gradient(135deg,var(--surface),rgba(245,158,11,.05))}.entry-card:hover{border-color:var(--primary)}.entry-content{flex:1}.entry-date{font-size:11px;color:var(--text-dim);text-transform:uppercase;margin-bottom:8px}.entry-text{color:var(--text);line-height:1.5;margin-bottom:8px}.entry-timer{font-size:13px;color:var(--warning);font-weight:600}.entry-delete{width:24px;height:24px;border-radius:50%;background:var(--surface-hover);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:16px}.entry-delete:hover{background:var(--danger);color:#fff;border-color:var(--danger)}.entry-delete:active{transform:scale(.9)}.settings-section{margin-bottom:32px}.settings-title{font-size:18px;font-weight:700;margin-bottom:16px}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:20px}@media (min-width: 480px){.stats-grid{grid-template-columns:repeat(4,1fr)}}.stat-card{background:linear-gradient(135deg,var(--surface),var(--surface-hover));border:1px solid var(--border);border-radius:12px;padding:16px;text-align:center}.stat-value{font-size:28px;font-weight:700;background:linear-gradient(135deg,var(--primary),#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:11px;color:var(--text-dim);text-transform:uppercase;margin-top:4px}.settings-banner{background:linear-gradient(135deg,var(--primary),#8b5cf6);border-radius:12px;padding:16px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .2s}.settings-banner:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--primary-glow)}.settings-banner:active{transform:scale(.98)}.settings-banner-content{display:flex;align-items:center;gap:12px}.settings-banner-icon{font-size:24px}.settings-banner-text{color:#fff;font-weight:600;font-size:15px}.settings-banner-arrow{color:#fffc;font-size:20px}.settings-option{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .2s}.settings-option:hover{border-color:var(--danger);background:var(--surface-hover)}.settings-option:active{transform:scale(.98)}.settings-option-content{display:flex;align-items:center;gap:12px}.settings-option-icon{width:40px;height:40px;border-radius:10px;background:#ef44441a;display:flex;align-items:center;justify-content:center;font-size:20px}.settings-option-text{display:flex;flex-direction:column}.settings-option-title{font-weight:600;font-size:15px}.settings-option-desc{font-size:12px;color:var(--text-dim);margin-top:2px}.empty-state{text-align:center;padding:60px 20px;color:var(--text-dim)}.empty-icon{font-size:48px;opacity:.3;margin-bottom:16px}.fab{position:fixed;bottom:20px;right:20px;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--primary),#8b5cf6);color:#fff;border:none;font-size:28px;cursor:pointer;box-shadow:0 4px 12px var(--primary-glow);transition:all .3s cubic-bezier(.4,0,.2,1);z-index:50}.fab:hover{transform:scale(1.1) rotate(90deg);box-shadow:0 6px 20px var(--primary-glow)}.fab:active{transform:scale(.9)}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:200;padding:20px;animation:fadeIn .3s cubic-bezier(.4,0,.2,1)}.modal.closing{animation:fadeOut .3s cubic-bezier(.4,0,.2,1)}.modal-content{background:var(--surface);border-radius:20px;padding:24px;width:100%;max-width:400px;max-height:90vh;overflow-y:auto;animation:scaleIn .3s cubic-bezier(.4,0,.2,1)}.modal.closing .modal-content{animation:scaleOut .3s cubic-bezier(.4,0,.2,1)}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-title{font-size:20px;font-weight:700}.close-btn{width:32px;height:32px;border-radius:50%;background:var(--surface-hover);border:1px solid var(--border);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:20px}.close-btn:hover{background:var(--danger);color:#fff;border-color:var(--danger);transform:rotate(90deg)}.form-group{margin-bottom:16px}.form-label{display:block;font-size:12px;font-weight:600;color:var(--text-dim);margin-bottom:8px;text-transform:uppercase}.form-input,.form-textarea{width:100%;padding:12px;background:var(--bg);border:2px solid var(--border);border-radius:8px;color:var(--text);font-size:15px;font-family:inherit;transition:all .2s}.form-input:focus,.form-textarea:focus{outline:none;border-color:var(--primary)}.form-row{display:grid;grid-template-columns:2fr 1fr;gap:8px}.toggle-group{display:flex;flex-wrap:wrap;gap:8px}.toggle-btn{padding:8px 16px;background:var(--surface-hover);border:2px solid var(--border);border-radius:20px;color:var(--text-dim);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.toggle-btn:hover{transform:translateY(-2px)}.toggle-btn.active{background:linear-gradient(135deg,var(--primary),#8b5cf6);color:#fff}.btn-group{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.btn{padding:12px 20px;border:none;border-radius:8px;font-weight:600;font-size:15px;cursor:pointer;transition:all .2s}.btn:active{transform:scale(.95)}.btn-primary{background:linear-gradient(135deg,var(--primary),#8b5cf6);color:#fff}.btn-secondary{background:var(--surface-hover);color:var(--text);border:1px solid var(--border)}.btn-danger{background:linear-gradient(135deg,var(--danger),#dc2626);color:#fff}.alert-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:300;padding:20px;animation:fadeIn .3s cubic-bezier(.4,0,.2,1)}.alert-overlay.closing{animation:fadeOut .3s cubic-bezier(.4,0,.2,1)}.alert-box{background:var(--surface);border-radius:16px;padding:24px;max-width:320px;width:100%;text-align:center;animation:scaleIn .3s cubic-bezier(.4,0,.2,1)}.alert-overlay.closing .alert-box{animation:scaleOut .3s cubic-bezier(.4,0,.2,1)}.alert-title{font-size:18px;font-weight:600;margin-bottom:12px}.alert-message{color:var(--text-dim);margin-bottom:20px;line-height:1.4}.alert-actions{display:flex;gap:12px}.alert-btn{flex:1;padding:10px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s}.alert-btn-confirm{background:linear-gradient(135deg,var(--danger),#dc2626);color:#fff}.alert-btn-cancel{background:var(--surface-hover);color:var(--text);border:1px solid var(--border)}.alert-btn:active{transform:scale(.95)}.feature-banner{background:linear-gradient(135deg,#6366f11a,#8b5cf61a);border:1px solid var(--primary);border-radius:12px;padding:16px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:start;animation:slideDown .5s cubic-bezier(.4,0,.2,1)}.feature-banner-content{flex:1;padding-right:12px}.feature-banner-title{font-weight:600;font-size:16px;margin-bottom:8px;color:var(--text)}.feature-banner-desc{font-size:14px;color:var(--text-dim);line-height:1.4}.feature-banner-close{width:28px;height:28px;border-radius:50%;background:var(--surface-hover);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:18px;flex-shrink:0}.feature-banner-close:hover{background:var(--danger);color:#fff;border-color:var(--danger);transform:rotate(90deg)}.swipe-hint{position:fixed;left:0;right:0;bottom:150px;display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none;z-index:150;background:radial-gradient(circle at 30% 50%,#282965,#0a0a0a 50%),radial-gradient(circle at 80% 80%,#10b981,#0a0a0a 50%);width:50%;margin:auto;padding:20px;border-radius:20px;box-shadow:0 4px 12px #6366f140;border:2px solid #8b5cf6;transition:all .2s;animation:flying 7s linear infinite}@keyframes swipeRight{0%{transform:translate(0);opacity:.9}50%{transform:translate(70px);opacity:1}85%{transform:translate(95px);opacity:0}to{transform:translate(0);opacity:0}}@keyframes flying{0%{transform:translateY(0)}10%{transform:translateY(3px)}20%{transform:translateY(0)}30%{transform:translateY(3px)}40%{transform:translateY(0)}50%{transform:translateY(4px)}60%{transform:translateY(0)}70%{transform:translateY(3px)}80%{transform:translateY(0)}90%{transform:translateY(4px)}to{transform:translateY(0)}}body.modal-open{overflow:hidden;touch-action:none}.swipe-ghost{width:120px;height:44px;border-radius:999px;background:#ffffff0f;border:1px solid var(--border);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:flex-end;padding-right:10px}.ghost-finger{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--primary),#8b5cf6);animation:swipeLeft 1.6s ease-in-out infinite;box-shadow:0 0 12px var(--primary-glow)}@keyframes swipeLeft{0%{transform:translate(0);opacity:.9}50%{transform:translate(-70px);opacity:1}85%{transform:translate(-95px);opacity:0}to{transform:translate(0);opacity:0}}.drag-ghost{opacity:.85}.drag-chosen{opacity:.9}.drag-handle{cursor:grab}.drag-active .drag-handle{cursor:grabbing}.habit-card{transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s cubic-bezier(.2,.8,.2,1);will-change:transform}.dnd-chosen{transform:scale(.98);box-shadow:0 10px 28px #00000047}.sortable-fallback{opacity:1!important;transform:scale(.98);box-shadow:0 12px 32px #00000059;z-index:9999}.dnd-ghost{opacity:.25;background:var(--surface);border:1px dashed var(--border)}.dnd-chosen{transform:scale(.99);box-shadow:0 10px 24px #00000040;transition:transform .12s}.dnd-ghost{opacity:.2;border:1px dashed var(--border)}.dnd-drag{will-change:transform;transition:none!important}.drag-handle{cursor:grab;touch-action:none}.drag-active .progress-btn,.drag-active .share-btn{pointer-events:none}