.hours-page { background: #f7f8fc; color: #30394f; }
.hours-page a { text-decoration: none; }
.hours-shell { min-height: 100dvh; }
.hours-sidebar { position: fixed; width: 232px; inset: 0 auto 0 0; background: #fff; border-right: 1px solid #e8ebf3; padding: 30px 18px 22px; display: flex; flex-direction: column; z-index: 5; }
.hours-sidebar .brand { margin: 0 12px 45px; }
.hours-sidebar .workspace-label { padding-left: 14px; }
.hours-sidebar nav { display: grid; gap: 7px; margin-top: 6px; }
.hours-sidebar nav a { color: #8490a6; padding: 12px 14px; display: flex; align-items: center; gap: 12px; border-radius: 8px; font-size: var(--font-action); }
.hours-sidebar nav a:hover { background: #f7f8fc; }
.hours-sidebar nav a.active { background: #edf0fc; color: #475bca; font-weight: 600; }
.calendar-bridge { margin: 34px 5px 20px; padding: 16px 11px; border: 1px solid #e9edf5; border-radius: 10px; display: flex; align-items: center; gap: 10px; color: #697dc4; background: #fafbff; }
.calendar-bridge strong, .calendar-bridge small { display: block; }
.calendar-bridge strong { font-size: var(--font-body); font-weight: 600; }
.calendar-bridge small { font-size: var(--font-small); color: #98a3b9; margin-top: 3px; }
.calendar-bridge > svg:last-child { margin-left: auto; }
.hours-sidebar-bottom { margin-top: auto; border-top: 1px solid #eef0f5; padding: 22px 4px 0; display: flex; align-items: center; gap: 9px; }
.hours-sidebar-bottom strong { font-size: var(--font-secondary); font-weight: 500; display: block; }
.hours-sidebar-bottom small { font-size: var(--font-small); color: #9da7b9; display: block; }
.hours-sidebar-bottom button { margin-left: auto; }
.hours-main { margin-left: 232px; }
.hours-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 66px; padding: 0 36px; border-bottom: 1px solid #e8ebf3; background: #fff; font-size: var(--font-secondary); color: #8d98ac; }
.hours-topbar b { margin: 0 15px; color: #d1d6e1; font-weight: 400; }
.hours-topbar strong { font-weight: 500; color: #637089; }
.hours-topbar > div { display: flex; align-items: center; gap: 22px; }
.hours-sync { color: #6b9a86; font-size: var(--font-caption); }
.hours-sync::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: currentColor; margin-right: 6px; vertical-align: 2px; }
.mobile-calendar { display: none; }
.hours-mobile-logout { display: none; }
.hours-content { max-width: 1580px; margin: auto; padding: 36px 36px 18px; }
.hours-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.hours-heading .eyebrow { font-size: var(--font-small); letter-spacing: 1.5px; }
.hours-heading h1 { font-size: 30px; margin: 6px 0 7px; font-weight: 600; letter-spacing: -.6px; }
.hours-heading p { font-size: var(--font-secondary); color: #939eb2; margin: 0; }
.hours-page .button { font-size: var(--font-action); min-height: 37px; }
.period-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 24px; }
.period-presets { display: flex; border: 1px solid #e5e9f3; padding: 3px; background: white; border-radius: 7px; }
.period-presets button { border: none; border-radius: 4px; background: transparent; color: #8491aa; font-size: var(--font-action); padding: 5px 15px; }
.period-presets button:hover, .period-presets button:focus { background: #eef1fb; color: #475bca; }
.period-fields { display: flex; align-items: center; gap: 10px; font-size: var(--font-secondary); color: #98a2b5; }
.period-fields label { display: flex; gap: 10px; align-items: center; }
.period-fields input { min-height: 34px; padding: 5px 8px; font-size: 16px; color: #69758e; }
.period-fields .button { min-height: 34px; padding: 5px 13px; }
.metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; margin-bottom: 24px; }
.metric { background: white; border: 1px solid #e7ebf4; border-radius: 11px; padding: 20px 22px; }
.metric > div { display: flex; justify-content: space-between; align-items: center; font-size: var(--font-secondary); color: #8893a9; }
.metric-icon { width: 31px; height: 31px; border-radius: 8px; display: grid; place-items: center; background: #eff2ff; color: #7284d2; font-style: normal; }
.metric-icon.amber { background: #fff6e8; color: #c79b53; }.metric-icon.green, .exchange-icon.green { background: #edf7f2; color: #71a18b; }.metric-icon.lavender { background: #f3f0fc; color: #9c8bc4; }
.metric > strong { display: block; font-size: clamp(22px,2.3vw,32px); font-weight: 600; margin: 8px 0 6px; letter-spacing: -.6px; font-variant-numeric: tabular-nums; }
.metric strong small { font-size: var(--font-secondary); color: #99a4b8; font-weight: 400; margin-left: 7px; letter-spacing: 0; }
.metric > p { color: #a0a9bb; font-size: var(--font-small); margin: 0; }
.analysis-grid { display: grid; grid-template-columns: 1.7fr 1fr; gap: 22px; margin-bottom: 24px; }
.hours-panel { background: #fff; border: 1px solid #e7ebf4; border-radius: 11px; overflow: hidden; min-width: 0; }
.panel-heading { padding: 22px 24px 16px; display: flex; justify-content: space-between; align-items: center; gap: 15px; }
.panel-heading h2 { font-size: 20px; font-weight: 600; margin: 0; color: #485570; }
.panel-heading p { color: #9aa5b9; font-size: var(--font-caption); margin: 5px 0 0; }
.panel-heading > svg { color: #a1aec5; }
.panel-heading .text-button { font-size: var(--font-action); white-space: nowrap; }
.chart-legend { display: flex; gap: 13px; font-size: var(--font-small); color: #98a3b7; }
.chart-legend span { display: flex; align-items: center; gap: 5px; }.chart-legend i { height: 7px; width: 7px; background: #e4e8f8; border-radius: 2px; }.chart-legend span:last-child i { background: #8293dc; }
.bar-chart { height: 235px; padding: 15px 24px 25px; display: flex; gap: 15px; }
.chart-scale { width: 25px; display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 27px; color: #a8b2c3; font-size: var(--font-small); }
.chart-bars { display: flex; flex: 1; gap: 12px; overflow-x: auto; background: repeating-linear-gradient(to top, transparent 0, transparent calc(50% - 1px), #f0f2f8 calc(50% - 1px), #f0f2f8 50%); }
.chart-column { flex: 1; min-width: 24px; max-width: 70px; display: flex; flex-direction: column; justify-content: flex-end; }
.bar-pair { height: 100%; display: flex; justify-content: center; align-items: flex-end; gap: 3px; }
.bar-pair span { width: 35%; max-width: 20px; background: #e5e9f8; border-radius: 3px 3px 0 0; min-height: 0; }.bar-pair span:last-child { background: #8293dc; }
.chart-column small { flex-shrink: 0; height: 27px; padding-top: 10px; text-align: center; font-size: var(--font-small); color: #9ba7bc; background: white; }
.institution-ranking { padding: 4px 24px 22px; }.ranking-item + .ranking-item { margin-top: 13px; }.ranking-item > div:first-child { display: flex; justify-content: space-between; gap: 10px; font-size: var(--font-body); }.ranking-item b { color: #b0b8ca; font-size: var(--font-small); margin-right: 9px; font-weight: 400; }.ranking-item strong { font-weight: 500; color: #6d7ba5; white-space: nowrap; }.ranking-item small { color: #a3aec0; font-size: var(--font-small); font-weight: 400; }.ranking-track { height: 5px; background: #f2f4f9; border-radius: 4px; margin: 7px 0 2px; overflow: hidden; }.ranking-track i { height: 100%; background: #99a8df; display: block; border-radius: inherit; }
.count-pill { color: #8290bd; background: #eff2fb; border-radius: 5px; font-size: var(--font-small); padding: 2px 6px; margin-left: 4px; }
.pending-list { padding: 0 24px 6px; }.pending-row { display: flex; gap: 18px; align-items: center; padding: 17px 0; border-top: 1px solid #eff1f6; }.lesson-date { flex-shrink: 0; width: 42px; height: 45px; border: 1px solid #eaedf5; background: #fafbfe; border-radius: 7px; text-align: center; }.lesson-date strong { display: block; color: #7c8bad; font-size: 18px; line-height: 25px; font-weight: 500; }.lesson-date small { display: block; color: #a9b1c1; font-size: var(--font-small); }.pending-title { flex: 1; min-width: 0; }.pending-title strong { font-size: var(--font-body); font-weight: 500; color: #5f6c86; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.pending-title small { color: #a0aabd; font-size: var(--font-secondary); display: block; margin-top: 4px; }.pending-duration { color: #8b98af; font-size: var(--font-caption); }.row-actions { display: flex; gap: 14px; white-space: nowrap; }.row-actions .text-button { font-size: var(--font-action); }.text-button.muted { color: #99a4b9; }
.status-tag { display: inline-flex; align-items: center; gap: 5px; font-size: var(--font-small); padding: 3px 8px; border-radius: 5px; white-space: nowrap; }.status-tag i { width: 4px; height: 4px; border-radius: 50%; background: currentColor; }.status-tag.pending { background: #f3f4f8; color: #99a3b7; }.status-tag.completed { background: #eef2ff; color: #7a8cc5; }.status-tag.paid { background: #edf7f2; color: #79a68f; }
.hours-empty { text-align: center; color: #9ba7bd; padding: 42px 20px; font-size: var(--font-body); }.empty-symbol { color: #a6b3d9; margin-bottom: 12px; }.hours-empty h3 { font-size: var(--font-body); color: #8a98b0; font-weight: 500; margin: 5px 0 9px; }.hours-empty p { font-size: var(--font-caption); margin: 5px 0 15px; }.trend-panel .hours-empty { padding: 42px 20px 55px; }
.ledger-filters { padding: 20px 24px; border-bottom: 1px solid #edf0f6; }.status-tabs { display: flex; gap: 9px; margin-bottom: 18px; }.status-tabs button { border: 0; background: none; padding: 6px 12px; font-size: var(--font-action); color: #8f9bb2; border-radius: 6px; }.status-tabs button.active { color: #5269c2; background: #eef1fc; }.status-tabs b { font-weight: 400; font-size: var(--font-small); margin-left: 5px; opacity: .7; }.ledger-tools { display: flex; align-items: center; gap: 12px; }.search-field { display: flex; align-items: center; color: #9aa7c0; position: relative; flex: 1; }.search-field svg { position: absolute; left: 11px; }.search-field input { padding-left: 34px; width: 100%; }.ledger-tools input,.ledger-tools select { font-size: 16px; min-height: 36px; }.ledger-tools select { max-width: 200px; }.ledger-summary { display: flex; gap: 24px; flex-wrap: wrap; background: #fafbfe; padding: 12px 24px; font-size: var(--font-caption); color: #98a4b9; border-bottom: 1px solid #edf0f6; }.ledger-summary strong { font-weight: 500; color: #7282a8; margin: 0 4px; }.hours-table-wrap { overflow-x: auto; }.hours-table { border-collapse: collapse; width: 100%; min-width: 830px; text-align: left; }.hours-table th { font-size: var(--font-small); color: #9aa5b9; font-weight: 500; background: #fdfdff; padding: 13px 20px; border-bottom: 1px solid #eef1f6; }.hours-table td { padding: 19px 20px; font-size: var(--font-body); color: #7b89a3; border-bottom: 1px solid #eff1f6; }.hours-table td:first-child { max-width: 240px; overflow-wrap: anywhere; }.hours-table td strong { color: #586783; font-size: var(--font-body); font-weight: 500; }.hours-table small { display: block; font-size: var(--font-secondary); margin-top: 5px; color: #9ea9bd; }.hours-table a { color: #7183b8; }.hours-table tr:last-child td { border-bottom: none; }.table-pagination { display: flex; align-items: center; justify-content: space-between; padding: 17px 24px; border-top: 1px solid #eef1f6; color: #98a5bb; font-size: var(--font-small); gap: 10px; }.table-pagination > div { display: flex; align-items: center; gap: 14px; }.table-pagination .button { font-size: var(--font-action); min-height: 29px; padding: 4px 10px; }
.institution-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; font-size: var(--font-secondary); color: #94a1b8; }.institution-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }.institution-card { padding: 24px; }.institution-card.archived { background: #fbfcfe; }.institution-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }.org-avatar { width: 44px; height: 44px; border-radius: 10px; background: #eff2fb; color: #8a9bd1; display: grid; place-items: center; font-size: 19px; }.org-state { color: #87a593; background: #f0f7f3; padding: 3px 8px; font-size: var(--font-small); border-radius: 4px; }.archived .org-state { background: #f0f1f5; color: #9aa2b3; }.institution-card h2 { font-size: 20px; color: #64728e; margin: 0 0 7px; overflow-wrap: anywhere; }.institution-card p { color: #a0aabd; font-size: var(--font-body); overflow-wrap: anywhere; }.institution-price { border-top: 1px solid #edf0f6; margin-top: 20px; padding-top: 16px; }.institution-price > span { display: block; color: #a2adbf; font-size: var(--font-caption); }.institution-price strong { color: #7182aa; font-size: 24px; font-weight: 500; }.institution-price small { font-size: var(--font-small); font-weight: 400; color: #a5b0c2; }.institution-note { min-height: 38px; white-space: pre-wrap; }.institution-card > .button { width: 100%; margin-top: 8px; justify-content: space-between; }
.exchange-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }.exchange-card { padding: 28px; }.exchange-icon { width: 50px; height: 50px; display: grid; place-items: center; color: #8798d6; background: #eff2fd; border-radius: 12px; margin-bottom: 21px; }.exchange-card h2 { font-size: 22px; font-weight: 500; margin: 0; color: #5e6d88; }.exchange-card > p { color: #9aa6bc; font-size: var(--font-secondary); line-height: 1.9; margin: 10px 0 22px; }.import-drop { display: flex; align-items: center; flex-direction: column; padding: 25px; border: 1px dashed #cbd4e8; border-radius: 9px; background: #fafbff; color: #98a7cc; cursor: pointer; position: relative; }.import-drop strong { font-size: var(--font-body); font-weight: 500; margin-top: 10px; color: #788bbc; }.import-drop span { font-size: var(--font-small); margin-top: 5px; }.import-drop input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }.import-drop:focus-within { outline: 2px solid #768acc; }.exchange-card > .text-button { font-size: var(--font-action); margin-top: 14px; }.import-notes { margin-top: 23px; border-top: 1px solid #edf0f6; padding-top: 12px; font-size: var(--font-caption); color: #9aa7bd; }.export-count { padding: 25px 22px; background: #f8fafc; border: 1px solid #edf1f6; border-radius: 9px; margin-bottom: 24px; }.export-count strong { display: block; color: #6f80a1; font-size: 34px; font-weight: 500; }.export-count small { font-size: var(--font-secondary); font-weight: 400; color: #9cabc0; margin-left: 9px; }.export-count > span { color: #9faec3; font-size: var(--font-secondary); }.exchange-card > .full { margin-bottom: 11px; justify-content: space-between; }.exchange-card .export-note { font-size: var(--font-caption); margin-bottom: 0; }.import-preview { margin-top: 24px; }.import-preview-rows { padding: 0 24px 20px; }.import-preview-rows > div { display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: var(--font-body); padding: 14px 0; border-top: 1px solid #edf0f6; color: #8b99b1; }.import-preview-rows strong { font-weight: 500; color: #657795; flex: 1; }.import-preview > .form-error { margin: 0 24px 20px; }.import-result { display: flex; align-items: center; gap: 14px; padding: 25px; color: #74a48e; }.import-result h2 { font-size: 17px; margin: 0; font-weight: 500; }.import-result p { font-size: var(--font-secondary); margin-bottom: 0; }
.hours-footer { display: flex; justify-content: space-between; color: #acb5c6; font-size: var(--font-small); padding: 27px 2px 10px; gap: 12px; }.hours-error { display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid #f0d5c5; color: #b17f66; background: #fff6f0; padding: 12px 16px; border-radius: 7px; margin-bottom: 20px; font-size: var(--font-body); }.hours-stale { opacity: .55; pointer-events: none; }.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.hours-login { min-height: 100dvh; max-width: 1200px; padding: 45px 55px; margin: auto; }.hours-login-layout { display: grid; grid-template-columns: 1fr 420px; align-items: center; gap: 70px; min-height: 70vh; }.hours-login-story h1 { font-size: 43px; font-weight: 500; line-height: 1.45; letter-spacing: -.7px; margin: 16px 0 22px; color: #475675; }.hours-login-story p { font-size: 16px; color: #99a5bc; line-height: 2; }.login-steps { display: flex; align-items: center; gap: 13px; margin-top: 38px; color: #a4b0c9; font-size: var(--font-caption); }.login-steps span { display: flex; align-items: center; gap: 6px; }.login-steps b { font-weight: 400; }.hours-login-footer { color: #aab5c8; font-size: var(--font-secondary); text-align: center; }.hours-page .login-card { width: auto; }
.lesson-dialog .spaced { margin: 20px 0; }.lesson-report { background: #f5f7fe; border: 1px solid #e5eaf7; border-radius: 9px; padding: 15px; margin: 20px 0; }.lesson-estimate { color: #8596bf; font-size: var(--font-secondary); margin: 12px 0 4px; }.lesson-report .text-button { font-size: var(--font-action); }.undo-warning { color: #b8845e; background: #fff7eb; border-radius: 6px; padding: 11px; font-size: var(--font-secondary); }
@media(max-width:1150px) { .hours-sidebar { width: 208px; }.hours-main { margin-left: 208px; }.hours-content { padding: 27px 22px 16px; }.hours-topbar { padding: 0 22px; }.metric-grid { gap: 12px; }.metric { padding: 16px; }.analysis-grid { grid-template-columns: 1.4fr 1fr; gap: 16px; }.institution-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.pending-row { gap: 12px; }.pending-duration { display: none; }.period-fields { gap: 6px; }.hours-login-layout { gap: 40px; } }
@media(max-width:850px) { .hours-sidebar { width: 180px; padding: 24px 10px; }.hours-sidebar .brand { margin-left: 10px; }.hours-main { margin-left: 180px; }.hours-sidebar nav a { font-size: var(--font-action); gap: 8px; }.calendar-bridge { padding: 12px 8px; gap: 7px; }.calendar-bridge small { display: none; }.hours-sidebar-bottom strong { font-size: var(--font-small); }.metric-grid { grid-template-columns: 1fr 1fr; }.analysis-grid,.exchange-grid { grid-template-columns: 1fr; }.hours-heading { align-items: flex-start; }.zone-label { display: none; }.institution-ranking { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.ranking-item + .ranking-item { margin: 0; }.pending-row > .status-tag { display: none; }.hours-login { padding: 30px; }.hours-login-layout { grid-template-columns: 1fr 360px; gap: 25px; }.hours-login-story h1 { font-size: 30px; }.login-steps { flex-direction: column; align-items: flex-start; gap: 10px; }.login-steps b { display: none; } }
@media(max-width:700px) { .hours-sidebar { position: static; width: auto; padding: 16px 18px 0; border-right: 0; border-bottom: 1px solid #e7ebf4; }.hours-sidebar > .brand { margin: 0 0 14px; }.hours-sidebar .workspace-label,.calendar-bridge,.hours-sidebar-bottom { display: none; }.hours-sidebar nav { display: flex; justify-content: space-between; gap: 4px; margin: 0 0 9px; }.hours-sidebar nav a { gap: 5px; padding: 8px; font-size: var(--font-action); }.hours-sidebar nav svg { width: 15px; height: 15px; }.hours-main { margin: 0; }.hours-topbar { min-height: 43px; padding: 0 18px; font-size: var(--font-secondary); }.hours-topbar b { margin: 0 7px; }.hours-topbar > div { gap: 13px; }.mobile-calendar { display: inline; color: #7c90c3; }.hours-content { padding: 23px 16px 12px; }.hours-heading { gap: 10px; margin-bottom: 22px; }.hours-heading .eyebrow { font-size: var(--font-small); letter-spacing: .6px; }.hours-heading h1 { font-size: 22px; }.hours-heading p { font-size: var(--font-secondary); max-width: 250px; line-height: 1.9; }.hours-heading > button { font-size: var(--font-action); white-space: nowrap; padding: 7px 10px; min-height: 33px; margin-top: 23px; }.hours-heading > button svg { width: 14px; }.period-bar { gap: 12px; }.period-fields { width: 100%; flex-wrap: wrap; gap: 6px; }.period-fields label { font-size: var(--font-small); gap: 6px; }.period-fields input { font-size: 16px; width: 136px; padding: 5px; }.period-fields label:first-child { font-size: 0; gap: 0; }.metric-grid { gap: 10px; margin-bottom: 16px; }.metric { padding: 15px 13px; }.metric > div { font-size: var(--font-secondary); }.metric > strong { font-size: 25px; margin: 10px 0; }.metric > p { font-size: var(--font-small); }.metric-icon { width: 27px; height: 27px; }.analysis-grid { margin-bottom: 16px; }.panel-heading { padding: 19px 17px 14px; }.panel-heading h2 { font-size: 16px; }.panel-heading p { font-size: var(--font-caption); }.panel-heading .text-button { font-size: var(--font-action); }.institution-ranking { padding: 0 17px 20px; grid-template-columns: 1fr; }.bar-chart { padding: 10px 17px 20px; height: 215px; }.pending-list { padding: 0 17px 5px; }.pending-row { flex-wrap: wrap; gap: 10px; padding: 15px 0; }.pending-title { min-width: 140px; }.pending-row .row-actions { gap: 10px; margin-left: auto; }.pending-title small { font-size: var(--font-secondary); }.lesson-date { width: 35px; }.row-actions .text-button { font-size: var(--font-action); }.ledger-filters { padding: 16px 14px; }.status-tabs { gap: 1px; justify-content: space-between; }.status-tabs button { padding: 6px 7px; font-size: var(--font-action); }.status-tabs b { margin-left: 3px; }.ledger-tools { flex-wrap: wrap; gap: 8px; }.search-field { flex-basis: 100%; }.ledger-tools select { flex: 1; max-width: none; }.ledger-summary { padding: 12px 14px; gap: 8px 18px; }.table-pagination { padding: 13px; }.institution-grid { grid-template-columns: 1fr; }.institution-card { padding: 22px; }.exchange-card { padding: 22px; }.import-preview-rows > div { flex-wrap: wrap; }.hours-footer { font-size: var(--font-small); }.hours-login { padding: 26px 20px; }.hours-login-layout { display: block; min-height: auto; }.hours-login-story { padding: 36px 2px 28px; }.hours-login-story h1 { font-size: 32px; margin: 10px 0 16px; }.hours-login-story p { font-size: var(--font-body); }.hours-login-story .eyebrow { font-size: var(--font-small); }.login-steps { display: none; }.hours-login-footer { margin-top: 30px; }.hours-page .dialog-footer { flex-wrap: wrap; }.lesson-dialog .form-row { grid-template-columns: 1fr; }.lesson-dialog .form-row .field + .field { margin-top: 14px; } }

@media(max-width:700px) { .hours-sidebar nav a { flex:1; flex-direction:column; gap:5px; white-space:nowrap; font-size: var(--font-action); padding:9px 4px; } .hours-sidebar nav svg { width:17px; height:17px; } .hours-heading { display:block; } .hours-heading h1 { font-size: 22px; line-height:1.5; } .hours-heading p { max-width:none; } .hours-heading > button { margin-top:14px; min-height:36px; } .hours-topbar > div { gap:9px; } .hours-mobile-logout { display:inline-flex; width:25px; height:28px; } }