:root{--bg:#0a0e1a;--bg2:#111827;--bgc:rgba(17,24,39,.8);--bgch:rgba(25,35,55,.9);--bgs:rgba(164,239,249,.04);--bd:rgba(164,239,249,.08);--bdl:rgba(164,239,249,.15);--t1:#e8edf5;--t2:rgba(232,237,245,.6);--t3:rgba(232,237,245,.35);--ac:#A4EFF9;--acd:rgba(164,239,249,.15);--acg:rgba(164,239,249,.3);--pu:#6C63FF;--ur:#EC4899;--urd:rgba(236,72,153,.15);--gn:#4ADE80;--gnd:rgba(74,222,128,.15);--or:#FB923C;--ord:rgba(251,146,60,.15);--rd:#F87171;--rdd:rgba(248,113,113,.15);--yl:#FACC15;--rs:8px;--rm:12px;--rl:16px;--rx:20px;--sh:0 2px 8px rgba(0,0,0,.2);--sm:0 4px 16px rgba(0,0,0,.3);--sg:0 0 20px rgba(164,239,249,.1);--tr:.3s cubic-bezier(.4,0,.2,1);--tf:.15s cubic-bezier(.4,0,.2,1);--fn:-apple-system,BlinkMacSystemFont,'SF Pro Display','PingFang SC','Helvetica Neue',sans-serif;--raster-speed:3s}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;font-family:var(--fn);background:var(--bg);color:var(--t1);overflow:hidden;-webkit-font-smoothing:antialiased}
.app{height:100%;display:flex;flex-direction:column;position:relative}
.app::before{content:'';position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at 30% 20%,rgba(164,239,249,.03) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(108,99,255,.03) 0%,transparent 50%);pointer-events:none;z-index:0;animation:bgF 20s ease-in-out infinite}
@keyframes bgF{0%,100%{transform:translate(0,0)}50%{transform:translate(-2%,-1%)}}

.loading-screen{position:fixed;inset:0;z-index:1000;background:var(--bg);transition:opacity .6s ease,visibility .6s ease}
.loading-screen.hiding{opacity:0;visibility:hidden}
.loading-screen canvas{position:absolute;inset:0;width:100%;height:100%}
.loading-screen__overlay{position:absolute;bottom:18%;left:0;right:0;z-index:1;text-align:center;pointer-events:none}
.loading-screen__title{font-size:24px;font-weight:700;color:var(--ac);letter-spacing:6px;text-shadow:0 0 20px rgba(164,239,249,.3);margin-bottom:10px;animation:lsTI .8s ease both}
.loading-screen__sub{font-size:13px;color:var(--t3);letter-spacing:1px;margin-bottom:16px;min-height:20px;animation:lsSI .8s ease .2s both}
.loading-screen__hint{font-size:11px;color:rgba(164,239,249,.3);letter-spacing:.5px;animation:lsH 2.5s ease-in-out infinite .6s}
@keyframes lsTI{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes lsSI{from{opacity:0}to{opacity:1}}
@keyframes lsH{0%,100%{opacity:.25}50%{opacity:.6}}

.main-container{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1;padding-bottom:68px}

.header{display:flex;align-items:flex-start;justify-content:space-between;padding:12px 16px 8px;gap:8px}
.header__main{display:flex;align-items:center;gap:10px;flex:1;min-width:0;flex-wrap:wrap}
.header__greeting{font-size:16px;font-weight:700;background:linear-gradient(135deg,var(--ac),var(--pu));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;flex-shrink:0}
.header__date{font-size:11px;color:var(--t2);flex:1;min-width:60px}
.header__clock{font-size:22px;font-weight:200;color:var(--ac);font-variant-numeric:tabular-nums;letter-spacing:1px;text-shadow:0 0 20px rgba(164,239,249,.2)}
.header__user{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;background:rgba(255,255,255,.04);border:1px solid var(--bd);border-radius:999px;cursor:pointer;transition:all var(--tf);flex-shrink:0;max-width:140px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.header__user:active{background:var(--acd);border-color:var(--bdl);transform:scale(.96)}
.header__avatar{width:24px;height:24px;border-radius:50%;object-fit:cover;flex-shrink:0;display:block;background:var(--bg2)}
.header__avatar--fallback{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--ac),var(--pu));color:var(--bg);font-size:11px;font-weight:700;line-height:1}
.header__username{font-size:12px;color:var(--t1);max-width:84px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.header__user-arrow{color:var(--t3);flex-shrink:0;opacity:.7}

.nav-bar{position:fixed;bottom:0;left:0;right:0;z-index:100;background:rgba(10,14,26,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--bd);padding:2px 0;padding-bottom:env(safe-area-inset-bottom,4px)}
.nav-bar__inner{display:flex;justify-content:space-around;max-width:500px;margin:0 auto}
.nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 14px;color:var(--t3);font-size:10px;cursor:pointer;transition:all var(--tr);position:relative}
.nav-item.active{color:var(--ac)}
.nav-item__icon{width:22px;height:22px;transition:transform var(--tr)}
.nav-item.active .nav-item__icon{transform:scale(1.25)}
.nav-item.active::after{content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:20px;height:2px;background:var(--ac);border-radius:1px;box-shadow:0 0 8px var(--acg)}
.nav-item span{transition:transform var(--tr),opacity var(--tr)}
.nav-item.active span{transform:scale(1.1);opacity:1}

.tab-panel{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 16px 20px;display:none;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}
.tab-panel.active{display:block;animation:fsI .3s ease}
@keyframes fsI{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.dash-summary{display:flex;gap:8px;padding:4px 0 10px;align-items:stretch}
.dash-summary__item{flex:1;text-align:center;padding:8px 4px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm)}
.dash-summary__val{display:block;font-size:18px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums}
.dash-summary__lbl{display:block;font-size:10px;color:var(--t3);margin-top:2px}
.dash-sync-btn{flex-shrink:0;width:40px;display:flex;align-items:center;justify-content:center;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);color:var(--ac);cursor:pointer;transition:all var(--tf);-webkit-tap-highlight-color:transparent}
.dash-sync-btn:active{background:var(--acd);border-color:var(--bdl);transform:scale(.92)}
.dash-sync-btn.syncing svg{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;margin-top:12px}
.section-header--done{margin-top:16px}
.section-title{font-size:15px;font-weight:600}
.section-count{font-size:12px;font-weight:400;color:var(--t3);margin-left:4px}
.btn-text{background:none;border:none;color:var(--ac);font-size:13px;cursor:pointer;padding:4px 8px;border-radius:var(--rs);transition:background var(--tf);font-family:var(--fn)}
.btn-text:active{background:var(--acd)}
.btn-text--block{display:block;width:100%;text-align:center;padding:10px;margin-top:8px;border:1px dashed var(--bdl);border-radius:var(--rm)}

.task-list{min-height:20px}
.task-list--done .task-item{opacity:.55}
.task-list--done .task-actions{right:auto;left:10px;justify-content:flex-start}
.task-list--done .task-item--expanded .task-top{padding-right:0;padding-left:68px}
.task-list--done .task-item--expanded .task-title{max-width:none}

.task-item{padding:12px 14px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);margin-bottom:8px;transition:all var(--tr);position:relative;overflow:hidden;animation:tSI .25s ease;touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer;-webkit-user-select:none;user-select:none}
@keyframes tSI{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}
.task-item:active{transform:scale(.99)}
.task-item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px}
.task-item--h::before{background:var(--rd)}
.task-item--m::before{background:var(--or)}
.task-item--l::before{background:var(--gn)}
.task-item--u::before{background:var(--ur)}
.task-item--active{border-color:var(--ac);background:linear-gradient(135deg,rgba(164,239,249,.08),rgba(108,99,255,.05));margin-bottom:12px;position:relative;overflow:hidden}
.task-item--active::after{content:'';position:absolute;top:-60%;left:-40%;width:40%;height:220%;background:radial-gradient(ellipse 70% 45% at 55% 50%,rgba(164,239,249,.14) 0%,rgba(164,239,249,.05) 40%,transparent 70%),radial-gradient(ellipse 50% 35% at 45% 50%,rgba(108,99,255,.06) 0%,transparent 65%);filter:blur(3px);animation:flowLight var(--raster-speed) linear infinite;pointer-events:none}
@keyframes flowLight{0%{left:-40%;transform:rotate(-12deg)}100%{left:130%;transform:rotate(12deg)}}
.task-item--active .task-progress{display:block}

.task-top{display:flex;align-items:center;gap:8px;min-height:24px}
.task-title{flex:1;font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--t1)}
.task-note{font-size:12px;color:var(--t2);margin-top:4px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-all}
.task-meta{display:flex;align-items:center;gap:10px;margin-top:6px;flex-wrap:wrap}
.task-time{font-size:11px;color:var(--t3);font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:3px}
.task-time::before{content:'⏱';font-size:10px;opacity:.7}
.task-remain{font-size:11px;color:var(--or);font-variant-numeric:tabular-nums;padding:1px 8px;border-radius:8px;background:var(--ord)}
.task-remain--over{color:var(--rd);background:var(--rdd)}

.task-progress{display:none;height:3px;background:var(--bd);border-radius:2px;margin-top:8px;overflow:hidden}
.task-progress__bar{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--ac),var(--pu));transition:width 1s linear}

.task-actions{display:none;align-items:center;justify-content:flex-end;gap:4px;position:absolute;top:8px;right:10px;z-index:2;padding:0;margin:0;border:none;background:rgba(10,14,26,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:var(--rs);padding:3px 4px}
.task-item--expanded .task-actions{display:flex}
.task-item--expanded .task-top{padding-right:8px}
.task-item--expanded .task-title{max-width:calc(100% - 60px)}
.task-act{border:none;background:transparent;border-radius:var(--rs);color:var(--t2);cursor:pointer;padding:4px 6px;transition:all var(--tf);font-family:var(--fn);line-height:1;display:flex;align-items:center;justify-content:center;border:1px solid transparent;touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-width:28px;min-height:28px}
.task-act:active{transform:scale(.9);background:var(--acd);color:var(--ac)}
.task-act>svg,.task-item>.task-top,.task-item>.task-top>*,.task-item>.task-note,.task-item>.task-meta,.task-item>.task-meta>*,.task-item>.task-progress,.task-item>.task-timer-info{pointer-events:none}
.task-act--edit{color:var(--t2)}
.task-act--edit:hover,.task-act--edit:active{color:var(--ac);background:var(--acd);border-color:var(--bdl)}
.task-act--play{color:var(--ac)}
.task-act--pause{color:var(--yl);background:var(--acd)}
.task-act--tomato{color:var(--pu);background:rgba(108,99,255,.1)}
.task-act--done{color:var(--gn)}
.task-act--restore{color:var(--or)}
.task-act--del{color:var(--rd)}

.task-timer-info{display:none;margin-top:6px;font-size:12px;color:var(--ac);font-variant-numeric:tabular-nums}
.task-item--active .task-timer-info{display:block}

.task-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:8px}
.sort-btns{display:flex;gap:4px;flex-shrink:0}
.sort-btn{padding:4px 8px;border-radius:12px;font-size:10px;color:var(--t3);cursor:pointer;transition:all var(--tf)}
.sort-btn.active{background:var(--acd);color:var(--ac)}

.empty-state{text-align:center;padding:30px 20px}
.empty-state__text{font-size:14px;color:var(--t2);margin-bottom:4px}
.empty-state__hint{font-size:12px;color:var(--t3)}

.timer-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:calc(100vh - 160px);padding:10px 0}
.timer-mode{display:flex;gap:4px;background:var(--bgs);border-radius:24px;padding:3px;margin-bottom:20px;border:1px solid var(--bd)}
.timer-mode__btn{padding:8px 20px;border-radius:20px;font-size:13px;color:var(--t2);cursor:pointer;transition:all var(--tr);border:none;background:none;font-family:var(--fn)}
.timer-mode__btn.active{background:var(--ac);color:var(--bg);font-weight:600;box-shadow:var(--sg)}
.timer-mode__btn[data-mode="rest"].active{background:var(--gn);box-shadow:0 0 20px rgba(74,222,128,.2)}
.timer-ring-wrap{position:relative;width:240px;height:240px;margin-bottom:16px}
.timer-ring{width:100%;height:100%;transform:rotate(-90deg)}
.timer-ring__progress{transition:stroke-dashoffset 1s linear;filter:drop-shadow(0 0 8px rgba(164,239,249,.3))}
.timer-display{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.timer-display__time{font-size:48px;font-weight:200;color:var(--t1);font-variant-numeric:tabular-nums;letter-spacing:2px}
.timer-display__label{font-size:13px;color:var(--t3);margin-top:6px}
.timer-task-select{width:100%;max-width:280px;margin-bottom:12px}
.timer-select{width:100%;padding:10px 14px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);color:var(--t1);font-size:13px;font-family:var(--fn);appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(164,239,249,0.5)' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.timer-custom-time{display:flex;gap:8px;width:100%;max-width:280px;margin-bottom:16px}
.timer-custom-time__item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm)}
.timer-custom-time__lbl{font-size:10px;color:var(--t3)}
.timer-custom-time__val{font-size:16px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums;min-width:20px;text-align:center}
.timer-custom-time__adj{width:24px;height:24px;border-radius:50%;border:1px solid var(--bdl);background:var(--bgs);color:var(--ac);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--tf);font-family:var(--fn)}
.timer-custom-time__adj:active{background:var(--acd);transform:scale(.9)}
.timer-controls{display:flex;align-items:center;gap:20px;margin-bottom:16px}
.timer-btn{border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--tr);font-family:var(--fn)}
.timer-btn--reset,.timer-btn--skip{width:44px;height:44px;border-radius:50%;background:var(--bgs);border:1px solid var(--bd);color:var(--t2)}
.timer-btn--reset svg,.timer-btn--skip svg{width:20px;height:20px}
.timer-btn--reset:active,.timer-btn--skip:active{transform:scale(.9);background:var(--acd)}
.timer-btn--main{width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,var(--ac),#7DD3FC);color:var(--bg);box-shadow:0 4px 20px rgba(164,239,249,.3)}
.timer-btn--main svg{width:24px;height:24px}
.timer-btn--main:active{transform:scale(.92)}
.timer-btn--main.running{animation:tP 2s ease-in-out infinite}
.timer-btn--main.waiting{background:linear-gradient(135deg,var(--gn),#86EFAC);box-shadow:0 4px 20px rgba(74,222,128,.3);animation:tPW 1.5s ease-in-out infinite}
@keyframes tP{0%,100%{box-shadow:0 4px 20px rgba(164,239,249,.3)}50%{box-shadow:0 4px 30px rgba(164,239,249,.5)}}
@keyframes tPW{0%,100%{box-shadow:0 4px 20px rgba(74,222,128,.3)}50%{box-shadow:0 4px 30px rgba(74,222,128,.5)}}
.timer-sessions{display:flex;gap:8px}
.timer-sessions__dot{width:8px;height:8px;border-radius:50%;background:var(--bd);transition:all var(--tr)}
.timer-sessions__dot.active{background:var(--ac);box-shadow:0 0 8px var(--acg)}
.timer-loop-info{font-size:12px;color:var(--t2);margin-top:8px;font-variant-numeric:tabular-nums}

.lb-summary{display:flex;gap:8px;margin-bottom:16px}
.lb-summary__item{flex:1;text-align:center;padding:10px 4px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm)}
.lb-summary__val{display:block;font-size:16px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums}
.lb-summary__lbl{display:block;font-size:10px;color:var(--t3);margin-top:2px}
.lb-day{display:flex;align-items:center;gap:12px;padding:12px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);margin-bottom:6px;transition:all var(--tr)}
.lb-day--today{border-color:var(--ac);background:rgba(164,239,249,.04)}
.lb-day__rank{width:24px;height:24px;border-radius:50%;background:var(--bgs);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--t3);flex-shrink:0}
.lb-day--today .lb-day__rank{background:var(--acd);color:var(--ac);border-color:var(--ac)}
.lb-day__info{flex:1;min-width:0}
.lb-day__label{font-size:12px;color:var(--t2);margin-bottom:4px}
.lb-day__bar-wrap{height:6px;background:var(--bd);border-radius:3px;overflow:hidden}
.lb-day__bar{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--ac),var(--pu));transition:width .5s ease}
.lb-day--today .lb-day__bar{background:linear-gradient(90deg,var(--gn),#86EFAC)}
.lb-day__val{font-size:13px;font-weight:600;color:var(--ac);font-variant-numeric:tabular-nums;flex-shrink:0;min-width:40px;text-align:right}

.stats-range{display:flex;gap:4px;background:var(--bgs);border-radius:20px;padding:2px;border:1px solid var(--bd)}
.stats-range__btn{padding:5px 14px;border-radius:18px;font-size:12px;color:var(--t2);cursor:pointer;transition:all var(--tf);border:none;background:none;font-family:var(--fn)}
.stats-range__btn.active{background:var(--acd);color:var(--ac)}
.stats-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}
.stats-overview__item{text-align:center;padding:16px 8px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm)}
.stats-overview__value{font-size:22px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums}
.stats-overview__label{font-size:11px;color:var(--t3);margin-top:4px}
.stats-chart-wrap{background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rl);padding:16px;margin-bottom:16px}
.stats-chart{display:flex;align-items:flex-end;justify-content:space-around;height:140px;gap:6px}
.stats-chart__bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.stats-chart__bar{width:100%;max-width:28px;border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--ac),rgba(164,239,249,.3));transition:height .5s cubic-bezier(.4,0,.2,1);min-height:2px;position:relative}
.stats-chart__bar:hover::after{content:attr(data-val);position:absolute;top:-22px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--ac);white-space:nowrap;background:var(--bg2);padding:2px 6px;border-radius:4px}
.stats-chart__label{font-size:10px;color:var(--t3)}

.settings-group{margin-bottom:20px}
.settings-group__title{font-size:12px;color:var(--t3);text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;padding-left:4px}
.setting-item{display:flex;align-items:center;justify-content:space-between;padding:14px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);margin-bottom:6px;transition:background var(--tf)}
.setting-item--action{cursor:pointer}
.setting-item--action:active{background:var(--bgch)}
.setting-item__label{font-size:14px}
.setting-item__control{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--ac)}
.setting-adj{width:28px;height:28px;border-radius:50%;border:1px solid var(--bdl);background:var(--bgs);color:var(--ac);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--tf);font-family:var(--fn)}
.setting-adj:active{background:var(--acd);transform:scale(.9)}
.setting-val{min-width:24px;text-align:center;font-weight:600;font-variant-numeric:tabular-nums}
.toggle{position:relative;display:inline-block;width:44px;height:24px}
.toggle input{opacity:0;width:0;height:0}
.toggle__slider{position:absolute;inset:0;background:var(--bd);border-radius:12px;cursor:pointer;transition:all var(--tr)}
.toggle__slider::before{content:'';position:absolute;width:18px;height:18px;left:3px;bottom:3px;background:var(--t2);border-radius:50%;transition:all var(--tr)}
.toggle input:checked+.toggle__slider{background:var(--acd);border:1px solid var(--ac)}
.toggle input:checked+.toggle__slider::before{transform:translateX(20px);background:var(--ac)}
.setting-item__arrow{color:var(--t3);font-size:16px}

.modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:none;align-items:flex-end;justify-content:center}
.modal-overlay.show{display:flex;animation:oI .2s ease}
@keyframes oI{from{opacity:0}to{opacity:1}}
.modal{width:100%;max-width:500px;max-height:85vh;background:var(--bg2);border-radius:var(--rx) var(--rx) 0 0;overflow:hidden;display:flex;flex-direction:column;animation:mSU .3s cubic-bezier(.4,0,.2,1)}
@keyframes mSU{from{transform:translateY(100%)}to{transform:translateY(0)}}
.modal__header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--bd)}
.modal__title{font-size:16px;font-weight:600}
.modal__close{width:28px;height:28px;border:none;background:var(--bgs);border-radius:50%;color:var(--t2);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all var(--tf)}
.modal__close:active{background:var(--rdd);color:var(--rd)}
.modal__body{padding:20px;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1}
.modal__body--detail{padding-bottom:0;display:flex;flex-direction:column}
.modal__footer{padding:12px 20px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--bd);background:var(--bg2);flex-shrink:0}

.form-group{margin-bottom:16px}
.form-label{display:block;font-size:13px;color:var(--t2);margin-bottom:6px}
.form-input{width:100%;padding:12px 14px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);color:var(--t1);font-size:14px;font-family:var(--fn);transition:border-color var(--tf);outline:none}
.form-input:focus{border-color:var(--ac);box-shadow:0 0 0 3px var(--acd)}
.form-input::placeholder{color:var(--t3)}
textarea.form-input{resize:vertical;min-height:60px;line-height:1.5}
.form-row{display:flex;gap:10px}
.form-row .form-group{flex:1}
.form-select{width:100%;padding:12px 14px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);color:var(--t1);font-size:14px;font-family:var(--fn);appearance:none;-webkit-appearance:none;outline:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(164,239,249,0.5)' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.form-select:focus{border-color:var(--ac)}
.priority-selector{display:flex;gap:4px}
.priority-btn{flex:1;padding:8px 4px;border-radius:var(--rm);border:1px solid var(--bd);background:var(--bgc);color:var(--t2);font-size:12px;cursor:pointer;text-align:center;transition:all var(--tf);font-family:var(--fn)}
.priority-btn.active-h{border-color:var(--rd);background:var(--rdd);color:var(--rd)}
.priority-btn.active-m{border-color:var(--or);background:var(--ord);color:var(--or)}
.priority-btn.active-l{border-color:var(--gn);background:var(--gnd);color:var(--gn)}
.priority-btn.active-u{border-color:var(--ur);background:var(--urd);color:var(--ur)}
.dur-control{display:flex;align-items:center;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);overflow:hidden}
.dur-adj{width:44px;height:44px;border:none;background:var(--bgs);color:var(--ac);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--tf);font-family:var(--fn);flex-shrink:0}
.dur-adj:active{background:var(--acd);transform:scale(.9)}
.dur-val{flex:1;text-align:center;font-size:18px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums;padding:0 8px}
.dur-quick{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.dur-quick__btn{padding:6px 12px;border-radius:16px;font-size:12px;color:var(--t2);background:var(--bgs);border:1px solid var(--bd);cursor:pointer;transition:all var(--tf);font-family:var(--fn)}
.dur-quick__btn:active{transform:scale(.9)}
.dur-quick__btn.active{background:var(--acd);color:var(--ac);border-color:var(--ac)}
.btn-submit{width:100%;padding:14px;background:linear-gradient(135deg,var(--ac),#7DD3FC);color:var(--bg);border:none;border-radius:var(--rm);font-size:15px;font-weight:600;cursor:pointer;transition:all var(--tr);font-family:var(--fn);margin-top:8px}
.btn-submit:active{transform:scale(.97);opacity:.9}
.btn-delete{width:100%;padding:14px;background:var(--rdd);color:var(--rd);border:1px solid rgba(248,113,113,.3);border-radius:var(--rm);font-size:14px;cursor:pointer;transition:all var(--tr);font-family:var(--fn);margin-top:8px}
.btn-delete:active{transform:scale(.97);background:rgba(248,113,113,.2)}

.modal-footer-btns{display:flex;justify-content:space-between;gap:10px;margin-top:8px}
.modal-footer-btns .btn-delete,
.modal-footer-btns .btn-submit{margin-top:0}
.modal-footer-btns .btn-delete{flex:1}
.modal-footer-btns .btn-submit{flex:2}

.toast-container{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:300;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{padding:10px 20px;border-radius:var(--rm);font-size:13px;color:var(--t1);background:var(--bg2);border:1px solid var(--bd);box-shadow:var(--sm);animation:tI .3s ease,tO .3s ease 2.5s forwards;white-space:nowrap}
.toast--success{border-color:var(--gn);color:var(--gn)}
.toast--error{border-color:var(--rd);color:var(--rd)}
.toast--info{border-color:var(--ac);color:var(--ac)}
@keyframes tI{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@keyframes tO{from{opacity:1}to{opacity:0;transform:translateY(-10px)}}

.sync-card-container{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom,0px) + 16px);left:16px;right:16px;z-index:250;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.sync-card{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-radius:var(--rm);font-size:13px;color:var(--t1);background:var(--bgc);border:1px solid var(--bdl);box-shadow:var(--sm);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:scI .3s ease;pointer-events:auto;transition:all .4s ease}
.sync-card--out{opacity:0;transform:translateY(10px)}
.sync-card__text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sync-card__close{flex-shrink:0;width:20px;height:20px;border:none;background:rgba(255,255,255,.08);color:var(--t2);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px;margin-left:8px;transition:all var(--tf);padding:0;line-height:1}
.sync-card__close:hover{background:rgba(255,255,255,.15);color:var(--t1)}
@keyframes scI{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

.fab{position:fixed;right:20px;bottom:calc(80px + env(safe-area-inset-bottom,0px) + 30px);width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,var(--ac),#7DD3FC);color:var(--bg);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(164,239,249,.3);z-index:50;transition:all var(--tr);animation:fI .5s cubic-bezier(.4,0,.2,1) .5s both}
@keyframes fI{from{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}
.fab svg{width:22px;height:22px}
.fab:active{transform:scale(.9)}
.proposal-fab{position:fixed;right:20px;bottom:calc(80px + env(safe-area-inset-bottom,0px) + 86px);width:44px;height:44px;border-radius:14px;border:1px solid rgba(164,239,249,.35);background:linear-gradient(135deg,rgba(164,239,249,.92),rgba(125,211,252,.82));color:var(--bg);font-size:20px;cursor:pointer;display:grid;place-items:center;box-shadow:0 8px 20px rgba(0,0,0,.3),0 0 16px rgba(164,239,249,.2);z-index:50;transition:transform .2s,box-shadow .2s,filter .2s}
.proposal-fab:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 26px rgba(0,0,0,.38),0 0 22px rgba(164,239,249,.3);filter:brightness(1.04)}
.proposal-fab:active{transform:scale(.96)}
.proposal-overlay{position:fixed;inset:0;z-index:255;background:rgba(4,6,14,.78);backdrop-filter:blur(12px);display:none;align-items:center;justify-content:center;padding:16px}
.proposal-overlay.show{display:flex}
.proposal-card{position:relative;width:min(92vw,420px);background:linear-gradient(180deg,rgba(16,22,50,.98),rgba(8,12,28,.98));border:1px solid rgba(164,239,249,.22);border-radius:22px;padding:24px 20px 22px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.proposal-close-btn{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;border:1px solid var(--bd);background:var(--bgs);color:var(--t3);font-size:16px;cursor:pointer;display:grid;place-items:center}
.proposal-close-btn:hover{border-color:var(--rd);color:var(--rd)}
.proposal-emoji{font-size:34px;text-align:center;margin-bottom:10px}
.proposal-card h3{text-align:center;font-size:20px;color:var(--t1);margin-bottom:10px}
.proposal-desc{font-size:14px;line-height:1.8;color:var(--t2);text-align:center}
.proposal-go-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:18px;height:46px;border-radius:14px;background:linear-gradient(135deg,var(--ac),#7DD3FC);color:#fff;text-decoration:none;font-weight:700;box-shadow:0 10px 24px rgba(164,239,249,.25)}
.proposal-go-btn:hover{filter:brightness(1.05)}
.thanks-board{padding:16px;border:1px solid rgba(164,239,249,.18);border-radius:18px;background:linear-gradient(180deg,rgba(164,239,249,.1),rgba(164,239,249,.03));color:var(--t2);box-shadow:0 10px 28px rgba(0,0,0,.18)}
.thanks-board-title{display:flex;align-items:center;justify-content:flex-start;gap:8px;font-size:14px;font-weight:800;color:var(--ac);margin-bottom:10px;letter-spacing:1px}
.thanks-board-text{font-size:12px;line-height:1.8;color:var(--t3);text-align:left;margin-bottom:12px}
.thanks-board-list{display:flex;flex-direction:column;gap:10px;align-items:stretch;margin-top:8px}
.thanks-board-item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid rgba(164,239,249,.18);background:rgba(255,255,255,.03)}
.thanks-board-rank{flex-shrink:0;min-width:64px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;font-size:11px;font-weight:800;letter-spacing:.5px;background:rgba(164,239,249,.14);color:var(--ac)}
.thanks-board-name{font-size:13px;line-height:1.6;color:var(--t2);font-weight:700}
.thanks-board-role{display:block;font-size:11px;line-height:1.4;color:var(--t3);font-weight:500;margin-top:2px}
.thanks-action-row{display:flex;justify-content:center;margin:12px 0 8px}
.thanks-proposal-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(164,239,249,.28);background:linear-gradient(135deg,rgba(164,239,249,.16),rgba(125,211,252,.12));color:var(--t1);font-size:13px;font-weight:800;text-decoration:none;box-shadow:0 10px 20px rgba(0,0,0,.12);transition:transform .18s,box-shadow .18s,border-color .18s,background .18s;cursor:pointer}
.thanks-proposal-btn:hover{transform:translateY(-1px);border-color:var(--ac);background:linear-gradient(135deg,rgba(164,239,249,.24),rgba(125,211,252,.18));box-shadow:0 14px 26px rgba(0,0,0,.16)}
.thanks-proposal-btn .tp-emoji{font-size:16px}
.thanks-section-title{font-size:13px;font-weight:800;color:var(--or);margin:14px 0 4px;letter-spacing:.5px}
.sponsor-rank{background:rgba(255,169,64,.16)!important;color:var(--or)!important}
.sponsor-placeholder{border-style:dashed;opacity:.7}
.sponsor-btn{border-color:rgba(255,169,64,.35)!important;background:linear-gradient(135deg,rgba(255,169,64,.18),rgba(255,210,119,.12))!important}
.sponsor-btn:hover{border-color:var(--or)!important;background:linear-gradient(135deg,rgba(255,169,64,.28),rgba(255,210,119,.22))!important}
.sponsor-overlay{display:none;position:fixed;inset:0;background:rgba(4,6,14,.65);backdrop-filter:blur(8px);z-index:256;justify-content:center;align-items:center;padding:16px}
.sponsor-overlay.open{display:flex}
.sponsor-card{width:min(400px,90vw);border-radius:20px;border:1px solid rgba(255,169,64,.3);background:linear-gradient(160deg,rgba(30,22,12,.97),rgba(16,12,8,.98));box-shadow:0 24px 80px rgba(0,0,0,.55),0 0 60px rgba(255,169,64,.1);padding:28px 24px 24px;text-align:center;animation:sponsorIn .35s ease;position:relative;overflow:hidden}
.sponsor-card::before{content:"";position:absolute;width:240px;height:240px;top:-100px;right:-80px;background:radial-gradient(circle,rgba(255,169,64,.18),transparent 70%);pointer-events:none}
.sponsor-card::after{content:"";position:absolute;width:180px;height:180px;bottom:-60px;left:-50px;background:radial-gradient(circle,rgba(255,210,119,.12),transparent 70%);pointer-events:none}
@keyframes sponsorIn{from{opacity:0;transform:translateY(24px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
.sponsor-close-btn{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:8px;border:1px solid rgba(255,169,64,.2);background:rgba(30,22,12,.5);color:var(--t3);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;z-index:1}
.sponsor-close-btn:hover{color:var(--or)}
.sponsor-emoji{font-size:48px;line-height:1;margin-bottom:8px;position:relative;z-index:1;animation:emojiBounce 2s ease-in-out infinite}
@keyframes emojiBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.sponsor-title{margin:0 0 4px;font-size:22px;font-weight:800;background:linear-gradient(90deg,#ffa940,#ffd277,#ffa940);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 3s linear infinite;position:relative;z-index:1}
@keyframes shimmer{0%{background-position:0% center}100%{background-position:200% center}}
.sponsor-subtitle{margin:0 0 20px;font-size:13px;color:var(--t3);line-height:1.5;position:relative;z-index:1}
.sponsor-amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px;position:relative;z-index:1}
.sponsor-amount-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 6px;border-radius:14px;border:1.5px solid rgba(255,169,64,.2);background:rgba(255,169,64,.06);color:var(--t1);cursor:pointer;transition:.2s ease;font-family:inherit}
.sponsor-amount-btn .amount-icon{font-size:20px;line-height:1;transition:transform .2s}
.sponsor-amount-btn .amount-value{font-size:15px;font-weight:800;color:#ffd277}
.sponsor-amount-btn .amount-label{font-size:10px;color:var(--t3);white-space:nowrap}
.sponsor-amount-btn:hover{border-color:rgba(255,169,64,.5);background:rgba(255,169,64,.12);transform:translateY(-2px)}
.sponsor-amount-btn:hover .amount-icon{transform:scale(1.2)}
.sponsor-amount-btn.active{border-color:#ffa940;background:linear-gradient(135deg,rgba(255,169,64,.2),rgba(255,210,119,.12));box-shadow:0 0 16px rgba(255,169,64,.15)}
.sponsor-amount-btn.active .amount-value{color:#ffa940}
.sponsor-custom-amount{grid-column:1/-1;display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:1.5px solid rgba(255,169,64,.2);background:rgba(255,169,64,.06);transition:.2s}
.sponsor-custom-amount:focus-within{border-color:#ffa940;background:rgba(255,169,64,.1)}
.custom-prefix{font-size:18px;font-weight:800;color:#ffa940}
.custom-amount-input{flex:1;border:none;outline:none;background:transparent;color:var(--t1);font-size:18px;font-weight:700;font-family:inherit;min-width:0}
.custom-amount-input::placeholder{color:var(--t3);font-weight:400}
.custom-amount-input::-webkit-outer-spin-button,.custom-amount-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.custom-amount-input[type=number]{-moz-appearance:textfield}
.sponsor-message-wrap{margin-bottom:14px;position:relative;z-index:1}
.sponsor-message-input{width:100%;height:42px;padding:0 14px;border-radius:14px;border:1.5px solid rgba(255,169,64,.2);background:rgba(255,169,64,.06);color:var(--t1);font-size:13px;font-family:inherit;outline:none;transition:.2s;box-sizing:border-box}
.sponsor-message-input::placeholder{color:var(--t3)}
.sponsor-message-input:focus{border-color:#ffa940;background:rgba(255,169,64,.1)}
.sponsor-pay-btn{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 36px;border-radius:999px;border:none;background:linear-gradient(135deg,#ffa940,#ff7b87,#ffa940);background-size:200% auto;color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:.2s;box-shadow:0 4px 20px rgba(255,169,64,.4);position:relative;z-index:1;animation:payBtnGlow 2.5s ease-in-out infinite;font-family:inherit}
@keyframes payBtnGlow{0%,100%{box-shadow:0 4px 20px rgba(255,169,64,.4)}50%{box-shadow:0 4px 28px rgba(255,123,135,.5)}}
.sponsor-pay-btn:hover{transform:translateY(-2px);background-position:right center;box-shadow:0 6px 28px rgba(255,169,64,.55)}
.sponsor-pay-btn .pay-btn-icon{font-size:20px}
.sponsor-hint{margin:12px 0 0;font-size:11px;color:var(--t3);line-height:1.5;position:relative;z-index:1}
.sponsor-toast{position:fixed;top:24px;left:50%;transform:translateX(-50%) translateY(-120%);z-index:9999;display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:16px;border:1px solid rgba(255,169,64,.4);background:linear-gradient(135deg,rgba(30,22,12,.96),rgba(16,12,8,.98));backdrop-filter:blur(16px);box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 40px rgba(255,169,64,.15);transition:transform .4s cubic-bezier(.22,1,.36,1),opacity .4s ease;opacity:0;pointer-events:none;white-space:nowrap}
.sponsor-toast.show{transform:translateX(-50%) translateY(0);opacity:1;pointer-events:auto}
.sponsor-toast-icon{font-size:24px;line-height:1}
.sponsor-toast-text{font-size:14px;font-weight:700;color:#ffd277;letter-spacing:.3px}
.sponsor-item{animation:sponsorFadeIn .4s ease both}
@keyframes sponsorFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.sponsor-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sponsor-name-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sponsor-amount-badge{font-size:11px;font-weight:800;color:#ffa940;background:rgba(255,169,64,.14);border-radius:999px;padding:2px 8px;letter-spacing:.3px;white-space:nowrap}
.sponsor-msg{color:var(--t2);font-style:italic;font-size:12px;line-height:1.5}
.sponsor-time{font-size:10px!important;color:var(--t3)!important;margin-top:1px}

.fireworks-canvas{position:fixed;inset:0;z-index:250;pointer-events:none;display:none}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.4s!important;transition-duration:1s!important}.task-item--active::after{animation-duration:var(--raster-speed)!important}}
@media(min-width:500px){.main-container{max-width:500px;margin:0 auto}.nav-bar__inner{max-width:500px}}

.goto-tomato{display:flex;flex-direction:column;gap:14px}
.goto-tomato__intro{font-size:13px;color:var(--t2);line-height:1.55;padding:10px 12px;background:var(--bgs);border-radius:var(--rm);border-left:3px solid var(--ac)}
.goto-tomato__card{padding:16px;background:linear-gradient(135deg,rgba(164,239,249,.06),rgba(108,99,255,.04));border:1px solid var(--bdl);border-radius:var(--rl);display:flex;flex-direction:column;gap:10px}
.goto-tomato__head{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.goto-pri{font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600;letter-spacing:.3px}
.goto-pri--h{color:var(--rd);background:var(--rdd)}
.goto-pri--m{color:var(--or);background:var(--ord)}
.goto-pri--l{color:var(--gn);background:var(--gnd)}
.goto-pri--u{color:var(--ur);background:var(--urd)}
.goto-tomato__title{font-size:17px;font-weight:600;color:var(--t1);line-height:1.4;word-break:break-all}
.goto-tomato__desc{font-size:12px;color:var(--t2);line-height:1.5;word-break:break-all;padding:8px 10px;background:var(--bgs);border-radius:var(--rs)}
.goto-tomato__stats{display:flex;gap:8px;margin-top:2px}
.goto-stat{flex:1;text-align:center;padding:10px 4px;background:var(--bg2);border:1px solid var(--bd);border-radius:var(--rm)}
.goto-stat__val{font-size:20px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums;line-height:1}
.goto-stat__val span{font-size:11px;font-weight:400;color:var(--t3);margin-left:2px}
.goto-stat__lbl{font-size:10px;color:var(--t3);margin-top:4px}
.goto-progress{height:4px;background:var(--bd);border-radius:2px;overflow:hidden;margin-top:4px}
.goto-progress__bar{height:100%;background:linear-gradient(90deg,var(--ac),var(--pu));border-radius:2px;transition:width .4s ease}
.goto-progress__lbl{font-size:11px;color:var(--t3);text-align:right;font-variant-numeric:tabular-nums}
.goto-tomato__warn{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:var(--or);background:var(--ord);padding:10px 12px;border-radius:var(--rm);border:1px solid rgba(251,146,60,.2);line-height:1.5}
.goto-tomato__warn svg{flex-shrink:0;margin-top:2px}
.goto-tomato__actions{display:flex;gap:10px;margin-top:6px}
.goto-tomato__actions .btn-cancel{flex:1;padding:14px;background:var(--bgs);color:var(--t1);border:1px solid var(--bd);border-radius:var(--rm);font-size:14px;cursor:pointer;font-family:var(--fn);transition:all var(--tf)}
.goto-tomato__actions .btn-cancel:active{transform:scale(.97);background:var(--bgc)}
.goto-tomato__actions .btn-submit{flex:2;margin-top:0}

.tomato-task{width:100%;max-width:300px;padding:12px 14px;margin-bottom:14px;background:linear-gradient(135deg,rgba(164,239,249,.10),rgba(108,99,255,.06));border:1px solid var(--bdl);border-radius:var(--rm);display:flex;flex-direction:column;gap:8px;box-shadow:0 4px 16px rgba(0,0,0,.18)}
.tomato-task__title{font-size:14px;font-weight:600;color:var(--t1);line-height:1.4;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tomato-task__stats{display:flex;justify-content:space-between;gap:6px;font-size:11px;color:var(--t2);font-variant-numeric:tabular-nums}
.tomato-task__stats span{flex:1;text-align:center}
.tomato-task__progress{height:3px;background:var(--bd);border-radius:2px;overflow:hidden}
.tomato-task__progress-bar{height:100%;background:linear-gradient(90deg,var(--ac),var(--pu));border-radius:2px;transition:width .5s ease}

.timer-display__label{max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}

.timer-btn--complete{border:none;background:linear-gradient(135deg,var(--gn),#34D399);color:var(--bg);border-radius:50%;width:44px;height:44px;cursor:pointer;transition:all var(--tf);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(52,211,153,.35)}
.timer-btn--complete svg{width:22px;height:22px}
.timer-btn--complete:active{transform:scale(.95)}

.tomato-task__desc{font-size:12px;color:var(--t2);line-height:1.5;padding:6px 8px;background:var(--bgs);border-radius:var(--rs);word-break:break-all;margin-top:2px}

.fireworks-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;display:flex;align-items:center;justify-content:center}
.fireworks-canvas-wrap{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}
.fireworks-canvas{width:100%;height:100%;display:none}
.fw-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:12px;transition:opacity .5s ease;z-index:2}
.fw-emoji{font-size:48px;animation:fwEmojiPop .5s ease forwards}
@keyframes fwEmojiPop{0%{opacity:0;transform:scale(.5)}60%{transform:scale(1.15)}100%{opacity:1;transform:scale(1)}}
.fw-status{padding:16px 28px;background:rgba(10,14,26,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:var(--rl);border:1px solid rgba(164,239,249,.25);text-align:center;box-shadow:0 8px 32px rgba(0,0,0,.4)}
.fw-title{font-size:22px;font-weight:700;color:var(--t1);line-height:1.3}
.fw-sub{font-size:13px;color:var(--t2);margin-top:6px;line-height:1.4}
.fw-status--early{border-color:rgba(255,215,0,.4);box-shadow:0 8px 32px rgba(255,215,0,.25)}
.fw-status--early .fw-title{color:#FFD700}
.fw-status--ontime{border-color:rgba(164,239,249,.4);box-shadow:0 8px 32px rgba(164,239,249,.25)}
.fw-status--ontime .fw-title{color:#A4EFF9}
.fw-status--late{border-color:rgba(251,146,60,.4);box-shadow:0 8px 32px rgba(251,146,60,.25)}
.fw-status--late .fw-title{color:#FB923C}

.detail-card{display:flex;flex-direction:column;gap:16px}
.detail-header{display:flex;flex-direction:column;gap:8px}
.detail-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.detail-title{font-size:18px;font-weight:700;color:var(--t1);line-height:1.4;flex:1;word-break:break-all}
.detail-status{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:4px 10px;border-radius:12px;font-weight:500;flex-shrink:0;white-space:nowrap}
.detail-status--done{color:var(--gn);background:var(--gnd)}
.detail-status--active{color:var(--ac);background:var(--acd);animation:detailPulse 2s ease-in-out infinite}
@keyframes detailPulse{0%,100%{box-shadow:0 0 0 0 rgba(164,239,249,.2)}50%{box-shadow:0 0 0 4px rgba(164,239,249,.08)}}
.detail-status--pending{color:var(--t2);background:var(--bgs);border:1px solid var(--bd)}
.detail-tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.detail-pri{font-size:10px;padding:3px 10px;border-radius:10px;font-weight:600;letter-spacing:.3px}
.detail-pri--h{color:var(--rd);background:var(--rdd)}
.detail-pri--m{color:var(--or);background:var(--ord)}
.detail-pri--l{color:var(--gn);background:var(--gnd)}
.detail-pri--u{color:var(--ur);background:var(--urd)}
.detail-stats{display:flex;gap:8px}
.detail-stat{flex:1;text-align:center;padding:14px 6px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm)}
.detail-stat__val{font-size:22px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums;line-height:1}
.detail-stat__val span{font-size:11px;font-weight:400;color:var(--t3);margin-left:1px}
.detail-stat__val--over{color:var(--or)}
.detail-stat__lbl{font-size:10px;color:var(--t3);margin-top:6px}
.detail-progress{height:6px;background:var(--bd);border-radius:3px;overflow:hidden;margin-top:2px}
.detail-progress__bar{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--ac),var(--pu));transition:width .5s ease}
.detail-progress__lbl{font-size:11px;color:var(--t3);text-align:right;font-variant-numeric:tabular-nums;margin-top:4px}
.detail-section{display:flex;flex-direction:column;gap:8px}
.detail-section__title{font-size:12px;color:var(--t3);font-weight:600;letter-spacing:.5px;text-transform:uppercase;display:flex;align-items:center;gap:6px}
.detail-section__count{font-size:10px;padding:1px 6px;border-radius:8px;background:var(--acd);color:var(--ac);font-weight:500}
.detail-desc{font-size:13px;color:var(--t2);line-height:1.6;padding:12px 14px;background:var(--bgs);border-radius:var(--rm);border-left:3px solid var(--ac);word-break:break-all}
.detail-timers{display:flex;flex-direction:column;gap:0;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);overflow:hidden;max-height:180px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.detail-section__title--clickable{cursor:pointer;transition:color var(--tf)}
.detail-section__title--clickable:active{color:var(--ac)}
.detail-section__title--clickable::after{content:'查看全部';font-size:10px;color:var(--ac);font-weight:400;margin-left:auto;letter-spacing:0;text-transform:none}
.detail-timer-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--bd)}
.detail-timer-item:last-child{border-bottom:none}
.detail-timer-item--active{background:rgba(164,239,249,.06)}
.detail-timer__dot--pulse{animation:detailPulse 1.5s ease-in-out infinite}
@keyframes detailPulse{0%,100%{box-shadow:0 0 0 0 rgba(164,239,249,.5)}50%{box-shadow:0 0 0 5px rgba(164,239,249,0)}}
.detail-timer__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.detail-timer__info{flex:1;display:flex;align-items:center;justify-content:space-between}
.detail-timer__time{font-size:12px;color:var(--t2);font-variant-numeric:tabular-nums}
.detail-timer__dur{font-size:12px;color:var(--ac);font-weight:600;font-variant-numeric:tabular-nums}
.detail-meta{display:flex;flex-direction:column;gap:6px;padding:12px 14px;background:var(--bgs);border-radius:var(--rm)}
.detail-meta__item{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--t3);font-variant-numeric:tabular-nums}
.detail-meta__item svg{flex-shrink:0;opacity:.6}
.detail-actions{display:flex;gap:8px;margin-top:4px}
.detail-btn{flex:1;padding:12px 8px;border-radius:var(--rm);font-size:13px;font-weight:600;cursor:pointer;border:none;font-family:var(--fn);transition:all var(--tf);text-align:center}
.detail-btn:active{transform:scale(.96);opacity:.9}
.detail-btn--edit{background:var(--bgs);color:var(--t1);border:1px solid var(--bd)}
.detail-btn--play{background:linear-gradient(135deg,var(--ac),#7DD3FC);color:var(--bg)}
.detail-btn--pause{background:var(--acd);color:var(--ac);border:1px solid var(--bdl)}
.detail-btn--done{background:var(--gnd);color:var(--gn);border:1px solid rgba(74,222,128,.3)}
.detail-btn--restore{background:var(--ord);color:var(--or);border:1px solid rgba(251,146,60,.3)}

.color-selector{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.color-dot{width:28px;height:28px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:all var(--tf);flex-shrink:0;position:relative}
.color-dot:active{transform:scale(.9)}
.color-dot--active{border-color:var(--t1);box-shadow:0 0 8px rgba(255,255,255,.2)}
.color-dot--active::after{content:'';position:absolute;inset:3px;border-radius:50%;border:2px solid var(--bg2)}
.color-dot[data-cl=""]{background:var(--bgc)!important;border:2px dashed var(--bd)}
.color-dot[data-cl=""]::before{content:'✕';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--t3)}

.task-color-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-left:6px}

.task-item[data-cl="yl"]::before{background:var(--yl)!important}
.task-item[data-cl="gn"]::before{background:var(--gn)!important}
.task-item[data-cl="ac"]::before{background:var(--ac)!important}
.task-item[data-cl="pu"]::before{background:var(--pu)!important}
.task-item[data-cl="or"]::before{background:var(--or)!important}
.task-item[data-cl="rd"]::before{background:var(--rd)!important}
.task-item[data-cl="ur"]::before{background:var(--ur)!important}

.detail-card--themed{border-top:2px solid var(--da);background:radial-gradient(ellipse at 50% 0%,var(--dab) 0%,transparent 70%)}
.detail-card--themed .detail-stat__val{color:var(--da)}
.detail-card--themed .detail-progress__bar{background:linear-gradient(90deg,var(--da),var(--dag))}
.detail-card--themed .detail-desc{border-left-color:var(--da)}
.detail-card--themed .detail-timer__dur{color:var(--da)}
.detail-card--themed .detail-status--active{color:var(--da);background:var(--dab)}
.detail-card--themed .detail-status--pending{color:var(--da);background:var(--dab);border-color:var(--da)}
.detail-card--themed .detail-btn--play{background:linear-gradient(135deg,var(--da),var(--dag))}
.detail-card--themed .detail-btn--pause{background:var(--dab);color:var(--da);border-color:var(--da)}
.detail-card--themed .detail-section__count{background:var(--dab);color:var(--da)}
.detail-card--themed .detail-timer__dot{background:var(--da)!important}
.detail-card--themed .detail-timer-item--active{background:var(--dab)}
.detail-card--themed .detail-timer__dot--pulse{animation-name:detailPulseThemed}
@keyframes detailPulseThemed{0%,100%{box-shadow:0 0 0 0 var(--dag)}50%{box-shadow:0 0 0 5px transparent}}

.detail-stat__val--auto{transition:font-size .2s ease}

.timer-popup-overlay{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center}
.timer-popup-overlay.show{display:flex;animation:oI .2s ease}
.timer-popup{width:90%;max-width:380px;max-height:70vh;background:var(--bg2);border-radius:var(--rl);overflow:hidden;display:flex;flex-direction:column;animation:tpI .25s cubic-bezier(.4,0,.2,1)}
@keyframes tpI{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.timer-popup__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--bd)}
.timer-popup__title{font-size:15px;font-weight:600}
.timer-popup__close{width:28px;height:28px;border:none;background:var(--bgs);border-radius:50%;color:var(--t2);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all var(--tf)}
.timer-popup__close:active{background:var(--rdd);color:var(--rd)}
.timer-popup__body{padding:16px 20px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.timer-popup__list{display:flex;flex-direction:column;gap:0;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);overflow:hidden}
.timer-popup__item{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--bd)}
.timer-popup__item:last-child{border-bottom:none}
.timer-popup__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.timer-popup__info{flex:1;display:flex;align-items:center;justify-content:space-between}
.timer-popup__time{font-size:13px;color:var(--t2);font-variant-numeric:tabular-nums}
.timer-popup__dur{font-size:13px;color:var(--ac);font-weight:600;font-variant-numeric:tabular-nums}

.task-alarm-badge{color:var(--yl);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:auto;pointer-events:none}
.task-act--alarm{color:var(--yl)}
.task-act--alarm:hover,.task-act--alarm:active{color:var(--yl);background:rgba(250,204,21,.15)}

.reminder-popup-overlay{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center}
.reminder-popup-overlay.show{display:flex;animation:oI .2s ease}
.reminder-popup{width:90%;max-width:380px;max-height:80vh;background:var(--bg2);border-radius:var(--rl);overflow:hidden;display:flex;flex-direction:column;animation:tpI .25s cubic-bezier(.4,0,.2,1)}
.reminder-popup__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--bd)}
.reminder-popup__title{font-size:15px;font-weight:600}
.reminder-popup__close{width:28px;height:28px;border:none;background:var(--bgs);border-radius:50%;color:var(--t2);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all var(--tf)}
.reminder-popup__close:active{background:var(--rdd);color:var(--rd)}
.reminder-popup__body{padding:16px 20px;overflow-y:auto;-webkit-overflow-scrolling:touch}

.rm-popup{display:flex;flex-direction:column;gap:14px}
.rm-task-name{font-size:15px;font-weight:600;color:var(--t1);line-height:1.4;word-break:break-all;padding-bottom:10px;border-bottom:1px solid var(--bd)}
.rm-existing{display:flex;flex-direction:column;gap:8px}
.rm-existing__title{font-size:12px;color:var(--t3);font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.rm-existing__list{display:flex;flex-direction:column;gap:6px}
.rm-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);gap:8px}
.rm-item__info{display:flex;align-items:center;gap:8px;flex:1;min-width:0;flex-wrap:wrap}
.rm-item__time{font-size:13px;color:var(--t2);font-variant-numeric:tabular-nums;white-space:nowrap}
.rm-item__ch{font-size:11px;color:var(--t3)}
.rm-status{font-size:10px;padding:2px 6px;border-radius:8px;white-space:nowrap}
.rm-status--pending{color:var(--yl);background:rgba(250,204,21,.12)}
.rm-status--sent{color:var(--gn);background:var(--gnd)}
.rm-item__del{border:none;background:transparent;color:var(--t3);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:var(--rs);transition:all var(--tf);flex-shrink:0}
.rm-item__del:active{color:var(--rd);background:var(--rdd)}

.rm-form{display:flex;flex-direction:column;gap:12px;padding-top:12px;border-top:1px solid var(--bd)}
.rm-form__title{font-size:12px;color:var(--t3);font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.rm-channels{display:flex;flex-direction:column;gap:6px}
.rm-channel{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;background:var(--bgc);border:1px solid var(--bd);border-radius:var(--rm);cursor:pointer;transition:all var(--tf)}
.rm-channel:active{background:var(--bgch)}
.rm-channel input[type="checkbox"]{margin-top:2px;accent-color:var(--ac);width:16px;height:16px;flex-shrink:0}
.rm-channel__right{display:flex;flex-direction:column;gap:2px}
.rm-channel__name{font-size:13px;color:var(--t1)}
.rm-channel__note{font-size:11px;color:var(--t3)}
.rm-channel--disabled{opacity:.45;cursor:not-allowed}
.rm-channel--disabled:active{background:var(--bgc)}
.rm-channel--disabled .rm-channel__name{color:var(--t3)}
.rm-channel--unchecked{border-color:var(--yl);background:rgba(250,204,21,.06)}
.rm-channel--unchecked .rm-channel__note{color:var(--yl)}

.rm-qr-overlay{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center}
.rm-qr-overlay.show{display:flex;animation:oI .2s ease}
.rm-qr-popup{width:85%;max-width:320px;background:var(--bg2);border-radius:var(--rl);overflow:hidden;animation:tpI .25s cubic-bezier(.4,0,.2,1)}
.rm-qr-popup__header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--bd)}
.rm-qr-popup__header span{font-size:15px;font-weight:600}
.rm-qr-popup__close{width:28px;height:28px;border:none;background:var(--bgs);border-radius:50%;color:var(--t2);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all var(--tf)}
.rm-qr-popup__close:active{background:var(--rdd);color:var(--rd)}
.rm-qr-popup__body{padding:20px 18px;display:flex;flex-direction:column;align-items:center;gap:14px}
.rm-qr-loading{color:var(--t3);font-size:13px;padding:20px 0}
.rm-qr-hint{font-size:14px;color:var(--t1);text-align:center;line-height:1.5}
.rm-qr-img{width:200px;height:200px;border-radius:var(--rm);border:1px solid var(--bd);object-fit:contain;background:#fff}
.rm-qr-subhint{font-size:12px;color:var(--t3);text-align:center;line-height:1.4}
.rm-qr-success{font-size:14px;color:var(--gn);text-align:center;padding:20px 0;font-weight:600}
.rm-qr-error{font-size:13px;color:var(--rd);text-align:center;padding:10px 0}

.rm-confirm-overlay{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center}
.rm-confirm-overlay.show{display:flex;animation:oI .2s ease}
.rm-confirm-popup{width:80%;max-width:280px;background:var(--bg2);border-radius:var(--rl);padding:24px 20px 18px;animation:tpI .25s cubic-bezier(.4,0,.2,1)}
.rm-confirm__text{font-size:14px;color:var(--t1);text-align:center;line-height:1.5;margin-bottom:18px}
.rm-confirm__btns{display:flex;gap:10px;justify-content:center}
.rm-confirm__btn{flex:1;padding:8px 0;border:none;border-radius:var(--rm);font-size:13px;cursor:pointer;transition:all var(--tf)}
.rm-confirm__btn--cancel{background:var(--bgs);color:var(--t2)}
.rm-confirm__btn--ok{background:var(--rd);color:#fff}
.rm-confirm__btn:active{opacity:.7}