*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;min-height:100vh;display:flex;justify-content:center;padding:28px 16px 52px;transition:background-color .75s ease;background-image:linear-gradient(175deg,#ffffff1a,#0000002e);background-attachment:fixed}body.focus{background-color:#b94040}body.shortBreak{background-color:#2a8050}body.longBreak{background-color:#1a697a}body.paused{background-color:#38384e}#root{width:100%;max-width:420px}button{cursor:pointer;font-family:inherit}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1;height:20px}.app-layout{display:flex;flex-direction:column;gap:14px;width:100%}.app-header{display:flex;justify-content:space-between;align-items:center;padding:0 4px}.app-title{font-size:19px;font-weight:800;color:#fff;letter-spacing:.2px}.gear-btn{background:#ffffff2e;border:1px solid rgba(255,255,255,.25);border-radius:50%;width:40px;height:40px;font-size:16px;display:flex;align-items:center;justify-content:center;color:#ffffffe6;transition:background .2s,transform .35s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.gear-btn:hover{background:#ffffff47;transform:rotate(50deg)}.stats-bar{display:flex;background:#ffffff26;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.25);border-radius:18px;padding:13px 20px;align-items:center;width:100%}.stats-bar__item{display:flex;flex-direction:column;align-items:center;flex:1;gap:3px}.stats-bar__value{font-size:21px;font-weight:800;color:#fff;line-height:1}.stats-bar__label{font-size:10px;font-weight:600;color:#ffffffd9;text-transform:uppercase;letter-spacing:.9px}.stats-bar__sep{width:1px;height:30px;background:#fff3}.timer-card{background:#fff;border-radius:28px;padding:26px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:20px;box-shadow:0 28px 60px #00000040,0 4px 12px #00000014;width:100%}.mode-tabs{display:flex;gap:4px;background:#f2f2f2;border-radius:50px;padding:4px;width:100%}.mode-tab{flex:1;text-align:center;padding:7px 8px;border-radius:50px;font-size:12px;font-weight:700;color:#777;-webkit-user-select:none;user-select:none;transition:background .25s ease,color .25s ease,box-shadow .25s ease;letter-spacing:.1px;white-space:nowrap}.mode-tab--active{background:#fff;color:#1a1a1a;box-shadow:0 2px 10px #0000001a}.ring-wrapper{position:relative;display:flex;align-items:center;justify-content:center;width:220px;height:220px}.ring-track{stroke:#efefef}.ring-progress{transition:stroke-dashoffset 1s linear,stroke .65s ease}body.focus .ring-progress{stroke:#c0392b}body.shortBreak .ring-progress{stroke:#27ae60}body.longBreak .ring-progress{stroke:#1a7a8a}body.paused .ring-progress{stroke:#c8c8c8}.ring-time{position:absolute;font-size:52px;font-weight:800;font-family:Courier New,monospace;letter-spacing:3px;text-indent:3px;color:#1a1a1a;line-height:1}.timer-controls{display:flex;gap:10px;align-items:center}.ctrl-btn{padding:12px 28px;border-radius:50px;border:none;font-size:15px;font-weight:700;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.ctrl-btn--primary{min-width:120px}.ctrl-btn--start{background:#4caf50;color:#fff;box-shadow:0 6px 20px #4caf5073}.ctrl-btn--start:hover{background:#43a047;transform:translateY(-2px);box-shadow:0 10px 26px #4caf5080}.ctrl-btn--pause{background:#ef5350;color:#fff;box-shadow:0 6px 20px #ef535073}.ctrl-btn--pause:hover{background:#e53935;transform:translateY(-2px)}.ctrl-btn--reset{background:#f0f0f0;color:#666}.ctrl-btn--reset:hover{background:#e4e4e4;transform:translateY(-1px)}.task-list{background:#fff;border-radius:24px;padding:20px;box-shadow:0 10px 28px #0000001a;width:100%}.task-list__title{font-size:11px;font-weight:700;color:#999;text-transform:uppercase;letter-spacing:1.3px;margin-bottom:12px}.task-list__input-row{margin-bottom:10px}.task-list__input{width:100%;padding:11px 16px;border-radius:14px;border:2px solid #efefef;font-size:14px;font-family:inherit;outline:none;background:#fafafa;color:#222;transition:border-color .2s,background .2s}.task-list__input::placeholder{color:#aaa}.task-list__input:focus{border-color:#4caf50;background:#fff}.task-list__items{list-style:none;display:flex;flex-direction:column;gap:6px;max-height:220px;overflow-y:auto;padding:0;margin:0}.task-list__items::-webkit-scrollbar{width:4px}.task-list__items::-webkit-scrollbar-thumb{background:#e8e8e8;border-radius:4px}.task-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:#f8f8f8;transition:background .15s}.task-item:hover{background:#f2f2f2}.task-item--done .task-item__text{text-decoration:line-through;color:#aaa}.task-item__check{width:17px;height:17px;accent-color:#4caf50;cursor:pointer;flex-shrink:0}.task-item__text{flex:1;font-size:14px;color:#2a2a2a;line-height:1.4;word-break:break-word}.task-item__del{background:none;border:none;color:#bbb;font-size:20px;line-height:1;padding:0 2px;transition:color .15s}.task-item__del:hover{color:#f44336}.task-empty{font-size:13px;color:#aaa;text-align:center;padding:12px 0}.settings-modal__section{margin-top:18px}.settings-modal__section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#999;margin-bottom:4px}.settings-modal__row{display:flex;justify-content:space-between;align-items:center;padding:9px 0}.settings-modal__label{font-size:14px;font-weight:500;color:#333}.settings-modal__number{width:70px;padding:8px;font-size:15px;text-align:center;border-radius:10px;border:2px solid #eee;outline:none;font-family:inherit;transition:border-color .2s}.settings-modal__number:focus{border-color:#4caf50}.settings-modal__divider{border:none;border-top:1px solid #f5f5f5;margin:2px 0}.settings-modal__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.cancel-btn{padding:10px 22px;border-radius:22px;border:1.5px solid #e0e0e0;background:#fff;color:#777;font-weight:600;font-family:inherit;transition:border-color .2s,color .2s}.cancel-btn:hover{border-color:#bbb;color:#333}.save-btn{padding:10px 22px;border-radius:22px;border:none;background:#4caf50;color:#fff;font-weight:700;font-family:inherit;box-shadow:0 4px 14px #4caf5066;transition:background .2s,transform .15s}.save-btn:hover{background:#43a047;transform:translateY(-1px)}.toggle-container{width:50px;height:27px;background:#ddd;border-radius:27px;padding:3px;cursor:pointer;transition:background .3s ease;display:flex;align-items:center;flex-shrink:0}.toggle-circle{width:21px;height:21px;background:#fff;border-radius:50%;transition:transform .3s ease;box-shadow:0 1px 4px #0003}.toggle-container.on{background:#4caf50}.toggle-container.on .toggle-circle{transform:translate(23px)}:root{--primary: #4caf50;--primary-hover: #43a047;--danger: #c0392b;--text: #111;--text-secondary: #444;--radius: 24px;--transition: all .25s ease}.modal-overlay{position:fixed;inset:0;background:#0a0a0a4d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;padding:20px;z-index:1000}.modal-content{background:#ffffffbf;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);width:clamp(320px,90vw,460px);max-height:90vh;overflow-y:auto;padding:32px;border-radius:var(--radius);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 32px #00000026,inset 0 1px #fff9;animation:slideUp .35s ease}.modal-content h2{font-size:1.5rem;font-weight:800;color:var(--text);margin-bottom:8px}.setting-group{margin-top:24px}.setting-group h3{font-size:.8rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-secondary);margin-bottom:12px}.setting-group button,.cancel-btn,.save-btn,.danger-btn{transition:var(--transition)}.setting-group button{padding:10px 18px;border-radius:999px;border:1px solid rgba(0,0,0,.15);background:#fffc;font-weight:600}.setting-group button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00000014}.setting-group button:focus-visible,.save-btn:focus-visible,.cancel-btn:focus-visible,.danger-btn:focus-visible{outline:3px solid rgba(76,175,80,.3);outline-offset:3px}.active-btn{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important;box-shadow:0 8px 20px #4caf5059}.save-btn{background:var(--primary);padding:10px 22px;border-radius:999px;font-weight:700}.save-btn:hover{background:var(--primary-hover);transform:translateY(-2px)}.modal-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;border:none;background:#ffffff80;transition:var(--transition)}.modal-close:hover{transform:rotate(90deg);background:#ffffffe6}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}