html{height:100%;overflow:hidden;background-color:#000}body{height:100%;margin:0;overflow:hidden;font-family:system-ui,sans-serif}html,body{touch-action:none}html.light,html.light body{background-color:#fafafa}.layout{display:flex;flex-direction:row;height:100%;width:100%;overflow:hidden}#app{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:20px;box-sizing:border-box}.top-bar{position:absolute;top:16px;right:16px;left:auto;z-index:10;display:flex;align-items:center;gap:8px}.menu-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border-radius:8px;border:1px solid rgba(255,255,255,.2);cursor:pointer;transition:background .2s,color .2s}.menu-btn--hidden{display:none!important}.layout--sidebar-open .menu-btn{display:none}body:not(.light) .menu-btn{background:#222;color:#eee}body:not(.light) .menu-btn:hover{background:#333}body.light .menu-btn{background:#fff;color:#333;border-color:#00000026}body.light .menu-btn:hover{background:#f0f0f0}.sidebar{position:relative;z-index:20;width:0;height:100%;overflow:hidden;flex-shrink:0;transition:width .25s ease}.sidebar--open{width:380px}.sidebar__inner{width:380px;height:100%;padding:16px;overflow-y:auto;box-sizing:border-box}body:not(.light) .sidebar__inner{background:#111;color:#eee;border-left:1px solid rgba(255,255,255,.1)}body.light .sidebar__inner{background:#fff;color:#333;border-left:1px solid rgba(0,0,0,.1)}.sidebar__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.4)}body.light .sidebar__header{border-bottom-color:#00000026}.sidebar__title{margin:0;font-size:1.5rem;font-weight:600}.sidebar-close-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;margin:-8px -8px -8px auto;border:none;border-radius:8px;background:transparent;color:inherit;cursor:pointer;transition:background .2s;-webkit-tap-highlight-color:transparent}.sidebar-close-btn:hover{background:#80808033}.sidebar__description{margin-top:20px;padding-top:16px;border-top:1px solid rgba(255,255,255,.4);opacity:.8}body.light .sidebar__description{border-top-color:#00000026}.sidebar__description p{margin:0 0 12px;font-size:.875rem;line-height:1.6}.sidebar__description p:last-child{margin-bottom:0}.sidebar__divider{border:none;border-top:1px solid rgba(255,255,255,.4);margin:20px 0}body.light .sidebar__divider{border-top-color:#00000026}.sidebar__section-title{margin:0 0 12px;font-size:1rem;font-weight:600}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;z-index:15;pointer-events:none;opacity:0;transition:opacity .25s ease}@media(max-width:600px){.sidebar-overlay{display:block}.sidebar-overlay--visible{pointer-events:auto;opacity:1}html:has(.layout--sidebar-open),body:has(.layout--sidebar-open){overflow:hidden;touch-action:none}}.clocks-row{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:80px;flex:1;min-width:0}.clocks{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,auto);gap:12px;justify-items:center;align-items:start}@media(max-width:600px){html,body{overflow-y:auto;overflow-x:hidden;min-height:100%;height:auto;touch-action:pan-y}.layout{overflow:visible;min-height:100%;height:auto}#app{min-height:100%;height:auto;justify-content:flex-start;padding-bottom:40px}.sidebar,.sidebar__inner{height:100vh;height:100dvh}.clocks-row{flex:0 0 auto}.clocks,.clocks.clocks--ipad{grid-template-columns:1fr;grid-template-rows:auto}}.controls-column{display:none;flex-direction:column;align-items:center;gap:56px}.controls-column--visible{display:flex}.scheme-btn-group{display:flex;flex-direction:column;align-items:stretch;padding:8px;border-radius:999px;background:#3c3c435c;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);gap:6px;min-width:100px}body.light .scheme-btn-group{background:#78788033}.scheme-btn{min-width:0;padding:20px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;font-size:.85rem;font-weight:500;color:#ffffffe6;background:transparent;transition:background .25s ease,color .25s ease;outline:none;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none}.scheme-btn:focus{outline:none}.scheme-btn:active{background:transparent}.scheme-btn:first-child{border-radius:999px 999px 12px 12px}.scheme-btn:last-child{border-radius:12px 12px 999px 999px}.scheme-btn:only-child{border-radius:999px}.scheme-btn:not(:first-child):not(:last-child){border-radius:12px}body.light .scheme-btn{color:#3c3c43e6}.scheme-btn:hover:not(.scheme-btn--active){background:#ffffff14}body.light .scheme-btn:hover:not(.scheme-btn--active){background:#0000000f}.scheme-btn--active,body.light .scheme-btn--active{color:#fff}.scheme-btn__icon-wrap{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:48px;height:48px;border-radius:50%;transition:background .25s ease}.scheme-btn--active .scheme-btn__icon-wrap{background:#007aff}.scheme-btn__icon{flex-shrink:0}.scheme-btn__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.theme-btn-group{display:flex;flex-direction:column;align-items:stretch;padding:8px;border-radius:999px;background:#3c3c435c;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);gap:6px;min-width:100px}body.light .theme-btn-group{background:#78788033}.theme-btn{min-width:0;padding:20px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;font-size:.85rem;font-weight:500;color:#ffffffe6;background:transparent;transition:background .25s ease,color .25s ease;outline:none;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none}.theme-btn:focus{outline:none}.theme-btn:active{background:transparent}.theme-btn:first-child{border-radius:999px 999px 12px 12px}.theme-btn:last-child{border-radius:12px 12px 999px 999px}.theme-btn:only-child{border-radius:999px}.theme-btn:not(:first-child):not(:last-child){border-radius:12px}body.light .theme-btn{color:#3c3c43e6}.theme-btn:hover:not(.theme-btn--active){background:#ffffff14}body.light .theme-btn:hover:not(.theme-btn--active){background:#0000000f}.theme-btn--active,body.light .theme-btn--active{color:#fff}.theme-btn__icon-wrap{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:48px;height:48px;border-radius:50%;transition:background .25s ease}.theme-btn--active .theme-btn__icon-wrap{background:#007aff}.theme-btn__icon{flex-shrink:0}.theme-btn__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.clocks--ipad{grid-template-columns:repeat(2,1fr);gap:0px}body:not(.light) .controls{background:transparent;color:#eee}body.light .controls{background:transparent;color:#333}.control-row{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;margin-bottom:12px}.control-legend{font-weight:600;margin-right:12px;flex-shrink:0;font-size:.75rem}.controls label{display:inline-flex;align-items:center;gap:6px;margin-right:12px;cursor:pointer;font-size:.75rem;white-space:nowrap}.controls{width:100%;padding:0;font-size:.75rem}@media(max-width:600px){.control-legend,.controls label{font-size:.7rem}.control-row{margin-bottom:10px}.control-legend{margin-right:8px}.controls label{margin-right:8px;gap:4px}}