*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;color:#e0e0e0;background:#0f0f23;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}body{min-height:100dvh}button{cursor:pointer;font:inherit;color:inherit;background:0 0;border:none}input{font:inherit;color:inherit}.app{max-width:720px;padding:16px;padding-left:max(16px, env(safe-area-inset-left));padding-right:max(16px, env(safe-area-inset-right));flex-direction:column;height:100dvh;margin:0 auto;display:flex;overflow:hidden}.alert-banner{z-index:100;padding:8px;padding-top:max(8px, env(safe-area-inset-top));padding-left:max(8px, env(safe-area-inset-left));padding-right:max(8px, env(safe-area-inset-right));flex-direction:column;gap:4px;display:flex;position:fixed;top:0;left:0;right:0}.alert-banner__item{color:#fff;background:#2e7d32;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;width:100%;max-width:720px;margin:0 auto;padding:12px 16px;font-weight:500;animation:.3s ease-out slideDown;display:flex}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.alert-banner__dismiss{color:#fff;background:#fff3;border-radius:6px;flex-shrink:0;min-height:44px;padding:8px 18px;font-size:.9375rem;font-weight:600;transition:background .15s}.alert-banner__dismiss:hover{background:#ffffff59}.app-header{text-align:center;padding:24px 0 20px}.app-header__title{color:#4fc3f7;letter-spacing:-.02em;font-size:2rem;font-weight:700}.app-header__subtitle{color:#888;margin-top:2px;font-size:.875rem}.app-main{-webkit-overflow-scrolling:touch;flex:1;padding-bottom:140px;overflow-y:auto}.voice-fixed{padding:12px 16px;padding-bottom:max(12px, env(safe-area-inset-bottom));padding-left:max(16px, env(safe-area-inset-left));padding-right:max(16px, env(safe-area-inset-right));pointer-events:none;z-index:30;background:linear-gradient(0deg,#0f0f23 0% 40px,#0000 100%);justify-content:center;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.voice-fixed>*{pointer-events:auto}.voice-section{flex-direction:column;align-items:center;gap:8px;padding:12px 0;display:flex}.voice-btn{color:#0f0f23;touch-action:manipulation;background:linear-gradient(135deg,#4fc3f7,#29b6f6);border:none;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;transition:transform .15s,box-shadow .15s,background .15s;display:flex;box-shadow:0 4px 20px #4fc3f74d}.voice-btn:not(:disabled){cursor:pointer}.voice-btn:not(:disabled):active{transform:scale(.92)}.voice-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;background:#333}.voice-btn--recording{background:linear-gradient(135deg,#f44336,#d32f2f);animation:1s ease-in-out infinite pulse;box-shadow:0 4px 20px #f4433680}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.voice-btn__label{color:#888;-webkit-user-select:none;user-select:none;font-size:.8125rem}.voice-btn__error{text-align:center;border-radius:6px;max-width:280px;padding:6px 10px;font-size:.75rem}.voice-btn__error--error{color:#ef9a9a;background:#f443361a}.voice-btn__error--warning{color:#ffcc80;background:#ff98001a}.voice-btn__error--info{color:#81d4fa;background:#4fc3f71a}.error-banner{border-radius:10px;padding:12px 16px;font-size:.875rem;line-height:1.5}.error-banner--error{color:#ef9a9a;background:#3e1a1a;border:1px solid #f44336}.error-banner--warning{color:#ffcc80;background:#3e2e1a;border:1px solid #ff9800}.error-banner--info{color:#81d4fa;background:#1a2e3e;border:1px solid #4fc3f7}.error-banner__title{margin-bottom:2px;font-weight:600}.error-banner__message{opacity:.9}.dashboard{grid-template-columns:1fr;gap:12px;display:grid}@media (width>=600px){.dashboard{grid-template-columns:1fr 1fr}}.dashboard-empty{text-align:center;color:#666;padding:48px 16px}.dashboard-empty__hint{margin-top:8px;font-size:.875rem;font-style:italic}.timer-card{background:#1a1a3e;border:1px solid #2a2a4e;border-radius:14px;flex-direction:column;gap:12px;padding:20px;transition:border-color .2s,opacity .3s;display:flex}.timer-card--running{border-color:#2e7d32}.timer-card--paused{border-color:#e65100}.timer-card--completed,.timer-card--cancelled{opacity:.55}.timer-card__header{justify-content:space-between;align-items:center;gap:8px;display:flex}.timer-card__name{text-overflow:ellipsis;white-space:nowrap;font-size:1.0625rem;font-weight:600;overflow:hidden}.timer-card__status{border-radius:20px;flex-shrink:0;padding:2px 10px;font-size:.75rem;font-weight:600}.timer-card__status--running{color:#81c784;background:#4caf5033}.timer-card__status--paused{color:#ffb74d;background:#ff980033}.timer-card__status--completed{color:#bdbdbd;background:#9e9e9e33}.timer-card__status--cancelled{color:#ef9a9a;background:#f4433633}.timer-card__time{font-variant-numeric:tabular-nums;letter-spacing:.02em;text-align:center;color:#fff;font-size:2.75rem;font-weight:700;line-height:1.1}.timer-card--running .timer-card__time{color:#a5d6a7}.timer-card--paused .timer-card__time{color:#ffcc80}.timer-card__progress{background:#2a2a4e;border-radius:2px;height:4px;overflow:hidden}.timer-card__progress-fill{border-radius:2px;height:100%;transition:width 1s linear}.timer-card__progress-fill--running{background:#4caf50}.timer-card__progress-fill--paused{background:#ff9800}.timer-card__progress-fill--completed{background:#757575}.timer-card__progress-fill--cancelled{background:#616161}.timer-card__footer{text-align:center}.timer-card__footer-text{color:#888;font-size:.8125rem}.timer-card__actions{justify-content:center;gap:8px;display:flex}.timer-card__btn{border:1px solid #0000;border-radius:8px;min-width:44px;min-height:44px;padding:10px 18px;font-size:.875rem;font-weight:600;transition:background .15s,opacity .15s,border-color .15s}.timer-card__btn:disabled{opacity:.4;cursor:not-allowed}.timer-card__btn--pause{color:#4fc3f7;background:#4fc3f726;border-color:#4fc3f7}.timer-card__btn--pause:not(:disabled):hover{background:#4fc3f740}.timer-card__btn--resume{color:#4fc3f7;background:#4fc3f726;border-color:#4fc3f7}.timer-card__btn--resume:not(:disabled):hover{background:#4fc3f740}.timer-card__btn--cancel{color:#ef9a9a;background:#f443361a;border-color:#f44336}.timer-card__btn--cancel:not(:disabled):hover{background:#f4433633;border-color:#f44336}.timer-card__btn--delete{color:#ef9a9a;background:#f4433626;border-color:#f44336}.timer-card__btn--delete:not(:disabled):hover{background:#f443364d;border-color:#f44336}.timer-card__footer-actions{justify-content:space-between;align-items:center;gap:12px;width:100%;display:flex}.debug-panel{z-index:50;padding-bottom:env(safe-area-inset-bottom);font-size:.8125rem;position:fixed;bottom:12px;right:12px}.debug-panel__toggle{color:#888;background:#1e1e3a;border:1px solid #333;border-radius:8px;padding:6px 14px;font-size:.75rem;transition:background .15s}.debug-panel__toggle:hover{background:#2a2a4e}.debug-panel--open .debug-panel__toggle{border-radius:8px 8px 0 0}.debug-panel__content{background:#1e1e3a;border:1px solid #333;border-top:none;border-radius:0 0 8px 8px;flex-direction:column;gap:4px;min-width:180px;padding:8px 14px;display:flex}.debug-panel__row{justify-content:space-between;gap:12px;display:flex}.debug-panel__mono{color:#888;font-family:monospace}.settings-btn{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));z-index:40;color:#888;cursor:pointer;touch-action:manipulation;background:#1a1a3e;border:1px solid #2a2a4e;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:background .15s,color .15s,border-color .15s;display:flex;position:fixed}.settings-btn:hover{color:#4fc3f7;background:#2a2a4e;border-color:#4fc3f7}.settings-overlay{z-index:200;background:#0009;justify-content:center;align-items:center;padding:16px;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.settings-modal{background:#1a1a3e;border:1px solid #2a2a4e;border-radius:16px;width:100%;max-width:400px;animation:.2s ease-out scaleIn}.settings-modal__header{justify-content:space-between;align-items:center;padding:20px 20px 0;display:flex}.settings-modal__title{color:#4fc3f7;font-size:1.25rem;font-weight:700}.settings-modal__close{color:#888;cursor:pointer;touch-action:manipulation;background:#2a2a4e;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1rem;transition:background .15s,color .15s;display:flex}.settings-modal__close:hover{color:#fff;background:#3a3a5e}.settings-modal__body{flex-direction:column;gap:16px;padding:16px 20px 20px;display:flex}.settings-modal__desc{color:#aaa;font-size:.875rem;line-height:1.5}.settings-modal__status{color:#81c784;background:#4caf501a;border:1px solid #4caf5033;border-radius:8px;align-items:center;gap:8px;padding:10px 14px;font-size:.8125rem;display:flex}.settings-modal__status code{color:#a5d6a7;font-family:monospace}.settings-modal__status-dot{background:#4caf50;border-radius:50%;flex-shrink:0;width:8px;height:8px}.settings-modal__label{color:#ccc;flex-direction:column;gap:6px;font-size:.875rem;font-weight:600;display:flex}.settings-modal__input{color:#e0e0e0;background:#0f0f23;border:1px solid #2a2a4e;border-radius:8px;padding:10px 14px;font-family:monospace;font-size:.875rem;transition:border-color .15s}.settings-modal__input:focus{border-color:#4fc3f7;outline:none}.settings-modal__input::placeholder{color:#555}.settings-modal__save{color:#0f0f23;cursor:pointer;background:#4fc3f7;border:none;border-radius:8px;min-height:44px;padding:10px 18px;font-size:.9375rem;font-weight:600;transition:opacity .15s}.settings-modal__save:disabled{opacity:.4;cursor:not-allowed}.settings-modal__save:not(:disabled):hover{opacity:.85}.info-btn{top:max(12px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));z-index:40;color:#888;cursor:pointer;touch-action:manipulation;background:#1a1a3e;border:1px solid #2a2a4e;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:background .15s,color .15s,border-color .15s;display:flex;position:fixed}.info-btn:hover{color:#4fc3f7;background:#2a2a4e;border-color:#4fc3f7}.commands-overlay{z-index:200;background:#0009;justify-content:center;align-items:center;padding:16px;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.commands-modal{background:#1a1a3e;border:1px solid #2a2a4e;border-radius:16px;width:100%;max-width:400px;max-height:80vh;animation:.2s ease-out scaleIn;overflow-y:auto}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.commands-modal__header{justify-content:space-between;align-items:center;padding:20px 20px 0;display:flex}.commands-modal__title{color:#4fc3f7;font-size:1.25rem;font-weight:700}.commands-modal__close{color:#888;cursor:pointer;touch-action:manipulation;background:#2a2a4e;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1rem;transition:background .15s,color .15s;display:flex}.commands-modal__close:hover{color:#fff;background:#3a3a5e}.commands-modal__list{flex-direction:column;gap:12px;margin:0;padding:12px 20px 20px;list-style:none;display:flex}.commands-modal__item{background:#0f0f23;border:1px solid #2a2a4e;border-radius:10px;flex-direction:column;gap:2px;padding:10px 14px;display:flex}.commands-modal__action{color:#e0e0e0;font-size:.9375rem;font-weight:600}.commands-modal__verbs{color:#4fc3f7;font-family:monospace;font-size:.8rem}.commands-modal__example{color:#888;font-size:.8125rem;font-style:italic}
