:root{font-family:IBM Plex Sans,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}body{margin:0;min-width:320px;color:#e2e8f0;background:radial-gradient(circle at top,rgba(248,113,113,.28),transparent 28%),linear-gradient(180deg,#111827,#020617)}*{box-sizing:border-box}h1{margin:0 0 16px;font-size:clamp(2.5rem,7vw,4rem);line-height:.95;letter-spacing:-.05em}p{margin:0;color:#cbd5e1;line-height:1.6}code{display:inline-flex;padding:.65rem .9rem;border-radius:999px;background:#94a3b829;color:#f8fafc;font-family:IBM Plex Mono,SFMono-Regular,monospace}.app-shell{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:32px 20px}.app-card{width:min(100%,640px);padding:48px;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:radial-gradient(circle at top right,rgba(248,113,113,.18),transparent 36%),linear-gradient(160deg,#1a233df5,#0f172af0);box-shadow:0 24px 80px #0f172a59;text-align:left}.app-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:32px}.app-copy{flex:1 1 320px}.eyebrow{margin:0 0 16px;font-size:.8rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#fca5a5}.description{margin:0;max-width:42ch}.settings-button{flex:0 0 auto;min-height:48px;padding-inline:1.1rem}.timer-panel{display:grid;gap:24px;padding:28px;border:1px solid rgba(248,250,252,.08);border-radius:20px;background:#0f172a94;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.timer-status{font-size:.8rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#94a3b8}.timer-display{font-family:IBM Plex Mono,SFMono-Regular,monospace;font-size:clamp(4rem,18vw,7rem);font-weight:700;line-height:.9;letter-spacing:-.08em;color:#f8fafc}.timer-controls{display:flex;flex-wrap:wrap;gap:12px}.timer-controls button{flex:1 1 160px;min-height:52px;padding:.9rem 1.2rem;border:1px solid transparent;border-radius:999px;font:inherit;font-weight:700;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background-color .16s ease,opacity .16s ease}.timer-controls button:hover:not(:disabled){transform:translateY(-1px)}.timer-controls button:disabled{cursor:not-allowed;opacity:.45}.primary-button{background:linear-gradient(135deg,#ef4444,#fb7185);color:#fff7ed;box-shadow:0 18px 36px #ef444440}.secondary-button{border-color:#94a3b83d;background:#3341558c;color:#e2e8f0}.notification-panel{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-top:4px}.notification-status{font-size:.95rem;color:#cbd5e1}.notification-button{min-height:44px;padding:.7rem 1rem;border:1px solid rgba(252,165,165,.28);border-radius:999px;background:#7f1d1d38;color:#fecaca;font:inherit;font-weight:700;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background-color .16s ease}.notification-button:hover{transform:translateY(-1px);border-color:#fca5a566;background:#7f1d1d52}.settings-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#020617b8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:20}.settings-modal{width:min(100%,520px);padding:32px;border:1px solid rgba(248,250,252,.12);border-radius:24px;background:radial-gradient(circle at top right,rgba(248,113,113,.14),transparent 42%),linear-gradient(180deg,#1e293bfa,#0f172afa);box-shadow:0 24px 80px #02061773}.settings-modal-header{display:grid;gap:12px;margin-bottom:24px}.settings-modal-title{margin:0;font-size:clamp(2rem,6vw,2.8rem);line-height:1;letter-spacing:-.05em}.settings-modal-description{max-width:42ch}.settings-form{display:grid;gap:20px}.settings-field{display:grid;gap:10px;font-weight:700;color:#f8fafc}.settings-input{min-height:52px;padding:.85rem 1rem;border:1px solid rgba(148,163,184,.24);border-radius:14px;background:#0f172acc;color:#f8fafc;font:inherit}.settings-input:focus{outline:2px solid rgba(251,113,133,.9);outline-offset:2px}.settings-input[aria-invalid=true]{border-color:#fca5a5e0;background:#7f1d1d2e}.settings-error{font-size:.95rem;font-weight:400;color:#fecaca}.settings-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end;padding-top:4px}.settings-actions button{flex:1 1 180px}@media (max-width: 640px){.app-card{padding:32px 24px}.app-header{gap:16px}.settings-button{width:100%}.timer-panel{padding:24px 20px}.notification-panel{align-items:stretch}.settings-modal{padding:28px 20px}}
