*{margin:0;padding:0;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;-webkit-tap-highlight-color:transparent}:root{color-scheme:light;--bg: #f0f4f8;--surface: #ffffff;--surface-soft: #f7fafc;--accent: #2b6cb0;--accent-hover: #1a4f8b;--accent-soft: #ebf4ff;--accent-soft-2: #e2edff;--accent-soft-3: #ebf8ff;--heading: #1a365d;--text: #2d3748;--text-secondary: #4a6fa5;--text-muted: #718096;--border: #e2e8f0;--container-shadow: 0 20px 40px -12px rgba(0, 20, 40, .25);--card-shadow: 0 2px 8px rgba(0, 0, 0, .06);--card-shadow-hover: 0 6px 16px rgba(0, 0, 0, .08);--card-border-hover: #bee3f8;--green: #48bb78;--up-badge-bg: #c6f6d5;--up-badge-text: #276749;--up-solid: #38a169;--down-badge-bg: #fed7d7;--down-badge-text: #9b2c2c;--down-solid: #e53e3e;--pending-badge-bg: #e2e8f0;--pending-badge-text: #4a5568;--delete-border: #feb2b2;--delete-hover-bg: #fff5f5;--delete-hover-border: #fc8181;--input-placeholder: #a0aec0}[data-theme=dark]{color-scheme:dark;--bg: #0b1220;--surface: #151f32;--surface-soft: #1c2a42;--accent: #63a4e0;--accent-hover: #7db4e8;--accent-soft: #1a2b45;--accent-soft-2: #1d3152;--accent-soft-3: #17304a;--heading: #dce7f5;--text: #c3d0e0;--text-secondary: #8fb0d4;--text-muted: #7d8da3;--border: #2a3a55;--container-shadow: 0 20px 40px -12px rgba(0, 0, 0, .55);--card-shadow: 0 2px 8px rgba(0, 0, 0, .35);--card-shadow-hover: 0 6px 16px rgba(0, 0, 0, .45);--card-border-hover: #3b5780;--green: #4cc184;--up-badge-bg: #173c2c;--up-badge-text: #7ed6a5;--up-solid: #38a169;--down-badge-bg: #4a1f24;--down-badge-text: #f09a9a;--down-solid: #e53e3e;--pending-badge-bg: #2a3a55;--pending-badge-text: #a8b7cc;--delete-border: #6b3131;--delete-hover-bg: #3a2025;--delete-hover-border: #a05252;--input-placeholder: #5c6c83}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);min-height:100vh;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);transition:background-color .25s ease,color .25s ease}#root{max-width:1200px;margin:0 auto}.app-container{background:var(--surface);min-height:100vh;min-height:100dvh;padding:1rem;display:flex;flex-direction:column;transition:background-color .25s ease,box-shadow .25s ease}.top-bar{position:sticky;top:0;z-index:40;display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;background:var(--surface);box-shadow:0 1px 0 var(--border);margin:-1rem -1rem .75rem;padding:calc(1rem + env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) .75rem max(1rem,env(safe-area-inset-left))}h1{display:flex;align-items:center;gap:8px;font-size:clamp(1.3rem,5.5vw,2rem);color:var(--heading);flex-wrap:wrap;line-height:1.2}h1 .icon{color:var(--accent)}.frequency-badge{background:var(--accent-soft-2);padding:.25rem .75rem;border-radius:40px;font-size:.72rem;font-weight:600;color:var(--accent);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}.theme-toggle{flex-shrink:0;background:var(--surface-soft);border:2px solid var(--border);color:var(--accent);width:44px;height:44px;min-width:44px;min-height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:all .2s}.theme-toggle:hover{background:var(--accent-soft);border-color:var(--accent)}.theme-toggle:active{transform:scale(.95)}.subtitle{color:var(--text-secondary);background:var(--accent-soft);padding:.6rem .9rem;border-radius:12px;display:block;margin-bottom:1rem;border-left:4px solid var(--accent);font-size:.9rem;line-height:1.45;transition:background-color .25s ease,color .25s ease}.toolbar{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}.add-form{display:flex;flex-direction:column;gap:.6rem;background:var(--surface-soft);padding:.75rem;border-radius:16px;border:2px solid var(--border);transition:background-color .25s ease,border-color .25s ease}.add-form input{width:100%;min-width:0;border:1px solid var(--border);background:var(--surface);padding:.75rem .9rem;font-size:16px;border-radius:12px;outline:none;color:var(--heading);transition:border-color .2s}.add-form input:focus{border-color:var(--accent)}.add-form input::placeholder{color:var(--input-placeholder)}.add-form button{background:var(--accent);border:none;color:#fff;padding:.75rem;min-height:48px;border-radius:12px;font-weight:600;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .2s,transform .15s}.add-form button:hover{background:var(--accent-hover)}.add-form button:active{transform:scale(.98)}.check-all-btn{background:var(--green);border:none;color:#fff;padding:.75rem;min-height:48px;border-radius:12px;font-weight:600;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;transition:opacity .2s,transform .15s}.check-all-btn:disabled{opacity:.6;cursor:not-allowed}.check-all-btn:not(:disabled):active{transform:scale(.98)}.stats-bar{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;background:var(--surface-soft);padding:.75rem;border-radius:16px;margin-bottom:1.25rem;transition:background-color .25s ease}.stat-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--text);font-size:.85rem;padding:.65rem .25rem;border-radius:10px;background:var(--surface)}.stat-item svg{font-size:1.15rem}.stat-label{font-size:.72rem;font-weight:600;color:var(--text-muted)}.stat-item .badge{background:var(--accent);color:#fff;padding:.1rem .7rem;border-radius:40px;font-size:.8rem;font-weight:600}.stat-item .badge.up{background:var(--up-solid)}.stat-item .badge.down{background:var(--down-solid)}.site-grid{display:grid;grid-template-columns:1fr;gap:.75rem;flex:1}.site-card{background:var(--surface);border-radius:16px;padding:1rem;box-shadow:var(--card-shadow);border:1px solid var(--border);transition:all .2s}.site-card:hover{box-shadow:var(--card-shadow-hover);border-color:var(--card-border-hover)}.site-header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.site-url{display:block;font-weight:600;color:var(--heading);word-break:break-all;font-size:.9rem}.status-badge{padding:.2rem .8rem;border-radius:40px;font-size:.7rem;font-weight:700;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}.status-badge.up{background:var(--up-badge-bg);color:var(--up-badge-text)}.status-badge.down{background:var(--down-badge-bg);color:var(--down-badge-text)}.status-badge.pending{background:var(--pending-badge-bg);color:var(--pending-badge-text)}.site-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25rem .75rem;font-size:.75rem;color:var(--text-muted);margin:.6rem 0 .8rem;padding-top:.6rem;border-top:1px solid var(--border)}.site-actions{display:flex;gap:8px}.site-actions button{flex:1;background:none;border:1px solid var(--border);border-radius:30px;min-height:44px;padding:.35rem .9rem;font-size:.75rem;font-weight:500;color:var(--text-muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:all .15s}.site-actions button:hover{background:var(--surface-soft)}.site-actions .delete-btn{color:var(--down-solid);border-color:var(--delete-border)}.site-actions .delete-btn:hover{background:var(--delete-hover-bg);border-color:var(--delete-hover-border)}.empty-state{text-align:center;padding:4rem 1rem;color:var(--text-muted);grid-column:1 / -1}.empty-state .icon{font-size:4rem;opacity:.4;margin-bottom:1rem}.footer-note{margin-top:1.5rem;background:var(--accent-soft-3);padding:.9rem 1rem;border-radius:16px;font-size:.8rem;color:var(--text-secondary);display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;line-height:1.45;transition:background-color .25s ease,color .25s ease}.footer-note svg{flex-shrink:0;margin-top:2px}.spin{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (min-width: 640px){.app-container{padding:1.5rem}.top-bar{margin:-1.5rem -1.5rem .75rem;padding:calc(1.5rem + env(safe-area-inset-top)) 1.5rem .75rem}.toolbar{flex-direction:row;align-items:stretch;justify-content:space-between}.add-form{flex:1;flex-direction:row;align-items:center;border-radius:60px;padding:.5rem .5rem .5rem 1rem}.add-form input{flex:1;border:none;background:transparent;padding:.6rem .5rem}.add-form button{width:auto;min-height:44px;border-radius:40px;padding:.5rem 1.8rem}.check-all-btn{width:auto;min-height:44px;border-radius:40px;padding:.5rem 1.5rem}.site-grid{grid-template-columns:repeat(2,1fr);gap:1rem}.subtitle{display:inline-block}.site-actions button{flex:none}}@media (min-width: 768px){body{padding:2rem 1rem}.top-bar{position:static;box-shadow:none;margin:0 0 1rem;padding:0}.app-container{min-height:auto;border-radius:28px;box-shadow:var(--container-shadow);padding:2rem}.stats-bar{display:flex;flex-wrap:wrap;gap:1.5rem 2.5rem;border-radius:40px;padding:.8rem 1.5rem}.stat-item{flex-direction:row;align-items:center;gap:8px;background:transparent;justify-content:flex-start;padding:0;font-size:1rem}.stat-item svg{font-size:1rem}.stat-label{font-size:inherit;font-weight:inherit;color:inherit}}@media (min-width: 1024px){.site-grid{grid-template-columns:repeat(3,1fr);gap:20px}}.search-bar{display:flex;align-items:center;gap:8px;background:var(--surface-soft);border:2px solid var(--border);border-radius:14px;padding:.35rem .75rem;margin-bottom:.75rem;transition:border-color .2s,background-color .25s ease}.search-bar:focus-within{border-color:var(--accent)}.search-icon{color:var(--text-muted);flex-shrink:0}.search-bar input{flex:1;min-width:0;border:none;background:transparent;padding:.6rem 0;font-size:16px;outline:none;color:var(--heading)}.search-bar input::-webkit-search-cancel-button{-webkit-appearance:none}.search-bar input::placeholder{color:var(--input-placeholder)}.search-clear{flex-shrink:0;border:none;background:var(--border);color:var(--text-muted);width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.7rem;transition:all .15s}.search-clear:hover{background:var(--accent);color:#fff}.filter-row{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1rem}.filter-chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.filter-chips::-webkit-scrollbar{display:none}.chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface);color:var(--text-muted);padding:.4rem .9rem;min-height:40px;border-radius:40px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .15s}.chip:hover{border-color:var(--accent);color:var(--accent)}.chip.active{background:var(--accent);border-color:var(--accent);color:#fff}.chip-count{background:var(--accent-soft-2);color:var(--accent);border-radius:40px;padding:.05rem .45rem;font-size:.7rem}.chip.active .chip-count{background:rgba(255,255,255,.25);color:#fff}.filter-controls{display:flex;gap:8px}.sort-select{flex:1;min-width:0;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:.45rem .8rem;min-height:44px;border-radius:12px;font-size:.85rem;outline:none}.export-btn{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--surface-soft);color:var(--text);padding:.45rem 1rem;min-height:44px;border-radius:12px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .15s}.export-btn:hover{border-color:var(--green);color:var(--up-badge-text)}.add-inputs{display:flex;flex-direction:column;gap:.6rem;flex:1;min-width:0}.add-inputs input{min-width:0}.site-identity{flex:1;min-width:0}.site-name{display:block;font-weight:700;color:var(--heading);font-size:1rem;word-break:break-word;margin-bottom:2px}mark{background:var(--accent-soft-2);color:var(--accent);border-radius:3px;padding:0 1px}.site-health{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:.6rem 0}.uptime-pct{font-size:.8rem;font-weight:700;white-space:nowrap}.uptime-pct.good{color:var(--up-solid)}.uptime-pct.warn{color:#d69e2e}.uptime-pct.bad{color:var(--down-solid)}.uptime-pct.muted{color:var(--text-muted);font-weight:500}.sparkline{display:flex;align-items:flex-end;gap:1px;height:24px;flex:1;min-width:0;justify-content:flex-end}.spark-bar{flex:1;min-width:2px;max-width:6px;border-radius:2px 2px 0 0;background:var(--pending-badge-bg)}.spark-bar.up{background:var(--up-solid)}.spark-bar.down{background:var(--down-solid)}.status-badge.paused{background:#fefcbf;color:#975a16}[data-theme=dark] .status-badge.paused{background:#3b3414;color:#ecc94b}.reset-btn{margin-top:1rem;border:1px solid var(--accent);background:var(--accent);color:#fff;padding:.5rem 1.2rem;min-height:40px;border-radius:40px;font-weight:600;font-size:.85rem;cursor:pointer}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center;z-index:50}.modal{background:var(--surface);width:100%;max-width:480px;border-radius:20px 20px 0 0;padding:1.5rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom));box-shadow:var(--container-shadow);animation:modal-up .25s ease}.modal h3{color:var(--heading);margin-bottom:1rem;font-size:1.1rem}.modal-label{display:block;font-size:.8rem;font-weight:600;color:var(--text-muted);margin-bottom:.9rem}.modal-label input{display:block;width:100%;margin-top:.35rem;border:1px solid var(--border);background:var(--surface-soft);padding:.7rem .9rem;font-size:16px;border-radius:12px;outline:none;color:var(--heading)}.modal-label input:focus{border-color:var(--accent)}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:1.25rem}.modal-actions button{border:none;border-radius:12px;padding:.6rem 1.3rem;min-height:44px;font-weight:600;font-size:.9rem;cursor:pointer}.modal-cancel{background:var(--surface-soft);color:var(--text-muted);border:1px solid var(--border)!important}.modal-save{background:var(--accent);color:#fff}@keyframes modal-up{0%{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}.toast{position:fixed;bottom:calc(1rem + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);z-index:60;display:flex;align-items:center;gap:8px;background:var(--surface);color:var(--text);padding:.7rem 1.2rem;border-radius:40px;box-shadow:0 10px 30px #00000040;font-size:.85rem;font-weight:600;max-width:calc(100vw - 2rem);cursor:pointer;animation:toast-in .25s ease;border-left:4px solid var(--green)}.toast.error{border-left-color:var(--down-solid)}.toast svg{color:var(--green);flex-shrink:0}.toast.error svg{color:var(--down-solid)}@keyframes toast-in{0%{transform:translate(-50%,12px);opacity:0}to{transform:translate(-50%);opacity:1}}@media (min-width: 640px){.add-inputs{flex-direction:row}.add-inputs input:first-child{max-width:180px}.filter-row{flex-direction:row;align-items:center;justify-content:space-between}.filter-chips{overflow-x:visible;flex-wrap:wrap}.filter-controls{flex-shrink:0}.sort-select{flex:none}.modal-overlay{align-items:center;padding:1rem}.modal{border-radius:20px;padding:1.5rem}.sparkline{max-width:180px}}.fab{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom));z-index:45;width:56px;height:56px;border-radius:50%;border:none;background:var(--accent);color:#fff;font-size:1.2rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 20px #0000004d;transition:transform .15s,opacity .2s}.fab:disabled{opacity:.6;cursor:not-allowed}.fab:not(:disabled):active{transform:scale(.92)}@media (min-width: 768px){.fab{display:none}}.modal-handle{width:40px;height:4px;border-radius:2px;background:var(--border);margin:0 auto .9rem}@media (min-width: 640px){.modal-handle{display:none}}