/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

:root { background: #070914; color: #f7f4ff; font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; font-size: 17px; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; line-height: 1.5; background: #070914; }
a { color: inherit; }
.shell { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.marketing { --pointer-x: .5; --pointer-y: .5; position: relative; overflow: hidden; isolation: isolate; min-height: 100vh; background: radial-gradient(circle at 50% -15%, #31285f 0, #10152e 40%, #070914 74%); }
.marketing::before { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .35; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom, black, transparent 80%); }
.marketing__aurora { position: absolute; z-index: -1; width: 48rem; height: 48rem; border-radius: 999px; filter: blur(70px); opacity: .3; pointer-events: none; transition: transform .25s ease-out; }
.marketing__aurora--one { top: -28rem; right: calc((var(--pointer-x) - .5) * -100px); background: #c577ff; }
.marketing__aurora--two { top: 21rem; left: calc((var(--pointer-y) - .5) * 90px); width: 30rem; height: 30rem; background: #21e0c3; opacity: .14; }
.marketing-nav { display: flex; align-items: center; justify-content: space-between; padding-top: 24px; }
.brandmark { display: inline-flex; align-items: center; gap: .65rem; color: #fff; font-size: 1.25rem; font-weight: 800; letter-spacing: -.02em; text-decoration: none; }
.brandmark__icon { position: relative; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid rgba(255,255,255,.48); border-radius: 9px; transform: rotate(-7deg); box-shadow: 0 8px 24px rgba(101,77,255,.55); }
.brandmark__icon i { position: absolute; width: 3px; height: 13px; border-radius: 3px; background: linear-gradient(#b9a9ff, #fff); transform: rotate(32deg); }
.brandmark__icon i:nth-child(1) { margin-left: -8px; height: 8px; }.brandmark__icon i:nth-child(3) { margin-left: 8px; height: 18px; }
.marketing-nav__actions { display: flex; align-items: center; gap: 1rem; }.phone-link { font-size: .87rem; color: #d9d6e7; text-decoration: none; }.phone-link span { color: #79f7de; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: .6rem 1rem; border: 1px solid transparent; border-radius: 999px; color: #090816; text-decoration: none; font-size: .9rem; font-weight: 800; background: #fff; box-shadow: 0 10px 25px rgba(0,0,0,.18); transition: transform .2s ease, box-shadow .2s ease; }.button:hover { transform: translateY(-2px); box-shadow: 0 15px 30px rgba(0,0,0,.25); }.button--ghost { color: #fff; border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.06); box-shadow: none; }.button--primary { color: #071019; background: linear-gradient(135deg, #83f9de, #b2a0ff); }
.hero-3d { display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: 5rem; min-height: 680px; padding: 4rem 0 6rem; }.hero-3d__copy { max-width: 620px; }.eyebrow { margin: 0 0 .9rem; color: #82f6dc; font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .13em; }.hero-3d h1 { max-width: 650px; margin: 0; font-size: clamp(3.3rem, 6.3vw, 6.1rem); letter-spacing: -.02em; line-height: .91; }.hero-3d__lede { max-width: 540px; margin: 1.7rem 0 0; color: #b7b7c8; font-size: 1.08rem; }.hero-3d__actions { display: flex; align-items: center; gap: 1.4rem; margin-top: 2rem; }.text-link { color: #f2edff; font-size: .94rem; font-weight: 700; text-decoration: none; }.text-link span { color: #82f6dc; }.hero-3d__note { margin-top: 2rem; color: #77778f; font-size: .78rem; }
.tilt-card { --rotate-x: 0deg; --rotate-y: 0deg; transform: perspective(1200px) rotateX(var(--rotate-x)) rotateY(var(--rotate-y)); transition: transform .2s ease, box-shadow .2s ease; will-change: transform; }.tilt-card:hover { box-shadow: 0 38px 80px rgba(0,0,0,.38); }
.command-card { position: relative; padding: 1.45rem; border: 1px solid rgba(255,255,255,.18); border-radius: 24px; background: linear-gradient(140deg, rgba(45,49,93,.94), rgba(16,18,43,.91)); box-shadow: 0 36px 80px rgba(0,0,0,.45), inset 0 1px rgba(255,255,255,.14); }.command-card::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(130deg, rgba(179,164,255,.2), transparent 32%, rgba(107,255,223,.12)); pointer-events: none; }.command-card__top { display: flex; align-items: center; gap: .45rem; color: #a8a8bc; font-size: .69rem; font-weight: 800; letter-spacing: .09em; }.command-card__time { margin-left: auto; color: #fff; }.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #78f6d9; box-shadow: 0 0 12px #78f6d9; }.command-card__title { display: flex; align-items: center; gap: .8rem; margin: 2.3rem 0 1.5rem; }.command-card__title strong { display: block; font-size: 1.3rem; }.command-card__title small, .command-card__people small { display: block; color: #9c9daf; font-size: .78rem; }.command-card__glyph { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; color: #061114; font-size: 1.65rem; background: linear-gradient(135deg, #83f9de, #b9a7ff); }.command-card__people { display: grid; gap: .65rem; }.command-card__people > div { display: flex; align-items: center; gap: .65rem; padding: .65rem; border: 1px solid rgba(255,255,255,.07); border-radius: 13px; background: rgba(2,4,20,.32); }.command-card__people p { flex: 1; margin: 0; font-size: .85rem; }.command-card__people b { display: block; }.command-card__people em { color: #7debd3; font-size: .67rem; font-style: normal; }.avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #071019; font-size: .62rem; font-weight: 900; }.avatar--coral { background: #fdab9f; }.avatar--violet { background: #bca7ff; }.avatar--mint { background: #83f9de; }.command-card__footer { display: flex; align-items: center; gap: .65rem; margin-top: 1.25rem; color: #a6a5b8; font-size: .75rem; }.command-card__footer strong { color: #fff; }.progress { flex: 1; height: 5px; overflow: hidden; border-radius: 9px; background: #34354f; }.progress i { display: block; width: 68%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7bf4d9, #ae9bff); }
.chaos-callout { display: grid; grid-template-columns: 170px minmax(0, 470px); align-items: center; gap: 1.5rem; margin-bottom: 5rem; padding: 1rem; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: rgba(20,22,47,.55); }.chaos-callout__image { width: 170px; height: 150px; border-radius: 14px; object-fit: cover; object-position: center; box-shadow: 0 18px 34px rgba(0,0,0,.3); transform: rotate(-3deg); }.chaos-callout h2 { max-width: 470px; margin: 0; font-size: clamp(1.5rem, 3vw, 2.2rem); letter-spacing: -.02em; line-height: 1; }.chaos-callout p:last-child { margin: .75rem 0 0; color: #aaaabd; }
.orbit { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; padding-bottom: 6rem; }.feature-card { position: relative; min-height: 225px; overflow: hidden; padding: 1.45rem; border: 1px solid rgba(255,255,255,.13); border-radius: 22px; background: rgba(20,22,47,.74); }.feature-card::before { content: ""; position: absolute; width: 150px; height: 150px; border-radius: 50%; filter: blur(16px); opacity: .35; }.feature-card--one::before { top: -70px; right: -60px; background: #82f6dc; }.feature-card--two::before { bottom: -75px; left: -65px; background: #a790ff; }.feature-card--three::before { top: -55px; left: 20px; background: #ffb181; }.feature-card--four::before { bottom: -80px; right: -50px; background: #f08de4; }.feature-card__icon { position: relative; display: grid; place-items: center; width: 39px; height: 39px; border-radius: 12px; background: rgba(255,255,255,.12); font-size: 1.25rem; }.feature-card h2 { position: relative; margin: 2.5rem 0 .55rem; font-size: 1.18rem; }.feature-card p { position: relative; margin: 0; color: #adaec0; font-size: .87rem; }.feature-card b { position: absolute; right: 1.2rem; bottom: .8rem; color: rgba(255,255,255,.18); font-size: 3.4rem; letter-spacing: -.02em; }
.proof { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2rem 0 6rem; color: #dedcea; }.proof p { max-width: 370px; margin: 0; font-size: 1.2rem; }.proof div { display: flex; align-items: center; gap: .75rem; color: #9999ad; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }.proof i { width: 28px; height: 1px; background: #56566a; }
.marketing-footer { display: grid; grid-template-columns: 1fr auto; gap: 1rem 3rem; padding: 2rem 0 3rem; border-top: 1px solid rgba(255,255,255,.12); color: #a5a5b6; font-size: .78rem; }.brandmark--footer { font-size: 1rem; }.marketing-footer p { margin: .55rem 0 0; }.marketing-footer nav { display: flex; gap: 1.2rem; }.marketing-footer nav a { text-decoration: none; }.marketing-footer__draft { grid-column: 1 / -1; color: #74748b; }
.legal-page { max-width: 760px; padding-top: 4rem; padding-bottom: 6rem; color: #d9d8e4; }.legal-page h1 { margin: .5rem 0 1.4rem; color: #fff; font-size: clamp(2.7rem, 6vw, 4.5rem); letter-spacing: -.02em; }.legal-page h2 { margin-top: 2.5rem; color: #fff; }.legal-page p { color: #b9b8c7; }.legal-page a { color: #82f6dc; }.legal-page__back { color: #fff; text-decoration: none; }
.access-alert { position: relative; display: grid; grid-template-columns: minmax(0, .95fr) minmax(360px, .75fr); align-items: center; gap: clamp(3rem, 8vw, 9rem); min-height: 100vh; overflow: hidden; padding: clamp(2rem, 7vw, 6rem) max(24px, calc((100vw - 1060px) / 2)); background: #090713; isolation: isolate; }.access-alert__grid { position: absolute; z-index: -2; inset: 0; opacity: .38; background: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(110deg, black, transparent 76%); }.access-alert__orb { position: absolute; z-index: -1; width: 38rem; height: 38rem; border-radius: 50%; filter: blur(85px); pointer-events: none; }.access-alert__orb--one { top: -20rem; left: -16rem; background: #f44c70; opacity: .22; animation: alertDrift 9s ease-in-out infinite alternate; }.access-alert__orb--two { right: -19rem; bottom: -20rem; background: #6355ff; opacity: .3; animation: alertDrift 12s ease-in-out infinite alternate-reverse; }.access-alert__intro { max-width: 570px; animation: accessEnter .8s both; }.access-alert__signal { display: inline-flex; align-items: center; gap: .55rem; margin-top: clamp(3.5rem, 10vh, 7rem); padding: .42rem .7rem; border: 1px solid rgba(255,112,136,.45); border-radius: 999px; color: #ffb4c1; background: rgba(255,57,94,.1); font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }.access-alert__signal span { width: 7px; height: 7px; border-radius: 50%; background: #ff5d7f; box-shadow: 0 0 0 0 rgba(255,93,127,.7); animation: alertPulse 1.5s infinite; }.access-alert h1 { max-width: 760px; margin: 1.25rem 0; color: #fff; font-size: clamp(3.2rem, 6vw, 5.75rem); letter-spacing: -.02em; line-height: .98; text-wrap: balance; }.access-alert__intro > p { max-width: 450px; margin: 0; color: #b8b5c8; font-size: 1.05rem; }.access-alert__status { display: inline-flex; align-items: center; gap: .55rem; margin-top: 2.5rem; color: #aaa7b8; font-size: .77rem; font-weight: 800; }.access-alert__status i, .access-card__footer i { width: 8px; height: 8px; border-radius: 50%; background: #73f6d5; box-shadow: 0 0 15px #73f6d5; }.access-alert__status b { margin-left: .25rem; color: #78f6d7; font-weight: 800; }.access-card { position: relative; overflow: hidden; padding: clamp(1.7rem, 4vw, 2.6rem); border: 1px solid rgba(255,255,255,.2); border-radius: 28px; background: linear-gradient(150deg, rgba(36,30,61,.88), rgba(11,10,27,.93)); box-shadow: 0 34px 90px rgba(0,0,0,.46), inset 0 1px rgba(255,255,255,.12); animation: accessCardEnter .9s .12s both; }.access-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 100% 0, rgba(255,75,110,.17), transparent 35%); pointer-events: none; }.access-card__scanner { position: absolute; top: 0; left: -30%; width: 30%; height: 2px; background: linear-gradient(90deg, transparent, #ff7b97, transparent); box-shadow: 0 0 18px #ff5579; animation: scanner 4s ease-in-out infinite; }.access-card h2 { position: relative; margin: .7rem 0 0; color: #fff; font-size: clamp(1.9rem, 3.4vw, 2.4rem); letter-spacing: -.02em; line-height: 1.1; text-wrap: balance; }.access-card__lede { position: relative; margin: .55rem 0 2rem; color: #aaa8bb; }.access-form { position: relative; display: grid; gap: 1.05rem; }.access-form p { margin: 0; }.access-form label { display: block; margin-bottom: .42rem; color: #d8d6e5; font-size: .77rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }.access-form input:not([type="submit"]) { width: 100%; min-height: 50px; padding: .8rem .95rem; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; outline: none; color: #fff; background: rgba(5,5,18,.5); font: inherit; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }.access-form input::placeholder { color: #706e80; }.access-form input:focus { border-color: #ff7c98; box-shadow: 0 0 0 4px rgba(255,89,122,.14); transform: translateY(-1px); }.access-form__submit { min-height: 52px; margin-top: .45rem; border: 0; border-radius: 12px; color: #210a12; background: linear-gradient(105deg, #ff7d99, #ffc67d); box-shadow: 0 14px 30px rgba(255,71,106,.28); font: inherit; font-weight: 900; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }.access-form__submit:hover { transform: translateY(-2px); box-shadow: 0 19px 35px rgba(255,71,106,.4); }.access-card__footer { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.45rem; color: #a7a5b6; font-size: .75rem; }.access-card__footer span { display: inline-flex; align-items: center; gap: .45rem; }.access-card__footer a { color: #fff; font-weight: 800; text-decoration-color: #ff809b; text-underline-offset: 4px; }
.dashboard-shell { display: grid; grid-template-columns: 245px minmax(0, 1fr); min-height: 100vh; color: #15233d; background: #f4f7fb; }.dashboard-sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; padding: 28px 16px 20px; border-right: 1px solid #e3e9f1; background: #fff; }.dashboard-brand { display: inline-flex; align-items: center; gap: .7rem; padding: 0 10px; color: #10213d; font-size: 1.35rem; font-weight: 900; letter-spacing: -.02em; text-decoration: none; }.dashboard-brand__mark { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 10px; color: #fff; background: linear-gradient(145deg, #765df2, #4336b9); box-shadow: 0 9px 20px rgba(93,71,216,.24); font-size: 1.05rem; }.dashboard-sidebar__location { margin: 1.8rem 10px 1.2rem; color: #667795; font-size: .78rem; font-weight: 700; }.dashboard-sidebar__location span { color: #2bc596; }.dashboard-nav { display: grid; gap: .35rem; }.dashboard-nav a { display: flex; align-items: center; gap: .8rem; padding: .82rem .85rem; border-radius: 10px; color: #667795; font-size: .93rem; font-weight: 750; text-decoration: none; transition: background .18s ease, color .18s ease, transform .18s ease; }.dashboard-nav a:hover { color: #312582; background: #f0eeff; transform: translateX(3px); }.dashboard-nav a.is-active { color: #fff; background: #18223b; box-shadow: 0 10px 22px rgba(24,34,59,.15); }.dashboard-nav i { display: grid; place-items: center; width: 18px; color: inherit; font-size: 1rem; font-style: normal; }.dashboard-nav b { display: grid; place-items: center; min-width: 20px; height: 20px; margin-left: auto; border-radius: 99px; color: #fff; background: #ef5a70; font-size: .65rem; }.dashboard-sidebar__bottom { margin-top: auto; padding: 1rem 10px 0; border-top: 1px solid #e8edf4; }.dashboard-user { display: flex; align-items: center; gap: .7rem; }.dashboard-user > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: #5540ce; background: #e8e5ff; font-size: .82rem; font-weight: 900; }.dashboard-user p { margin: 0; }.dashboard-user b, .dashboard-user small { display: block; }.dashboard-user b { max-width: 140px; overflow: hidden; font-size: .77rem; text-overflow: ellipsis; white-space: nowrap; }.dashboard-user small { color: #8190a8; font-size: .68rem; }.dashboard-signout { display: block; margin-top: 1rem; color: #6b7b93; font-size: .77rem; font-weight: 800; text-decoration: none; }.dashboard-workspace { min-width: 0; padding: 38px clamp(24px, 4vw, 58px) 60px; }.dashboard-topbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; margin-bottom: 2.3rem; }.dashboard-kicker { margin: 0 0 .3rem; color: #816ce8; font-size: .68rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }.dashboard-topbar h1, .dashboard-section h2 { margin: 0; letter-spacing: -.02em; }.dashboard-topbar h1 { font-size: clamp(2rem, 3.3vw, 3rem); }.dashboard-subtitle { margin: .45rem 0 0; color: #75839a; }.dashboard-topbar__actions { display: flex; align-items: center; gap: .7rem; }.dashboard-live, .dashboard-help { display: inline-flex; align-items: center; gap: .4rem; min-height: 36px; padding: 0 .8rem; border: 1px solid #dfe6ef; border-radius: 9px; color: #48617e; background: #fff; font-size: .76rem; font-weight: 800; text-decoration: none; }.dashboard-live i { width: 7px; height: 7px; border-radius: 50%; background: #28c993; box-shadow: 0 0 10px #28c993; }.dashboard-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 2.1rem; }.dashboard-metrics article, .dashboard-section--panel, .dashboard-tools details { border: 1px solid #e0e6ee; border-radius: 16px; background: #fff; box-shadow: 0 2px 4px rgba(23,39,70,.03); }.dashboard-metrics article { position: relative; padding: 1.15rem; overflow: hidden; }.dashboard-metrics p { margin: .65rem 0 .2rem; color: #77869c; font-size: .76rem; font-weight: 750; }.dashboard-metrics strong { display: block; font-size: 1.75rem; letter-spacing: -.02em; }.dashboard-metrics small { color: #95a1b2; font-size: .68rem; }.metric-icon { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 9px; font-size: .92rem; font-weight: 900; }.metric-icon--violet { color: #614ddd; background: #eeebff; }.metric-icon--coral { color: #d34d66; background: #ffeaee; }.metric-icon--mint { color: #159b70; background: #e4fbf3; }.metric-icon--amber { color: #c6801d; background: #fff5df; }.dashboard-section { margin-top: 1.8rem; }.dashboard-section__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }.dashboard-section h2 { font-size: 1.35rem; }.dashboard-section__heading > a, .dashboard-section__actions a { color: #5641d1; font-size: .76rem; font-weight: 850; text-decoration: none; }.dashboard-section__heading > a span { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-left: .3rem; border-radius: 6px; color: #fff; background: #604ad8; }.schedule-board { display: grid; grid-template-columns: repeat(7, minmax(140px, 1fr)); gap: .65rem; overflow-x: auto; padding-bottom: .2rem; }.schedule-day { min-height: 230px; padding: .85rem; border: 1px solid #e0e6ee; border-radius: 14px; background: #fff; }.schedule-day--today { border: 2px solid #735cf0; box-shadow: 0 7px 18px rgba(101,79,222,.1); }.schedule-day header { display: grid; grid-template-columns: 1fr auto; align-items: center; }.schedule-day header span { color: #7b8aa1; font-size: .66rem; font-weight: 850; }.schedule-day header strong { font-size: 1.35rem; letter-spacing: -.02em; }.schedule-day header b { grid-column: 2; grid-row: 1 / 3; color: #667794; font-size: 1.3rem; font-weight: 400; }.schedule-shift { margin-top: .8rem; padding: .65rem; border-radius: 8px; background: #f3f6fa; }.schedule-shift b, .schedule-shift small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.schedule-shift b { font-size: .74rem; }.schedule-shift small { margin-top: .2rem; color: #71819a; font-size: .65rem; }.schedule-empty { margin-top: 2.8rem; color: #a2aec0; font-size: .72rem; text-align: center; }.dashboard-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }.dashboard-section--panel { padding: 1.2rem; }.count-badge { display: grid; place-items: center; min-width: 25px; height: 25px; border-radius: 50%; color: #d74460; background: #ffeaee; font-size: .72rem; font-weight: 900; }.exception-list, .team-list { display: grid; gap: .75rem; }.exception-list article, .team-list article { display: flex; align-items: flex-start; gap: .65rem; padding: .75rem 0; border-top: 1px solid #edf0f5; }.exception-list__icon { display: grid; place-items: center; flex: 0 0 auto; width: 27px; height: 27px; border-radius: 8px; color: #d84961; background: #ffeaed; font-size: .8rem; font-weight: 900; }.exception-list b, .team-list b { font-size: .78rem; }.exception-list p { margin: .15rem 0 .5rem; color: #7b899e; font-size: .69rem; }.exception-list form { display: flex; gap: .4rem; }.exception-list input, .exception-list input:focus { min-width: 0; padding: .45rem .55rem; border: 1px solid #dce3ed; border-radius: 6px; outline: none; font: inherit; font-size: .68rem; }.exception-list input { flex: 1; }.exception-list input:focus { border-color: #7863e7; }.exception-list input[type="submit"], .dashboard-section__actions input[type="submit"], .dashboard-table button, .tool-form input[type="submit"] { border: 0; border-radius: 6px; color: #fff; background: #5d48d5; font: inherit; font-size: .66rem; font-weight: 800; cursor: pointer; }.exception-list input[type="submit"] { padding: 0 .55rem; }.dashboard-empty { padding: 1.2rem .2rem .4rem; color: #7e8ca1; text-align: center; }.dashboard-empty span { display: grid; place-items: center; width: 34px; height: 34px; margin: 0 auto .5rem; border-radius: 11px; color: #5843ca; background: #eeebff; font-weight: 900; }.dashboard-empty b { display: block; color: #475a76; font-size: .78rem; }.dashboard-empty p { margin: .25rem 0 0; font-size: .7rem; }.team-list article { align-items: center; }.team-list article > span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; color: #536a8c; background: #eaf0f8; font-size: .7rem; font-weight: 900; }.team-list p { flex: 1; margin: 0; }.team-list b, .team-list small { display: block; }.team-list small { margin-top: .12rem; color: #8795aa; font-size: .65rem; }.team-list code { color: #705bdb; font-family: inherit; }.team-status { padding: .2rem .42rem; border-radius: 999px; color: #159870; background: #e5faf2; font-size: .6rem; font-style: normal; font-weight: 850; text-transform: capitalize; }.team-status--inactive { color: #a26b18; background: #fff3dd; }.kiosk-strip { display: flex; align-items: center; gap: .6rem; margin-top: .4rem; padding-top: .85rem; border-top: 1px solid #edf0f5; }.kiosk-strip p { margin: 0; }.kiosk-strip b, .kiosk-strip small { display: block; }.kiosk-strip b { font-size: .73rem; }.kiosk-strip small { color: #8b98ab; font-size: .65rem; }.dashboard-section__actions { display: flex; align-items: center; gap: .55rem; }.dashboard-section__actions form { display: flex; gap: .35rem; }.dashboard-section__actions input[type="date"] { border: 1px solid #dce3ed; border-radius: 6px; padding: .3rem; color: #4d5d72; font: inherit; font-size: .67rem; }.dashboard-section__actions input[type="submit"] { padding: .5rem .65rem; }.dashboard-outline-button { padding: .43rem .65rem; border: 1px solid #dce3ed; border-radius: 6px; color: #53657c !important; background: #fff; }.dashboard-table-wrap { overflow-x: auto; }.dashboard-table { width: 100%; border-collapse: collapse; font-size: .74rem; }.dashboard-table th { padding: .7rem; color: #8694a8; font-size: .63rem; letter-spacing: .05em; text-align: left; text-transform: uppercase; }.dashboard-table td { padding: .75rem .7rem; border-top: 1px solid #edf0f5; color: #62728a; }.dashboard-table td:first-child { color: #283b58; }.timesheet-status { padding: .23rem .45rem; border-radius: 999px; color: #a86d16; background: #fff1d9; font-size: .62rem; font-weight: 850; text-transform: capitalize; }.dashboard-table button { padding: .4rem .6rem; }.dashboard-table button:disabled { color: #9ba7b6; background: #edf0f5; cursor: default; }.dashboard-tools { margin-top: 1.8rem; }.dashboard-tools details { margin-top: .65rem; padding: 0 1rem; }.dashboard-tools summary { display: flex; align-items: center; justify-content: space-between; padding: .85rem 0; color: #344963; font-size: .8rem; font-weight: 850; cursor: pointer; }.dashboard-tools summary span { color: #6049d8; font-size: 1.1rem; }.tool-form { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: .55rem; padding: .2rem 0 .9rem; }.tool-form input, .tool-form select { min-width: 0; padding: .55rem; border: 1px solid #dce3ed; border-radius: 7px; color: #3a4e69; background: #fff; font: inherit; font-size: .7rem; }.tool-form input[type="submit"] { padding: 0 .75rem; }.dashboard-tools details > p { margin: 0 0 .5rem; color: #7c8ba1; font-size: .68rem; }.tool-form--import { grid-template-columns: 1fr auto; }.tool-form--shift { grid-template-columns: repeat(5, minmax(0, 1fr)) auto; }
.reveal { animation: enter .8s both; }.hero-3d .command-card { animation-delay: .12s; }.orbit .feature-card:nth-child(2) { animation-delay: .12s; }.orbit .feature-card:nth-child(3) { animation-delay: .24s; }.orbit .feature-card:nth-child(4) { animation-delay: .36s; }@keyframes enter { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes accessEnter { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }@keyframes accessCardEnter { from { opacity: 0; transform: translate3d(24px, 18px, 0) scale(.96); } to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } }@keyframes alertPulse { 70% { box-shadow: 0 0 0 9px rgba(255,93,127,0); } 100% { box-shadow: 0 0 0 0 rgba(255,93,127,0); } }@keyframes alertDrift { to { transform: translate3d(35px, 25px, 0) scale(1.12); } }@keyframes scanner { 0%, 16% { transform: translateX(0); opacity: 0; } 22% { opacity: 1; } 58% { transform: translateX(450%); opacity: 1; } 68%, 100% { transform: translateX(450%); opacity: 0; } }
@media (max-width: 900px) { .hero-3d { grid-template-columns: 1fr; gap: 2rem; padding-top: 5rem; }.hero-3d h1 { max-width: 700px; }.command-card { max-width: 570px; }.chaos-callout { margin-bottom: 4rem; }.orbit { grid-template-columns: repeat(2, 1fr); }.proof { align-items: flex-start; flex-direction: column; }.access-alert { grid-template-columns: 1fr; gap: 3rem; }.access-alert__intro { max-width: 650px; }.access-alert__signal { margin-top: 4rem; }.access-card { max-width: 560px; width: 100%; } }.marketing-footer { grid-template-columns: 1fr; }.marketing-footer nav { flex-wrap: wrap; }
@media (max-width: 600px) { .shell { width: min(100% - 32px, 1160px); }.phone-link { display: none; }.marketing-nav { padding-top: 16px; }.hero-3d { min-height: auto; padding: 4rem 0; }.hero-3d h1 { font-size: clamp(3.15rem, 16vw, 4.5rem); }.hero-3d__actions { align-items: flex-start; flex-direction: column; }.chaos-callout { grid-template-columns: 105px minmax(0, 1fr); gap: 1rem; padding: .8rem; }.chaos-callout__image { width: 105px; height: 130px; }.chaos-callout h2 { font-size: 1.35rem; }.chaos-callout p:last-child { font-size: .84rem; }.orbit { grid-template-columns: 1fr; padding-bottom: 4rem; }.proof div { flex-wrap: wrap; }.marketing-footer nav { gap: .65rem 1.1rem; }.access-alert { min-height: 100svh; padding: 1.5rem 1.25rem 2.5rem; gap: 2.5rem; }.access-alert__signal { margin-top: 3.5rem; }.access-alert h1 { font-size: clamp(3.35rem, 17vw, 4.5rem); }.access-alert__intro > p { font-size: .95rem; }.access-card { padding: 1.4rem; border-radius: 20px; }.access-card__footer { align-items: flex-start; flex-direction: column; } }
@media (max-width: 1050px) { .dashboard-shell { grid-template-columns: 195px minmax(0, 1fr); }.dashboard-sidebar { padding-inline: 12px; }.dashboard-workspace { padding-inline: 24px; }.dashboard-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }.dashboard-columns { grid-template-columns: 1fr; }.tool-form--shift { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) { .dashboard-shell { display: block; }.dashboard-sidebar { position: static; display: block; height: auto; padding: 18px 16px 0; border-right: 0; border-bottom: 1px solid #e3e9f1; }.dashboard-sidebar__location, .dashboard-sidebar__bottom { display: none; }.dashboard-nav { display: flex; overflow-x: auto; gap: .4rem; margin-top: 1rem; padding-bottom: 12px; }.dashboard-nav a { flex: 0 0 auto; padding: .65rem .75rem; font-size: .78rem; }.dashboard-nav a b { display: none; }.dashboard-workspace { padding: 28px 16px 44px; }.dashboard-topbar { align-items: flex-start; flex-direction: column; gap: 1rem; }.dashboard-topbar h1 { font-size: 2rem; }.dashboard-metrics { grid-template-columns: 1fr 1fr; gap: .7rem; }.dashboard-metrics article { padding: .9rem; }.schedule-board { grid-template-columns: repeat(7, 145px); }.dashboard-section__heading { align-items: flex-start; }.dashboard-section__actions { align-items: stretch; flex-direction: column; }.dashboard-section__actions form { flex-wrap: wrap; }.dashboard-table { min-width: 500px; }.tool-form, .tool-form--shift { grid-template-columns: 1fr; }.tool-form input[type="submit"] { min-height: 38px; }.dashboard-tools details { padding-inline: .8rem; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }
.schedule-shift { border: 0; }.schedule-shift--day-link { display: block; color: inherit; text-decoration: none; cursor: pointer; transition: background .16s ease, transform .16s ease; }.schedule-shift--day-link:hover, .schedule-shift--day-link:focus-visible { background: #ebe7ff; outline: 2px solid #725bf0; outline-offset: 2px; transform: translateY(-1px); }.schedule-empty--link { display: block; color: #8b98ab; text-decoration: none; }.schedule-empty--link:hover, .schedule-empty--link:focus-visible { color: #5946cf; text-decoration: underline; }.shift-status { display: inline-block; margin-top: .4rem; padding: .15rem .3rem; border-radius: 99px; color: #886218; background: #fff0d2; font-size: .56rem; font-style: normal; font-weight: 850; text-transform: capitalize; }.shift-status--published { color: #158f6a; background: #e2f9f0; }.schedule-shift__manage { display: grid; gap: .4rem; margin-top: .65rem; padding-top: .65rem; border-top: 1px solid #dee5ed; }.schedule-shift__manage form { display: grid; gap: .35rem; }.schedule-shift__manage select, .schedule-shift__manage input { width: 100%; min-width: 0; padding: .38rem; border: 1px solid #d8e0ea; border-radius: 5px; color: #475c78; background: #fff; font: inherit; font-size: .62rem; }.schedule-shift__manage input[type="submit"], .schedule-shift__manage button { padding: .42rem; border: 0; border-radius: 5px; color: #fff; background: #5d48d5; font: inherit; font-size: .62rem; font-weight: 800; cursor: pointer; }.schedule-shift__manage form.button_to button { width: 100%; background: #b35b68; }
.team-page { min-height: 100vh; padding: 34px clamp(18px, 4vw, 58px) 60px; color: #1b2b46; background: #f4f7fb; }.team-page__header { display: flex; align-items: flex-start; gap: 2rem; max-width: 1400px; margin: 0 auto 2rem; }.team-page__back { display: inline-flex; margin-top: .25rem; padding: .55rem .75rem; border: 1px solid #dde5ef; border-radius: 8px; color: #5d6f88; background: #fff; font-size: .75rem; font-weight: 800; text-decoration: none; }.team-page h1 { margin: 0; font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.02em; }.team-page__header p:last-child { margin: .4rem 0 0; color: #74849b; }.team-layout { display: grid; grid-template-columns: minmax(245px, .34fr) minmax(0, 1fr); max-width: 1400px; margin: 0 auto; gap: 1rem; }.team-directory, .team-detail, .team-card { border: 1px solid #e0e7ef; border-radius: 16px; background: #fff; box-shadow: 0 2px 5px rgba(31,49,81,.035); }.team-directory { align-self: start; padding: 1rem; }.team-directory__heading, .team-card__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }.team-directory h2, .team-card h3, .team-profile h2 { margin: 0; letter-spacing: -.02em; }.team-directory h2 { font-size: 1.3rem; }.team-directory__heading > a { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #fff; background: #5f4bd6; font-size: 1.2rem; text-decoration: none; }.team-directory__list { display: grid; gap: .35rem; margin-top: .85rem; }.team-directory__person { display: flex; align-items: center; gap: .6rem; padding: .65rem; border-radius: 10px; color: #334864; text-decoration: none; }.team-directory__person:hover, .team-directory__person.is-selected { background: #f0eeff; }.team-directory__person > span { display: grid; place-items: center; flex: 0 0 auto; width: 31px; height: 31px; border-radius: 50%; color: #5946cf; background: #e7e4ff; font-size: .7rem; font-weight: 900; }.team-directory__person p { flex: 1; min-width: 0; margin: 0; }.team-directory__person b, .team-directory__person small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.team-directory__person b { font-size: .76rem; }.team-directory__person small { margin-top: .1rem; color: #8795aa; font-size: .65rem; }.team-add { margin-top: .9rem; padding-top: .85rem; border-top: 1px solid #ecf0f5; }.team-add summary { display: flex; justify-content: space-between; color: #5f4bd6; font-size: .73rem; font-weight: 850; cursor: pointer; }.team-detail { min-width: 0; padding: clamp(1rem, 2.5vw, 1.8rem); }.team-detail--empty { display: grid; min-height: 440px; place-items: center; color: #74849b; text-align: center; }.team-detail--empty span { display: grid; place-items: center; width: 48px; height: 48px; margin: auto; border-radius: 14px; color: #5c48d0; background: #eeebff; font-size: 1.3rem; }.team-detail--empty h2 { margin: .8rem 0 .25rem; color: #334864; }.team-detail--empty p { margin: 0; }.team-profile { display: flex; align-items: center; gap: .8rem; }.team-profile__avatar { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 16px; color: #fff; background: linear-gradient(145deg, #7761ef, #5040bd); font-size: 1.15rem; font-weight: 900; }.team-profile p { margin: .25rem 0 0; color: #8190a4; font-size: .74rem; }.team-profile code { color: #634fd7; font-family: inherit; }.team-profile .team-status { margin-left: auto; }.team-hour-report { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin: 1.25rem 0; }.team-hour-report article { padding: .85rem; border: 1px solid #e7ebf1; border-radius: 12px; background: #fafbfe; }.team-hour-report p { margin: 0; color: #8190a5; font-size: .67rem; font-weight: 750; }.team-hour-report strong { display: block; margin: .28rem 0; font-size: 1.4rem; letter-spacing: -.02em; }.team-hour-report small { color: #909caf; font-size: .63rem; }.team-detail__grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }.team-card { padding: 1rem; }.team-card h3 { font-size: 1.05rem; }.team-card__hint, .team-card > p { margin: .5rem 0 .8rem; color: #8090a5; font-size: .7rem; line-height: 1.45; }.team-form { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }.team-form input, .team-form select { min-width: 0; min-height: 36px; padding: .5rem .58rem; border: 1px solid #dce4ed; border-radius: 7px; color: #40546e; background: #fff; font: inherit; font-size: .69rem; }.team-form input[type="submit"] { border: 0; color: #fff; background: #5d48d5; font-weight: 850; cursor: pointer; }.team-card__actions { display: grid; grid-template-columns: 1fr auto; gap: .55rem; margin-top: .75rem; }.team-pin-form { display: flex; gap: .4rem; }.team-pin-form input { min-width: 0; flex: 1; padding: .5rem; border: 1px solid #dce4ed; border-radius: 7px; font: inherit; font-size: .68rem; }.team-pin-form input[type="submit"], .team-archive-button { padding: .5rem .65rem; border: 0; border-radius: 7px; color: #fff; background: #536a8c; font: inherit; font-size: .67rem; font-weight: 800; cursor: pointer; }.team-archive-button { background: #ad5966; }.team-archive-button:disabled { opacity: .5; cursor: default; }.team-card--wide { margin-top: .8rem; }.team-card--wide > .team-card__heading > span { color: #8795a8; font-size: .69rem; font-weight: 750; }.team-shift-list { display: grid; gap: .5rem; margin-top: .8rem; }.team-shift-list details { padding: .65rem; border: 1px solid #e5ebf2; border-radius: 9px; background: #fafbfe; }.team-shift-list summary { display: flex; align-items: center; gap: .65rem; cursor: pointer; list-style: none; }.team-shift-list summary::-webkit-details-marker { display: none; }.team-shift-list__date { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; color: #604bd1; background: #ece9ff; }.team-shift-list__date b, .team-shift-list__date small { display: block; line-height: 1; }.team-shift-list__date b { font-size: .58rem; }.team-shift-list__date small { margin-top: .12rem; font-size: .75rem; font-weight: 900; }.team-shift-list summary p { flex: 1; margin: 0; }.team-shift-list summary p b, .team-shift-list summary p small { display: block; }.team-shift-list summary p b { font-size: .75rem; }.team-shift-list summary p small { margin-top: .15rem; color: #8997aa; font-size: .64rem; }.team-shift-list__edit { display: grid; gap: .5rem; margin-top: .7rem; padding-top: .7rem; border-top: 1px solid #e4eaf1; }.team-form--inline { grid-template-columns: repeat(5, minmax(0, 1fr)) auto; }.team-shift-list__edit .button_to button { padding: .45rem .65rem; border: 0; border-radius: 6px; color: #fff; background: #167f61; font: inherit; font-size: .66rem; font-weight: 800; cursor: pointer; }.team-shift-list__edit .button_to:last-child button { background: #ae5966; }.team-card__empty { padding: 1.5rem 0 .4rem; color: #8090a5; text-align: center; }.team-card__empty span { display: grid; place-items: center; width: 30px; height: 30px; margin: auto; border-radius: 8px; color: #5e49d4; background: #ece9ff; font-weight: 900; }.team-card__empty b { display: block; margin-top: .4rem; color: #425771; font-size: .75rem; }.team-card__empty p { margin: .2rem 0; font-size: .68rem; }
@media (max-width: 900px) { .team-layout { grid-template-columns: 1fr; }.team-directory { max-height: 290px; overflow: auto; }.team-directory__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }.team-detail__grid { grid-template-columns: 1fr; }.team-form--inline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .team-page { padding: 22px 14px 44px; }.team-page__header { gap: 1rem; }.team-page__back { font-size: 0; }.team-page__back::after { content: "←"; font-size: .9rem; }.team-directory__list { grid-template-columns: 1fr; }.team-hour-report { grid-template-columns: 1fr; }.team-card__actions { grid-template-columns: 1fr; }.team-form { grid-template-columns: 1fr; }.team-form--inline { grid-template-columns: 1fr; }.team-profile { align-items: flex-start; }.team-profile .team-status { margin-left: 0; } }
.team-page--directory { min-width: 0; }.team-page--directory .team-page__header { align-items: center; justify-content: space-between; }.team-add-button { flex: 0 0 auto; min-height: 42px; padding: .65rem .9rem; border: 0; border-radius: 9px; color: #fff; background: #5d48d5; box-shadow: 0 10px 22px rgba(93,72,213,.24); font: inherit; font-size: .76rem; font-weight: 850; cursor: pointer; }.staff-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; max-width: 1400px; margin: 0 auto; }.staff-summary-card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: .7rem; padding: 1rem; border: 1px solid #e0e7ef; border-radius: 15px; color: #283d59; background: #fff; box-shadow: 0 2px 5px rgba(31,49,81,.035); font: inherit; text-align: left; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }.staff-summary-card:hover { border-color: #b8acef; box-shadow: 0 12px 28px rgba(50,45,101,.1); transform: translateY(-3px); }.staff-summary-card__avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: #fff; background: linear-gradient(145deg, #7761ef, #5040bd); font-size: .85rem; font-weight: 900; }.staff-summary-card h2 { margin: .05rem 0; font-size: 1rem; letter-spacing: -.02em; }.staff-summary-card__meta { margin: .25rem 0 0; color: #8190a5; font-size: .67rem; }.staff-summary-card .team-status { justify-self: start; grid-column: 2; }.staff-summary-card__open { grid-column: 1 / -1; padding-top: .65rem; border-top: 1px solid #edf0f5; color: #604bd3; font-size: .7rem; }.team-directory-empty { max-width: 600px; margin: 4rem auto; color: #7c8ca1; text-align: center; }.team-directory-empty span { display: grid; place-items: center; width: 48px; height: 48px; margin: auto; border-radius: 14px; color: #5d49d3; background: #ece9ff; font-size: 1.25rem; }.team-directory-empty h2 { margin: .8rem 0 .3rem; color: #354a67; }.team-directory-empty p { max-width: 400px; margin: 0 auto 1rem; font-size: .8rem; }.staff-dialog { width: min(860px, calc(100vw - 32px)); max-height: min(830px, calc(100vh - 32px)); overflow: auto; padding: 0; border: 1px solid #e0e7ef; border-radius: 18px; color: #293e5a; box-shadow: 0 28px 90px rgba(19,25,52,.3); }.staff-dialog::backdrop { background: rgba(19,28,50,.58); backdrop-filter: blur(4px); }.staff-dialog__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.35rem; border-bottom: 1px solid #e8edf3; }.staff-dialog__header h2 { margin: .1rem 0 0; letter-spacing: -.02em; }.staff-dialog__close { display: grid; place-items: center; width: 31px; height: 31px; border: 0; border-radius: 50%; color: #61738d; background: #eff3f8; font-size: 1.3rem; cursor: pointer; }.staff-dialog .team-form { padding: 1.25rem 1.35rem; }.team-form--modal { grid-template-columns: 1fr 1fr; }.staff-dialog__identity { display: flex; align-items: center; gap: .7rem; }.staff-dialog__identity p:last-child { margin: .15rem 0 0; color: #8290a3; font-size: .7rem; }.staff-dialog__identity code { color: #604bd3; font-family: inherit; }.staff-dialog--detail .team-hour-report { margin: 1.1rem 1.35rem; }.staff-dialog__columns { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid #e8edf3; }.staff-dialog__columns > section { padding: 1.15rem 1.35rem; }.staff-dialog__columns > section + section { border-left: 1px solid #e8edf3; }.staff-dialog__columns > section > .dashboard-kicker { margin-bottom: .65rem; }.staff-dialog__hint { margin: 0 0 .75rem; color: #7e8da1; font-size: .7rem; line-height: 1.45; }.staff-dialog__columns .team-form { padding: 0; }.staff-dialog__shifts { padding: 1.15rem 1.35rem; border-top: 1px solid #e8edf3; }.staff-dialog__shifts h3 { margin: 0; font-size: 1rem; letter-spacing: -.02em; }.staff-dialog__shifts ul { display: grid; gap: .45rem; margin: .75rem 0 0; padding: 0; list-style: none; }.staff-dialog__shifts li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem .7rem; border-radius: 8px; background: #f6f8fc; font-size: .72rem; }.staff-dialog__shifts li b { display: block; }.staff-dialog__shifts li span { color: #8390a4; font-size: .65rem; }.staff-dialog__danger { display: grid; grid-template-columns: 1fr auto; gap: .6rem; padding: 1rem 1.35rem 1.35rem; border-top: 1px solid #e8edf3; }.staff-dialog__danger .team-pin-form { margin: 0; }.staff-dialog__danger .team-archive-button { margin: 0; }
@media (max-width: 1120px) { .staff-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 650px) { .team-page--directory .team-page__header { align-items: flex-start; }.team-page--directory .team-page__header .team-page__back { display: none; }.team-add-button { min-height: 38px; padding-inline: .65rem; white-space: nowrap; }.staff-summary-grid { grid-template-columns: 1fr; }.staff-dialog { width: min(100vw - 16px, 860px); }.team-form--modal, .staff-dialog__columns, .staff-dialog__danger { grid-template-columns: 1fr; }.staff-dialog__columns > section + section { border-top: 1px solid #e8edf3; border-left: 0; }.staff-dialog__shifts li { align-items: flex-start; flex-direction: column; gap: .25rem; }.staff-dialog__danger { gap: .75rem; } }
.staff-dialog__body { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr); border-top: 1px solid #e8edf3; }.staff-dialog__profile, .staff-dialog__shifts { padding: 1.25rem 1.35rem; }.staff-dialog__profile { border-right: 1px solid #e8edf3; }.staff-dialog__profile > .dashboard-kicker { margin-bottom: .7rem; }.staff-dialog__profile .team-form { padding: 0; }.staff-dialog__shifts-heading { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }.staff-dialog__shifts-heading h3 { margin: 0; font-size: 1.15rem; letter-spacing: -.02em; }.shift-add-button, .staff-shift-rows__blank { border: 1px dashed #b5abed; border-radius: 8px; color: #5946ca; background: #f5f3ff; font: inherit; font-size: .75rem; font-weight: 850; cursor: pointer; }.shift-add-button { padding: .55rem .65rem; white-space: nowrap; }.staff-shift-rows { display: grid; gap: .5rem; margin-top: .85rem; }.staff-shift-rows article { display: flex; align-items: center; gap: .65rem; padding: .7rem; border: 1px solid #e3e9f1; border-radius: 9px; background: #fafbfe; }.staff-shift-rows article > span { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 8px; color: #604bd1; background: #ece9ff; }.staff-shift-rows article > span b, .staff-shift-rows article > span small { display: block; line-height: 1; }.staff-shift-rows article > span b { font-size: .58rem; }.staff-shift-rows article > span small { margin-top: .13rem; font-size: .78rem; font-weight: 900; }.staff-shift-rows article p { flex: 1; margin: 0; }.staff-shift-rows article p b, .staff-shift-rows article p small { display: block; }.staff-shift-rows article p b { font-size: .78rem; }.staff-shift-rows article p small { margin-top: .12rem; color: #8492a6; font-size: .67rem; }.staff-shift-rows__blank { display: flex; align-items: center; justify-content: center; gap: .5rem; min-height: 48px; }.staff-shift-rows__blank span { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; color: #fff; background: #604bd1; font-size: 1rem; }.shift-dialog { width: min(510px, calc(100vw - 32px)); padding: 0; border: 1px solid #e0e7ef; border-radius: 17px; color: #293e5a; box-shadow: 0 28px 90px rgba(19,25,52,.3); }.shift-dialog::backdrop { background: rgba(19,28,50,.65); backdrop-filter: blur(5px); }.shift-dialog__form { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: .7rem; padding: 1.35rem; }.shift-dialog__form p { margin: 0; }.shift-dialog__form label { display: block; margin-bottom: .4rem; color: #697b94; font-size: .75rem; font-weight: 850; }.shift-dialog__form input[type="datetime-local"] { width: 100%; min-height: 45px; padding: .55rem; border: 1px solid #d8e1ec; border-radius: 8px; color: #334a68; font: inherit; }.shift-dialog__dash { padding-bottom: .7rem; color: #806ee4; font-size: 1.2rem; }.shift-dialog__actions { display: flex; grid-column: 1 / -1; justify-content: flex-end; gap: .55rem; margin-top: .5rem; }.shift-dialog__actions button, .shift-dialog__actions input[type="submit"] { min-height: 39px; padding: .5rem .85rem; border: 0; border-radius: 8px; font: inherit; font-size: .75rem; font-weight: 850; cursor: pointer; }.shift-dialog__actions button { color: #62738b; background: #eef2f7; }.shift-dialog__actions input[type="submit"] { color: #fff; background: #5d48d5; }
@media (max-width: 650px) { .staff-dialog__body { grid-template-columns: 1fr; }.staff-dialog__profile { border-right: 0; border-bottom: 1px solid #e8edf3; }.shift-dialog__form { grid-template-columns: 1fr; }.shift-dialog__dash { display: none; }.shift-dialog__actions { margin-top: 0; } }
.staff-page { min-width: 0; min-height: 100vh; padding: 34px clamp(22px, 4vw, 64px) 60px; color: #1b2b46; background: #f4f7fb; }.staff-page__header, .staff-page__grid, .staff-page__hours, .staff-page__access { max-width: 1400px; margin-right: auto; margin-left: auto; }.staff-page__header { display: flex; align-items: center; gap: 1.15rem; margin-bottom: 1.5rem; }.staff-page__back { flex: 0 0 auto; padding: .75rem .9rem; border: 1px solid #dde5ef; border-radius: 9px; color: #516681; background: #fff; font-size: .82rem; font-weight: 850; text-decoration: none; }.staff-page__heading { flex: 1; }.staff-page__heading h1 { margin: .05rem 0; font-size: clamp(2rem, 4vw, 3.25rem); letter-spacing: -.02em; }.staff-page__heading p:last-child { margin: .25rem 0 0; color: #798aa1; }.staff-page__heading code { color: #604bd3; font-family: inherit; }.staff-page__hours { margin-top: 0; margin-bottom: 1rem; }.staff-page__grid { display: grid; grid-template-columns: minmax(300px, .85fr) minmax(0, 1.15fr); gap: 1rem; }.staff-page__panel { padding: 1.25rem; border: 1px solid #e0e7ef; border-radius: 16px; background: #fff; box-shadow: 0 2px 5px rgba(31,49,81,.035); }.staff-page__panel h2 { margin: .08rem 0 .9rem; font-size: 1.2rem; letter-spacing: -.02em; }.staff-page__profile-form { margin-top: 1rem; }.staff-page__panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }.staff-page__panel-heading h2 { margin-bottom: 0; }.staff-page__access { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 1rem; margin-top: 1rem; }.staff-page__access .dashboard-kicker { grid-column: 1; margin: 0; }.staff-page__access h2 { grid-column: 1; margin: 0; }.staff-page__access .team-pin-form { grid-column: 2; grid-row: 1 / span 2; }.shift-dialog { width: min(760px, calc(100vw - 32px)); }.shift-dialog__form { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }.shift-dialog__form input[type="datetime-local"] { min-width: 0; box-sizing: border-box; }
@media (max-width: 900px) { .staff-page__grid { grid-template-columns: 1fr; }.staff-page__access { grid-template-columns: 1fr; }.staff-page__access .team-pin-form { grid-column: 1; grid-row: auto; } }
@media (max-width: 650px) { .staff-page { padding: 22px 14px 44px; }.staff-page__header { align-items: flex-start; flex-wrap: wrap; }.staff-page__heading { order: 3; flex-basis: 100%; }.staff-page__header .team-add-button { margin-left: auto; }.staff-page__panel-heading { align-items: flex-start; flex-direction: column; }.staff-page__panel-heading .shift-add-button { width: 100%; }.shift-dialog { width: calc(100vw - 16px); } }
.shift-dialog__form input[type="time"] { width: 100%; min-width: 0; min-height: 45px; box-sizing: border-box; padding: .55rem; border: 1px solid #d8e1ec; border-radius: 8px; color: #334a68; font: inherit; }
.staff-page__identity-grid { margin-bottom: 1rem; }.staff-page__identity-grid .staff-page__access { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .8fr); align-items: end; gap: 1.1rem; margin-top: 0; }.staff-page__access-code { display: flex; align-items: center; gap: .55rem; margin: .65rem 0 .45rem; }.staff-page__access-code code { padding: .4rem .55rem; border-radius: 7px; color: #4f3dbb; background: #efecff; font-family: inherit; font-size: 1rem; font-weight: 900; letter-spacing: .08em; }.staff-page__access-code span { color: #7d8ba1; font-size: .7rem; font-weight: 750; }.staff-page__pin-note { margin: 0; color: #7d8ba1; font-size: .7rem; line-height: 1.45; }.staff-page__profile-form input[type="submit"] { grid-column: 1 / -1; }.staff-page__identity-grid .staff-page__access .team-pin-form { display: grid; gap: .5rem; grid-column: auto; grid-row: auto; }.staff-page__identity-grid .staff-page__access .team-pin-form input { min-width: 0; min-height: 38px; }.staff-page__identity-grid .staff-page__access .team-pin-form input[type="submit"] { min-height: 38px; padding: 0 .7rem; border: 0; border-radius: 7px; color: #fff; background: #5d48d5; font: inherit; font-size: .7rem; font-weight: 850; cursor: pointer; }
@media (max-width: 900px) { .staff-page__identity-grid .staff-page__access { grid-template-columns: 1fr; } }
.staff-page__revealed-pin { display: flex; align-items: center; gap: .55rem; margin: .65rem 0 .45rem; }.staff-page__revealed-pin code { padding: .4rem .55rem; border-radius: 7px; color: #4f3dbb; background: #efecff; font-family: inherit; font-size: 1rem; font-weight: 900; letter-spacing: .08em; }.staff-page__revealed-pin span { color: #7d8ba1; font-size: .7rem; font-weight: 750; }.staff-page__reveal-pin { margin-top: .7rem; padding: .5rem .65rem; border: 0; border-radius: 7px; color: #fff; background: #536a8c; font: inherit; font-size: .7rem; font-weight: 850; cursor: pointer; }
.location-hours-list { display: grid; gap: .65rem; margin-top: 1rem; }.location-hours-form { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(140px, .75fr) minmax(140px, .75fr) auto; align-items: center; gap: .75rem; padding: .85rem; border: 1px solid #e3e9f1; border-radius: 10px; background: #fafbfe; }.location-hours-form b { color: #344966; }.location-hours-form label { display: grid; gap: .25rem; color: #74849c; font-size: .76rem; font-weight: 750; }.location-hours-form input { min-height: 38px; padding: .4rem .5rem; border: 1px solid #d8e1ec; border-radius: 7px; color: #344966; background: #fff; font: inherit; }.location-hours-form input[type="submit"] { padding: .6rem .75rem; border: 0; border-radius: 7px; color: #fff; background: #5d48d5; font-weight: 850; cursor: pointer; } @media (max-width: 720px) { .location-hours-form { grid-template-columns: 1fr 1fr; }.location-hours-form b { grid-column: 1 / -1; }.location-hours-form input[type="submit"] { grid-column: 1 / -1; } }
.location-workspace { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }.location-card { padding: 1.2rem; border: 1px solid #e0e7ef; border-radius: 16px; background: #fff; box-shadow: 0 2px 5px rgba(31,49,81,.035); }.location-card > header, .location-card__team > div { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }.location-card h2, .location-card h3, .location-create h2 { margin: .08rem 0 .85rem; color: #273d59; letter-spacing: -.02em; }.location-card > header > span { padding: .35rem .5rem; border-radius: 999px; color: #5c48d0; background: #eeebff; font-size: .72rem; font-weight: 850; }.location-form { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }.location-form label { display: grid; gap: .28rem; color: #73839b; font-size: .75rem; font-weight: 800; }.location-form input, .location-form input[type="time"], .location-assign-form select { min-width: 0; min-height: 41px; box-sizing: border-box; padding: .45rem .55rem; border: 1px solid #d8e1ec; border-radius: 8px; color: #344966; background: #fff; font: inherit; }.location-form input[type="submit"], .location-assign-form input[type="submit"] { min-height: 41px; border: 0; border-radius: 8px; color: #fff; background: #5d48d5; font: inherit; font-weight: 850; cursor: pointer; }.location-card__team { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e8edf3; }.location-card__team h3 { margin-bottom: .2rem; font-size: 1rem; }.location-card__team p { margin: 0; color: #7d8ca0; font-size: .74rem; }.location-staff { display: flex; align-items: center; gap: .5rem; margin-top: .65rem !important; }.location-staff span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; color: #fff; background: #604bd3; font-size: .68rem; font-weight: 900; }.location-staff b { color: #425773; }.location-assign-form { display: grid; grid-template-columns: 1fr auto; gap: .55rem; margin-top: .85rem; }.location-create { margin-top: 1rem; }.location-create .location-form { max-width: 720px; } @media (max-width: 900px) { .location-workspace { grid-template-columns: 1fr; } } @media (max-width: 600px) { .location-form { grid-template-columns: 1fr; } }
.location-hours-week { grid-column: 1 / -1; display: grid; gap: .6rem; padding: .85rem; border: 1px solid #e3e9f1; border-radius: 10px; background: #fafbfe; }.location-hours-week > b { margin-bottom: .15rem; color: #41546e; }.location-hours-day { padding: .55rem; border: 1px solid #e4eaf2; border-radius: 8px; background: #fff; }.location-hours-day__header { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .45rem; }.location-hours-day__header > span { color: #3c516d; font-size: .76rem; font-weight: 850; }.location-hours-day__header label { display: flex; align-items: center; gap: .35rem; color: #73839b; font-size: .7rem; font-weight: 750; }.location-hours-day input[type="checkbox"] { min-height: auto; width: auto; padding: 0; }.location-hours-chunks { display: grid; gap: .4rem; }.location-hours-chunk { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; align-items: start; gap: .4rem; }.location-hours-chunk input[type="time"] { min-height: 34px; }.location-hours-chunk i { color: #8a98a9; font-style: normal; }.location-hours-chunk button, .location-hours-add { border: 0; border-radius: 6px; color: #604bd3; background: #eeebff; font: inherit; font-size: .72rem; font-weight: 850; cursor: pointer; }.location-hours-chunk button { width: 28px; height: 34px; font-size: 1rem; }.location-hours-add { margin-top: .45rem; padding: .4rem .55rem; }.location-hours-day.is-closed .location-hours-chunks { opacity: .45; }.location-form--dialog { padding: 1.25rem 1.35rem; }.location-form--dialog input[type="submit"] { grid-column: 1 / -1; } @media (max-width: 600px) { .location-hours-chunk { grid-template-columns: 1fr auto 1fr auto; } }
.location-attendance-policy { grid-column: 1 / -1; padding: .85rem; border: 1px solid #e3e9f1; border-radius: 10px; background: #fafbfe; }.location-attendance-policy__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }.location-attendance-policy__heading b, .location-attendance-policy__heading small { display: block; }.location-attendance-policy__heading b { color: #41546e; font-size: .82rem; }.location-attendance-policy__heading small, .location-attendance-policy__heading p { margin: .16rem 0 0; color: #7c8ba0; font-size: .68rem; line-height: 1.45; }.location-attendance-policy__heading p { max-width: 330px; text-align: right; }.location-attendance-policy__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }.location-attendance-policy__fields label { gap: .18rem; padding: .65rem; border: 1px solid #e4eaf2; border-radius: 8px; background: #fff; color: #41546e; }.location-attendance-policy__fields label span { color: #8290a3; font-size: .66rem; font-weight: 700; }.location-attendance-policy__fields input { min-height: 36px; margin-top: .18rem; } @media (max-width: 600px) { .location-attendance-policy__heading { display: block; }.location-attendance-policy__heading p { text-align: left; }.location-attendance-policy__fields { grid-template-columns: 1fr; } }
.staff-page__week { max-width: 1400px; margin: 0 auto 1rem; }.weekly-shift-editor { display: grid; gap: .6rem; margin-top: 1rem; }.weekly-shift-day { padding: .7rem; border: 1px solid #e1e8f1; border-radius: 10px; background: #fafbfe; }.weekly-shift-day__header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }.weekly-shift-day__header strong, .weekly-shift-day__header span { display: block; }.weekly-shift-day__header strong { color: #334b68; font-size: .86rem; }.weekly-shift-day__header span { margin-top: .08rem; color: #8290a4; font-size: .67rem; font-weight: 750; }.weekly-shift-add { padding: .45rem .6rem; border: 1px dashed #b5abed; border-radius: 7px; color: #5946ca; background: #f5f3ff; font: inherit; font-size: .72rem; font-weight: 850; cursor: pointer; white-space: nowrap; }.weekly-shift-day__rows { display: grid; gap: .4rem; margin-top: .6rem; }.weekly-shift-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .55rem .65rem; border: 1px solid #e4eaf2; border-radius: 7px; background: #fff; }.weekly-shift-row b { color: #334b68; font-size: .76rem; }.weekly-shift-remove { padding: .25rem .4rem; border: 0; border-radius: 5px; color: #a35062; background: #fff0f3; font: inherit; font-size: .67rem; font-weight: 800; cursor: pointer; }.weekly-shift-day__empty { margin: 0; padding: .55rem .65rem; border: 1px dashed #c7cfdb; border-radius: 7px; color: #8290a3; background: transparent; font-size: .72rem; }
.location-workspace { grid-template-columns: 1fr; }.location-card { display: block; width: 100%; padding: 1.35rem; }.location-card > .location-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }.location-card > .location-form > .location-hours-week, .location-card > .location-form > input[type="submit"] { grid-column: 1 / -1; }.location-card > .location-form > input[type="submit"] { width: 100%; }.location-card__team { margin-top: 1.2rem; padding-top: 1.2rem; border-top: 1px solid #e8edf3; }.location-card__team > div:first-child { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; }.location-card__team .dashboard-kicker { margin-bottom: .2rem; }.location-card__team h3 { margin: 0; }.location-assign-button { min-height: 38px; padding: .5rem .7rem; border: 0; border-radius: 8px; color: #fff; background: #5d48d5; font: inherit; font-size: .74rem; font-weight: 850; cursor: pointer; white-space: nowrap; }.location-staff-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: .5rem; width: 100%; margin-top: .75rem; }.location-staff { display: grid; grid-template-columns: 38px minmax(180px, 1fr) minmax(240px, .9fr) auto; align-items: center; gap: 1rem; width: 100%; margin: 0 !important; padding: .8rem .9rem; border: 1px solid #e3e9f1; border-radius: 10px; background: #fafbfe; }.location-staff > span { width: 38px; height: 38px; }.location-staff b, .location-staff small { display: block; }.location-staff b { overflow: hidden; color: #425773; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }.location-staff small { margin-top: .1rem; color: #8492a6; font-size: .66rem; }.location-staff__shift { display: flex; align-items: center; gap: .5rem; margin: 0; color: #667995; font-size: .74rem; }.location-staff__shift b { color: #816ce8; font-size: .66rem; letter-spacing: .05em; text-transform: uppercase; }.location-staff__remove { padding: .35rem .55rem; border: 0; border-radius: 6px; color: #a35062; background: #fff0f3; font: inherit; font-size: .68rem; font-weight: 800; cursor: pointer; }.location-staff-list__empty { margin: 0; color: #8290a3; font-size: .74rem; }.location-assign-dialog { width: min(430px, calc(100vw - 32px)); }.location-assign-dialog__form { display: grid; gap: .75rem; padding: 1.25rem 1.35rem; }.location-assign-dialog__form select, .location-assign-dialog__form input[type="submit"] { min-height: 42px; padding: .5rem .6rem; border-radius: 8px; font: inherit; }.location-assign-dialog__form select { border: 1px solid #d8e1ec; color: #344966; background: #fff; }.location-assign-dialog__form input[type="submit"] { border: 0; color: #fff; background: #5d48d5; font-weight: 850; cursor: pointer; } @media (max-width: 760px) { .location-card > .location-form { grid-template-columns: 1fr; }.location-card__team > div:first-child { align-items: stretch; flex-direction: column; }.location-assign-button { width: 100%; }.location-staff { grid-template-columns: 38px minmax(0, 1fr) auto; }.location-staff__shift { grid-column: 2 / -1; } }

.settings-workspace { display: grid; gap: 1rem; max-width: 920px; }.settings-card { padding: 1.35rem; border: 1px solid #e0e7ef; border-radius: 15px; background: #fff; box-shadow: 0 2px 5px rgba(31,49,81,.035); }.settings-card__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; }.settings-card__heading h2 { margin: .1rem 0 0; color: #263b58; font-size: 1.2rem; letter-spacing: -.02em; }.settings-card__heading > p, .settings-card--danger > p { max-width: 390px; margin: .15rem 0 0; color: #7d8ca0; font-size: .75rem; line-height: 1.45; }.settings-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }.settings-form label, .settings-delete-form label { display: grid; gap: .35rem; color: #51657f; font-size: .73rem; font-weight: 800; }.settings-form input, .settings-form select, .settings-form textarea, .settings-delete-form input { width: 100%; min-height: 40px; box-sizing: border-box; padding: .5rem .6rem; border: 1px solid #dce4ed; border-radius: 8px; color: #344966; background: #fff; font: inherit; font-size: .78rem; }.settings-form input[type="color"] { padding: .2rem; }.settings-form textarea { resize: vertical; }.settings-form__wide, .settings-form input[type="submit"] { grid-column: 1 / -1; }.settings-form input[type="submit"], .settings-delete-form input[type="submit"] { width: fit-content; min-height: 42px; padding: .55rem .85rem; border: 0; border-radius: 8px; color: #fff; background: #5d48d5; font: inherit; font-size: .75rem; font-weight: 850; cursor: pointer; }.settings-card--danger { border-color: #f1cfd5; background: #fffafb; }.settings-card--danger h2 { color: #914755; }.settings-delete-form { display: flex; align-items: end; gap: .7rem; margin-top: 1rem; }.settings-delete-form label { flex: 1; }.settings-delete-form input[type="submit"] { background: #ad5966; white-space: nowrap; } @media (max-width: 650px) { .settings-card__heading, .settings-delete-form { align-items: stretch; flex-direction: column; }.settings-form { grid-template-columns: 1fr; }.settings-form__wide, .settings-form input[type="submit"] { grid-column: auto; }.settings-form input[type="submit"], .settings-delete-form input[type="submit"] { width: 100%; } }

.north-american-phone-input { display: flex; align-items: center; overflow: hidden; border: 1px solid #dce4ed; border-radius: 8px; background: #fff; }.north-american-phone-input b { align-self: stretch; display: grid; place-items: center; padding: 0 .65rem; border-right: 1px solid #dce4ed; color: #526681; background: #f5f7fb; font-size: .78rem; }.settings-form .north-american-phone-input input, .north-american-phone-input input { flex: 1; width: 100%; min-width: 0; border: 0; border-radius: 0; outline: 0; }.phone-format-feedback { color: #74849b; font-size: .66rem; font-weight: 650; }.north-american-phone-input:has(input.is-invalid) { border-color: #d85064; background: #fff8f9; }.north-american-phone-input:has(input.is-invalid) + .phone-format-feedback { color: #ba4255; }

.settings-address { margin-top: .35rem; padding-top: .9rem; border-top: 1px solid #e7ecf3; }.settings-address .dashboard-kicker { margin-bottom: .2rem; }.settings-address > p:last-child { margin: 0; color: #7d8ca0; font-size: .7rem; line-height: 1.45; }
.settings-banner-gallery { margin-top: .15rem; }.settings-banner-gallery > p { margin: 0 0 .55rem; color: #7d8ca0; font-size: .72rem; }.settings-banner-gallery__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }.settings-banner-preview { position: relative; min-width: 0; aspect-ratio: 16 / 10; margin: 0; overflow: hidden; border: 1px solid #dce4ed; border-radius: 9px; background: #edf2f6; }.settings-banner-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }.settings-banner-preview form { position: absolute; top: .42rem; right: .42rem; margin: 0; }.settings-banner-preview__delete { min-height: 30px; padding: .35rem .55rem; border: 0; border-radius: 6px; color: #fff; background: rgba(149, 47, 65, .94); box-shadow: 0 1px 4px rgba(25, 35, 50, .28); font: inherit; font-size: .67rem; font-weight: 850; cursor: pointer; opacity: 0; transform: translateY(-3px); transition: opacity .15s ease, transform .15s ease; }.settings-banner-preview:hover .settings-banner-preview__delete, .settings-banner-preview:focus-within .settings-banner-preview__delete { opacity: 1; transform: translateY(0); } @media (hover: none) { .settings-banner-preview__delete { opacity: 1; transform: none; } } @media (max-width: 650px) { .settings-banner-gallery__grid { grid-template-columns: 1fr; }.settings-banner-preview__delete { opacity: 1; transform: none; } }

.dashboard-sidebar__bottom .button_to { margin: 1rem 0 0; }.dashboard-sidebar__bottom .dashboard-signout { margin: 0; padding: 0; border: 0; color: #6b7b93; background: transparent; font: inherit; font-size: .77rem; font-weight: 800; cursor: pointer; }
.system-admin { max-width: 1120px; padding-top: 3rem; padding-bottom: 3rem; }.system-admin__header { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }.system-admin__header h1 { margin: .15rem 0; color: #263b58; }.system-admin__header p:last-child { margin: 0; color: #728198; }.system-admin__count { padding: .45rem .65rem; border-radius: 999px; color: #4d3cc3; background: #eeeaff; font-size: .78rem; font-weight: 800; white-space: nowrap; }.system-admin__table-wrap { overflow-x: auto; border: 1px solid #e0e7ef; border-radius: 14px; background: #fff; }.system-admin__table { width: 100%; border-collapse: collapse; text-align: left; }.system-admin__table th, .system-admin__table td { padding: .9rem 1rem; border-bottom: 1px solid #edf0f5; color: #526681; font-size: .8rem; }.system-admin__table th { color: #7c8ca1; background: #f8f9fc; font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }.system-admin__table tr:last-child td { border-bottom: 0; }.system-admin__table td b { display: block; color: #293e5b; }.system-admin__table td small { display: block; margin-top: .15rem; color: #8190a4; }.system-admin__status { display: inline-block; padding: .28rem .5rem; border-radius: 999px; font-size: .69rem; font-weight: 850; }.system-admin__status--trial { color: #885b0f; background: #fff1d3; }.system-admin__status--purchased { color: #23664a; background: #dff7e9; }.system-admin__impersonate, .impersonation-banner__return { border: 0; border-radius: 7px; color: #fff; background: #5d48d5; font: inherit; font-size: .72rem; font-weight: 800; cursor: pointer; padding: .48rem .65rem; }.impersonation-banner { display: flex; align-items: center; justify-content: center; gap: .7rem; padding: .5rem 1rem; color: #4b3500; background: #ffe7a9; font-size: .76rem; font-weight: 750; }.impersonation-banner form { display: inline; margin: 0; }.impersonation-banner__return { padding: .3rem .5rem; background: #725816; } @media (max-width: 650px) { .system-admin { padding-top: 1.25rem; }.system-admin__header { align-items: start; flex-direction: column; }.impersonation-banner { align-items: stretch; flex-direction: column; text-align: center; } }

/* Public signup is intentionally self-contained so its light theme cannot alter the workspace. */
.onboarding-flow { --on-bg: #090b17; --on-panel: rgba(20,23,45,.86); --on-panel-solid: #151a31; --on-text: #f7f7fc; --on-muted: #adb2c5; --on-line: rgba(255,255,255,.13); --on-input: rgba(4,6,17,.58); --on-accent: #80f2d5; --on-accent-ink: #06211e; --on-violet: #aa9cff; position: relative; isolation: isolate; min-height: 100vh; overflow: hidden; padding: 22px clamp(20px, 5vw, 76px) 64px; color: var(--on-text); background: radial-gradient(circle at 82% 10%, #292750 0, transparent 32%), radial-gradient(circle at 5% 80%, #123e45 0, transparent 30%), var(--on-bg); }.onboarding-flow::before { content: ""; position: absolute; z-index: -2; inset: 0; opacity: .23; background-image: linear-gradient(var(--on-line) 1px, transparent 1px), linear-gradient(90deg, var(--on-line) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to bottom, black, transparent 75%); }.onboarding-flow__glow { position: absolute; z-index: -1; width: 34rem; height: 34rem; border-radius: 50%; filter: blur(90px); pointer-events: none; }.onboarding-flow__glow--one { top: -22rem; right: -16rem; background: #947eff; opacity: .27; }.onboarding-flow__glow--two { bottom: -25rem; left: -15rem; background: #42d6c4; opacity: .16; }.onboarding-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: min(1180px, 100%); margin: 0 auto; }.onboarding-nav__actions { display: flex; align-items: center; gap: .8rem; }.onboarding-nav__prompt { color: var(--on-muted); font-size: .8rem; }.onboarding-nav__signin, .theme-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; border: 1px solid var(--on-line); border-radius: 999px; color: var(--on-text); background: color-mix(in srgb, var(--on-panel-solid) 65%, transparent); font: inherit; font-size: .78rem; font-weight: 800; text-decoration: none; cursor: pointer; }.onboarding-nav__signin { padding: .45rem .8rem; }.theme-toggle { gap: .38rem; padding: .42rem .7rem; }.theme-toggle span:first-child { color: var(--on-accent); font-size: 1rem; }.onboarding-layout { display: grid; grid-template-columns: minmax(280px, .84fr) minmax(460px, 1fr); align-items: center; gap: clamp(3rem, 9vw, 10rem); width: min(1080px, 100%); margin: clamp(3rem, 9vh, 7.5rem) auto 0; }.onboarding-intro { max-width: 450px; }.onboarding-kicker, .signup-card__eyebrow { margin: 0; color: var(--on-accent); font-size: .69rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }.onboarding-intro h1, .signup-confirmation h1 { margin: 1rem 0 1.2rem; color: var(--on-text); font-size: clamp(3.1rem, 5.1vw, 5.2rem); letter-spacing: -.02em; line-height: .92; }.onboarding-intro > p:not(.onboarding-kicker), .signup-confirmation > p { max-width: 430px; margin: 0; color: var(--on-muted); font-size: 1.03rem; }.onboarding-benefits { display: grid; gap: .95rem; margin: 2.5rem 0; padding: 0; list-style: none; }.onboarding-benefits li { display: flex; gap: .75rem; align-items: start; }.onboarding-benefits li > span { display: grid; place-items: center; flex: 0 0 22px; width: 22px; height: 22px; margin-top: .1rem; border-radius: 50%; color: var(--on-accent-ink); background: var(--on-accent); font-size: .72rem; font-weight: 900; }.onboarding-benefits b, .onboarding-benefits small { display: block; }.onboarding-benefits b { color: var(--on-text); font-size: .87rem; }.onboarding-benefits small { margin-top: .08rem; color: var(--on-muted); font-size: .75rem; }.onboarding-quote { display: flex; gap: .7rem; padding: .9rem 1rem; border-left: 2px solid var(--on-violet); color: var(--on-muted); background: color-mix(in srgb, var(--on-panel) 60%, transparent); font-size: .75rem; }.onboarding-quote span { color: var(--on-violet); }.onboarding-quote p { margin: 0; }.signup-card { padding: clamp(1.35rem, 4vw, 2.4rem); border: 1px solid var(--on-line); border-radius: 24px; background: linear-gradient(145deg, color-mix(in srgb, var(--on-panel) 96%, transparent), color-mix(in srgb, var(--on-panel-solid) 89%, transparent)); box-shadow: 0 30px 75px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.08); }.signup-card__header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }.signup-card h2 { margin: .28rem 0 0; color: var(--on-text); font-size: clamp(1.65rem, 3vw, 2.3rem); letter-spacing: -.02em; }.signup-card__trial { padding: .37rem .58rem; border: 1px solid color-mix(in srgb, var(--on-accent) 40%, transparent); border-radius: 999px; color: var(--on-accent); background: color-mix(in srgb, var(--on-accent) 10%, transparent); font-size: .65rem; font-weight: 900; white-space: nowrap; }.signup-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; margin: 1.7rem 0 1.8rem; padding: 0; list-style: none; counter-reset: progress; }.signup-progress li { position: relative; display: flex; align-items: center; gap: .38rem; color: var(--on-muted); font-size: .68rem; font-weight: 800; }.signup-progress li:not(:last-child)::after { content: ""; position: absolute; top: 50%; left: calc(100% - .2rem); width: .4rem; height: 1px; background: var(--on-line); }.signup-progress span { display: grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--on-line); border-radius: 50%; font-size: .65rem; }.signup-progress .is-current, .signup-progress .is-complete { color: var(--on-text); }.signup-progress .is-current span, .signup-progress .is-complete span { border-color: var(--on-accent); color: var(--on-accent-ink); background: var(--on-accent); }.signup-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }.signup-step legend { color: var(--on-text); font-size: 1.05rem; font-weight: 850; letter-spacing: -.025em; }.signup-step__lede { margin: .32rem 0 1.25rem; color: var(--on-muted); font-size: .77rem; }.signup-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; }.signup-fields p { margin: 0; }.signup-fields__wide { grid-column: 1 / -1; }.signup-fields label { display: block; margin-bottom: .37rem; color: var(--on-text); font-size: .7rem; font-weight: 850; letter-spacing: .035em; }.signup-fields__optional::after { content: " optional"; color: var(--on-muted); font-weight: 600; text-transform: lowercase; }.signup-fields input:not([type="color"]), .signup-fields select, .signup-fields textarea { width: 100%; min-height: 46px; padding: .65rem .72rem; border: 1px solid var(--on-line); border-radius: 10px; outline: 0; color: var(--on-text); background: var(--on-input); font: inherit; font-size: .83rem; transition: border-color .18s ease, box-shadow .18s ease; }.signup-fields textarea { min-height: 78px; resize: vertical; }.signup-fields select option { color: #172034; background: #fff; }.signup-fields input::placeholder, .signup-fields textarea::placeholder { color: color-mix(in srgb, var(--on-muted) 65%, transparent); }.signup-fields input:focus, .signup-fields select:focus, .signup-fields textarea:focus { border-color: var(--on-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--on-accent) 17%, transparent); }.signup-fields small { display: block; margin-top: .3rem; color: var(--on-muted); font-size: .64rem; }.signup-fields .north-american-phone-input { border-color: var(--on-line); border-radius: 10px; background: var(--on-input); }.signup-fields .north-american-phone-input b { border-color: var(--on-line); color: var(--on-muted); background: color-mix(in srgb, var(--on-panel-solid) 80%, transparent); }.signup-fields .north-american-phone-input input { min-height: 44px; color: var(--on-text); background: transparent; }.signup-colour { display: flex; align-items: center; gap: .55rem; min-height: 46px; padding: .4rem .6rem; border: 1px solid var(--on-line); border-radius: 10px; color: var(--on-muted); background: var(--on-input); font-size: .69rem; }.signup-colour input { width: 29px; height: 29px; padding: 0; border: 0; background: transparent; }.signup-email-note { display: flex; gap: .65rem; margin-top: 1.2rem; padding: .75rem .8rem; border: 1px solid color-mix(in srgb, var(--on-violet) 32%, transparent); border-radius: 10px; color: var(--on-muted); background: color-mix(in srgb, var(--on-violet) 8%, transparent); font-size: .7rem; line-height: 1.45; }.signup-email-note > span { color: var(--on-violet); font-size: 1rem; }.signup-email-note p { margin: 0; }.signup-email-note b { color: var(--on-text); }.signup-actions { display: flex; justify-content: space-between; gap: .7rem; margin-top: 1.5rem; }.signup-actions button, .signup-actions input { min-height: 47px; border-radius: 10px; font: inherit; font-size: .78rem; font-weight: 900; cursor: pointer; }.signup-actions__back { padding: 0 .9rem; border: 1px solid var(--on-line); color: var(--on-text); background: transparent; }.signup-actions__next, .signup-actions__submit { margin-left: auto; padding: 0 1rem; border: 0; color: var(--on-accent-ink); background: linear-gradient(120deg, var(--on-accent), #a9a0ff); box-shadow: 0 12px 24px color-mix(in srgb, var(--on-accent) 18%, transparent); }.signup-card__terms { margin: 1rem 0 0; color: var(--on-muted); font-size: .64rem; text-align: center; }.signup-card__terms a, .signup-confirmation__help a { color: var(--on-text); text-underline-offset: 3px; }.onboarding-flow--confirmation { padding-bottom: 110px; }.signup-confirmation { width: min(570px, 100%); margin: clamp(4.5rem, 13vh, 9rem) auto 0; text-align: center; }.signup-confirmation__icon { display: grid; place-items: center; width: 74px; height: 74px; margin: 0 auto 1.5rem; border: 1px solid color-mix(in srgb, var(--on-accent) 45%, transparent); border-radius: 24px; color: var(--on-accent-ink); background: linear-gradient(135deg, var(--on-accent), #afa2ff); box-shadow: 0 18px 40px color-mix(in srgb, var(--on-accent) 17%, transparent); font-size: 2rem; }.signup-confirmation h1 { margin-top: .75rem; font-size: clamp(2.5rem, 5.3vw, 4.4rem); }.signup-confirmation > p { margin-right: auto; margin-left: auto; }.confirmation-steps { display: grid; gap: .8rem; margin: 2.2rem 0; padding: 0; list-style: none; text-align: left; }.confirmation-steps li { display: flex; align-items: center; gap: .75rem; padding: .75rem; border: 1px solid var(--on-line); border-radius: 12px; background: color-mix(in srgb, var(--on-panel) 68%, transparent); }.confirmation-steps > li > span { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; color: var(--on-accent-ink); background: var(--on-accent); font-size: .68rem; font-weight: 900; }.confirmation-steps b, .confirmation-steps small { display: block; }.confirmation-steps b { color: var(--on-text); font-size: .75rem; }.confirmation-steps small { color: var(--on-muted); font-size: .67rem; }.signup-confirmation__actions { display: flex; justify-content: center; gap: .7rem; }.confirmation-link { min-height: 42px; padding: .6rem .85rem; border: 1px solid var(--on-line); border-radius: 9px; color: var(--on-text); font-size: .73rem; font-weight: 850; text-decoration: none; }.confirmation-link--strong { border-color: transparent; color: var(--on-accent-ink); background: var(--on-accent); }.signup-confirmation__help { margin-top: 1.6rem !important; font-size: .69rem !important; }
:root[data-theme="light"] .onboarding-flow { --on-bg: #f4f7fb; --on-panel: rgba(255,255,255,.92); --on-panel-solid: #ffffff; --on-text: #17243d; --on-muted: #62718a; --on-line: rgba(32,51,83,.15); --on-input: #f7f9fc; --on-accent: #3acdae; --on-accent-ink: #06251f; --on-violet: #6958db; background: radial-gradient(circle at 82% 10%, #e6e0ff 0, transparent 32%), radial-gradient(circle at 5% 80%, #d8f5ee 0, transparent 30%), var(--on-bg); }.onboarding-flow:has(.signup-fields) .north-american-phone-input { background: var(--on-input); }
@media (max-width: 800px) { .onboarding-flow { padding: 18px 20px 48px; }.onboarding-nav__prompt { display: none; }.onboarding-layout { grid-template-columns: 1fr; gap: 2.5rem; margin-top: 3rem; }.onboarding-intro { max-width: 580px; }.onboarding-intro h1 { font-size: clamp(2.8rem, 10vw, 4.4rem); }.onboarding-benefits, .onboarding-quote { display: none; }.signup-card { width: min(600px, 100%); }.signup-confirmation { margin-top: 4rem; } }
@media (max-width: 500px) { .onboarding-nav__brand { font-size: 1.08rem; }.theme-toggle span:last-child { display: none; }.onboarding-nav__actions { gap: .45rem; }.signup-card { padding: 1.2rem; border-radius: 18px; }.signup-fields { grid-template-columns: 1fr; }.signup-progress b { display: none; }.signup-progress { gap: 1rem; }.signup-progress li:not(:last-child)::after { width: 1rem; left: calc(100% - .7rem); }.signup-actions { flex-wrap: wrap; }.signup-actions__back { margin-right: auto; }.signup-actions__next, .signup-actions__submit { flex: 1; }.signup-confirmation__actions { align-items: stretch; flex-direction: column; }.confirmation-link { text-align: center; } }
.staff-page__badges { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(240px, .9fr); align-items: start; gap: 1.1rem; max-width: 1400px; margin: 0 auto 1rem; }
.staff-page__badges h2 { margin-bottom: .4rem; }
.staff-badge-list { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.staff-badge-list li { display: flex; align-items: center; gap: .65rem; padding: .6rem .7rem; border: 1px solid #e4eaf2; border-radius: 10px; background: #fafbfe; }
.staff-badge-list li > div { flex: 1; min-width: 0; }
.staff-badge-list b, .staff-badge-list small { display: block; }
.staff-badge-list b { font-size: .8rem; }
.staff-badge-list small { margin-top: .1rem; color: #7d8ba1; font-size: .68rem; }
.staff-badge-list__icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; color: #5540ce; background: #eeebff; font-size: .9rem; }
.staff-badge-list__empty { margin: 0; padding: .8rem; border: 1px dashed #d7dfea; border-radius: 10px; color: #7d8ba1; font-size: .72rem; }
.staff-badge-form label { display: grid; gap: .25rem; color: #41546e; font-size: .7rem; font-weight: 800; }
.staff-badge-form small { color: #7d8ba1; font-size: .66rem; line-height: 1.45; }
.staff-badge-form input:focus { border-color: #7863e7; outline: 2px solid rgba(120,99,231,.25); }
@media (max-width: 1100px) { .staff-page__badges { grid-template-columns: 1fr; } }
.location-clock-in-methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.location-clock-in-methods label { display: flex; align-items: flex-start; gap: .55rem; padding: .65rem; border: 1px solid #e4eaf2; border-radius: 8px; background: #fff; color: #41546e; cursor: pointer; }
.location-clock-in-methods label:has(input:checked) { border-color: #7863e7; box-shadow: 0 0 0 2px rgba(120,99,231,.18); }
.location-clock-in-methods input { margin-top: .15rem; accent-color: #5d48d5; }
.location-clock-in-methods b, .location-clock-in-methods small { display: block; }
.location-clock-in-methods b { font-size: .78rem; }
.location-clock-in-methods small { margin-top: .12rem; color: #8290a3; font-size: .66rem; font-weight: 700; line-height: 1.4; }
@media (max-width: 900px) { .location-clock-in-methods { grid-template-columns: 1fr; } }
.staff-page__badges .staff-badge-form { display: grid; gap: .55rem; grid-column: auto; grid-row: auto; margin: 0; }
.staff-page__badges .staff-badge-form input { width: 100%; min-width: 0; min-height: 38px; box-sizing: border-box; }
.staff-page__badges .staff-badge-form input[type="submit"] { padding: 0 .7rem; border: 0; border-radius: 7px; color: #fff; background: #5d48d5; font: inherit; font-size: .7rem; font-weight: 850; cursor: pointer; }
.guide-page { max-width: 980px; padding-top: 3rem; padding-bottom: 6rem; color: #d9d8e4; }
.guide-hero h1 { max-width: 760px; margin: .5rem 0 1rem; color: #fff; font-size: clamp(2.3rem, 5vw, 3.6rem); letter-spacing: -.02em; line-height: 1.05; text-wrap: balance; }
.guide-hero p:last-child { max-width: 720px; color: #b9b8c7; font-size: 1.05rem; line-height: 1.6; }
.guide-toc { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin: 2rem 0 3rem; padding: 1rem 1.2rem; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; background: rgba(255,255,255,.04); }
.guide-toc ol { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin: 0; padding-left: 1.2rem; }
.guide-toc a { color: #82f6dc; font-weight: 700; text-decoration: none; }
.guide-toc a:hover { text-decoration: underline; }
.guide-toc__more { white-space: nowrap; }
.guide-step { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 1.2rem; padding: 2.2rem 0; border-top: 1px solid rgba(255,255,255,.1); scroll-margin-top: 1rem; }
.guide-step__number { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: #10213d; background: linear-gradient(145deg, #f48aa2, #f6c98b); font-size: 1.15rem; font-weight: 900; }
.guide-step h2 { margin: .35rem 0 .9rem; color: #fff; font-size: 1.6rem; letter-spacing: -.02em; }
.guide-step h2 small { display: inline-block; margin-left: .6rem; padding: .15rem .55rem; border-radius: 999px; color: #c7c2ff; background: rgba(130,110,255,.18); font-size: .72rem; font-weight: 800; letter-spacing: .02em; vertical-align: middle; }
.guide-step p, .guide-step li { color: #c9c8d6; line-height: 1.6; }
.guide-step ol { margin: 0 0 1.2rem; padding-left: 1.2rem; }
.guide-step li + li { margin-top: .45rem; }
.guide-step b { color: #fff; }
.guide-tip { margin: 0 0 1.2rem; padding: .8rem 1rem; border-left: 3px solid #82f6dc; border-radius: 0 10px 10px 0; color: #c9c8d6; background: rgba(130,246,220,.07); }
.guide-shot { margin: 0 0 1.2rem; }
.guide-shot img { display: block; width: 100%; height: auto; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; background: #fff; box-shadow: 0 18px 40px rgba(0,0,0,.35); }
.guide-shot figcaption { margin-top: .5rem; color: #9897a8; font-size: .82rem; }
.guide-shots--two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.guide-faq { padding-top: 2.2rem; border-top: 1px solid rgba(255,255,255,.1); scroll-margin-top: 1rem; }
.guide-faq h2 { color: #fff; }
.guide-faq details { margin-top: .6rem; padding: .85rem 1rem; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: rgba(255,255,255,.03); }
.guide-faq summary { color: #fff; font-weight: 800; cursor: pointer; }
.guide-faq details p { margin: .6rem 0 0; color: #c9c8d6; line-height: 1.6; }
.guide-faq__help { margin-top: 1.5rem; color: #b9b8c7; }
.guide-faq a { color: #82f6dc; }
@media (max-width: 700px) { .guide-step { grid-template-columns: 1fr; } .guide-shots--two { grid-template-columns: 1fr; } .guide-step h2 small { display: table; margin: .4rem 0 0; } }
.guide-toc ol { display: grid; flex: 1 1 560px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .55rem 1.2rem; padding-left: 0; list-style-position: inside; color: #9897a8; font-weight: 700; }
@media (max-width: 860px) { .guide-toc ol { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.guide-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.guide-languages { display: inline-flex; padding: .2rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(255,255,255,.04); }
.guide-languages a { padding: .35rem .8rem; border-radius: 999px; color: #c9c8d6; font-size: .82rem; font-weight: 800; text-decoration: none; }
.guide-languages a.is-active { color: #10213d; background: #82f6dc; }
.access-card__footer { flex-direction: column; align-items: flex-start; gap: .8rem; }
.access-card__links { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; }
.access-card__links a { white-space: nowrap; }
.access-languages { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.4rem; }
.access-languages a { padding: .3rem .7rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; color: #c9c8d6; font-size: .78rem; font-weight: 800; text-decoration: none; }
.access-languages a.is-active { border-color: #82f6dc; color: #10213d; background: #82f6dc; }