/* club views: calendar, academy, livery, shows, show planner, transport, people, rota */
.block { display: block; } .dim td { opacity: .5; } .ok-txt { color: var(--ok); }
.pad-h { padding: 12px 16px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .pad-h h3 { margin: 0 auto 0 0; }
.sec-h { display: flex; align-items: center; gap: 8px; font-size: 16px; letter-spacing: .06em; margin: 18px 0 10px; cursor: pointer; }
.row-acts { display: inline-flex; gap: 4px; align-items: center; justify-content: flex-end; }
.kpis.k4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.chip-btn.on { background: var(--green); color: var(--oat); border-color: var(--green); }
:root[data-theme="dark"] .chip-btn.on { background: var(--clay); color: var(--green); border-color: var(--clay); }
.chip-btn small { opacity: .7; font-family: var(--f-mono); font-size: 10.5px; }
.toolbar select { width: auto; }
.seg a { text-decoration: none; display: contents; }
.meter.big { height: 8px; margin: 10px 0 4px; }

/* ---- calendar */
.cal-bar .cal-date { width: auto; }
.cal-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 0 0 10px; font-size: 13px; }
.cal-legend .lg { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; opacity: .55; font-weight: 600; } .cal-legend .lg.on { opacity: 1; }
.cal-legend .lg input { display: none; } .cal-legend .lg i { width: 10px; height: 10px; border-radius: 3px; } .cal-legend small { font-family: var(--f-mono); color: var(--mute); }
.cal-scroll { overflow: auto; max-height: calc(100vh - 250px); }
.cal-grid { display: grid; min-width: 640px; }
.cal-h { position: sticky; top: 0; z-index: 3; background: var(--panel2); border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); padding: 8px; font-weight: 700; font-size: 14px; display: flex; justify-content: space-between; gap: 4px; }
.cal-h small { font: 500 10.5px var(--f-mono); color: var(--mute); } .cal-h.today { color: var(--tack); box-shadow: inset 0 -3px 0 var(--clay); }
.cal-ad-l { font: 600 9.5px var(--f-mono); color: var(--mute); padding: 6px 4px; border-bottom: 1px solid var(--line); text-transform: uppercase; }
.cal-ad { border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 3px; display: flex; flex-direction: column; gap: 2px; min-height: 28px; }
.cal-hours > div { font: 500 10px var(--f-mono); color: var(--mute); text-align: right; padding-right: 6px; transform: translateY(-6px); }
.cal-col { position: relative; border-left: 1px solid var(--line); }
.cal-slot { border-bottom: 1px dashed color-mix(in srgb, var(--line) 70%, transparent); cursor: copy; }
.cal-slot:nth-child(2n) { border-bottom-style: solid; border-bottom-color: var(--line); }
.cal-slot:hover { background: color-mix(in srgb, var(--clay) 12%, transparent); }
.cal-pos { position: absolute; padding: 1px 2px; z-index: 2; }
.cal-ev { width: 100%; height: 100%; overflow: hidden; text-align: left; border: 0; border-left: 4px solid var(--dc, var(--c)); border-radius: 6px; background: color-mix(in srgb, var(--c) 22%, var(--panel)); color: var(--ink); padding: 3px 6px; font: 600 12.5px var(--f-head); cursor: pointer; line-height: 1.2; display: block; }
.cal-ad .cal-ev { height: auto; } .cal-ev:hover { background: color-mix(in srgb, var(--c) 38%, var(--panel)); }
.cal-ev b { font: 600 10.5px var(--f-mono); } .cal-ev small { display: block; color: var(--ink2); font-weight: 500; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-ev em { display: inline-block; font: 600 9.5px var(--f-mono); font-style: normal; background: var(--panel); border-radius: 4px; padding: 0 4px; margin-left: 2px; }
.cal-now { position: absolute; left: 0; right: 0; height: 2px; background: var(--clay); z-index: 4; pointer-events: none; }
.cal-now::before { content: ''; position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--clay); }
.cal-month { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.m-h { font: 600 10px var(--f-mono); color: var(--mute); padding: 8px; background: var(--panel2); border-bottom: 1px solid var(--line); text-transform: uppercase; }
.m-day { min-height: 108px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 4px; display: flex; flex-direction: column; gap: 2px; position: relative; }
.m-day.out { background: var(--panel2); opacity: .6; } .m-day.today .m-num { background: var(--clay); color: var(--green); }
.m-num { font: 600 11px var(--f-mono); align-self: flex-start; padding: 1px 5px; border-radius: 99px; cursor: pointer; }
.m-ev { display: flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--ink); text-align: left; font: 600 12px var(--f-head); padding: 1px 2px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-radius: 4px; }
.m-ev:hover { background: var(--panel2); } .m-ev i { width: 7px; height: 7px; border-radius: 50%; background: var(--c); flex: none; }
.m-more { font: 500 10.5px var(--f-mono); color: var(--mute); }
.m-add { position: absolute; top: 3px; right: 4px; border: 0 !important; color: var(--mute); width: 18px; height: 18px !important; text-align: center; border-radius: 4px; opacity: 0; }
.m-day:hover .m-add { opacity: 1; }
.ag-day { padding: 8px 14px; border-bottom: 1px solid var(--line); } .ag-day h4 { margin: 4px 0 6px; font-size: 14px; letter-spacing: .06em; }
.ag-it { display: grid; grid-template-columns: 62px 4px 1fr auto; gap: 10px; align-items: center; width: 100%; border: 0; background: transparent; color: var(--ink); text-align: left; padding: 6px 4px; cursor: pointer; font: 500 14px var(--f-head); border-radius: 6px; }
.ag-it:hover { background: var(--panel2); } .ag-it > i { height: 28px; border-radius: 3px; background: var(--c); } .ag-it small { display: block; color: var(--mute); font-size: 12.5px; }
.bk-sum p { margin: 0 0 8px; } .bk-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.bk-extra { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px 14px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line2); }
.sug-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .sug-list { display: flex; gap: 6px; flex-wrap: wrap; }
.sug-list .chip-btn.on { background: var(--clay); border-color: var(--clay); color: var(--green); }

/* ---- academy */
.tabs a button { pointer-events: none; }
.ac-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.class-card { border: 1px solid var(--line); border-radius: var(--arch); padding: 10px 12px; margin-bottom: 10px; background: var(--panel2); }
.cc-head { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; flex-wrap: wrap; } .cc-head span small { display: block; color: var(--mute); font-size: 12.5px; }
.cc-head > span:nth-child(2) { flex: 1; }
.cap { font: 700 13px var(--f-mono); background: var(--sage); color: var(--green); border-radius: 99px; padding: 2px 9px; } .cap.full { background: var(--clay); }
.roster td { background: var(--panel); } .roster .att { text-align: right; white-space: nowrap; }
.tt-grid { display: grid; grid-template-columns: repeat(7, minmax(130px, 1fr)); gap: 8px; overflow-x: auto; }
.tt-day { background: var(--panel2); border: 1px solid var(--line); border-radius: var(--arch); padding: 8px; display: flex; flex-direction: column; gap: 6px; min-height: 160px; }
.tt-day.today { border-color: var(--clay); } .tt-day h4 { margin: 2px 0 4px; font-size: 14px; } .tt-day h4 small { font: 500 10.5px var(--f-mono); color: var(--mute); }
.tt-cls { display: block; text-decoration: none; background: var(--panel); border: 1px solid var(--line); border-left: 4px solid var(--dc); border-radius: 6px; padding: 5px 7px; font-weight: 700; font-size: 13.5px; }
.tt-cls small { display: block; font-weight: 500; color: var(--mute); font-size: 11.5px; }
.tt-add { margin-top: auto; border: 1px dashed var(--line2); background: transparent; color: var(--mute); border-radius: 6px; padding: 4px; cursor: pointer; font: 600 12px var(--f-head); }
.tt-add:hover { border-color: var(--clay); color: var(--tack); }
.grp-h { margin: 14px 0 8px; } .svc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.svc { display: flex; flex-direction: column; gap: 2px; text-decoration: none; border: 1px solid var(--line); border-radius: var(--arch); padding: 12px; background: var(--panel2); position: relative; }
.svc:hover { border-color: var(--clay); } .svc > b { font-size: 16px; } .svc > span { font: 600 15px var(--f-mono); color: var(--tack); } .svc small { color: var(--mute); }
.svc em { position: absolute; top: 10px; right: 10px; font-style: normal; }
.pk-meter { min-width: 130px; } .pk-meter .meter { margin: 3px 0; }
.av { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 10px 10px 4px 4px; background: var(--sage); color: var(--green); font: 700 10.5px var(--f-mono); margin-right: 8px; vertical-align: middle; }
.av.big { width: 54px; height: 54px; font-size: 18px; border-radius: 20px 20px 8px 8px; margin: 0; }

/* ---- livery */
.pk-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin-bottom: 14px; }
.pk-card { display: flex; flex-direction: column; gap: 3px; text-decoration: none; background: var(--panel); border: 1px solid var(--line); border-radius: 22px 22px 8px 8px; padding: 14px; position: relative; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.pk-card:hover { border-color: var(--clay); } .pk-card small { font: 600 10px var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); }
.pk-card b { font-size: 18px; } .pk-card > span { font: 600 14px var(--f-mono); color: var(--tack); }
.pk-card p { font-size: 13px; color: var(--ink2); margin: 4px 0; } .pk-card ul { margin: 0; padding-left: 16px; font-size: 12.5px; color: var(--mute); }
.pk-card em { position: absolute; top: 12px; right: 12px; font: 600 11px var(--f-mono); font-style: normal; background: var(--sage); color: var(--green); border-radius: 99px; padding: 1px 8px; }
.pk-card.add { border-style: dashed; align-items: flex-start; justify-content: center; background: transparent; }
section.card.flush + section.card.flush, .lv-root > section, .lv-root > details { margin-top: 14px; }

/* ---- shows */
.show-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 12px; }
.show-card { display: flex; gap: 14px; text-decoration: none; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 14px; }
.show-card:hover { border-color: var(--clay); }
.sc-date { flex: none; width: 58px; height: 62px; border-radius: 20px 20px 8px 8px; background: var(--green); color: var(--oat); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.show-card.ev .sc-date { background: var(--straw); color: var(--green); }
.sc-date b { font: 700 24px var(--f-head); line-height: 1; } .sc-date small { font: 600 10px var(--f-mono); letter-spacing: .1em; }
.sc-main { min-width: 0; flex: 1; } .sc-main > b { font-size: 18px; display: block; } .sc-main > small { color: var(--mute); }
.sc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0; align-items: center; }
.sc-stats { display: flex; gap: 12px; flex-wrap: wrap; font-size: 13px; } .sc-stats span { display: inline-flex; align-items: center; gap: 4px; } .sc-stats .ico { width: 15px; height: 15px; }
.show-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.show-strip > div { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 8px 12px; }
.show-strip > div.warn { background: var(--straw-bg); border-color: var(--straw); }
.show-strip small { display: block; font: 600 9.5px var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); } .show-strip b { font-size: 20px; }
.show-strip select { padding: 3px 6px; margin-top: 2px; }
.tp-board { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.tp-col { background: var(--panel); border: 1px solid var(--line); border-radius: 22px 22px 8px 8px; padding: 12px; display: flex; flex-direction: column; gap: 6px; min-height: 160px; }
.tp-col h4 { margin: 0; display: flex; align-items: center; gap: 6px; font-size: 15px; } .tp-col h4 small { margin-left: auto; font: 600 12px var(--f-mono); }
.tp-col p { margin: 0 0 4px; } .tp-col.loose { background: var(--panel2); border-style: dashed; } .tp-col.over { border-color: var(--bad); }
.tp-col.add { align-items: center; justify-content: center; border-style: dashed; background: transparent; cursor: pointer; color: var(--mute); font: 700 14px var(--f-head); }
.tp-horse { border: 1.5px solid var(--line2); background: var(--panel2); border-radius: 14px 14px 6px 6px; padding: 7px 10px; text-align: left; font: 700 15px var(--f-head); color: var(--ink); cursor: pointer; }
.tp-horse.in { background: var(--sage); border-color: var(--sage); color: var(--green); } .tp-horse.on { background: var(--clay); border-color: var(--clay); color: var(--green); box-shadow: 0 0 0 3px rgba(227, 145, 94, .3); }
.tp-drop { font: 500 11px var(--f-mono); color: var(--tack); min-height: 4px; } .tp-col.truck { cursor: pointer; }
.ck-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.ck { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; font-weight: 600; }
.ck span { flex: 1; } .ck.done span { text-decoration: line-through; color: var(--mute); } .ck.done { background: var(--panel2); }
.ck-add { display: flex; gap: 6px; margin-bottom: 8px; }
.budget .tot td { font-weight: 700; border-top: 2px solid var(--ink); } .budget tr { cursor: default !important; }
.res { font: 700 18px var(--f-head); color: var(--tack); }

/* ---- transport */
.trip-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; }
.trip-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.trip-card.s-in_transit { border-color: var(--info); box-shadow: inset 4px 0 0 var(--info); } .trip-card.s-cancelled { opacity: .55; }
.tc-head { display: flex; gap: 12px; align-items: center; } .tc-head a { text-decoration: none; font-size: 17px; }
.trip-card p { margin: 0; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; } .trip-card p .ico { width: 15px; height: 15px; }
.tc-horses { display: flex; gap: 4px; flex-wrap: wrap; } .tc-horses .pill { font: 700 13px var(--f-head); background: var(--sage); color: var(--green); border: 0; padding: 2px 10px; }
.tc-ck { display: flex; flex-wrap: wrap; gap: 4px 12px; background: var(--panel2); border-radius: 8px; padding: 8px; font-size: 13px; }
.tc-ck .done { color: var(--mute); text-decoration: line-through; } .tc-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.veh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.veh-card { display: flex; gap: 12px; background: var(--panel); border: 1px solid var(--line); border-radius: 22px 22px 8px 8px; padding: 14px; }
.veh-card a { text-decoration: none; font-size: 17px; } .veh-card p { margin: 6px 0; display: flex; gap: 4px; flex-wrap: wrap; } .veh-qr .qr { width: 64px; height: 64px; }
.past-trips summary { list-style: none; }

/* ---- people */
.role-chips { gap: 5px; }
.drawer .modal-body h4 { margin: 16px 0 6px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--mute); font-family: var(--f-mono); }
.pd-head { display: flex; gap: 14px; align-items: center; } .pd-head > div:nth-child(2) { flex: 1; } .pd-head p { margin: 0 0 4px; }
.pd-bal { text-align: right; } .pd-bal small { display: block; font: 600 10px var(--f-mono); color: var(--mute); } .pd-bal b { font-size: 20px; }
.pd-acts { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; } .statement tr[data-go] { cursor: pointer; }

/* ---- rota */
.rota { width: 100%; border-collapse: collapse; min-width: 860px; }
.rota th, .rota td { border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); padding: 6px; vertical-align: top; }
.rota thead th { background: var(--panel2); font: 600 11px var(--f-mono); text-transform: uppercase; color: var(--mute); text-align: left; }
.rota th.today, .rota td.today { background: color-mix(in srgb, var(--clay) 8%, transparent); }
.rota .who { text-align: left; min-width: 150px; } .rota .who small { display: block; font-weight: 500; color: var(--mute); font-size: 12px; }
.rota td[data-cell] { cursor: copy; min-width: 100px; position: relative; } .rota td .add { color: var(--mute); opacity: 0; font-weight: 700; } .rota td:hover .add { opacity: 1; }
.shift { display: block; width: 100%; text-align: left; border: 0; border-left: 4px solid var(--c); background: color-mix(in srgb, var(--c) 25%, var(--panel)); border-radius: 6px; padding: 3px 6px; margin-bottom: 3px; cursor: pointer; color: var(--ink); font: 600 12px var(--f-head); }
.shift b { font-size: 11px; } .shift small { display: block; font-size: 11.5px; color: var(--ink2); } .shift.s-leave, .shift.s-absent { opacity: .6; background: repeating-linear-gradient(45deg, var(--panel2) 0 6px, var(--panel) 6px 12px); }
.rota .tot td, .rota .tot th { background: var(--panel2); }

@media (max-width: 900px) { .ac-grid { grid-template-columns: 1fr; } .show-strip { grid-template-columns: repeat(3, 1fr); } .kpis.k4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .cal-month { font-size: 11px; } .m-day { min-height: 70px; } .m-ev { font-size: 10.5px; } .show-grid, .trip-grid, .veh-grid { grid-template-columns: 1fr; } .show-strip { grid-template-columns: 1fr 1fr; } .pd-head { flex-wrap: wrap; } }
@media print { .rota-root .toolbar { display: none; } }

/* competition centre */
.cc-tabs .seg { flex-wrap: wrap; } .cc-tabs .seg a { text-decoration: none; display: contents; }
.cc-year { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--line2); border-radius: 8px; background: var(--panel); padding: 0 4px; }
.cc-year b { font-size: 15px; min-width: 44px; text-align: center; }
[dir="rtl"] .cc-year .ico, [dir="rtl"] .cc-tabs .ico-back { transform: scaleX(-1); }
.cc-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); } .cc-kpis.k4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cc-clash { border-color: var(--straw); background: var(--straw-bg); margin-bottom: 14px; }
.cc-cl { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--line); } .cc-cl:last-child { border-bottom: 0; }
.cc-cl.bad b { color: var(--bad); } .cc-cl small { flex-basis: 100%; color: var(--mute); } .cc-cl small a { color: inherit; }
.cc-tl-wrap { overflow-x: auto; margin-bottom: 14px; padding-bottom: 4px; }
.cc-tl { display: grid; grid-template-columns: repeat(12, minmax(150px, 1fr)); gap: 8px; min-width: 1100px; }
.cc-month { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 8px; display: flex; flex-direction: column; gap: 6px; min-height: 120px; }
.cc-month.now { border-color: var(--clay); box-shadow: 0 0 0 2px rgba(227, 145, 94, .2); }
.cc-month h4 { margin: 0 0 2px; font: 600 11px var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mute); }
.cc-none { margin: 0; color: var(--line2); text-align: center; }
.cc-chip { position: relative; display: flex; flex-direction: column; gap: 1px; padding: 7px 8px 7px 10px; border-radius: 12px 12px 6px 6px; background: var(--panel2); border: 1px solid var(--line); text-decoration: none; color: var(--ink); border-inline-start: 4px solid var(--dc); }
.cc-chip:hover { border-color: var(--clay); } .cc-chip.past { opacity: .65; } .cc-chip.dim { opacity: .4; text-decoration: line-through; }
.cc-chip small { color: var(--mute); font-size: 10.5px; } .cc-chip b { font-size: 13.5px; line-height: 1.15; overflow-wrap: anywhere; } .cc-chip span { font-size: 11.5px; color: var(--mute); }
.cc-chip em { position: absolute; top: 6px; inset-inline-end: 6px; font-style: normal; } .cc-chip em .ico { width: 14px; height: 14px; } .cc-chip em.bad { color: var(--bad); } .cc-chip em.warn { color: var(--warn); }
.cc-horses { display: flex; flex-direction: column; gap: 10px; }
.cc-hrow { display: grid; grid-template-columns: 230px minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.cc-hname { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .cc-hname a { display: inline-flex; gap: 6px; align-items: center; text-decoration: none; font-size: 16px; }
.cc-hshows { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.cc-hs { display: flex; flex-direction: column; padding: 5px 10px; border-radius: 12px 12px 6px 6px; border: 1px solid var(--line2); background: var(--panel); text-decoration: none; min-width: 0; max-width: 220px; }
.cc-hs b { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cc-hs small { color: var(--mute); font-size: 10.5px; }
.cc-hs.target { border-color: var(--clay); background: color-mix(in srgb, var(--clay) 12%, var(--panel)); } .cc-hs.past { opacity: .6; }
.cc-gap { font: 600 10px var(--f-mono); color: var(--mute); padding: 0 2px; } .cc-gap.warn { color: var(--warn); } .cc-gap.bad { color: var(--bad); }
.cc-hcl { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; } .cc-hacts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.cc-2 { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.cc-cat { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 5px 0; font-size: 13.5px; }
.cc-bars { display: flex; flex-direction: column; gap: 2px; } .cc-bars i, i.lg { display: block; height: 7px; border-radius: 4px; min-width: 2px; } .cc-bars .pl, i.lg.pl { background: var(--line2); } .cc-bars .ac, i.lg.ac { background: var(--clay); }
i.lg { display: inline-block; width: 14px; vertical-align: middle; margin-inline: 6px 2px; }
.cc-plans { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.cc-pcard { cursor: pointer; display: flex; flex-direction: column; gap: 6px; text-align: start; font: inherit; color: var(--ink); } .cc-pcard:hover { border-color: var(--clay); } .cc-pcard p { margin: 0; }
.cc-pcard.add { border-style: dashed; background: transparent; flex-direction: row; align-items: center; justify-content: center; min-height: 90px; }
.cc-ph { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.cc-prog { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; align-items: baseline; margin: 6px 0 10px; } .cc-prog b { font: 700 22px var(--f-head); } .cc-prog.small b { font-size: 17px; } .cc-prog span { color: var(--mute); font-size: 13px; } .cc-prog .meter { grid-column: 1 / -1; margin-top: 2px; }
.cc-plan-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.cc-weeks { display: flex; flex-direction: column; gap: 8px; }
.cc-week { border: 1px solid var(--line); border-radius: 10px; padding: 8px; border-inline-start: 4px solid var(--line2); }
.cc-week.ph-build { border-inline-start-color: var(--sage); } .cc-week.ph-base { border-inline-start-color: #8FA596; } .cc-week.ph-sharpen { border-inline-start-color: var(--clay); } .cc-week.ph-taper { border-inline-start-color: var(--straw); } .cc-week.ph-show { border-inline-start-color: var(--tack); } .cc-week.ph-recovery { border-inline-start-color: var(--info); }
.cc-wh { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 6px; } .cc-wh small { color: var(--mute); }
.cc-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cc-day { border-radius: 8px; padding: 5px 6px; background: var(--panel2); border: 1px solid var(--line); display: flex; flex-direction: column; min-width: 0; }
.cc-day small { font: 500 9.5px var(--f-mono); color: var(--mute); } .cc-day b { font-size: 12px; line-height: 1.15; overflow-wrap: anywhere; } .cc-day em { font: 500 10px var(--f-mono); font-style: normal; color: var(--mute); }
.cc-day.in-rest { opacity: .55; background: transparent; border-style: dashed; } .cc-day.in-hard { background: color-mix(in srgb, var(--clay) 18%, var(--panel)); border-color: var(--clay); }
.cc-day.in-moderate { background: color-mix(in srgb, var(--sage) 35%, var(--panel)); } .cc-day.in-show { background: var(--green); color: var(--oat); } .cc-day.in-show small { color: #C8D2C3; }
:root[data-theme="dark"] .cc-day.in-show { background: var(--clay); color: var(--green); }
.cc-form { white-space: nowrap; } .fm { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 4px; margin-inline-end: 2px; border-radius: 6px; font: 600 10.5px var(--f-mono); font-style: normal; background: var(--panel2); border: 1px solid var(--line); }
.fm.w { background: var(--clay); color: var(--green); border-color: var(--clay); } .fm.p { background: var(--sage); color: var(--green); border-color: var(--sage); } .fm.c { color: var(--ok); }
.cc-trophies { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.cc-trophy { display: flex; flex-direction: column; gap: 2px; padding: 10px; border-radius: 20px 20px 8px 8px; border: 1px solid var(--line); background: var(--panel2); text-align: center; }
.cc-trophy b.res { font-size: 15px; color: var(--tack); } .cc-trophy small { color: var(--mute); font-size: 11.5px; }
.cc-quals { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; } .cc-qual p { margin: 4px 0; } .cc-qual.qualified { border-color: var(--sage); } .cc-qual.missed { opacity: .75; }
.cc-qual details { margin-top: 6px; font-size: 13px; } .cc-qual summary { cursor: pointer; color: var(--tack); }
.cc-setup { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.cc-split-bar { display: flex; height: 30px; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); font: 600 11px var(--f-mono); }
.cc-split-bar i { display: grid; place-items: center; font-style: normal; background: var(--sage); color: var(--green); white-space: nowrap; overflow: hidden; min-width: 0; } .cc-split-bar i.r { background: var(--clay); } .cc-split-bar i.s { background: var(--green); color: var(--oat); }
.cc-elig { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.cc-elig .card.bad { border-color: var(--bad); } .cc-elig .card.warn { border-color: var(--straw); } .cc-elig h3 a { display: inline-flex; gap: 6px; align-items: center; text-decoration: none; }
.cc-chk { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; align-items: start; padding: 6px 0; border-bottom: 1px solid var(--line); } .cc-chk:last-child { border-bottom: 0; }
.cc-chk small { display: block; color: var(--mute); font-size: 12.5px; overflow-wrap: anywhere; }
.ck-ok, .ck-warn, .ck-bad { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-weight: 700; }
.ck-ok { background: var(--ok-bg); color: var(--ok); } .ck-ok .ico { width: 14px; height: 14px; } .ck-warn { background: var(--warn-bg); color: var(--warn); } .ck-bad { background: var(--bad-bg); color: var(--bad); }
.cc-sched { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-bottom: 14px; }
.cc-srow { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--line); } .cc-srow:last-child { border-bottom: 0; }
.cc-srow small { display: block; color: var(--mute); } .cc-srow.en b.mono { color: var(--tack); }
.cc-sadd .btn { margin-top: 10px; }
.cc-budget td { vertical-align: middle; } .cc-budget tbody tr { cursor: default; } .cc-num { width: 110px; padding: 5px 8px; font-size: 13.5px; }
.cc-alloc summary { display: flex; justify-content: space-between; gap: 8px; cursor: pointer; padding: 7px 0; border-bottom: 1px solid var(--line); list-style: none; } .cc-alloc summary::-webkit-details-marker { display: none; }
.cc-split summary { cursor: pointer; font-weight: 700; color: var(--tack); margin: 12px 0 6px; }
.cc-pay { display: grid; gap: 8px; margin: 10px 0; }
.meter.big { height: 8px; margin: -4px 0 14px; }
@media (max-width: 1100px) { .cc-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cc-2, .cc-setup { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .cc-kpis, .cc-kpis.k4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cc-hrow { grid-template-columns: 1fr; } .cc-hacts { justify-content: flex-start; }
  .cc-days { grid-template-columns: repeat(4, minmax(0, 1fr)); } .cc-cat { grid-template-columns: 1fr; gap: 3px; }
  .cc-num { width: 84px; } .cc-tl { grid-template-columns: repeat(12, minmax(140px, 1fr)); min-width: 1000px; }
}