@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@600;700&display=swap";html,body{margin:0;padding:0;font-family:Inter,Arial,sans-serif;background-color:#fff}.hidden{display:none}qmates-timer-app,landing-page,timer-page{display:block;width:100%;height:100%}.container{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;flex-direction:column}.row{display:flex;justify-content:center;align-items:center;flex-direction:row}.container>.row{padding-bottom:4rem}.landing-content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 24px 48px;min-height:calc(100vh - 200px);gap:48px}timer-display{color:#1a0a2e;font-size:5.5rem;-webkit-user-select:none;user-select:none}stop-timer-button,toggle-pause-button{background-color:#f5f3ff;color:#7b3aec;border:3px solid #DDD6FE;width:5rem;height:5rem;font-size:2rem;border-radius:50%;margin:1rem;transition:transform .2s,background-color .2s,border-color .2s,color .2s;cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;justify-content:center;align-items:center;line-height:5rem;text-align:center}:is(stop-timer-button,toggle-pause-button):hover{border-color:#7b3aec;color:#fff;background-color:#7b3aec;transform:scale(1.1);transition:transform .2s}:is(stop-timer-button,toggle-pause-button).playing{text-indent:.3rem}start-timer-button{background-color:#7b3aec;color:#fff;border:5px solid #DDD6FE;display:flex;justify-content:center;align-items:center;margin:1.5rem;transition:transform .2s,background-color .2s,border-color .2s;cursor:pointer;-webkit-user-select:none;user-select:none}start-timer-button:hover{border-color:#7b3aec;background-color:#6025d2;transform:scale(1.2);transition:transform .2s}start-timer-button.small{width:8rem;height:8rem;font-size:3.5rem;border-radius:5rem}start-timer-button.medium{width:10rem;height:10rem;font-size:4.3rem;border-radius:6rem}start-timer-button.large{width:13rem;height:13rem;font-size:5.5rem;border-radius:9rem}.logo-name{font-weight:800;font-size:18px;color:#1a0a2e;letter-spacing:-.03em;white-space:nowrap}top-bar{position:fixed;top:0;left:0;right:0;z-index:1000;display:block;background:#fff}start-timer-buttons{padding-bottom:4rem}connected-users{display:block}timer-sounds{display:none}sound-toggle{position:relative;display:inline-block}body{font-family:Inter,sans-serif}:root{--qm-purple: #7B3AEC;--qm-blue: #3B82F6;--qm-purple-light: #F5F3FF;--qm-purple-border: #DDD6FE;--qm-blue-light: #EFF6FF;--qm-blue-border: #BFDBFE;--qm-ink: #1A0A2E;--qm-muted: #AAA;--qm-surface: #FAFAFA;--qm-border: #E5E7EB;--qm-hover: #EAEAEC;--qm-green: #10B981;--qm-red: #EF4444;--qm-font: "Inter", sans-serif;--qm-font-mono: "JetBrains Mono", monospace;--qm-radius-pill: 999px;--qm-radius-card: 20px;--qm-radius-sm: 10px;--qm-gradient: linear-gradient(100deg, #7B3AEC 10%, #3B82F6 70%);--qm-gradient-text: linear-gradient(100deg, #7B3AEC 30%, #3B82F6)}.qm-grad{background:var(--qm-gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}