/* TM다움 admin home, scoped under .ad (page headings become .hr-h1/.hr-h2 so the homepage keeps one h1): rules copied from tm-daum-mono design/admin-prototype (admin.css, home-roles.css) that the branch-manager home uses. */
.ad{--primary-red: #ef4444; --red-tint: rgba(239, 68, 68, 0.05); --primary-blue: #2d80ff; --blue-tint: rgba(64, 139, 255, 0.1); --sky-blue: rgba(64, 139, 255, 0.05); --mint: #24cea7; --mint-tint: rgba(36, 206, 167, 0.1); --purple: #4c24ce; --purple-tint: rgba(76, 36, 206, 0.1); --gray-100: #031832; --gray-70: rgba(3, 24, 50, 0.7); --gray-46: rgba(3, 24, 50, 0.46); --gray-28: rgba(3, 24, 50, 0.28); --gray-18: rgba(3, 24, 50, 0.18); --gray-5: rgba(3, 24, 50, 0.05); --background: #f4f6f9; --white: #fff; --black: #000; --chart-1: #4e9eff; --chart-1-tint: rgba(78, 158, 255, 0.2); --chart-2: #75dcff; --chart-2-tint: rgba(117, 220, 255, 0.2); --chart-3: #009eff; --chart-3-tint: rgba(0, 158, 255, 0.2); --chart-4: #00b4ba; --chart-4-tint: rgba(0, 180, 186, 0.2); --focus-ring: rgba(45, 128, 255, 0.35); --font-sans: Pretendard, "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --text-page-title: 600 23px/1.4 var(--font-sans); --text-section-title: 700 20px/1.4 var(--font-sans); --text-card-title: 600 18px/1.4 var(--font-sans); --text-label: 600 16px/1.5 var(--font-sans); --text-body: 500 16px/1.5 var(--font-sans); --text-caption: 500 14px/1.5 var(--font-sans); --canvas: var(--background); --surface: var(--white); --text: var(--gray-100); --secondary: var(--gray-70); --muted: var(--gray-46); --primary: var(--primary-blue); --chart: var(--chart-1); --primary-light: var(--blue-tint); --border: var(--gray-18); --danger: var(--primary-red); color: var(--text); background: var(--canvas); font-family: var(--font-sans); font-synthesis: none;}
.ad, .ad *{box-sizing: border-box;}
.ad, .ad{min-width: 1240px; min-height: 100%; background: var(--canvas);}
.ad{font: var(--text-body); margin: 0;}
.ad button, .ad input, .ad select{font: inherit;}
.ad a{color: inherit;}
.ad :where(a:not([aria-disabled="true"]), .ad button:not(:disabled):not([aria-disabled="true"]), .ad summary){transition: opacity 80ms ease, transform 80ms ease;}
.ad :where(.hr-tabs button, .hr-idle a):active{opacity: 0.82; transform: scale(0.98); transition-duration: 0s;}
.ad .visually-hidden{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;}
.ad .admin-shell{display: grid; grid-template-columns: 200px minmax(1040px, 1fr); min-height: 100dvh; align-items: stretch;}
.ad .admin-sidebar{position: sticky; top: 0; display: flex; height: 100dvh; padding: 24px 12px 16px; align-self: start; flex-direction: column; justify-content: space-between; gap: 16px; border-right: 1px solid var(--border); background: var(--surface);}
.ad .admin-sidebar > div:first-child{display: flex; min-height: 0; flex-direction: column;}
.ad .admin-logo{display: flex; width: 112px; height: 32px; padding-left: 12px; align-items: center;}
.ad .admin-logo img{display: block; width: 67px; height: 20px;}
.ad .admin-nav{display: grid; min-height: 0; margin: 24px -4px 0; padding: 0 4px; align-content: start; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--gray-18) transparent;}
.ad .admin-nav a{font: var(--text-caption); display: flex; min-height: 40px; padding: 8px 12px; align-items: center; gap: 10px; border-radius: 8px; color: var(--gray-70); text-decoration: none; transition: background-color 120ms ease, color 120ms ease;}

.ad .admin-nav a.is-active{background: var(--blue-tint); color: var(--primary); font-weight: 600;}
.ad .admin-nav a.admin-nav-primary{font: var(--text-label); font-size: 15px;}
.ad .admin-nav-practice{display: flex; min-width: 0; border-radius: 8px;}


.ad .admin-nav-practice > a{min-width: 0; flex: 1; white-space: nowrap;}
.ad .admin-nav-practice > button{display: grid; width: 32px; flex: none; place-items: center; margin: 4px 4px 4px 0; padding: 0; border: 0; border-radius: 6px; background: transparent; cursor: pointer;}

.ad .admin-nav-practice > button img{width: 14px; height: 14px; transition: transform 120ms ease;}
.ad .admin-nav-practice > button img.is-open{transform: rotate(180deg);}
.ad .admin-nav-units{display: grid; gap: 2px; min-width: 0; margin: 2px 0 6px 21px; padding-left: 9px; border-left: 1px solid var(--border);}
.ad .admin-nav .admin-nav-units a{display: block; min-width: 0; min-height: 34px; overflow: hidden; padding: 7px 10px; border-radius: 6px; color: var(--muted); text-overflow: ellipsis; white-space: nowrap;}

.ad .admin-nav a img{width: 20px; height: 20px; flex: none; object-position: 100px 0; background-color: currentColor; -webkit-mask: var(--nav-icon) center / contain no-repeat; mask: var(--nav-icon) center / contain no-repeat; opacity: .55; transition: opacity 120ms ease;}
.ad .admin-nav a img[src$="home.svg"]{--nav-icon: url("/assets/admin/home-mask.svg");}
.ad .admin-nav a img[src$="practice.svg"]{--nav-icon: url("/assets/admin/practice-mask.svg");}
.ad .admin-nav a img[src$="shortcut-analysis.svg"]{--nav-icon: url("/assets/admin/analysis-mask.svg");}
.ad .admin-nav a img[src$="shortcut-follow-reading.svg"]{--nav-icon: url("/assets/admin/follow-reading-mask.svg");}

.ad .admin-nav a.is-active img, .ad .admin-nav-practice.is-active > a img{opacity: 1;}
.ad .admin-nav-customer-group{display: grid; gap: 2px;}
.ad .admin-nav-tool-group{display: grid; gap: 2px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--gray-5);}
.ad .admin-nav-tool-heading{margin: 0 12px 6px; color: var(--muted); font: var(--text-caption); font-size: 12px; font-weight: 600; word-break: keep-all; overflow-wrap: anywhere;}
.ad .admin-nav-tool-group a{min-height: 36px; padding-top: 6px; padding-bottom: 6px;}
.ad .admin-account{position: relative; padding-top: 12px; border-top: 1px solid var(--gray-5);}
.ad .admin-account-summary{display: flex; min-width: 0; padding: 8px; align-items: center; gap: 10px; border-radius: 8px; cursor: pointer; list-style: none; transition: background-color 120ms ease;}

.ad .admin-account-summary::-webkit-details-marker{display: none;}
.ad .admin-account-summary img{flex: none;}
.ad .admin-account-text{display: flex; min-width: 0; flex-direction: column; gap: 0; color: var(--muted); font: var(--text-caption); font-size: 12px; line-height: 1.45;}
.ad .admin-account-text > *{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.ad .admin-account-text strong{margin-bottom: 1px; color: var(--text); font: var(--text-caption); font-weight: 600;}
.ad .admin-account-title{color: var(--gray-46);}
.ad .admin-account-menu{position: absolute; right: 0; bottom: calc(100% + 8px); width: 160px; padding: 4px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); box-shadow: 0 8px 24px var(--gray-18); z-index: 2;}
.ad .admin-account:not([open]) .admin-account-menu{display: none;}
.ad .admin-main{min-width: 1040px; padding: 0 40px; background: var(--canvas);}
.ad .admin-content{width: 960px; margin: 0 auto; padding: 40px 0;}
.ad .hr-h1, .ad .hr-h2, .ad p{margin-top: 0;}
.ad .dashboard-page{display: flex; flex-direction: column; gap: 40px;}
.ad .breadcrumb{font: var(--text-caption); display: flex; min-height: 32px; align-items: center; gap: 12px; color: var(--secondary);}
.ad .admin-signout{display: block; width: 100%; padding: 8px 12px; border: 0; border-radius: 4px; background: none; color: var(--text); text-align: left; font: var(--text-caption); cursor: pointer;}

@media (prefers-reduced-motion: reduce){
.ad :where(a:not([aria-disabled="true"]), .ad button:not(:disabled):not([aria-disabled="true"]), .ad summary){transition: none;}

}
.ad .home-roles{--hr-text-chart: 500 12px/1 var(--font-sans); --hr-inset: 20px; --hr-gutter: 16px; display: grid; gap: 40px; padding-bottom: 96px;}
.ad .visually-hidden{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;}
.ad .hr-scope{display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;}
.ad .hr-scope > div:first-child{display: grid; gap: 4px;}
.ad .hr-scope-path{color: var(--muted); font: var(--text-caption);}
.ad .hr-scope h1{margin: 0; font: var(--text-page-title);}
.ad .hr-scope p{margin: 0; color: var(--secondary); font: var(--text-caption);}
.ad .hr-scope-controls{display: flex; flex: none; align-items: center; gap: 12px; font: var(--text-caption);}
.ad .hr-company-select{display: flex; align-items: center; gap: 8px; color: var(--muted);}
.ad .hr-company-select select{width: 200px; min-height: 44px; padding: 8px 40px 8px 14px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface) url("/assets/admin/chevron-down.svg") right 14px center / 12px no-repeat; color: var(--text); font: var(--text-body); appearance: none; cursor: pointer;}
.ad .hr-company-select select:focus:not(:focus-visible){outline: none;}
.ad .hr-crumb{min-height: 0; gap: 8px; color: var(--muted); font: var(--text-body);}
.ad .hr-profile{display: grid; padding: 24px; grid-template-columns: 255px minmax(0, 1fr); align-items: center; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);}
.ad .hr-profile__who{min-width: 0; padding-right: 24px;}
.ad .hr-profile__who .hr-h1{display: flex; min-width: 0; margin: 0; align-items: baseline; gap: 8px; font: var(--text-page-title);}
.ad .hr-profile__kind{color: var(--muted); font: var(--text-label);}
.ad .hr-profile__info{display: grid; margin: 0; padding-left: 36px; grid-template-columns: 1fr 1fr; column-gap: 24px; border-left: 1px solid var(--border);}
.ad .hr-profile__info > div{display: flex; min-height: 46px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--gray-5);}
.ad .hr-profile__info dt{flex: none; color: var(--muted); font: var(--text-body);}
.ad .hr-profile__info dd{min-width: 0; margin: 0; overflow: hidden; font: var(--text-label); text-align: right; text-overflow: ellipsis; white-space: nowrap;}
.ad .hr-profile__sub{color: var(--secondary); font: var(--text-body);}
.ad .hr-profile__sub a{color: var(--primary); text-decoration: none;}
.ad .hr-section{display: grid; gap: 16px;}
.ad .hr-section-head{display: flex; align-items: baseline; justify-content: space-between; gap: 16px;}
.ad .hr-section-head .hr-h2{margin: 0; font: var(--text-section-title);}
.ad .hr-section-head p{margin: 0; color: var(--muted); font: var(--text-caption); text-align: right;}
.ad .hr-table-wrap{overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);}
.ad .hr-table{width: 100%; border-collapse: collapse; font: var(--text-caption);}
.ad .hr-table th, .ad .hr-table td{padding: 14px 16px; border-bottom: 1px solid var(--gray-5); text-align: left; vertical-align: middle;}
.ad .hr-table tbody tr:last-child > *{border-bottom: 0;}
.ad .hr-table tbody th{font-weight: 500;}
.ad .hr-table tbody th, .ad .hr-table tbody td{line-height: 1.4;}
.ad .hr-table td > strong{display: block; color: var(--text); font: var(--text-label);}
.ad .hr-table tr[data-href]{cursor: pointer;}
.ad .hr-table tr[data-href]:hover > *, .ad .hr-table tr[data-href]:focus-visible > *{background: var(--sky-blue);}
.ad .hr-org{display: block; color: var(--text); font: var(--text-label);}
.ad .hr-arrow{width: 24px; color: var(--muted); font: 600 20px/1 var(--font-sans); text-align: right;}
.ad .hr-people th:first-child{width: 24%;}
.ad .hr-people .hr-days{width: 196px; margin: 0 auto;}
.ad .hr-people th, .ad .hr-people td{padding: 14px 12px; white-space: nowrap;}
.ad .hr-people tr > :first-child{padding-left: var(--hr-inset);}
.ad .hr-people tr > :last-child{padding-right: var(--hr-inset);}
.ad .hr-people th:nth-child(3), .ad .hr-people td:nth-child(3){width: 44px;}
.ad .hr-people .hr-arrow{width: 16px;}
.ad .hr-split{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hr-gutter);}
.ad .hr-split > .hr-section{grid-template-rows: auto 1fr;}
.ad .hr-split .hr-table-wrap{display: flex; flex-direction: column;}
.ad .hr-split .hr-table-wrap > .hr-idle{flex: 1;}
.ad .hr-split .hr-table-more{margin-top: auto;}
.ad .hr-person{display: flex; align-items: baseline; gap: 8px;}
.ad .hr-title{color: var(--muted); font: var(--text-caption);}
.ad .hr-days{display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px;}
.ad .hr-days > b{display: grid; height: 24px; place-items: center; border-radius: 5px; background: var(--gray-5); color: var(--white); font: var(--hr-text-chart); font-weight: 700; font-variant-numeric: tabular-nums;}
.ad .hr-days > b[data-active]{background: var(--primary);}
.ad .hr-table-more{display: flex; padding: 14px 16px; justify-content: center; align-items: center; gap: 6px; border-top: 1px solid var(--gray-5); color: var(--primary); font: var(--text-caption); font-weight: 600; text-decoration: none;}

.ad .hr-count{margin-left: 6px; color: var(--primary);}
.ad .hr-card{padding: 24px var(--hr-inset); border: 1px solid var(--border); border-radius: 12px; background: var(--surface);}
.ad .hr-tabs{display: flex; padding: 3px; border-radius: 8px; background: var(--gray-5); font: var(--text-caption);}
.ad .hr-tabs button{padding: 5px 12px; border: 0; border-radius: 6px; background: transparent; color: var(--secondary); font: inherit; cursor: pointer;}
.ad .hr-tabs button[aria-selected="true"]{background: var(--surface); color: var(--text); font-weight: 600;}
.ad .hr-flow{display: grid; gap: 24px;}
.ad .hr-flow-head{display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;}
.ad .hr-flow-controls{display: flex; align-items: center; gap: 8px;}
.ad .hr-flow-org select{height: 39px; padding: 0 36px 0 14px; border: 0; border-radius: 8px; background: var(--gray-5) url("/assets/admin/chevron-down.svg") right 12px center / 12px no-repeat; color: var(--text); font: var(--text-caption); font-weight: 600; appearance: none; cursor: pointer;}
.ad .hr-flow-total{display: grid; gap: 2px;}
.ad .hr-flow-total strong{font: var(--text-page-title);}
.ad .hr-flow-total small{color: var(--muted); font: var(--text-caption);}
.ad .hr-bars{display: grid; grid-template-columns: repeat(7, 1fr);}
.ad .hr-bars > div{display: grid; justify-items: center;}
.ad .hr-bar-zone{display: flex; width: 100%; height: 148px; flex-direction: column; justify-content: flex-end; align-items: center; gap: 6px; border-bottom: 1px solid var(--border);}
.ad .hr-bars em{color: var(--secondary); font: var(--hr-text-chart); font-weight: 600; font-style: normal;}
.ad .hr-bars b{width: 44%; max-width: 40px; border-radius: 4px 4px 0 0; background: var(--chart-1-tint);}
.ad .hr-bars .is-today b{background: var(--primary);}
.ad .hr-bars .is-today em, .ad .hr-bars .is-today small{color: var(--primary); font-weight: 700;}
.ad .hr-bars small{margin-top: 10px; color: var(--muted); font: var(--hr-text-chart); white-space: nowrap;}
.ad .hr-idle{margin: 0; padding: 0; list-style: none;}
.ad .hr-idle > li + li{border-top: 1px solid var(--gray-5);}
.ad .hr-idle a{display: grid; grid-template-columns: minmax(0, 1fr) auto 24px; min-height: 57px; padding: 0 var(--hr-inset); align-items: center; gap: 12px; color: var(--secondary); font: var(--text-caption); text-decoration: none;}
.ad .hr-idle a:hover{background: var(--sky-blue);}
