:root{--bg: #ffffff;--fg: #0b0f19;--muted: #6b7280;--primary: #111827;--card: #f7f7f9;--border: #e5e7eb;--accent: #3b82f6;--radius: 14px;--shadow: 0 10px 30px rgba(0, 0, 0, .06);--header-h: 64px;--footer-h: 56px;color-scheme:light dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Arial,"Apple Color Emoji","Segoe UI Emoji"}:root[data-theme=dark]{--bg: hsl(120 20% 6%);--fg: #e5e7eb;--muted: #9ca3af;--primary: #f9fafb;--card: hsl(120 14% 10%);--border: hsl(120 10% 18%);--accent: hsl(120 60% 50%);--shadow: 0 10px 30px rgba(0, 0, 0, .4)}*,*:before,*:after{box-sizing:border-box}html,body{padding:0;margin:0}body{background:var(--bg);color:var(--fg);line-height:1.6;min-width:320px;min-height:100vh;min-height:100dvh;overflow-x:hidden;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .25s ease,color .25s ease}.site-header{min-height:var(--header-h);display:flex;align-items:center}.container{max-width:960px;margin:0 auto;padding:clamp(16px,4vw,32px)}.footer-container{max-width:960px;margin:0 auto;padding:0 clamp(16px,4vw,32px)}.site-header{height:var(--header-h);flex-shrink:0;display:flex;align-items:center;border-bottom:1px solid var(--border);background:var(--bg);z-index:10}.site-main{flex:1;display:grid;place-items:center;padding:0;overflow:hidden}.site-main .container{padding:0 clamp(16px,4vw,32px)}.site-footer{height:var(--footer-h);flex-shrink:0;display:flex;align-items:center;border-top:1px solid var(--border);background:var(--bg);z-index:10}.site-footer .footer-inner{display:flex;justify-content:center;align-items:center}.site-header .header-inner{display:flex;justify-content:flex-end;align-items:center}.hero{text-align:center;max-width:100%;margin-top:-1rem}.headline{margin:0 0 12px;display:grid;gap:10px;justify-items:center}.footnote{color:var(--muted);font-size:.875rem}.tag{display:inline-block;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:var(--card);border:1px solid var(--border);padding:6px 10px;border-radius:999px}.domain{font-weight:800;letter-spacing:-.02em;font-size:clamp(28px,8vw,72px);word-break:break-word;line-height:1.1}:root:not([data-theme=dark]) .domain{color:#315e31}.subtext{margin:0;color:var(--muted)}.theme-toggle{display:inline-flex;align-items:center;gap:8px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--primary);padding:10px 14px;cursor:pointer;box-shadow:var(--shadow);transition:background-color .25s ease,color .25s ease,border-color .25s ease,transform .12s ease;-webkit-user-select:none;user-select:none}.theme-toggle:hover{transform:translateY(-1px);border-color:var(--accent)}.theme-toggle:active{transform:translateY(0)}.theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.theme-toggle .icon{font-size:1.1rem}a{color:inherit;text-decoration:none}@media (prefers-reduced-motion: reduce){*{transition:none!important}}.clock-wrapper{display:flex;flex-direction:column;align-items:center;margin-top:8px}.realtime-clock{display:inline-flex;align-items:baseline;gap:8px;font-size:clamp(14px,3.2vw,18px);font-weight:600;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--primary);background:var(--card);border:1px solid var(--border);border-radius:calc(var(--radius) - 6px);padding:6px 10px;transition:background-color .25s ease,color .25s ease,border-color .25s ease}@media (max-width: 480px){.realtime-clock{gap:6px;padding:5px 9px}}.analog-clock{display:inline-block;padding:8px;margin-top:8px;background:var(--card);border:1px solid var(--border);border-radius:calc(var(--radius) - 6px)}@media (max-width: 480px){.analog-clock{padding:6px}}#root{margin:0;padding:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}
