/* Suited Admin (design/app-build/admin.py, board row L): the team's own app. Kit parts only, placed the way the boards place
   them. Phone: a title row, two tiles across, the app's capsule. Laptop (k-wide): the wordmark row, the side list of sections
   on the left, four tiles across. Money's tiles are board K6's (helpdesk.py am_tiles). */
.ad{min-height:100svh;padding:calc(env(safe-area-inset-top) + 16px) 16px 140px}
.ad-hd{display:none}
.ad-ph-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;margin-bottom:16px}
.ad-ph-hd .k-title{margin:0}
.ad-ph-hd>span{display:flex;align-items:center;gap:10px}
.ad-nav{display:none}
.ad-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
.ad-grid>.w2{grid-column:span 2}
.ad-grid>.k-tile{min-width:0;text-decoration:none;color:inherit}
.ad-t{display:block;font-size:17px;font-weight:600;line-height:22px;color:var(--text)}
.ad-fig{margin-top:10px;overflow-wrap:anywhere}
.ad-sub{margin-top:6px}
.ad-line{margin-top:12px;min-height:120px}
.ad-rows{margin-top:6px}
.ad-zero{color:var(--text-3)}
.ad-note{margin-top:16px}
.ad-sign{max-width:400px;margin:0 auto;padding-top:96px;text-align:center}
.ad-sign img{display:block;margin:0 auto;border-radius:22px}
.ad-sign .k-title{margin-top:24px}
.ad-sign .k-body{margin-top:8px}
.ad-sign form{margin-top:28px;display:flex;flex-direction:column;gap:12px;text-align:left}
.ad-sign .k-field{width:100%}
.ad-sign .k-small{margin-top:12px}
.ad.money .ad-grid{grid-template-columns:minmax(0,1fr)}
.ad.money .ad-grid>.w2{grid-column:auto}
.am-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px}
.am-two>div{min-width:0}
.am-bars{display:flex;align-items:flex-end;gap:4px;height:112px;margin-top:18px}
.am-bars i{flex:1;min-height:2px;border-radius:3px 3px 0 0;background:rgba(var(--fg-rgb),.20)}
.am-bars i.now{background:var(--text)}
.am-axis{display:flex;justify-content:space-between;margin-top:6px}
.am-src{display:grid;grid-template-columns:minmax(0,96px) 1fr 52px;align-items:center;gap:12px;margin-top:12px;font-size:14px}
.am-src>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-2)}
.am-src>span:last-child{text-align:right;font-variant-numeric:tabular-nums}
.am-src .bar{height:6px;border-radius:3px;background:rgba(var(--fg-rgb),.08);overflow:hidden}
.am-src .bar i{display:block;height:100%;border-radius:3px;background:rgba(var(--fg-rgb),.55)}

/* People (board AdminPeople, AdminPeoplePhone, AdminPerson): the search, the five, the list; one person's page. On a phone
   the person replaces the list, with Back; on a laptop the list stays on the left and the person opens beside it. */
.ad-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ad-col{display:flex;flex-direction:column;gap:16px;min-width:0}
.ad-list>.k-field{width:100%}
.ad-segs{overflow-x:auto;scrollbar-width:none;padding:6px 0;margin:-6px 0}
/* the kit's 32 px cells, each reaching 44 px tall for a thumb */
.ad-segs .k-seg>span{cursor:pointer;position:relative}
.ad-segs .k-seg>span::before{content:'';position:absolute;inset:-6px 0}
.ad-count{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 -8px}
.ad-more{display:flex;justify-content:space-between;align-items:center;gap:12px}
.ad-more .k-btn{width:auto}
.ad-two.open>.ad-list{display:none}
.ad-who{display:flex;align-items:center;gap:16px;min-width:0}
.ad-who>div{min-width:0;overflow-wrap:anywhere}
.ad-back{margin:-8px 0 -4px -8px}
.ad-back .k-top{position:static;padding:0;height:auto}
.ad.people .ad-ph-hd{margin-bottom:12px}
.ad-two.open~.ad-note{display:none}
.ad.people:has(.ad-two.open) .ad-ph-hd{position:absolute;width:1px;height:1px;min-height:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* the change rows are buttons (they open a sheet), drawn as the kit's rows; the sheets sit over the whole page */
.ad button.k-row{width:100%;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer}
.ad-sheets .k-veil{position:fixed}
.ad-sheets .k-sheet{position:fixed;max-width:430px;margin:0 auto;overflow:auto;padding-bottom:calc(32px + env(safe-area-inset-bottom))}
.ad-sheet{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.ad-sheet .k-field{width:100%}
.ad-sheet .k-small{margin:0}
.ad-sheet-err:empty{display:none}
.ad-sheet-err{color:var(--down)}
.ad-sheet-acts{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:14px}

/* Waitlist, Log and Switches (boards AdminSwitches, AdminMorePhone): one column of the kit's groups */
.ad-switches .k-switch{pointer-events:none}
.ad-shot{display:block;max-width:240px;max-height:320px;border-radius:12px;margin-top:8px}

/* the laptop (k-wide, wide.js): the wordmark row, the side list, four tiles across */
.k-wide .ad{padding:24px 32px 64px;display:grid;grid-template-columns:232px minmax(0,1fr);column-gap:32px;row-gap:24px;align-items:start;align-content:start;max-width:1440px;margin:0 auto}
.k-wide .ad-hd{display:flex;grid-column:1 / -1;align-items:center;gap:16px;min-height:48px}
.k-wide .ad-hd>.k-label{padding-top:4px}
.k-wide .ad-hd>span:last-child{margin-left:auto;display:flex;align-items:center;gap:14px}
.k-wide .ad-nav{display:block;position:sticky;top:24px}
.k-wide .ad-ph-hd{position:absolute;width:1px;height:1px;min-height:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.k-wide .ad-ph-hd>span{display:none}
.k-wide .ad-grid,.k-wide .ad.money .ad-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.k-wide .ad-grid>.w2,.k-wide .ad.money .ad-grid>.w2{grid-column:span 2}
.k-wide .am-bars{height:168px}
.k-wide .ad-sign{grid-column:1 / -1}
.k-wide .ad .k-tabs,.k-wide .ad .k-tabs-fade{display:none}
.k-wide .ad-two{display:grid;grid-template-columns:380px minmax(0,1fr);gap:24px;align-items:start}
.k-wide .ad-two.open>.ad-list{display:flex}
.k-wide .ad-back{display:none}
.k-wide .ad-person{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.k-wide .ad-person>.k-tile{grid-column:1 / -1}
.k-wide .ad-person>.k-group{margin:0}
.k-wide .ad-person.ad-tbl{display:flex}
.k-wide .ad-sheets .k-sheet{max-width:none}
.k-wide .ad-switches,.k-wide .ad-log,.k-wide .ad-line-list{max-width:640px}

@media (prefers-reduced-motion:reduce){.ad *{transition:none!important;animation:none!important}}
