.pd-root { margin-top: 52px; --pd-red: #dc3024; --pd-ink: #161616; --pd-gray: #817e79; --pd-line: #e9e6e1; color: var(--pd-ink); }
.pd-root button { appearance: none; cursor: pointer; font-family: inherit; }
.pd-root button:focus-visible, .pd-root [tabindex]:focus-visible { outline: 3px solid #ee695d; outline-offset: 4px; }
.pd-root button:disabled { cursor: default; }
.pd-root .pd-icon { flex: 0 0 auto; vertical-align: middle; }
.pd-controls { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.pd-role-tabs { display: flex; align-items: center; gap: 4px; padding: 5px; border: 1px solid #e2dfda; border-radius: 8px; background: #eeebe6; }
.pd-role-tab { display: flex; align-items: center; gap: 9px; padding: 13px 21px; border: 0; border-radius: 5px; background: transparent; color: #6d6964; font-size: 13px; font-weight: 650; transition: background .2s, color .2s; }
.pd-role-tab .pd-icon { width: 17px; height: 17px; }
.pd-role-tab.is-selected { background: var(--pd-ink); color: #fff; box-shadow: 0 3px 8px #00000012; }
.pd-concept-tag { display: flex; align-items: center; gap: 8px; color: #75716b; font-size: 11px; white-space: nowrap; }
.pd-concept-tag i { width: 6px; height: 6px; border-radius: 100%; background: var(--pd-red); }
.pd-stage { position: relative; overflow: hidden; padding: 52px 6%; background: #141414; color: #fff; border: 1px solid #242424; border-radius: 14px; }
.pd-stage-member { display: grid; grid-template-columns: 1fr 1.04fr; align-items: center; min-height: 754px; gap: 30px; }
.pd-stage-kicker { color: #fa8176; font-size: 11px; font-weight: 750; letter-spacing: .12em; }
.pd-member-copy { position: relative; z-index: 1; max-width: 430px; }
.pd-member-copy h3 { margin: 22px 0 20px; font-size: clamp(30px, 3.2vw, 43px); line-height: 1.22; letter-spacing: -.055em; }
.pd-member-copy > p { max-width: 370px; margin: 0; color: #aaa6a1; font-size: 14px; line-height: 1.9; }
.pd-screen-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 34px; }
.pd-screen-tabs button { display: flex; align-items: center; gap: 9px; padding: 14px; border: 1px solid #393735; border-radius: 5px; background: transparent; color: #b1aca7; font-size: 12px; text-align: left; transition: background .2s, color .2s; }
.pd-screen-tabs button > span { color: #72706d; font-size: 11px; font-weight: 700; }
.pd-screen-tabs button > .pd-icon { width: 14px; height: 14px; margin-left: auto; opacity: .5; }
.pd-screen-tabs button.is-selected { border-color: #b7342a; background: #311916; color: #fff; }
.pd-screen-tabs button.is-selected > span { color: #ff877d; }
.pd-screen-tabs button.is-selected > .pd-icon { opacity: 1; color: #ff877d; }
.pd-member-value { margin-top: 29px; padding-top: 22px; border-top: 1px solid #353331; }
.pd-member-value > span { display: block; color: #77726e; font-size: 11px; }
.pd-member-value > b { display: block; margin-top: 10px; color: #d7d2cc; font-size: 13px; font-weight: 550; line-height: 1.75; }
.pd-device-area { position: relative; display: flex; align-items: center; justify-content: center; min-height: 654px; }
.pd-device-wordmark { position: absolute; top: 18px; left: -5px; color: #ffffff07; font-size: 77px; font-weight: 900; letter-spacing: -.08em; line-height: 1; pointer-events: none; }
.pd-phone { position: relative; z-index: 1; width: 322px; flex: 0 0 auto; height: 654px; padding: 8px; border: 1px solid #75716b; border-radius: 43px; background: #232220; box-shadow: 24px 32px 80px #0009, inset 0 0 0 2px #121212; }
.pd-phone::before { position: absolute; left: -3px; top: 123px; width: 2px; height: 40px; border-radius: 3px; background: #716e68; content: ''; }
.pd-phone-status { position: relative; display: flex; align-items: center; justify-content: space-between; height: 47px; padding: 6px 22px 0; border-radius: 34px 34px 0 0; background: #f7f6f3; color: #181818; font-size: 11px; }
.pd-phone-status > b { font-size: 12px; }
.pd-phone-status > span:last-child { font-size: 11px; letter-spacing: .5px; }
.pd-dynamic-island { position: absolute; top: 9px; left: 50%; width: 86px; height: 24px; transform: translateX(-50%); border-radius: 20px; background: #131313; }
.pd-phone-panel { height: 514px; padding: 10px 17px 14px; overflow-y: auto; scrollbar-width: none; background: #f7f6f3; color: #171717; overscroll-behavior: contain; }
.pd-phone-panel::-webkit-scrollbar { display: none; }
.pd-phone-panel button { color: inherit; }
.pd-phone-panel h4, .pd-phone-panel h5, .pd-phone-panel p { margin: 0; }
.pd-phone-panel .pd-icon { width: 15px; height: 15px; }
.pd-phone-nav { display: grid; grid-template-columns: repeat(4, 1fr); height: 56px; padding: 7px 7px 0; border-top: 1px solid #e8e5df; color: #88847e; background: #f7f6f3; }
.pd-phone-nav button { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; color: #8a8580; font-size: 11px; }
.pd-phone-nav button .pd-icon { width: 19px; height: 19px; }
.pd-phone-nav button.is-active { color: var(--pd-red); font-weight: 750; }
.pd-home-indicator { position: relative; height: 19px; border-radius: 0 0 33px 33px; background: #f7f6f3; }
.pd-home-indicator::after { position: absolute; width: 96px; height: 4px; left: 50%; bottom: 6px; transform: translateX(-50%); border-radius: 10px; background: #161616; content: ''; }
.pd-device-label { position: absolute; z-index: 2; bottom: 28px; right: -28px; width: 194px; padding: 14px 17px; border-left: 3px solid var(--pd-red); background: #f7f4ed; color: #191919; box-shadow: 0 8px 26px #0005; }
.pd-device-label > span { display: block; color: var(--pd-red); font-size: 11px; font-weight: 800; letter-spacing: .05em; }
.pd-device-label > b { display: block; margin-top: 7px; font-size: 11px; line-height: 1.6; }
.pd-mobile-brand { display: flex; align-items: center; justify-content: space-between; }
.pd-mobile-brand > b { font-size: 13px; font-weight: 850; letter-spacing: -.05em; }
.pd-mobile-brand > b > span { margin-left: 2px; color: var(--pd-red); font-size: 11px; }
.pd-circle-button { display: grid; place-items: center; width: 27px; height: 27px; padding: 0; border: 1px solid #ddd9d2; border-radius: 50%; background: transparent; }
.pd-welcome { margin: 10px 0 12px; }
.pd-welcome > span { display: block; color: #7e7973; font-size: 11px; }
.pd-welcome h4 { margin-top: 5px; font-size: 23px; font-weight: 750; letter-spacing: -.06em; }
.pd-location { display: flex; align-items: center; gap: 5px; width: 100%; padding: 9px 0; border: 0; border-top: 1px solid #e3dfd8; border-bottom: 1px solid #e3dfd8; background: transparent; font-size: 11px; text-align: left; }
.pd-location small { margin-left: auto; color: #8e8780; font-size: 11px; }
.pd-location > .pd-icon:first-child { color: var(--pd-red); }
.pd-location > .pd-icon:last-child { width: 12px; height: 12px; }
.pd-training-image { position: relative; height: 167px; margin-top: 12px; overflow: hidden; border-radius: 6px; background: #282624; }
.pd-training-image > img { width: 100%; height: 100%; object-fit: cover; object-position: 63% 40%; filter: saturate(.65); }
.pd-training-image::after { position: absolute; inset: 0; background: linear-gradient(90deg, #000b 0%, #0004 70%, #0001); content: ''; }
.pd-training-image > div { position: absolute; z-index: 1; inset: 15px 14px; color: #fff; }
.pd-training-image > div > span { font-size: 11px; font-weight: 650; letter-spacing: .025em; }
.pd-training-image > div > b { display: block; margin-top: 9px; font-size: 24px; line-height: 1.16; letter-spacing: -.05em; }
.pd-training-image button { display: inline-flex; align-items: center; gap: 10px; margin-top: 10px; padding: 6px 9px; border: 0; border-radius: 3px; background: var(--pd-red); color: #fff; font-size: 11px; }
.pd-training-image button .pd-icon { width: 13px; height: 13px; }
.pd-week-summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 16px 0; }
.pd-week-summary > div:first-child > span { display: block; color: #817a73; font-size: 11px; }
.pd-week-summary b { display: block; margin-top: 5px; font-size: 23px; line-height: 1; }
.pd-week-summary b small { font-size: 11px; font-weight: 500; color: #8b847d; }
.pd-week-dots { display: flex; gap: 4px; }
.pd-week-dots > i { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #e7e3dc; color: #918b83; font-size: 11px; font-style: normal; }
.pd-week-dots > i.is-done { background: var(--pd-red); color: #fff; }
.pd-mobile-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 13px 0 10px; }
.pd-mobile-heading > b { font-size: 13px; }
.pd-mobile-heading > span { color: #928a81; font-size: 11px; }
.pd-mobile-heading > button { display: flex; align-items: center; gap: 2px; padding: 0; border: 0; background: transparent; color: #8f877e; font-size: 11px; }
.pd-mobile-heading > button .pd-icon { width: 12px; height: 12px; }
.pd-next-course { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid #e6e1db; }
.pd-time-block { min-width: 44px; padding-right: 10px; border-right: 1px solid #ddd7cf; }
.pd-time-block > b { display: block; font-size: 14px; }
.pd-time-block > span { display: block; margin-top: 4px; color: #8b847c; font-size: 11px; }
.pd-next-course > div:nth-child(2) > b { font-size: 12px; }
.pd-next-course > div:nth-child(2) > span { display: block; margin-top: 5px; color: #8a8178; font-size: 11px; }
.pd-tiny-status { margin-left: auto; color: var(--pd-red); font-size: 11px; white-space: nowrap; }
.pd-screen-heading { align-items: flex-end; margin: 2px 0 16px; }
.pd-screen-heading > h4 { font-size: 21px; line-height: 1.2; letter-spacing: -.05em; }
.pd-screen-heading > span { font-size: 11px; letter-spacing: -.04em; }
.pd-member-card { position: relative; overflow: hidden; padding: 18px; border-radius: 9px; background: #242321; color: #fff; }
.pd-member-card::after { position: absolute; top: -30px; right: 25px; width: 53px; height: 230px; transform: rotate(28deg); background: #e22f23; content: ''; }
.pd-member-card > div:first-child { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; }
.pd-member-card > div:first-child > b { font-size: 12px; font-weight: 850; letter-spacing: -.04em; }
.pd-member-card > div:first-child > span { padding: 3px 5px; border: 1px solid #ffffff77; border-radius: 2px; font-size: 11px; }
.pd-member-tier { position: relative; z-index: 1; display: block; margin-top: 18px; color: #ddd8d1; font-size: 11px; }
.pd-member-card > strong { position: relative; z-index: 1; display: block; margin-top: 9px; font-size: 26px; line-height: 1; font-weight: 850; letter-spacing: -.05em; }
.pd-card-footer { position: relative; z-index: 1; display: flex; justify-content: space-between; margin-top: 20px; color: #d1cbc2; font-size: 11px; }
.pd-card-validity { display: flex; justify-content: space-between; margin: 11px 0 15px; color: #8b8279; font-size: 11px; }
.pd-card-validity > b { color: #5c554d; font-weight: 550; }
.pd-member-code { display: flex; align-items: center; gap: 10px; width: 100%; padding: 11px 12px; border: 1px solid #e3ddd5; border-radius: 7px; background: #fff; text-align: left; }
.pd-code-mark { color: #25221f; font-size: 31px; line-height: 1; }
.pd-member-code > span:nth-child(2) > b { display: block; font-size: 12px; }
.pd-member-code small { display: block; margin-top: 4px; color: #90857a; font-size: 11px; }
.pd-member-code .pd-icon { margin-left: auto; color: #978c80; }
.pd-authorized-stores { display: grid; }
.pd-authorized-stores > div { display: flex; align-items: center; gap: 9px; padding: 9px 0; border-top: 1px solid #e6e1da; }
.pd-authorized-stores > div > i { display: grid; place-items: center; width: 30px; height: 32px; border-radius: 4px; background: #ebe5dd; color: #6c6257; font-size: 14px; font-style: normal; font-weight: 800; }
.pd-authorized-stores b { display: block; font-size: 12px; }
.pd-authorized-stores small { display: block; margin-top: 4px; color: #968a7d; font-size: 11px; }
.pd-store-check { margin-left: auto; color: #bf342b; }
.pd-inline-note { margin: 10px 0 0 !important; color: #928a80; font-size: 11px; line-height: 1.6; }
.pd-date-strip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; margin: 13px 0 12px; }
.pd-date-strip > button { padding: 9px 0; border: 0; border-radius: 5px; background: #ece8e1; color: #7e756a; }
.pd-date-strip > button > span { display: block; font-size: 11px; }
.pd-date-strip > button > b { display: block; margin-top: 7px; font-size: 17px; font-weight: 650; }
.pd-date-strip > button.is-active { background: #222; color: #fff; }
.pd-filter-row { display: flex; gap: 6px; align-items: center; margin-bottom: 12px; }
.pd-filter-row > button { padding: 6px 11px; border: 1px solid #e2dcd2; border-radius: 20px; color: #8a8075; background: transparent; font-size: 11px; }
.pd-filter-row > button.is-active { background: #f5dfda; color: #bb3328; border-color: #f5dfda; }
.pd-filter-row > span { margin-left: auto; color: #8e8376; font-size: 11px; }
.pd-booking-courses { display: grid; gap: 9px; }
.pd-book-course { padding: 12px; border: 1px solid #e5ded4; border-radius: 7px; background: #fff; }
.pd-book-course-top { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; }
.pd-book-course-top > span > b { font-size: 15px; }
.pd-book-course-top > span > small { margin-left: 7px; color: #968a7e; font-size: 11px; }
.pd-class-tag { color: #9b8c7d; font-size: 11px; }
.pd-book-course-main { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 11px; }
.pd-book-course-main h5 { font-size: 17px; font-weight: 750; letter-spacing: -.04em; }
.pd-book-course-main > div > span { display: block; margin-top: 5px; color: #9c8d7f; font-size: 11px; }
.pd-book-button { min-width: 55px; padding: 8px 10px; border: 0; border-radius: 4px; background: var(--pd-red); color: #fff !important; font-size: 11px; font-weight: 650; }
.pd-book-button.is-booked { background: #f3e7e2; color: #a5483d !important; }
.pd-course-coach { display: flex; align-items: center; gap: 6px; margin-top: 12px; padding-top: 9px; border-top: 1px solid #eee8e1; }
.pd-course-coach > i { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; background: #e5ded5; color: #5d554c; font-size: 11px; font-style: normal; font-weight: 700; }
.pd-course-coach > span { font-size: 11px; color: #7e7266; }
.pd-course-coach > small { margin-left: auto; font-size: 11px; color: #a39586; }
.pd-coach-selection { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.pd-coach-selection > button { display: flex; align-items: center; gap: 7px; padding: 8px; border: 1px solid #e4dcd1; border-radius: 5px; background: transparent; text-align: left; }
.pd-coach-selection > button > i { display: grid; place-items: center; width: 29px; height: 33px; border-radius: 4px; background: #d7d0c5; color: #5b5247; font-size: 17px; font-style: normal; font-weight: 750; }
.pd-coach-selection b { display: block; font-size: 12px; }
.pd-coach-selection small { display: block; margin-top: 4px; color: #978979; font-size: 11px; }
.pd-coach-selection .pd-icon { display: none; width: 12px; height: 12px; margin-left: auto; color: var(--pd-red); }
.pd-coach-selection > button.is-selected { border-color: #c75044; background: #faeae4; }
.pd-coach-selection > button.is-selected .pd-icon { display: block; }
.pd-empty-state { display: grid; place-items: center; gap: 10px; min-height: 150px; padding: 25px 15px; border: 1px dashed #d4cbbf; border-radius: 6px; color: #9a8b7b; text-align: center; font-size: 12px; }
.pd-empty-state > button { padding: 7px; border: 0; border-radius: 4px; background: #efe5db; color: #7e6651; font-size: 11px; }
.pd-record-total { display: flex; align-items: flex-end; justify-content: space-between; margin: 21px 0 20px; }
.pd-record-total > div > span { display: block; color: #8d8174; font-size: 11px; }
.pd-record-total strong { display: block; margin-top: 6px; font-size: 48px; font-weight: 700; letter-spacing: -.07em; line-height: .95; }
.pd-record-total strong > small { margin-left: 7px; font-size: 12px; font-weight: 500; letter-spacing: 0; }
.pd-record-total > span { padding-bottom: 4px; color: var(--pd-red); }
.pd-record-total > span .pd-icon { display: block; width: 23px; height: 23px; margin-bottom: 5px; }
.pd-record-total > span > b { font-size: 11px; font-weight: 550; }
.pd-calendar-card { padding: 13px; border: 1px solid #e4dcd0; border-radius: 7px; background: #fff; }
.pd-calendar-card > div:first-child { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.pd-calendar-card > div:first-child > b { font-size: 12px; }
.pd-calendar-card > div:first-child > span { color: #968774; font-size: 11px; }
.pd-calendar-card > div:first-child > span > i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: var(--pd-red); }
.pd-calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.pd-calendar-grid > span { display: grid; place-items: center; width: 25px; height: 25px; margin: auto; color: #8d7c68; font-size: 11px; }
.pd-calendar-grid > span.pd-calendar-week { color: #b0a28f; }
.pd-calendar-grid > span.is-trained { border-radius: 50%; background: #f5ded6; color: #b63d2d; }
.pd-calendar-grid > span.is-today { background: var(--pd-red); color: #fff; }
.pd-training-chart { display: flex; align-items: flex-end; justify-content: space-around; height: 114px; padding: 0 8px; border-bottom: 1px solid #e4dcd0; }
.pd-training-chart > div { display: flex; flex-direction: column; align-items: center; width: 35px; }
.pd-training-chart b { margin-bottom: 4px; color: #8a7c6b; font-size: 11px; font-weight: 550; }
.pd-training-chart i { display: block; width: 22px; border-radius: 3px 3px 0 0; background: #d2c7b8; }
.pd-training-chart i.is-current { background: var(--pd-red); }
.pd-training-chart span { padding-top: 6px; color: #9b8a75; font-size: 11px; }
.pd-record-recent { display: flex; align-items: center; gap: 8px; margin-top: 19px; }
.pd-record-recent > .pd-icon { color: var(--pd-red); }
.pd-record-recent b { display: block; font-size: 12px; }
.pd-record-recent small { display: block; margin-top: 5px; color: #9b8b78; font-size: 11px; }
.pd-record-recent > span:last-child { margin-left: auto; color: #a49a8c; font-size: 11px; }
.pd-bottom-note { display: flex; justify-content: space-between; gap: 15px; margin-top: 16px; color: #88827b; font-size: 11px; line-height: 1.7; }
.pd-bottom-note > span:first-child { color: #504c47; }
.pd-toast { position: fixed; z-index: 100; left: 50%; bottom: 32px; width: max-content; max-width: calc(100vw - 40px); padding: 15px 22px; transform: translate(-50%, 15px); border: 1px solid #514b45; border-left: 3px solid var(--pd-red); border-radius: 6px; color: #f5f1e9; background: #24211efa; box-shadow: 0 10px 40px #0003; font-size: 13px; line-height: 1.7; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.pd-toast.is-visible { transform: translate(-50%, 0); opacity: 1; }
.pd-stage-workbench { padding: 40px 4%; }
.pd-workbench-intro { display: flex; justify-content: space-between; align-items: flex-end; gap: 25px; margin-bottom: 29px; }
.pd-workbench-intro h3 { margin: 12px 0 0; font-size: clamp(24px, 2.5vw, 32px); line-height: 1.25; letter-spacing: -.05em; }
.pd-workbench-intro > p { margin: 0 0 3px; color: #a9a29a; font-size: 12px; line-height: 1.85; }
.pd-coach-app { display: grid; grid-template-columns: 146px minmax(0, 1fr); overflow: hidden; min-height: 530px; border: 1px solid #66605a; border-radius: 9px; background: #f7f5f0; color: #1c1916; box-shadow: 0 20px 50px #0005; }
.pd-coach-sidebar { display: flex; flex-direction: column; padding: 22px 15px; border-right: 1px solid #e2d9ce; background: #ede7de; }
.pd-coach-sidebar > b { font-size: 13px; font-weight: 850; letter-spacing: -.04em; }
.pd-coach-sidebar > b > span { color: var(--pd-red); }
.pd-coach-sidebar > span { display: block; margin: 6px 0 30px; color: #9d8f7f; font-size: 11px; }
.pd-coach-sidebar > button { display: flex; align-items: center; gap: 8px; padding: 12px 9px; border: 0; border-radius: 5px; color: #8a7b6b; background: transparent; font-size: 11px; text-align: left; }
.pd-coach-sidebar > button .pd-icon { width: 16px; height: 16px; }
.pd-coach-sidebar > button.is-current { color: #b83224; background: #e9d5cc; }
.pd-coach-user { display: flex; gap: 7px; align-items: center; margin-top: auto; padding-top: 25px; }
.pd-coach-user > i { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: #342f29; color: #eee6da; font-size: 13px; font-style: normal; }
.pd-coach-user > span { font-size: 12px; }
.pd-coach-user small { display: block; margin-top: 4px; color: #9d8f7e; font-size: 11px; }
.pd-coach-main { padding: 25px 26px 21px; }
.pd-workspace-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 15px; }
.pd-workspace-top > div > span { color: #a99b88; font-size: 11px; letter-spacing: .06em; }
.pd-workspace-top h4 { margin: 7px 0 0; font-size: 20px; font-weight: 750; letter-spacing: -.05em; }
.pd-sample-pill { padding: 5px 7px; border: 1px solid #e5dcd0; border-radius: 3px; color: #9c8a76; font-size: 11px; white-space: nowrap; }
.pd-coach-overview { display: grid; grid-template-columns: repeat(3, 1fr); margin: 25px 0 24px; }
.pd-coach-overview > div + div { padding-left: 24px; border-left: 1px solid #e4d8ca; }
.pd-coach-overview > div > span { color: #9e8b75; font-size: 11px; }
.pd-coach-overview b { display: block; margin-top: 7px; font-size: 27px; font-weight: 650; letter-spacing: -.04em; }
.pd-coach-overview b small { font-size: 11px; font-weight: 450; color: #a48f76; }
.pd-coach-content { display: grid; grid-template-columns: 1.2fr 1fr; gap: 21px; }
.pd-workspace-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pd-workspace-heading h5 { margin: 0; font-size: 13px; font-weight: 700; }
.pd-workspace-heading > span { color: #a08b73; font-size: 11px; }
.pd-day-toggle { display: flex; gap: 2px; padding: 2px; border: 1px solid #e6dbcd; border-radius: 4px; }
.pd-day-toggle > button { padding: 5px 7px; border: 0; border-radius: 2px; background: transparent; color: #a28b70; font-size: 11px; }
.pd-day-toggle > button.is-selected { background: #34302a; color: #faf5ec; }
.pd-agenda-list { display: grid; gap: 9px; margin-top: 15px; }
.pd-agenda-item { display: flex; gap: 13px; }
.pd-agenda-item > time { padding-top: 8px; color: #a28d74; font-size: 11px; }
.pd-agenda-card { flex: 1; min-width: 0; padding: 10px 12px; border-left: 2px solid #c6ac8a; border-radius: 0 4px 4px 0; background: #eee6da; }
.pd-agenda-card.group { border-left-color: #d43a28; background: #f0dfd6; }
.pd-agenda-card.assessment { border-left-color: #726b5d; background: #e9e5dc; }
.pd-agenda-card > span { display: block; color: #b49a7b; font-size: 11px; }
.pd-agenda-card.group > span { color: #c25b43; }
.pd-agenda-card > h6 { margin: 4px 0 5px; font-size: 14px; }
.pd-agenda-card > p { margin: 0; color: #9a8367; font-size: 11px; }
.pd-agenda-card > small { display: flex; align-items: center; gap: 4px; margin-top: 8px; color: #ac977a; font-size: 11px; }
.pd-agenda-card > small .pd-icon { width: 12px; height: 12px; }
.pd-agenda-card > small > span { margin-left: auto; }
.pd-member-service { min-width: 0; padding: 15px; border: 1px solid #e7dbcb; border-radius: 6px; background: #fffdf8; }
.pd-service-profile { display: flex; align-items: center; gap: 9px; margin: 21px 0 16px; }
.pd-service-profile > i { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #e6dac7; color: #9f8460; font-size: 18px; font-style: normal; }
.pd-service-profile > div > b { font-size: 13px; }
.pd-service-profile > div > span { display: block; margin-top: 5px; color: #ac9475; font-size: 11px; }
.pd-service-badge { margin-left: auto; padding: 4px 6px; border-radius: 3px; background: #edf0e5; color: #778561; font-size: 11px; white-space: nowrap; }
.pd-service-history > div { display: flex; flex-wrap: wrap; gap: 5px; justify-content: space-between; padding: 9px 0; border-top: 1px solid #eee5d7; font-size: 11px; line-height: 1.5; }
.pd-service-history > div > span { color: #b29c7e; }
.pd-service-history b { color: #8f795c; font-weight: 550; }
.pd-service-note { margin-top: 15px; padding: 13px; border-radius: 4px; background: #f2eadc; }
.pd-service-note > span { color: #a8875d; font-size: 11px; font-weight: 650; }
.pd-service-note > p { margin: 7px 0 12px; color: #a48c6b; font-size: 11px; line-height: 1.8; }
.pd-service-note > button { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; padding: 8px; border: 1px solid #c4b08e; border-radius: 3px; background: transparent; color: #93764d; font-size: 11px; }
.pd-service-note > button .pd-icon { width: 13px; height: 13px; }
.pd-workbench-value { display: flex; align-items: center; gap: 20px; margin-top: 25px; padding-top: 18px; border-top: 1px solid #35302a; }
.pd-workbench-value > span { color: #f28f7b; font-size: 11px; white-space: nowrap; }
.pd-workbench-value > p { margin: 0; color: #aaa196; font-size: 12px; line-height: 1.75; }
.pd-store-app { overflow: hidden; border: 1px solid #66605a; border-radius: 9px; background: #f7f5f0; color: #2d271f; box-shadow: 0 20px 50px #0005; }
.pd-store-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 56px; padding: 0 23px; border-bottom: 1px solid #e2d6c7; background: #fdfbf6; }
.pd-store-bar > b { font-size: 13px; font-weight: 850; letter-spacing: -.04em; }
.pd-store-bar > b > span { color: var(--pd-red); }
.pd-store-bar small { margin-left: 17px; padding-left: 17px; border-left: 1px solid #dfd1be; font-size: 11px; font-weight: 500; letter-spacing: 0; }
.pd-store-bar > span { display: flex; align-items: center; gap: 5px; color: #8a7150; font-size: 11px; }
.pd-store-bar > span > .pd-icon { width: 14px; height: 14px; color: #b5432e; }
.pd-store-bar > span > i { margin-left: 12px; color: #b2a087; font-size: 11px; font-style: normal; }
.pd-store-layout { display: grid; grid-template-columns: 143px minmax(0, 1fr); }
.pd-store-sidebar { display: flex; flex-direction: column; padding: 20px 12px; border-right: 1px solid #e2d5c4; background: #efe9df; }
.pd-store-sidebar > button { display: flex; align-items: center; gap: 8px; padding: 12px 11px; border: 0; border-radius: 4px; color: #9d8668; background: transparent; text-align: left; font-size: 11px; }
.pd-store-sidebar > button .pd-icon { width: 15px; height: 15px; }
.pd-store-sidebar > button.is-current { background: #e5d7c4; color: #9a4a2f; }
.pd-store-sidebar > span { margin-top: auto; padding: 30px 11px 0; color: #b49d7e; font-size: 11px; line-height: 1.9; }
.pd-store-main { min-width: 0; padding: 23px; }
.pd-store-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; margin: 21px 0 22px; }
.pd-store-kpis > div { padding: 13px 15px; border: 1px solid #e7dac8; border-radius: 5px; background: #fffdf8; }
.pd-store-kpis > div > span { color: #a48d6e; font-size: 11px; }
.pd-store-kpis b { display: block; margin: 6px 0 7px; font-size: 27px; font-weight: 650; letter-spacing: -.04em; }
.pd-store-kpis b > small { margin-left: 5px; color: #ab9474; font-size: 11px; font-weight: 450; }
.pd-schedule-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.pd-schedule-card { padding: 12px; border-left: 2px solid #b84a2c; border-radius: 0 4px 4px 0; background: #f0ddd0; }
.pd-schedule-card.dark { border-color: #635241; background: #e2d9c9; }
.pd-schedule-card.light { border-color: #b09c6e; background: #ece6d6; }
.pd-schedule-card > span { display: flex; align-items: center; justify-content: space-between; color: #8e5e3f; font-size: 12px; font-weight: 650; }
.pd-schedule-card small { color: #ad8565; font-size: 11px; font-weight: 450; }
.pd-schedule-card > b { display: block; margin: 12px 0 10px; color: #765137; font-size: 15px; }
.pd-schedule-card > div { display: flex; align-items: center; gap: 5px; color: #a07b59; font-size: 11px; }
.pd-schedule-card > div > .pd-icon { width: 13px; height: 13px; }
.pd-schedule-card > div > span { margin-left: auto; }
.pd-reservation-table { margin-top: 23px; }
.pd-table-scroll { overflow-x: auto; margin-top: 12px; border: 1px solid #e8dac6; border-radius: 5px; background: #fffdf8; }
.pd-reservation-table table { width: 100%; border-collapse: collapse; text-align: left; font-size: 11px; white-space: nowrap; }
.pd-reservation-table th { padding: 10px; border-bottom: 1px solid #e8d8c1; background: #f1e9dc; color: #b09878; font-size: 11px; font-weight: 500; }
.pd-reservation-table td { padding: 11px 10px; border-bottom: 1px solid #f0e5d5; color: #9a7c57; font-size: 11px; }
.pd-reservation-table tr:last-child td { border-bottom: 0; }
.pd-reservation-table td > b { font-size: 11px; font-weight: 550; }
.pd-reservation-table td small { display: block; margin-top: 4px; color: #b7a07f; font-size: 11px; }
.pd-table-status { display: inline-block; padding: 4px 5px; border-radius: 3px; background: #f3e7cd; color: #ad8c4f; font-size: 11px; }
.pd-table-status.is-complete { background: #e7ecda; color: #7c8e55; }
.pd-reservation-table td button { padding: 6px 7px; border: 0; border-radius: 3px; background: #b33320; color: #fff; font-size: 11px; }
.pd-reservation-table td button:disabled { background: #ede7dc; color: #b3a184; }

/* Keep small interface labels readable at their actual presentation size. */
.pd-coach-sidebar > span,
.pd-coach-sidebar > button,
.pd-coach-user small,
.pd-workspace-top > div > span,
.pd-coach-overview > div > span,
.pd-coach-overview b small,
.pd-workspace-heading > span,
.pd-day-toggle > button,
.pd-agenda-item > time,
.pd-agenda-card > span,
.pd-agenda-card > p,
.pd-agenda-card > small,
.pd-service-profile > div > span,
.pd-service-history > div > span,
.pd-service-history b,
.pd-service-note > span,
.pd-service-note > p,
.pd-service-note > button,
.pd-inline-note,
.pd-sample-pill,
.pd-store-bar > span,
.pd-store-bar > span > i,
.pd-store-sidebar > button,
.pd-store-sidebar > span,
.pd-store-kpis > div > span,
.pd-store-kpis b > small,
.pd-schedule-card small,
.pd-schedule-card > div,
.pd-reservation-table th,
.pd-reservation-table td,
.pd-reservation-table td small { color: #776e63; }
.pd-phone-panel small,
.pd-phone-panel .pd-mobile-heading > span,
.pd-phone-panel .pd-mobile-heading > button,
.pd-phone-panel .pd-book-course-main > div > span,
.pd-phone-panel .pd-class-tag,
.pd-phone-panel .pd-course-coach > span,
.pd-phone-panel .pd-calendar-card > div:first-child > span,
.pd-phone-panel .pd-calendar-grid > span.pd-calendar-week,
.pd-phone-panel .pd-training-chart span,
.pd-phone-panel .pd-record-recent > span:last-child { color: #817669; }
.pd-coach-sidebar > button.is-current { color: #aa3928; background: #e9d5cc; }
.pd-store-sidebar > button.is-current { color: #a63928; background: #e7d5c8; }
.pd-day-toggle > button.is-selected { color: #faf5ec; }

@media (max-width: 1100px) {
  .pd-stage-member { gap: 20px; padding-left: 5%; padding-right: 5%; }
  .pd-device-label { right: -14px; bottom: 10px; }
  .pd-coach-app { grid-template-columns: 120px minmax(0, 1fr); }
  .pd-coach-main { padding: 21px 19px; }
  .pd-coach-content { gap: 13px; }
  .pd-coach-sidebar { padding-left: 10px; padding-right: 10px; }
  .pd-store-layout { grid-template-columns: 120px minmax(0, 1fr); }
  .pd-store-main { padding: 20px 17px; }
  .pd-store-kpis > div { padding: 13px 10px; }
}
@media (max-width: 960px) {
  .pd-controls { align-items: flex-start; flex-direction: column; gap: 13px; }
  .pd-stage-member { grid-template-columns: 1fr 1fr; min-height: 750px; padding: 36px 4%; gap: 14px; }
  .pd-member-copy h3 { font-size: 29px; }
  .pd-member-copy > p { font-size: 13px; }
  .pd-screen-tabs { grid-template-columns: 1fr; gap: 7px; margin-top: 25px; }
  .pd-screen-tabs button { padding: 10px 12px; }
  .pd-phone { width: 294px; }
  .pd-phone-panel { padding-left: 14px; padding-right: 14px; }
  .pd-device-label { width: 180px; right: -8px; }
  .pd-device-wordmark { display: none; }
  .pd-workbench-intro { display: block; }
  .pd-workbench-intro > p { margin-top: 15px; }
  .pd-coach-app { grid-template-columns: 60px minmax(0, 1fr); }
  .pd-coach-sidebar { align-items: center; padding: 18px 8px; }
  .pd-coach-sidebar > b { font-size: 13px; }
  .pd-coach-sidebar > b > span, .pd-coach-sidebar > span, .pd-coach-sidebar > button > span, .pd-coach-user > span { display: none; }
  .pd-coach-sidebar > button { padding: 12px; }
  .pd-coach-sidebar > button:first-of-type { margin-top: 27px; }
  .pd-coach-content { grid-template-columns: 1fr; }
  .pd-member-service { margin-top: 7px; }
  .pd-service-history { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .pd-service-history > div { display: block; }
  .pd-service-history b { display: block; margin-top: 5px; }
  .pd-service-note { margin-top: 8px; }
  .pd-store-layout { grid-template-columns: 56px minmax(0, 1fr); }
  .pd-store-sidebar { align-items: center; padding: 17px 6px; }
  .pd-store-sidebar > button { padding: 12px; }
  .pd-store-sidebar > button > span, .pd-store-sidebar > span { display: none; }
  .pd-schedule-grid { grid-template-columns: 1fr; }
  .pd-schedule-card { display: grid; grid-template-columns: 1fr 1fr 1.1fr; align-items: center; gap: 10px; padding: 10px 12px; }
  .pd-schedule-card > b { margin: 0; font-size: 13px; }
  .pd-schedule-card > span { flex-direction: column; align-items: flex-start; gap: 4px; }
  .pd-schedule-card > div > span { display: none; }
}
@media (max-width: 680px) {
  .pd-root { margin-top: 32px; }
  .pd-role-tabs { width: 100%; }
  .pd-role-tab { flex: 1; justify-content: center; gap: 5px; padding: 11px 5px; font-size: 12px; white-space: nowrap; }
  .pd-role-tab .pd-icon { width: 15px; height: 15px; }
  .pd-concept-tag { font-size: 11px; }
  .pd-stage-member { grid-template-columns: 1fr; gap: 26px; padding: 31px 20px 39px; }
  .pd-member-copy { max-width: 100%; }
  .pd-member-copy h3 { margin: 14px 0; font-size: 29px; line-height: 1.25; }
  .pd-member-copy > p { max-width: 430px; font-size: 13px; line-height: 1.8; }
  .pd-screen-tabs { grid-template-columns: 1fr 1fr; margin-top: 21px; gap: 6px; }
  .pd-screen-tabs button { padding: 11px 9px; font-size: 11px; gap: 6px; }
  .pd-screen-tabs button > .pd-icon { width: 12px; height: 12px; }
  .pd-member-value { display: none; }
  .pd-device-area { min-height: 666px; }
  .pd-phone { max-width: 100%; width: 308px; }
  .pd-device-label { right: -1px; bottom: 0; width: 186px; padding: 10px 12px; }
  .pd-bottom-note { display: block; margin-top: 13px; font-size: 11px; }
  .pd-bottom-note > span { display: block; }
  .pd-bottom-note > span + span { margin-top: 4px; }
  .pd-stage-workbench { padding: 29px 13px; }
  .pd-workbench-intro { margin: 0 8px 23px; }
  .pd-workbench-intro h3 { font-size: 25px; line-height: 1.35; }
  .pd-workbench-intro > p { font-size: 12px; }
  .pd-coach-app { display: block; }
  .pd-coach-sidebar { flex-direction: row; gap: 6px; padding: 10px 13px; border-right: 0; border-bottom: 1px solid #e2d9ce; }
  .pd-coach-sidebar > b { margin-right: auto; }
  .pd-coach-sidebar > button { padding: 9px; }
  .pd-coach-sidebar > button:first-of-type { margin-top: 0; }
  .pd-coach-user { margin: 0 0 0 6px; padding: 0; }
  .pd-coach-user > i { width: 25px; height: 25px; }
  .pd-coach-main { padding: 19px 14px; }
  .pd-workspace-top h4 { font-size: 18px; line-height: 1.35; }
  .pd-sample-pill { padding: 4px; font-size: 11px; }
  .pd-workspace-top { gap: 8px; }
  .pd-workspace-top > div > span { letter-spacing: .01em; }
  .pd-coach-overview { margin: 21px 0; }
  .pd-coach-overview > div + div { padding-left: 12px; }
  .pd-coach-overview > div > span { font-size: 11px; }
  .pd-coach-overview b { font-size: 25px; }
  .pd-workspace-heading { flex-wrap: wrap; gap: 10px; }
  .pd-agenda-item { gap: 10px; }
  .pd-agenda-card > small > span { display: none; }
  .pd-service-history { grid-template-columns: 1fr; gap: 0; }
  .pd-service-history > div { display: flex; }
  .pd-service-history b { margin-top: 0; }
  .pd-workbench-value { align-items: flex-start; gap: 12px; margin: 22px 6px 0; }
  .pd-workbench-value > p { font-size: 11px; line-height: 1.9; }
  .pd-workbench-value > span { padding-top: 2px; }
  .pd-store-bar { flex-wrap: wrap; align-items: center; gap: 10px; padding: 14px; }
  .pd-store-bar > b { font-size: 12px; }
  .pd-store-bar small { margin-left: 9px; padding-left: 9px; }
  .pd-store-bar > span { width: 100%; }
  .pd-store-bar > span > i { margin-left: auto; }
  .pd-store-layout { display: block; }
  .pd-store-sidebar { flex-direction: row; justify-content: space-between; padding: 5px 6px; border: 0; border-bottom: 1px solid #e2d5c4; }
  .pd-store-sidebar > button { flex-direction: column; gap: 5px; padding: 9px 7px; font-size: 11px; }
  .pd-store-sidebar > button > span { display: block; font-size: 11px; }
  .pd-store-main { padding: 18px 12px; }
  .pd-store-kpis { gap: 6px; margin-top: 18px; }
  .pd-store-kpis > div { padding: 11px 7px; }
  .pd-store-kpis > div > span { font-size: 11px; line-height: 1.6; }
  .pd-store-kpis > div > span:last-child { display: none; }
  .pd-store-kpis b { font-size: 25px; margin-bottom: 0; }
  .pd-schedule-card { grid-template-columns: .85fr 1fr .7fr; padding: 10px; gap: 7px; }
  .pd-schedule-card > b { font-size: 13px; }
  .pd-schedule-card > div { font-size: 11px; }
  .pd-reservation-table table { min-width: 600px; }
  .pd-toast { padding: 12px 15px; font-size: 12px; bottom: 19px; }
}
@media (prefers-reduced-motion: reduce) {
  .pd-root *, .pd-root *::before, .pd-root *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}