*{box-sizing:border-box;margin:0;padding:0}:root{--ctp-base: #eff1f5;--ctp-mantle: #e6e9ef;--ctp-crust: #dce0e8;--ctp-surface0: #ccd0da;--ctp-surface1: #bcc0cc;--ctp-surface2: #acb0be;--ctp-overlay0: #9ca0b0;--ctp-overlay1: #8c8fa1;--ctp-text: #4c4f69;--ctp-subtext0: #6c6f85;--ctp-subtext1: #5c5f77;--ctp-blue: #1e66f5;--ctp-lavender: #7287fd;--ctp-sapphire: #209fb5;--ctp-sky: #04a5e5;--ctp-teal: #179299;--ctp-green: #40a02b;--ctp-yellow: #df8e1d;--ctp-peach: #fe640b;--ctp-maroon: #e64553;--ctp-red: #d20f39;--ctp-mauve: #8839ef;--ctp-pink: #ea76cb;--ctp-flamingo: #dd7878;--ctp-rosewater: #dc8a78;--bg-primary: var(--ctp-base);--bg-secondary: var(--ctp-mantle);--bg-card: var(--ctp-surface0);--text-primary: var(--ctp-text);--text-secondary: var(--ctp-subtext0);--accent: var(--ctp-mauve);--accent-hover: var(--ctp-lavender);--border: var(--ctp-surface1);--success: var(--ctp-green);--error: var(--ctp-red);--border-radius: 12px}@media(prefers-color-scheme:dark){:root{--ctp-base: #1e1e2e;--ctp-mantle: #181825;--ctp-crust: #11111b;--ctp-surface0: #313244;--ctp-surface1: #45475a;--ctp-surface2: #585b70;--ctp-overlay0: #6c7086;--ctp-overlay1: #7f849c;--ctp-text: #cdd6f4;--ctp-subtext0: #a6adc8;--ctp-subtext1: #bac2de;--ctp-blue: #89b4fa;--ctp-lavender: #b4befe;--ctp-sapphire: #74c7ec;--ctp-sky: #89dceb;--ctp-teal: #94e2d5;--ctp-green: #a6e3a1;--ctp-yellow: #f9e2af;--ctp-peach: #fab387;--ctp-maroon: #eba0ac;--ctp-red: #f38ba8;--ctp-mauve: #cba6f7;--ctp-pink: #f5c2e7;--ctp-flamingo: #f2cdcd;--ctp-rosewater: #f5e0dc}}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100%}.app{min-height:100%;display:flex;flex-direction:column;padding:24px 16px;max-width:480px;margin:0 auto}.header{text-align:center;margin-bottom:32px;padding-top:env(safe-area-inset-top)}.header h1{font-size:28px;font-weight:700;margin-bottom:4px}.subtitle{color:var(--text-secondary);font-size:14px}.main{flex:1;display:flex;flex-direction:column;gap:24px}.message{padding:12px 16px;border-radius:var(--border-radius);font-size:14px;text-align:center;cursor:pointer;animation:slideIn .2s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.message.error{background:color-mix(in srgb,var(--error) 15%,transparent);color:var(--error);border:1px solid color-mix(in srgb,var(--error) 30%,transparent)}.message.success{background:color-mix(in srgb,var(--success) 15%,transparent);color:var(--success);border:1px solid color-mix(in srgb,var(--success) 30%,transparent)}.quick-action{width:100%;padding:20px 32px;font-size:20px;font-weight:600;color:#fff;background:var(--accent);border:none;border-radius:var(--border-radius);cursor:pointer;transition:background .2s,transform .1s;touch-action:manipulation}.quick-action:hover:not(:disabled){background:var(--accent-hover)}.quick-action:active:not(:disabled){transform:scale(.98)}.quick-action:disabled{opacity:.6;cursor:not-allowed}.options{display:flex;flex-direction:column;gap:20px}.option-group{background:var(--bg-secondary);padding:16px;border-radius:var(--border-radius)}.option-label{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);margin-bottom:12px}.duration-buttons,.scope-buttons{display:flex;gap:8px;flex-wrap:wrap}.duration-btn,.scope-btn{flex:1;min-width:60px;padding:10px 12px;font-size:14px;font-weight:500;color:var(--text-primary);background:var(--bg-card);border:2px solid transparent;border-radius:8px;cursor:pointer;transition:border-color .2s,background .2s;touch-action:manipulation}.duration-btn:hover,.scope-btn:hover{background:var(--bg-primary)}.duration-btn.active,.scope-btn.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}.custom-input{display:flex;align-items:center;gap:8px;margin-top:12px}.custom-input input{flex:1;padding:10px 12px;font-size:16px;color:var(--text-primary);background:var(--bg-card);border:2px solid transparent;border-radius:8px;outline:none;transition:border-color .2s}.custom-input input:focus{border-color:var(--accent)}.custom-input input::placeholder{color:var(--text-secondary)}.input-suffix{color:var(--text-secondary);font-size:14px}.footer{text-align:center;padding:16px 0;padding-bottom:env(safe-area-inset-bottom);margin-top:auto}.footer p{color:var(--text-secondary);font-size:12px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.offline-banner{position:fixed;top:0;left:0;right:0;background:var(--error);color:#fff;text-align:center;padding:8px 16px;padding-top:calc(8px + env(safe-area-inset-top));font-size:14px;font-weight:500;z-index:100;animation:slideDown .3s ease-out}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.overrides-section{background:var(--bg-secondary);padding:16px;border-radius:var(--border-radius)}.section-title{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);margin-bottom:12px}.overrides-list{list-style:none;display:flex;flex-direction:column;gap:8px}.override-item{display:flex;align-items:center;justify-content:space-between;background:var(--bg-card);padding:12px;border-radius:8px}.override-info{display:flex;flex-direction:column;gap:2px}.override-target{font-size:14px;font-weight:500;color:var(--text-primary)}.override-timer{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent)}.cancel-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:300;color:var(--text-secondary);background:transparent;border:1px solid var(--text-secondary);border-radius:50%;cursor:pointer;transition:color .2s,border-color .2s,background .2s;touch-action:manipulation}.cancel-btn:hover:not(:disabled){color:var(--error);border-color:var(--error);background:color-mix(in srgb,var(--error) 10%,transparent)}.cancel-btn:disabled{opacity:.5;cursor:not-allowed}
