:root{
  --bg:#0a0a0b;
  --bg-2:#0f1012;
  --card:#141518;
  --card-2:#1b1c20;
  --field:#151517;
  --field-2:#1c1b1f;
  --line:#26282e;
  --line-2:#3a3a40;
  --text:#f5f4f2;
  --text-soft:#ededed;
  --muted:#8a8a8e;
  --muted-2:#67666b;
  --gold:#f5b301;
  --gold-2:#ffc21a;
  --gold-3:#c98f00;
  --red:#e3322a;
  --red-dark:#c4271f;
  --green:#2fbf71;
  --amber:#f5a524;
  --radius:14px;
  --maxw:1200px;
  --font:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --head:'Oswald',var(--font);
}
*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body{ margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
html{ touch-action:pan-x pan-y; }
body{ touch-action:pan-x pan-y; overscroll-behavior-y:none; }

body{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
input, textarea, select, [contenteditable="true"]{
  -webkit-user-select:text;
  user-select:text;
  -webkit-touch-callout:default;
}
.selectable, a[href^="tel:"]{
  -webkit-user-select:text;
  user-select:text;
  -webkit-touch-callout:default;
}
body{
  background:var(--bg); color:var(--text); font-family:var(--font);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  min-height:100vh; min-height:100dvh;
}
a{ color:inherit; }
img{ max-width:100%; }
.hidden{ display:none !important; }

.app{
  width:100%; max-width:460px; margin:0 auto; min-height:100vh; min-height:100dvh;
  display:flex; flex-direction:column;
  padding-top:calc(env(safe-area-inset-top) + clamp(12px,2.4vh,26px));
  padding-bottom:calc(env(safe-area-inset-bottom) + clamp(12px,2.2vh,24px));
  padding-left:calc(env(safe-area-inset-left) + 24px);
  padding-right:calc(env(safe-area-inset-right) + 24px);
}
.flex{ flex:1 1 0; min-height:clamp(6px,1.6vh,22px); }
.header{ text-align:center; flex:0 0 auto; }
.header__logo{ width:clamp(118px,22vh,min(184px,48vw)); height:auto; display:block; margin:0 auto clamp(10px,1.8vh,20px); filter:drop-shadow(0 6px 20px rgba(0,0,0,.5)); }
.eyebrow{ font-size:clamp(11px,1.5vh,13px); font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--muted); margin:0 0 clamp(7px,1.1vh,12px); }
.title{ font-weight:800; font-size:clamp(30px,8.4vw,46px); line-height:1.02; letter-spacing:-.01em; margin:0 0 clamp(9px,1.4vh,14px); }
.subtitle{ font-size:clamp(13px,1.95vh,16px); line-height:1.5; color:var(--muted); margin:0 auto; max-width:34ch; }

.form{ display:flex; flex-direction:column; flex:0 0 auto; }
.field{ margin-bottom:clamp(12px,2vh,20px); }
.field > label{ display:block; font-size:clamp(13px,1.85vh,15px); font-weight:500; color:var(--text-soft); margin-bottom:clamp(6px,1vh,10px); }
.input-wrap{ position:relative; display:flex; align-items:center; }
.input-wrap .lead-icon{ position:absolute; left:16px; top:50%; transform:translateY(-50%); width:19px; height:19px; color:var(--muted); pointer-events:none; }
.field input, .inp, select.inp, textarea.inp{
  width:100%; background:var(--field); border:1px solid var(--line); color:var(--text);
  border-radius:var(--radius); padding:clamp(13px,1.9vh,16px) 16px; font-size:16px; font-family:var(--font);
  outline:none; -webkit-appearance:none; appearance:none; transition:border-color .15s ease, background .15s ease;
}
.field input{ padding-left:46px; }
.inp--sm{ width:auto; min-width:112px; padding:6px 10px; border-radius:10px; }
.field input::placeholder,.inp::placeholder{ color:var(--muted-2); }
.field input:focus,.inp:focus{ border-color:var(--gold); background:var(--field-2); }
.password-wrap input{ padding-right:48px; }
.switchrow{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:13px 14px; border:1px solid var(--line); border-radius:12px; background-color:var(--field);
  cursor:pointer; transition:border-color .15s ease; }
.switchrow:hover{ border-color:var(--line-2); }
.switchrow__t{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.switchrow__l{ font-size:14px; font-weight:600; color:var(--text); }
.switchrow__d{ font-size:12px; line-height:1.4; color:var(--muted); }
.switchrow input{ position:absolute; opacity:0; width:0; height:0; }
.switch{ position:relative; flex:0 0 46px; width:46px; height:27px; border-radius:999px;
  background-color:#6a6a73; transition:background-color .18s ease; }
html[data-theme="light"] .switch{ background-color:#8e8e98; }
.switch::after{ content:''; position:absolute; top:3px; left:3px; width:21px; height:21px; border-radius:50%;
  background-color:var(--text); transition:transform .18s ease, background-color .18s ease; }
.switchrow input:checked + .switch{ background-color:var(--gold); }
.switchrow input:checked + .switch::after{ transform:translateX(19px); background-color:#111; }
.switchrow input:focus-visible + .switch{ box-shadow:0 0 0 3px rgba(245,179,1,.45); }
.switchrow:has(input:checked){ border-color:rgba(245,179,1,.45); }
html[data-theme="light"] .switchrow input:checked + .switch{ background-color:var(--gold-3); }
html[data-theme="light"] .switchrow input:checked + .switch::after{ background-color:#fff; }
html[data-theme="light"] .switch::after{ background-color:#fff; box-shadow:0 1px 2px rgba(0,0,0,.25); }

.iconbtn--bell{ position:relative; overflow:visible; }
.iconbtn__badge{
  position:absolute; top:-5px; right:-5px; min-width:19px; height:19px; padding:0 5px;
  border-radius:999px; background:#e5342a; color:#fff;
  font-size:11px; font-weight:800; line-height:19px; text-align:center;
  box-shadow:0 0 0 2px var(--bg-2);
  pointer-events:none;
}
.notif{ display:flex; align-items:flex-start; gap:10px; padding:12px 2px; border-bottom:1px solid var(--line); }
.notif:last-child{ border-bottom:none; }
.notif__body{ flex:1 1 auto; min-width:0; }
.notif__t{ font-size:14px; font-weight:700; color:var(--text); }
.notif__d{ font-size:13px; line-height:1.45; color:var(--muted); margin-top:2px; word-break:break-word; }
.notif__w{ font-size:11px; color:var(--muted); margin-top:5px; letter-spacing:.02em; }
.notif__x{
  flex:0 0 auto; width:32px; height:32px; border-radius:50%; border:none;
  background:transparent; color:var(--muted); font-size:19px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background-color .16s var(--ease), color .16s var(--ease);
}
.notif__x:hover{ background:var(--field-2); color:var(--text); }
.notif__foot{ display:flex; justify-content:flex-end; padding-top:12px; margin-top:4px; border-top:1px solid var(--line); }
html[data-theme="light"] .iconbtn__badge{ box-shadow:0 0 0 2px #fff; }

.nswitch-wrap{ position:relative; display:inline-flex; flex:0 0 auto; align-items:center; cursor:pointer; }
.nswitch-wrap input{ position:absolute; opacity:0; width:0; height:0; }
.nswitch{ position:relative; display:block; width:51px; height:31px; border-radius:999px;
  background-color:#39393d; transition:background-color .22s var(--ease); }
.nswitch::after{ content:''; position:absolute; top:2px; left:2px; width:27px; height:27px; border-radius:50%;
  background-color:#fff; box-shadow:0 3px 8px rgba(0,0,0,.15), 0 1px 1px rgba(0,0,0,.16);
  transition:transform .22s var(--ease); }
.nswitch-wrap input:checked + .nswitch{ background-color:#30d158; }
.nswitch-wrap input:checked + .nswitch::after{ transform:translateX(20px); }
.nswitch-wrap input:focus-visible + .nswitch{ box-shadow:0 0 0 3px rgba(48,209,88,.45); }
.nswitch-wrap:has(input:disabled){ cursor:not-allowed; opacity:.5; }
html[data-theme="light"] .nswitch{ background-color:#e9e9ea; }
html[data-theme="light"] .nswitch-wrap input:checked + .nswitch{ background-color:#34c759; }
html[data-theme="light"] .nswitch-wrap input:focus-visible + .nswitch{ box-shadow:0 0 0 3px rgba(52,199,89,.4); }
@media (prefers-reduced-motion: reduce){
  .nswitch, .nswitch::after{ transition-duration:.01ms; }
}

.toggle-pass{ position:absolute; right:8px; top:50%; transform:translateY(-50%); width:38px; height:38px; background:transparent; border:none; color:var(--muted); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
.toggle-pass svg{ width:20px; height:20px; }
.row{ display:flex; align-items:center; justify-content:space-between; margin:clamp(2px,.4vh,4px) 0 clamp(14px,2.4vh,24px); flex-wrap:wrap; gap:10px; }
.checkbox{ display:flex; align-items:center; gap:10px; font-size:clamp(13px,1.85vh,15px); cursor:pointer; user-select:none; }
.checkbox input{ position:absolute; opacity:0; width:0; height:0; }
.checkbox__box{ width:20px; height:20px; border-radius:6px; border:1.5px solid var(--line-2); background:var(--field); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.checkbox__box svg{ width:13px; height:13px; opacity:0; }
.checkbox input:checked + .checkbox__box{ background:var(--gold); border-color:var(--gold); }
.checkbox input:checked + .checkbox__box svg{ opacity:1; stroke:#111; }
.checkbox.is-disabled{ cursor:not-allowed; opacity:.5; }
.link{ font-size:clamp(13px,1.85vh,15px); text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--muted-2); cursor:pointer; }
.link:hover{ text-decoration-color:var(--text); }

.btn-login{ width:100%; background:var(--red); color:#fff; border:none; border-radius:var(--radius); padding:clamp(14px,2vh,18px); font-family:var(--font); font-size:clamp(15px,1.9vh,16px); font-weight:700; letter-spacing:.08em; text-transform:uppercase; cursor:pointer; box-shadow:0 8px 22px rgba(227,50,42,.22); transition:background .15s ease, transform .1s ease; }
.btn-login:hover{ background:var(--red-dark); }
.btn-login:active{ transform:scale(.985); }
.btn-login:disabled{ opacity:.65; cursor:not-allowed; box-shadow:none; }
.divider{ display:flex; align-items:center; gap:16px; margin:clamp(14px,2.6vh,28px) 0 clamp(10px,1.7vh,16px); color:var(--muted); font-size:clamp(12px,1.7vh,14px); flex:0 0 auto; }
.divider::before,.divider::after{ content:""; flex:1 1 auto; height:1px; background:var(--line); }
.btn-outline{ width:100%; display:flex; align-items:center; justify-content:center; gap:12px; background:transparent; border:1px solid var(--line-2); color:var(--text); border-radius:var(--radius); padding:clamp(13px,1.9vh,16px); font-family:var(--font); font-size:clamp(14px,1.85vh,15px); font-weight:600; cursor:pointer; flex:0 0 auto; }
.btn-outline:hover{ background:var(--field); border-color:#4a4a50; }
.btn-outline svg{ width:20px; height:20px; color:var(--muted); flex:0 0 auto; }
.footer-note{ margin:clamp(12px,2vh,18px) 0 0; text-align:center; font-size:clamp(12px,1.7vh,14px); line-height:1.55; color:var(--muted); flex:0 0 auto; }
.footer-note b{ color:var(--text-soft); } .footer-note a{ color:var(--gold-2); font-weight:600; text-decoration:none; }

.install-banner{ display:none; align-items:center; gap:12px; flex:0 0 auto; background:var(--field); border:1px solid var(--line); border-radius:var(--radius); padding:12px 14px; margin-bottom:clamp(10px,1.6vh,16px); }
.install-banner.show{ display:flex; }
.install-banner__icon{ width:38px; height:38px; flex:0 0 38px; border-radius:9px; display:grid; place-items:center; background:linear-gradient(145deg,#ffe08a,#f5b301 45%,#c98f00); color:#14161a; }
.install-banner__icon svg{ width:19px; height:19px; }
.install-banner__text{ flex:1 1 auto; min-width:0; }
.install-banner__title{ font-weight:600; font-size:13px; }
.install-banner__sub{ font-size:12px; color:var(--muted); margin-top:1px; }
.install-banner__btn{ flex:0 0 auto; background:var(--gold); color:#111; border:none; border-radius:9px; padding:9px 14px; font-weight:700; font-size:12.5px; cursor:pointer; }
.install-banner__close{ flex:0 0 auto; background:none; border:none; color:var(--muted-2); width:28px; height:28px; cursor:pointer; font-size:18px; }

.toast{
  position:fixed; left:50%; bottom:calc(env(safe-area-inset-bottom) + 24px);
  background:#24242a; color:#fff;
  padding:13px 20px; border-radius:16px; font-size:13.5px; font-weight:500;
  border:1px solid rgba(255,255,255,.16);
  z-index:9999; box-shadow:0 18px 40px rgba(0,0,0,.45), 0 2px 8px rgba(0,0,0,.25);
  opacity:0; pointer-events:none;
  max-width:calc(100% - 40px); text-align:center;
  transform:translateX(-50%) translateY(14px) scale(.94);
  transition:opacity .18s ease, transform .34s cubic-bezier(.22,1.15,.36,1);
}
.toast.show{ opacity:1; transform:translateX(-50%) translateY(-4px) scale(1); }
.toast.error{ background:#fdecea; color:#8a1c14; border-color:rgba(138,28,20,.18); }
.toast.success{ background:#eafaf0; color:#0f5c33; border-color:rgba(15,92,51,.18); }

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .toast{
    background:rgba(36,36,42,.62);
    -webkit-backdrop-filter:blur(20px) saturate(180%);
    backdrop-filter:blur(20px) saturate(180%);
  }
  .toast.error{ background:rgba(253,236,234,.82); }
  .toast.success{ background:rgba(234,250,240,.82); }
}

@media (prefers-reduced-motion: reduce){
  .toast{ transition:opacity .15s linear; transform:translateX(-50%) translateY(-4px) scale(1); }
}

.topbar{ position:sticky; top:0; z-index:40; background:rgba(10,10,11,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.topbar__inner{ max-width:var(--maxw); margin:0 auto; display:flex; align-items:center; gap:12px; padding:12px 18px; padding-top:calc(env(safe-area-inset-top) + 12px); }
.topbar__brand{ display:flex; align-items:center; gap:10px; font-family:var(--head); font-weight:700; letter-spacing:.02em; }
.topbar__brand img{ width:30px; height:30px; object-fit:contain; }
.topbar__brand b{ color:var(--gold); }
.topbar__spacer{ flex:1 1 auto; }
.who{ font-size:13px; color:var(--muted); text-align:right; line-height:1.3; }
.who b{ color:var(--text); display:block; }
.container{ max-width:var(--maxw); margin:0 auto; padding:18px; padding-bottom:calc(env(safe-area-inset-bottom) + 40px); }

.tabs{ display:flex; gap:6px; overflow-x:auto; padding:10px 18px 0; max-width:var(--maxw); margin:0 auto; scrollbar-width:none; }
.tabs::-webkit-scrollbar{ display:none; }
@media (min-width:721px){
  .tabs{ flex-wrap:wrap; overflow-x:visible; }
}
@media (max-width:720px){
  .tabs{
    -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);
            mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);
  }
}
.tab{ flex:0 0 auto; background:transparent; border:none; color:var(--muted); font-family:var(--font); font-size:14px; font-weight:600; padding:10px 14px; border-radius:10px 10px 0 0; cursor:pointer; white-space:nowrap; border-bottom:2px solid transparent; }
.tab.active{ color:var(--gold); border-bottom-color:var(--gold); }
.tab:hover{ color:var(--text); }
.tab__badge{ display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; margin-left:6px; padding:0 5px; border-radius:999px; background:rgba(229,52,42,.9); color:#fff; font-size:11px; font-weight:800; line-height:1; vertical-align:middle; }
.tab__badge.hidden{ display:none; }
html[data-theme="light"] .tab__badge{ background:#b3251d; color:#fff; }
.tab.active .tab__badge, .subtab.active .tab__badge{ background:#d03128; }
html[data-theme="light"] .tab.active .tab__badge,
html[data-theme="light"] .subtab.active .tab__badge{ background:#b3251d; }
.tab__badge--info{ background:#1a7d4a; color:#fff; }
html[data-theme="light"] .tab__badge--info{ background:#136437; color:#fff; }
.panel{ display:none; }
.panel.active{ display:block; animation:fade .2s ease; }
@keyframes fade{ from{ opacity:0; transform:translateY(4px); } to{ opacity:1; transform:none; } }

.card{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; margin-bottom:16px; }
.card h2, .card h3{ font-family:var(--head); font-weight:600; margin:0 0 12px; letter-spacing:.02em; }
.section-title{ font-family:var(--head); font-size:20px; font-weight:600; margin:4px 0 14px; letter-spacing:.03em; }
.muted{ color:var(--muted); }
.small{ font-size:12.5px; }
.gold{ color:var(--gold); }

.grid{ display:grid; gap:14px; }
.grid.cols-2{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.grid.cols-3{ grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.grid.cols-4{ grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }

.stat{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px; }
.stat__label{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.stat__value{ font-family:var(--head); font-size:30px; font-weight:700; margin-top:6px; }
.stat__sub{ font-size:12px; color:var(--muted); margin-top:2px; }
.stat--gold .stat__value{ color:var(--gold); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid var(--line-2); background:var(--field); color:var(--text); border-radius:11px; padding:12px 16px; font-family:var(--font); font-size:14.5px; font-weight:600; cursor:pointer; transition:background .15s,border-color .15s,transform .1s; }
.btn:hover{ background:var(--field-2); }
.btn:active{ transform:scale(.98); }
.btn:disabled{ opacity:.6; cursor:not-allowed; }
.btn--primary{ background:var(--gold); border-color:var(--gold); color:#111; }
.btn--primary:hover{ background:var(--gold-2); }
.btn--danger{ background:var(--red); border-color:var(--red); color:#fff; }
.btn--danger:hover{ background:var(--red-dark); }
.btn--ghost{ background:transparent; }
.btn--sm{ padding:8px 12px; font-size:13px; border-radius:9px; }
.btn--block{ width:100%; }
.btn-row{ display:flex; gap:10px; flex-wrap:wrap; }
.fbbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.fbbar .btn-row{ margin-left:auto; }

.fbitem{ position:relative; display:grid; grid-template-columns:1fr auto; gap:14px; align-items:start;
  padding:14px 16px 14px 19px; background:var(--field); border:1px solid var(--line);
  border-radius:12px; margin-bottom:10px; overflow:hidden; }
.fbitem::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--fb-accent,var(--line-2)); }
.fbitem:hover{ border-color:var(--line-2); }
.fbitem--read{ opacity:.6; }
.fbitem__top{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.fbitem__cat{ font-size:11px; font-weight:800; letter-spacing:.085em; text-transform:uppercase;
  color:var(--fb-accent,var(--muted)); }
.fbitem__new{ width:7px; height:7px; border-radius:50%; background:var(--gold); flex:0 0 7px; }
.fbitem__msg{ font-size:15px; line-height:1.5; color:var(--text); white-space:pre-wrap; overflow-wrap:anywhere; }
.fbitem__who{ margin-top:9px; font-size:12px; color:var(--muted); }
.fbitem__who b{ color:var(--text); font-weight:600; }
.fbitem__act{ align-self:center; }

.fbitem--cleanliness{ --fb-accent:#3aa5d1; }
.fbitem--staff{ --fb-accent:#d19b3a; }
.fbitem--trainer{ --fb-accent:#8b7fe0; }
.fbitem--equipment{ --fb-accent:#2fbf71; }
.fbitem--other{ --fb-accent:#8d8d97; }
html[data-theme="light"] .fbitem--cleanliness{ --fb-accent:#1c6c8f; }
html[data-theme="light"] .fbitem--staff{ --fb-accent:#8a5f10; }
html[data-theme="light"] .fbitem--trainer{ --fb-accent:#5546a8; }
html[data-theme="light"] .fbitem--equipment{ --fb-accent:#15703f; }
html[data-theme="light"] .fbitem--other{ --fb-accent:#5f5f68; }

@media (max-width:520px){
  .fbitem{ grid-template-columns:1fr; }
  .fbitem__act{ justify-self:start; }
}

.namebtn{ background:none; border:0; padding:0; font:inherit; color:var(--text); font-weight:600;
          cursor:pointer; text-align:left;
          text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px;
          text-decoration-color:var(--muted-2, var(--muted)); transition:text-decoration-color .15s ease; }
.namebtn:hover{ text-decoration-color:var(--text); text-decoration-thickness:2px; }
.namebtn:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; border-radius:4px; }

.prof__id{ color:var(--muted); font-size:13px; margin:-4px 0 14px; }
.prof__who{ display:flex; align-items:flex-start; gap:14px; margin:0 0 14px; }
.prof__who .prof__id{ margin:0 0 8px; }
.prof__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:6px; }
.prof__stat{ background:var(--field-2); border:1px solid var(--line-2); border-radius:12px; padding:10px 12px; }
.prof__statk{ font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.prof__statv{ font-family:var(--head); font-size:19px; margin-top:2px; }
.prof__h{ font-family:var(--head); font-size:13px; letter-spacing:.05em; text-transform:uppercase;
          color:var(--muted); margin:18px 0 8px; font-weight:600; }
.prof__row{ display:flex; justify-content:space-between; align-items:baseline; gap:14px;
            padding:7px 0; border-bottom:1px solid var(--line-2); font-size:13.5px; }
.prof__row:last-of-type{ border-bottom:0; }
.prof__k{ color:var(--muted); flex:0 0 auto; }
.prof__v{ text-align:right; min-width:0; word-break:break-word; }
.prof__tbl td, .prof__tbl th{ vertical-align:top; }
.prof__nw{ white-space:nowrap; }
@media (max-width:560px){
  .prof__grid{ grid-template-columns:1fr; }
  .prof__row{ flex-direction:column; gap:2px; }
  .prof__v{ text-align:left; }
}

.memtbl th:last-child, .memtbl td:last-child{
  position:sticky; right:0; background:var(--card);
  box-shadow:-8px 0 8px -8px rgba(0,0,0,.55);
}
.memtbl thead th:last-child{ background:var(--field-2); z-index:2; }
html[data-theme="light"] .memtbl th:last-child,
html[data-theme="light"] .memtbl td:last-child{ box-shadow:-8px 0 8px -8px rgba(0,0,0,.16); }

#attRosterTable > thead > tr > th:last-child,
#attRosterTable > tbody > tr:not(.att-emp__detail) > td:last-child{
  position:sticky; right:0; background:var(--card);
  box-shadow:-8px 0 8px -8px rgba(0,0,0,.55);
}
#attRosterTable > thead > tr > th:last-child{ background:var(--field-2); z-index:2; }
html[data-theme="light"] #attRosterTable > thead > tr > th:last-child,
html[data-theme="light"] #attRosterTable > tbody > tr:not(.att-emp__detail) > td:last-child{
  box-shadow:-8px 0 8px -8px rgba(0,0,0,.16);
}

.ren-sum{ display:flex; justify-content:space-between; align-items:center; gap:12px;
          padding:10px 12px; margin-bottom:12px; border:1px solid var(--line-2);
          border-radius:12px; background:var(--field-2); font-size:14px; }

.f{ margin-bottom:14px; }
.f > label{ display:block; font-size:13.5px; font-weight:500; color:var(--text-soft); margin-bottom:7px; }
.f-inline{ display:flex; gap:10px; flex-wrap:wrap; }
.f-inline > *{ flex:1 1 140px; }
.seg{ display:flex; gap:8px; flex-wrap:wrap; }
.seg button{ flex:1 1 auto; background:var(--field); border:1px solid var(--line); color:var(--text); border-radius:10px; padding:11px; font-weight:600; cursor:pointer; }
.seg button.active{ background:var(--gold); border-color:var(--gold); color:#111; }
.seg--wrap button{ flex:1 1 140px; min-width:140px; }

.badge{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px; letter-spacing:.02em; }
.badge--active{ background:rgba(47,191,113,.15); color:#67e29b; }
.badge--warn{ background:rgba(245,165,36,.15); color:var(--amber); }
.badge--expired{ background:rgba(227,50,42,.16); color:#ff7a72; }
.badge--muted{ background:var(--field-2); color:var(--muted); }
.badge--paused{ background:rgba(96,165,250,.16); color:#93c5fd; }
.badge--gold{ background:rgba(245,179,1,.15); color:var(--gold-2); }

.mcard__meta{ position:relative; display:flex; justify-content:space-between; gap:12px; margin-top:16px; font-size:13px; color:var(--muted); flex-wrap:wrap; }
.mcard__meta b{ color:var(--text); display:block; font-size:14px; }

.refcode{ display:flex; align-items:center; gap:12px; background:var(--card-2); border:1px dashed var(--gold-3); border-radius:12px; padding:14px 16px; }
.refcode__code{ font-family:var(--head); font-size:22px; letter-spacing:.14em; color:var(--gold); }

.tl{ list-style:none; margin:0; padding:0; }
.tl__group{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin:14px 0 8px; }
.tl__item{ display:flex; gap:12px; padding:12px 0; border-top:1px solid var(--line); }
.tl__icon{ width:36px; height:36px; flex:0 0 36px; border-radius:10px; background:var(--field-2); display:grid; place-items:center; font-size:16px; }
.tl__body{ flex:1 1 auto; min-width:0; }
.tl__title{ font-weight:600; font-size:14px; }
.tl__time{ font-size:12px; color:var(--muted); margin-top:2px; }

.table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:12px; }
.mem-more{ display:flex; justify-content:center; align-items:center; padding:12px 4px 2px; }
.mem-more .btn{ min-width:160px; min-height:40px; }
table{ width:100%; border-collapse:collapse; font-size:13.5px; min-width:520px; }
th,td{ text-align:left; padding:11px 12px; border-bottom:1px solid var(--line); white-space:nowrap; }
th{ font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600; background:var(--bg-2); }
tr:last-child td{ border-bottom:none; }
td .btn{ padding:6px 10px; font-size:12.5px; }

.modal{ position:fixed; inset:0; background:rgba(0,0,0,.72); display:none; align-items:center; justify-content:center; padding:20px; z-index:100; }
.modal.open{ display:flex; }
.modal__box{ background:var(--card); border:1px solid var(--line); border-radius:18px; width:100%; max-width:440px; max-height:90vh; overflow-y:auto; padding:22px; }
.modal__box.wide{ max-width:640px; }
.modal__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.modal__head h3{ font-family:var(--head); margin:0; font-size:20px; }
.modal__close{ background:none; border:none; color:var(--muted); font-size:24px; cursor:pointer; line-height:1; }
#memberModal #memberDetail > .card{ background:none; border:0; padding:0; margin:0; }
#memberModal .modal__head{ justify-content:flex-end; margin-bottom:2px; }
.qr-big{ background:#fff; border-radius:16px; padding:16px; display:grid; place-items:center; margin:0 auto; width:min(300px,80vw); }

.ann{ border-radius:12px; padding:14px 16px; margin-bottom:12px; border:1px solid var(--line); background:var(--card-2); }
.ann--promo{ border-color:var(--gold-3); background:linear-gradient(135deg,rgba(245,179,1,.1),transparent); }
.ann--warning{ border-color:var(--red-dark); background:rgba(227,50,42,.08); }
.ann__title{ font-weight:700; font-size:14.5px; }
.ann__msg{ font-size:13.5px; color:var(--text-soft); margin-top:4px; }
.ann--staff{ position:relative; padding-right:46px; }
.ann__x{
  position:absolute; top:10px; right:10px; width:28px; height:28px;
  display:inline-grid; place-items:center; border-radius:8px;
  background:transparent; border:1px solid var(--line); color:var(--muted);
  font-size:15px; line-height:1; cursor:pointer; padding:0;
}
.ann__x:hover{ color:var(--text); border-color:var(--line-2); }
.ann__x:disabled{ opacity:.5; cursor:default; }
.ann__meta{ font-size:12px; color:var(--muted); margin-top:6px; }

.pass{
  position:relative; border-radius:12px; overflow:hidden;
  background:var(--card); border:1px solid var(--line); margin-bottom:12px;
}
.pass__band{
  position:relative; overflow:hidden; padding:12px 15px 13px; text-align:center;
  background:linear-gradient(100deg,var(--gold-3),var(--gold) 42%,var(--gold-2) 60%,var(--gold-3));
}
.pass__band::after{
  content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-18deg); animation:passSweep 3.6s ease-in-out infinite;
}
@keyframes passSweep{ 0%{ left:-60%; } 55%{ left:120%; } 100%{ left:120%; } }
.pass__kicker{
  position:relative; font-family:var(--head); font-size:11px; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase; color:rgba(20,16,0,.68);
}
.pass__title{
  position:relative; font-family:var(--head); font-size:19px; font-weight:700;
  line-height:1.15; text-transform:uppercase; letter-spacing:.045em;
  color:#14110a; margin-top:2px;
  text-wrap:balance;
}
.pass__tear{ height:0; border-top:2px dashed var(--line-2); position:relative; background:var(--card); }
.pass__tear::before,.pass__tear::after{
  content:""; position:absolute; top:-9px; width:16px; height:16px;
  border-radius:50%; background:var(--bg);
}
.pass__tear::before{ left:-9px; }
.pass__tear::after{ right:-9px; }
.pass__seal{
  position:absolute; left:50%; top:0; transform:translate(-50%,-50%); z-index:2;
  background:var(--card); padding:0 9px; color:var(--gold);
  font-size:9px; letter-spacing:.32em; line-height:1;
}
.pass__body{ padding:14px 15px 15px; font-size:13.5px; color:var(--text-soft); text-align:left; }

.pass--personal .pass__band{ padding-left:44px; padding-right:44px; }
.pass__x{
  position:absolute; top:9px; right:9px; width:26px; height:26px; z-index:3;
  border-radius:8px; display:grid; place-items:center; cursor:pointer;
  background:rgba(20,17,10,.20); border:1px solid rgba(20,17,10,.26);
  color:rgba(20,17,10,.78); font-size:13px; line-height:1; padding:0;
}
.pass__x:hover,.pass__x:focus-visible{ color:#14110a; border-color:rgba(20,17,10,.55); outline:none; }
.pass__x:disabled{ opacity:.5; cursor:default; }

.pass--warning .pass__band{
  background:linear-gradient(100deg,#8e1a15,var(--red-dark) 42%,var(--red) 60%,#8e1a15);
}
.pass--warning .pass__kicker{ color:rgba(255,255,255,.82); }
.pass--warning .pass__title{ color:#fff; }
.pass--warning .pass__seal{ color:var(--red); }
.pass--warning .pass__x{
  background:rgba(0,0,0,.24); border-color:rgba(255,255,255,.3); color:rgba(255,255,255,.85);
}
.pass--warning .pass__x:hover,.pass--warning .pass__x:focus-visible{ color:#fff; border-color:#fff; }

@media (prefers-reduced-motion:reduce){ .pass__band::after{ animation:none; } }

.empty{ text-align:center; color:var(--muted); padding:34px 16px; font-size:14px; }
.row--muted > td{ opacity:.6; }
.row--muted > td:last-child{ opacity:1; }

.needs{ border-left:3px solid var(--red, #e5342a); }
.needs__head{ font-size:11.5px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.needs__items{ display:flex; flex-wrap:wrap; gap:8px; }
.needs__item{ display:inline-flex; align-items:baseline; gap:7px; background:var(--field-2); border:1px solid var(--line); border-radius:10px;
  padding:9px 13px; cursor:pointer; font-family:var(--font); font-size:13px; color:var(--text); transition:border-color .15s,background .15s; }
.needs__item:hover{ border-color:var(--line-2); background:var(--field); }
.needs__item b{ font-size:16px; font-weight:800; }
.needs__item--urgent b{ color:#ff6a60; }
html[data-theme="light"] .needs__item--urgent b{ color:#b3251d; }
.dash-clear{ margin:0 0 16px; color:var(--muted); font-size:13px; }


.monthrow__note{ color:var(--muted); font-weight:600; }

.matrix{ width:100%; border-collapse:collapse; font-size:13.5px; }
.matrix thead th{ text-align:right; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted); padding:0 0 9px 16px; white-space:nowrap; }
.matrix thead th:first-child{ text-align:left; padding-left:0; }
.matrix th[scope="row"]{ text-align:left; font-weight:600; color:var(--text); padding:9px 16px 9px 0; white-space:nowrap; }
.matrix td{ text-align:right; padding:9px 0 9px 16px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.matrix tbody tr + tr th, .matrix tbody tr + tr td{ border-top:1px solid var(--line); }
.matrix tfoot th, .matrix tfoot td{ border-top:2px solid var(--line-2); padding-top:11px; font-weight:700; }
.matrix__na{ color:var(--muted-2); }
.matrix__memo th[scope="row"]{ font-weight:500; color:var(--muted); padding-left:20px; }
.matrix__memo td{ color:var(--muted); }
.matrix .split-key__dot{ display:inline-block; margin-right:7px; vertical-align:middle; }

.split{ display:flex; height:9px; border-radius:999px; overflow:hidden; background:var(--field-2); }
.split span{ display:block; transition:width .25s ease; }
.split__gym{ background:var(--gold); }
.split__mt{ background:#c78bff; }
html[data-theme="light"] .split__gym{ background:var(--gold-3); }
html[data-theme="light"] .split__mt{ background:#6d28d9; }
.split-key{ display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:10px; }
.split-key > div{ display:flex; align-items:baseline; gap:7px; }
.split-key b{ font-family:Oswald,sans-serif; font-size:17px; font-weight:600; }
.split-key__dot{ width:9px; height:9px; border-radius:3px; flex:0 0 auto; }
.split-key__dot--gym{ background:var(--gold); }
.split-key__dot--mt{ background:#c78bff; }
html[data-theme="light"] .split-key__dot--gym{ background:var(--gold-3); }
html[data-theme="light"] .split-key__dot--mt{ background:#6d28d9; }

@media (max-width:560px){
  .monthrow{ gap:14px; }
  .monthrow__side{ gap:18px; }
}

.dsec{ display:flex; align-items:center; gap:11px; margin:26px 0 12px; }
.dsec__t{
  font-family:var(--head); font-size:15px; font-weight:600; letter-spacing:.11em;
  text-transform:uppercase; color:var(--text); margin:0;
}
.dsec__line{ flex:1; height:1px; background:var(--line); }
.dsec__r{ font-size:12.5px; color:var(--muted); }

.dgrid{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(196px,1fr)); }
.dcard{
  background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:18px 18px 16px; overflow:hidden;
}
.dcard__i{
  width:34px; height:34px; border-radius:9px; display:grid; place-items:center;
  margin-bottom:13px; background:var(--field-2); color:var(--muted);
}
.dcard__i svg{ width:17px; height:17px; }
.dcard__v{
  font-family:var(--head); font-size:28px; font-weight:600; color:var(--text);
  line-height:1.05; letter-spacing:-.01em; font-variant-numeric:tabular-nums;
}
.dcard__l{ font-size:12.5px; color:var(--muted); margin-top:6px; line-height:1.4; }
.dcard__s{
  font-size:12px; color:var(--muted); margin-top:9px; padding-top:9px;
  border-top:1px solid var(--line);
}
.dcard__s b{ color:var(--text-soft); font-weight:600; }

.dcard--lead{ border-color:rgba(245,179,1,.26);
  background:linear-gradient(150deg, rgba(245,179,1,.10), rgba(245,179,1,.03) 55%, var(--card)); }
.dcard--lead .dcard__v{ font-size:40px; color:var(--gold); }
.dcard--lead .dcard__i{ background:rgba(245,179,1,.13); color:var(--gold); }
html[data-theme="light"] .dcard--lead{ border-color:rgba(154,107,10,.30);
  background:linear-gradient(150deg, rgba(245,179,1,.16), rgba(245,179,1,.05) 55%, var(--card)); }
html[data-theme="light"] .dcard--lead .dcard__v{ color:var(--gold-4); }
html[data-theme="light"] .dcard--lead .dcard__i{ color:var(--gold-3); }

.dcard--span2{ grid-column:span 2; }

.dgrid--solo .dcard--lead{ display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:24px; }
.dgrid--solo .dcard--lead .dcard__i{ grid-column:1; margin-bottom:11px; }
.dgrid--solo .dcard--lead .dcard__v{ grid-column:1; }
.dgrid--solo .dcard--lead .dcard__l{ grid-column:1; }
.dgrid--solo .dcard--lead .dcard__s{
  grid-column:2; grid-row:1 / span 3; margin:0; padding:0 0 0 24px;
  border-top:0; border-left:1px solid var(--line); align-self:stretch;
  display:flex; align-items:center; text-align:right; font-size:12.5px;
}

.dcard--gym .dcard__i{ background:rgba(245,179,1,.13); color:var(--gold); }
.dcard--mt  .dcard__v{ color:#c78bff; }
.dcard--mt  .dcard__i{ background:rgba(199,139,255,.14); color:#c78bff; }
html[data-theme="light"] .dcard--gym .dcard__i{ color:var(--gold-3); }
html[data-theme="light"] .dcard--mt .dcard__v{ color:#6d28d9; }
html[data-theme="light"] .dcard--mt .dcard__i{ background:rgba(109,40,217,.10); color:#6d28d9; }

.dcard .dcard__v--down,
.dcard--lead .dcard__v--down{ color:#ff6a60; }
html[data-theme="light"] .dcard .dcard__v--down,
html[data-theme="light"] .dcard--lead .dcard__v--down{ color:var(--brand-2); }

.allfig{ margin-top:20px; background:var(--card); border:1px solid var(--line); border-radius:14px; }
.allfig > summary{
  list-style:none; cursor:pointer; padding:15px 19px; display:flex; align-items:center; gap:9px;
  font-family:var(--head); font-size:13.5px; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted);
}
.allfig > summary::-webkit-details-marker{ display:none; }
.allfig > summary::marker{ content:""; }
.allfig > summary::after{
  content:""; width:7px; height:7px; margin-left:auto; flex:0 0 auto;
  border-right:1.8px solid currentColor; border-bottom:1.8px solid currentColor;
  transform:rotate(45deg) translateY(-2px); transition:transform .18s ease;
}
.allfig[open] > summary::after{ transform:rotate(-135deg) translateY(-2px); }
.allfig > summary:hover{ color:var(--text); }
.allfig > summary:focus-visible{ outline:2px solid var(--gold); outline-offset:-3px; border-radius:14px; }
.allfig__body{ padding:0 19px 18px; }

@media (max-width:560px){
  .dgrid{ grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:11px; }
  .dcard{ padding:15px 15px 13px; }
  .dcard__v{ font-size:24px; }
  .dcard--span2{ grid-column:span 2; }
  .dgrid--solo .dcard--lead{ display:block; }
  .dgrid--solo .dcard--lead .dcard__s{
    grid-column:auto; padding:9px 0 0; border-left:0; border-top:1px solid var(--line);
    display:block; text-align:left; margin-top:9px;
  }
  .dcard--lead .dcard__v{ font-size:32px; }
}
.warn-ink{ color:var(--amber); font-weight:700; }
html[data-theme="light"] .warn-ink{ color:#8a5b00; }
.badge__sub{ margin-top:4px; }
.cell--actions{ white-space:nowrap; text-align:right; }
.cell--actions .btn + .btn{ margin-left:6px; }
.spinner{ width:22px; height:22px; border:2.5px solid var(--line-2); border-top-color:var(--gold); border-radius:50%; animation:spin .7s linear infinite; margin:24px auto; }
@keyframes spin{ to{ transform:rotate(360deg); } }

@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; } }
@media (max-width:520px){ .stat__value{ font-size:26px; } .container{ padding:14px; } }

:root{
  --brand:#de3229;
  --brand-2:#c4271f;
  --brand-soft:rgba(229,52,42,.14);
}
.btn--primary{ background:var(--brand); border-color:var(--brand); color:#fff; box-shadow:0 8px 22px rgba(229,52,42,.22); }
.btn--primary:hover{ background:var(--brand-2); border-color:var(--brand-2); }
.btn--good{ background:#1a7d4a; border-color:#1a7d4a; color:#fff; box-shadow:0 8px 22px rgba(26,125,74,.22); }
.btn--good:hover{ background:#15653c; border-color:#15653c; }
.btn--hold{ background:#1c5aa0; border-color:#1c5aa0; color:#fff; box-shadow:0 8px 22px rgba(28,90,160,.22); }
.btn--hold:hover{ background:#164a86; border-color:#164a86; }
.btn svg{ width:18px; height:18px; flex:0 0 auto; }
.btn-login{ background:var(--brand); box-shadow:0 8px 22px rgba(229,52,42,.24); }
.btn-login:hover{ background:var(--brand-2); }

.badge i.dot{ width:7px; height:7px; border-radius:50%; background:currentColor; display:inline-block; }
.badge--active{ background:rgba(34,197,94,.14); color:#38d17f; }
.badge--warn{ background:rgba(245,165,36,.16); color:#f5a524; }
.badge--expired{ background:rgba(229,52,42,.16); color:#ff6a60; }
.badge--paused{ background:rgba(96,165,250,.16); color:#7cb2f8; }

.appbar{ position:sticky; top:0; z-index:40; background:rgba(10,10,11,.86); backdrop-filter:blur(12px); border-bottom:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 18px; padding-top:calc(env(safe-area-inset-top) + 14px); }
.appbar__brand{ display:flex; align-items:center; gap:11px; }
.appbar__brand img{ width:38px; height:38px; object-fit:contain; }
.wordmark{ display:flex; flex-direction:column; line-height:1; }
.wordmark b{ font-family:var(--head); font-size:19px; font-weight:700; letter-spacing:.06em; color:#fff; }
.wordmark .wm-gold{ color:var(--gold); }
.wordmark__tag{ font-size:9.5px; letter-spacing:.34em; color:var(--muted-2); margin-top:4px; text-transform:uppercase; }
.logout-btn{ display:inline-flex; align-items:center; gap:8px; background:transparent; border:1px solid var(--line-2); color:var(--text);
  border-radius:11px; padding:9px 14px; font-family:var(--font); font-size:14px; font-weight:600; cursor:pointer; transition:border-color .15s,background .15s; }
.logout-btn:hover{ border-color:var(--brand); color:#fff; background:var(--brand-soft); }
.logout-btn svg{ width:17px; height:17px; }

.view{ max-width:560px; margin:0 auto; padding:16px 16px calc(env(safe-area-inset-bottom) + 92px); }
.page-title{ font-family:var(--head); font-size:24px; font-weight:600; letter-spacing:.02em; margin:2px 0 14px; }
.tabbar{ position:fixed; left:0; right:0; bottom:0; z-index:50; display:flex; background:rgba(12,12,14,.94); backdrop-filter:blur(12px);
  border-top:1px solid rgba(255,255,255,.07);
  --safe-b:env(safe-area-inset-bottom);
  padding-bottom:max(0px, calc(var(--safe-b) - 12px)); }
.tabbar__wrap,.tabbar{ }
.tabbtn{ flex:1 1 0; position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; background:none; border:none;
  color:var(--muted); font-family:var(--font); font-size:11.5px; font-weight:600; padding:12px 4px 14px; cursor:pointer; letter-spacing:.02em;
  white-space:nowrap; }
.tabbtn svg{ width:23px; height:23px; }
.tabbtn.active{ color:var(--gold); }

.mstage{
  position:relative; margin:0 -6px 18px; padding:15px; border-radius:34px;
  isolation:isolate; overflow:hidden;
  background:#0b0c0f;
  box-shadow:0 24px 52px rgba(0,0,0,.42);
}
.mstage__bg{
  position:absolute; inset:0; z-index:0;
  background:url('/card-bg.jpg') center/cover no-repeat;
  filter:saturate(115%) contrast(104%);
}
.mstage__bg::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(90% 70% at 88% 4%, rgba(245,179,1,.16), transparent 58%),
    radial-gradient(85% 75% at 4% 100%, rgba(229,52,42,.18), transparent 60%),
    radial-gradient(120% 100% at 50% 50%, transparent 48%, rgba(6,6,9,.34) 100%),
    linear-gradient(180deg, rgba(8,8,11,.30), rgba(8,8,11,.62));
}
.mstage::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit;
  background:radial-gradient(60% 44% at 84% 2%, rgba(255,206,102,.20), transparent 62%);
  mix-blend-mode:screen;
}

.mcard{ position:relative; z-index:1; border-radius:28px; padding:20px 18px;
  -webkit-backdrop-filter:blur(30px) saturate(190%) brightness(1.04);
  backdrop-filter:blur(30px) saturate(190%) brightness(1.04);
  background:linear-gradient(158deg, rgba(24,26,33,.74) 0%, rgba(14,15,20,.78) 45%, rgba(10,11,15,.82) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -1px 0 rgba(255,255,255,.06),
    inset 0 0 22px rgba(255,255,255,.05),
    0 18px 40px rgba(0,0,0,.38);
  --text:#f7f7f5;
  --text-soft:#ededed;
  --muted:#c3c3c9;
  --muted-2:#a8a8b0;
  --line:rgba(255,255,255,.14);
  --line-2:rgba(255,255,255,.22);
  --gold:#f5b301;
  --gold-2:#ffc21a;
  --gold-3:#f5b301;
  --gold-4:#f5b301;
  color:var(--text);
}
.mcard::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit;
  background:
    linear-gradient(112deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.03) 26%, transparent 48%),
    radial-gradient(120% 80% at 12% 0%, rgba(255,255,255,.07), transparent 60%);
}
.mcard::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; border-radius:inherit;
  padding:1.5px;
  background:
    linear-gradient(140deg,
      rgba(255,255,255,.72) 0%,
      rgba(255,255,255,.18) 20%,
      rgba(255,255,255,.04) 44%,
      rgba(255,255,255,.14) 72%,
      rgba(255,255,255,.46) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.mcard__content::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.5; border-radius:inherit;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))) {
  .mcard{ background:linear-gradient(158deg, rgba(20,21,26,.93) 0%, rgba(12,13,17,.96) 100%); }
}
.mcard__content{ position:relative; z-index:1; }
.mcard__top{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.mcard__idblock{ min-width:0; }
.mcard__name{ font-family:var(--head); font-size:26px; font-weight:700; letter-spacing:.02em; text-transform:uppercase;
  line-height:1.1; overflow-wrap:anywhere; }
.mcard__id{ font-size:13.5px; color:var(--muted); letter-spacing:.06em; margin-top:3px; }
.mcard__program{ margin-top:8px; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); }

.mcard__qrwrap{ display:flex; flex-direction:column; align-items:center; gap:8px; flex:0 0 auto; }
.mcard__qr{ background:#fff; border-radius:14px; padding:7px; width:88px; height:88px; display:grid; place-items:center; cursor:pointer;
  border:1px solid rgba(255,255,255,.55); box-shadow:0 8px 20px rgba(0,0,0,.34);
  --text:#16161a; --muted:#6a6a73; color:var(--text); }
.mcard__qr svg{ width:100%; height:100%; max-width:100%; max-height:100%; display:block; }
.mcard__showqr{ display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.20); border-radius:999px;
  padding:5px 12px; color:var(--gold); font-family:var(--head); font-size:11px; font-weight:600;
  letter-spacing:.12em; cursor:pointer; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20);
  transition:background .15s ease, border-color .15s ease; }
.mcard__showqr:hover{ background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.32); }

.mpanel{ position:relative; border-radius:20px;
  background:linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.03) 60%, rgba(0,0,0,.10));
  -webkit-backdrop-filter:blur(10px) saturate(140%); backdrop-filter:blur(10px) saturate(140%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 6px 18px rgba(0,0,0,.18); }
.mpanel::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; padding:1px;
  background:linear-gradient(140deg, rgba(255,255,255,.34) 0%, rgba(255,255,255,.05) 40%, rgba(255,255,255,.20) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.mcard__daysbox{ margin-top:18px; padding:14px 16px 16px; }
.mcard__prog{ margin-top:12px; padding:12px 14px 14px; }
.mcard__proghead{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:6px; }
.mcard__progname{ font-family:var(--head); font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text); }
.mcard__progmeta{ font-size:11.5px; color:var(--muted); text-align:right; min-width:0; overflow-wrap:anywhere; }
.mcard__days--sm b{ font-size:38px; }
.mcard__days--sm span{ font-size:12px; }
.mcard__days{ display:flex; align-items:baseline; gap:12px; }
.mcard__days b{ font-family:var(--head); font-size:58px; line-height:.92; font-weight:700; color:var(--ink, var(--gold));
  text-shadow:0 0 18px currentColor, 0 2px 16px rgba(0,0,0,.38); transition:color .3s var(--ease); }
.mcard__days span{ font-family:var(--head); font-size:14px; letter-spacing:.14em; color:var(--muted); text-transform:uppercase; }

.progress{ position:relative; height:7px; background:rgba(0,0,0,.42); border-radius:999px; overflow:hidden; margin-top:14px;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.34); }
.progress__fill{ position:absolute; inset:0 auto 0 0; background:var(--fill, var(--gold)); border-radius:999px;
  box-shadow:0 0 12px rgba(0,0,0,.20);
  transition:width .55s var(--ease), background .3s var(--ease); }
.progress__fill--held{ background:#7cb2f8; }

.mcard .badge--premium,
html[data-theme="light"] .mcard .badge--premium{
  color:#ffd25e;
  background:linear-gradient(135deg, rgba(245,179,1,.26), rgba(245,179,1,.12));
  border-color:rgba(255,210,94,.55);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    0 0 18px rgba(245,179,1,.28),
    0 2px 10px rgba(0,0,0,.26);
}
.mcard .badge--premium i.dot,
html[data-theme="light"] .mcard .badge--premium i.dot{
  background:#ffd25e;
  animation:pai-premium-pulse 2.8s ease-in-out infinite;
}
@keyframes pai-premium-pulse{
  0%,100%{ box-shadow:0 0 6px currentColor, 0 0 2px currentColor; opacity:.82; }
  50%    { box-shadow:0 0 13px currentColor, 0 0 5px currentColor; opacity:1; }
}

.mcard--premium{
  background:linear-gradient(158deg, rgba(38,30,12,.74) 0%, rgba(24,19,10,.78) 45%, rgba(14,11,6,.82) 100%);
}
.mcard--premium::after{
  background:
    linear-gradient(140deg,
      rgba(255,214,110,.80) 0%,
      rgba(255,199,60,.22) 20%,
      rgba(255,255,255,.05) 44%,
      rgba(255,199,60,.20) 72%,
      rgba(255,214,110,.55) 100%);
}

.mcard--premium::before{
  background:
    linear-gradient(112deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.03) 26%, transparent 48%),
    radial-gradient(120% 80% at 12% 0%, rgba(255,214,110,.10), transparent 60%),
    linear-gradient(105deg, transparent 38%, rgba(255,231,163,.16) 47%, rgba(255,255,255,.22) 50%, rgba(255,231,163,.16) 53%, transparent 62%);
  background-size:100% 100%, 100% 100%, 260% 100%;
  background-repeat:no-repeat;
  background-position:0 0, 0 0, 190% 0;
  animation:pai-premium-sheen 9s ease-in-out infinite;
}
@keyframes pai-premium-sheen{
  0%,      68%{ background-position:0 0, 0 0, 190% 0; }
  100%        { background-position:0 0, 0 0, -90% 0; }
}

.mstage--premium::after{
  background:radial-gradient(64% 48% at 84% 2%, rgba(255,206,102,.32), transparent 64%);
}

.progress__fill--premium{
  background:linear-gradient(90deg, var(--gold-3), var(--gold-2) 50%, var(--gold-3));
  background-size:220% 100%;
  animation:pai-premium-flow 7s linear infinite;
  box-shadow:0 0 14px rgba(245,179,1,.34);
}
@keyframes pai-premium-flow{
  from{ background-position:0 0; }
  to  { background-position:-220% 0; }
}
.mcard--premium .mcard__days b{ line-height:1; letter-spacing:0; }

@media (prefers-reduced-motion:reduce){
  .mcard--premium::before{ animation:none; background-position:0 0, 0 0, 190% 0; }
  .progress__fill--premium{ animation:none; background-position:0 0; }
  .mcard .badge--premium i.dot,
  html[data-theme="light"] .mcard .badge--premium i.dot{ animation:none; }
}


.mcard__stats{ display:grid; grid-template-columns:repeat(3,1fr); margin-top:12px; padding:14px 4px; }
.mstat{ min-width:0; padding:0 10px; }
.mstat__label{ display:flex; align-items:center; gap:7px; font-size:10.5px; font-weight:600; letter-spacing:.08em; }
.mstat__ic{ display:grid; place-items:center; flex:0 0 auto; width:22px; height:22px; border-radius:8px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.15); color:var(--gold); }
.mstat__ic svg{ width:13px; height:13px; display:block; }
.mstat__label span{ color:var(--muted); text-transform:uppercase; }
.mstat__val{ font-weight:600; font-size:14.5px; margin-top:7px; line-height:1.3; overflow-wrap:anywhere; }
.mcard__stats .mstat:not(:first-child){ border-left:1px solid rgba(255,255,255,.10); }

@media (max-width:359px){
  .mcard__stats{ grid-template-columns:1fr; gap:12px; padding:14px 14px; }
  .mcard__stats .mstat:not(:first-child){ border-left:0; border-top:1px solid rgba(255,255,255,.10); padding-top:12px; }
  .mstat{ padding:0; }
  .mcard__days b{ font-size:50px; }
}

.sec{ font-family:var(--head); font-size:17px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; margin:0; }
.refcard__head{ display:flex; align-items:flex-start; gap:14px; margin-bottom:16px; }
.refcard__icon{ width:52px; height:52px; flex:0 0 52px; border-radius:50%; border:1.5px solid rgba(245,179,1,.5); display:grid; place-items:center; color:var(--gold); }
.refcard__icon svg{ width:24px; height:24px; }
.refbox{ display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px dashed rgba(245,179,1,.4); border-radius:14px; padding:14px 16px; }
.refbox__label{ font-size:11.5px; letter-spacing:.1em; color:var(--muted); text-transform:uppercase; }
.refbox__code{ font-family:var(--head); font-size:26px; letter-spacing:.12em; color:var(--text); margin-top:4px; }
.refbox__code i{ font-style:normal; color:var(--gold); }
.sec-row{ display:flex; align-items:center; justify-content:space-between; padding-bottom:12px; }
.sec-row .sec{ margin-bottom:0; }


.progstrip{ display:flex; gap:10px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); flex-wrap:wrap; }
.progstrip > div{ flex:1 1 160px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.progstrip__k{ font-size:11px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); font-weight:700; }
.progstrip b{ font-size:19px; font-weight:800; color:var(--text); font-family:var(--head); }
.progstrip__d{ font-size:12px; color:var(--muted); }

.moredetail{ margin-bottom:16px; border:1px solid var(--line); border-radius:14px; background:var(--card); padding:0 16px; }
.moredetail[open]{ padding-bottom:16px; }
.moredetail__s{ list-style:none; cursor:pointer; padding:14px 0; font-size:13px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--muted); display:flex; align-items:center; gap:8px; }
.moredetail__s::-webkit-details-marker{ display:none; }
.moredetail__s::after{ content:''; width:7px; height:7px; border-right:2px solid currentColor;
  border-bottom:2px solid currentColor; transform:rotate(45deg); transition:transform .18s ease; margin-left:2px; }
.moredetail[open] .moredetail__s::after{ transform:rotate(-135deg); }
.moredetail__s:hover{ color:var(--text); }

.setgroup{ margin-bottom:26px; }
.setgroup__h{ font-family:var(--head); font-size:13px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gold); margin:0 0 14px; padding-bottom:9px; border-bottom:1px solid var(--line); }
html[data-theme="light"] .setgroup__h{ color:var(--gold-4,#7a5800); }
.setgroup__switches{ display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.linkbtn{ display:inline-flex; align-items:center; gap:3px; background:none; border:none; color:var(--text); font-family:var(--font); font-size:14px; font-weight:600; cursor:pointer; }
.linkbtn svg{ width:16px; height:16px; }

.profile-card{ text-align:center; }
.avatar{ position:relative; overflow:hidden;
  width:74px; height:74px; border-radius:50%; margin:0 auto 12px; display:grid; place-items:center; font-family:var(--head); font-size:28px; font-weight:700; color:#111;
  background:linear-gradient(145deg,#ffe08a,var(--gold) 55%,var(--gold-3)); box-shadow:0 8px 22px rgba(245,179,1,.22); }
.avatar__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mphoto{ position:relative; flex:0 0 auto; width:64px; height:64px; border-radius:50%; overflow:hidden;
  display:grid; place-items:center; font-family:var(--head); font-size:22px; font-weight:700; color:#111;
  background:linear-gradient(145deg,#ffe08a,var(--gold) 55%,var(--gold-3)); box-shadow:0 6px 16px rgba(245,179,1,.18); }
.mphoto__ini{ line-height:1; }
.mphoto__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mphoto--sm{ width:36px; height:36px; font-size:13px; box-shadow:0 3px 8px rgba(245,179,1,.14); }
.cellwho{ display:flex; align-items:center; gap:10px; min-width:0; }
.person{ display:flex; align-items:center; gap:10px; }
.person__t{ min-width:0; }
.person__t b{ display:block; line-height:1.25; }
.mphoto--xs{ width:28px; height:28px; font-size:11px; box-shadow:0 2px 6px rgba(245,179,1,.12); }
.mphoto--zoom{ padding:0; border:0; cursor:zoom-in; font:inherit; }
.mphoto--zoom:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.lightbox{ position:fixed; inset:0; background:rgba(0,0,0,.9); display:none;
  align-items:center; justify-content:center; padding:24px; z-index:200; }
.lightbox.open{ display:flex; }
.lightbox__img{ max-width:min(92vw,560px); max-height:88vh; width:auto; height:auto;
  border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.6); }
.lightbox__close{ position:absolute; top:12px; right:16px; background:none; border:0;
  color:#fff; font-size:34px; line-height:1; cursor:pointer; padding:4px 12px; }
.lightbox__close:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; border-radius:6px; }
.profile-name{ font-family:var(--head); font-size:22px; font-weight:600; }
.kv{ display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-top:1px solid var(--line); font-size:14px; }
.kv:first-of-type{ border-top:none; }
.kv span{ color:var(--muted); } .kv b{ text-align:right; }
.tl__time{ line-height:1.5; }

:root{
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out-back:cubic-bezier(.34,1.4,.64,1);
}
html{ scrollbar-width:none; -ms-overflow-style:none; }
html::-webkit-scrollbar, body::-webkit-scrollbar, .view::-webkit-scrollbar{ width:0; height:0; display:none; }

.tabbtn__ic{ position:relative; width:24px; height:24px; display:grid; place-items:center; }
.tabbtn__ic svg{ position:absolute; inset:0; margin:auto; width:24px; height:24px; }
.ic-line{ opacity:1; transform:scale(1); transition:opacity .2s var(--ease), transform .2s var(--ease); }
.ic-fill{ opacity:0; transform:scale(.72); transition:opacity .2s var(--ease), transform .2s var(--ease); }
.tabbtn.active .ic-line{ opacity:0; transform:scale(1.08); }
.tabbtn.active .ic-fill{ opacity:1; transform:scale(1); animation:iconPop .34s var(--ease-out-back); }
.tabbtn{ transition:color .2s var(--ease), transform .2s var(--ease); }
.tabbtn.active{ transform:translateY(-1px); }
.tabbtn:active{ transform:translateY(0) scale(.94); transition-duration:.09s; }
.tabbtn span:last-child{ transition:color .2s var(--ease); }
@keyframes iconPop{ 0%{ transform:scale(.72); } 100%{ transform:scale(1); } }


.tl__icon{ font-size:0; background:rgba(245,179,1,.10); color:var(--gold); }
.tl__icon svg{ width:20px; height:20px; }
.tl__icon--first{ background:rgba(229,52,42,.13); color:#ff6a60; }
.tl__icon--renew{ background:rgba(34,197,94,.13); color:#38d17f; }
.tl__icon--bonus{ background:rgba(34,197,94,.13); color:#38d17f; }
.tl__icon--adjust{ background:var(--field-2); color:var(--muted); }

.chart-legend{ display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; font-size:12.5px; color:var(--muted); }
.chart-legend--col{ flex-direction:column; gap:9px; }
.chart-legend .lg{ display:inline-flex; align-items:center; gap:7px; }
.chart-legend .lg i{ width:10px; height:10px; border-radius:3px; flex:0 0 auto; }
.chart-legend .lg b{ color:var(--text); }
.donut-wrap{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; justify-content:center; }
.chart-plot{ position:relative; }
.chart-plot svg{ outline:none; }
.chart-plot svg:focus-visible{ outline:2px solid var(--gold-3); outline-offset:3px; border-radius:8px; }
.chart-tip{
  position:absolute; top:6px; z-index:3; pointer-events:none;
  background:var(--card-2); border:1px solid var(--line-2); border-radius:10px;
  padding:8px 10px; min-width:104px; font-size:12px; line-height:1.45;
  box-shadow:0 10px 26px rgba(0,0,0,.34);
}
.chart-tip[hidden]{ display:none; }
.chart-tip__d{ color:var(--muted); font-size:11px; letter-spacing:.04em; text-transform:uppercase; margin-bottom:4px; }
.chart-tip__r{ display:flex; align-items:center; gap:7px; white-space:nowrap; }
.chart-tip__r i{ width:9px; height:9px; border-radius:3px; flex:0 0 auto; }
.chart-tip__r span{ color:var(--muted); }
.chart-tip__r b{ margin-left:auto; color:var(--text); font-variant-numeric:tabular-nums; }
html[data-theme="light"] .chart-tip{ box-shadow:0 10px 26px rgba(16,17,20,.16); }

.chart-card{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; margin-bottom:16px; }
.chart-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.chart-title{ font-family:var(--head); font-size:17px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; margin:0; }
.chart-sub{ font-size:12.5px; color:var(--muted); margin:3px 0 0; }
.chip-group{ display:inline-flex; gap:4px; background:var(--bg-2); border:1px solid var(--line); border-radius:11px; padding:4px; }
.chip{ background:transparent; border:none; color:var(--muted); font-family:var(--font); font-size:12.5px; font-weight:600; padding:7px 13px; border-radius:8px; cursor:pointer; transition:background .15s,color .15s; white-space:nowrap; }
.chip:hover{ color:var(--text); }
.chip.active{ background:var(--gold); color:#111; }

.kpi-row{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); margin-bottom:14px; }
.kpi{ position:relative; overflow:hidden; background:linear-gradient(150deg,#17181c 0%,#121317 60%,#0e0f12 100%);
  border:1px solid #262730; border-radius:18px; padding:18px 18px 16px; }
.kpi::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 90% at 100% 0%, rgba(245,179,1,.10), transparent 55%); }
.kpi--brand::after{ background:radial-gradient(120% 90% at 100% 0%, rgba(229,52,42,.14), transparent 55%); }
.kpi__top{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.kpi__label{ font-size:11.5px; text-transform:uppercase; letter-spacing:.11em; color:var(--muted); }
.kpi__ic{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; flex:0 0 auto;
  background:rgba(245,179,1,.12); color:var(--gold); }
.kpi--brand .kpi__ic{ background:rgba(229,52,42,.14); color:#ff6a60; }
.kpi--good .kpi__ic{ background:rgba(34,197,94,.13); color:#38d17f; }
.kpi__ic svg{ width:18px; height:18px; }
.kpi__value{ position:relative; font-family:var(--head); font-size:34px; font-weight:700; line-height:1.05; margin-top:12px; }
.kpi--gold .kpi__value{ color:var(--gold); }
.kpi--brand .kpi__value{ color:#ff7a72; }
.kpi__sub{ position:relative; font-size:12.5px; color:var(--muted); margin-top:5px; }

.stat{ transition:border-color .15s, transform .15s; }
.stat:hover{ border-color:#33343d; transform:translateY(-1px); }
.stat__label{ font-size:11px; letter-spacing:.1em; }

.panel-head{ margin:2px 0 14px; }
.panel-head h2{ font-family:var(--head); font-size:22px; font-weight:600; letter-spacing:.03em; margin:0; }
.panel-head p{ font-size:13px; color:var(--muted); margin:5px 0 0; }

.tabs{ gap:4px; padding:10px 18px 2px; }
.tab{ border-radius:10px; border-bottom:none; padding:9px 14px; }
.tab.active{ background:rgba(245,179,1,.12); color:var(--gold); }
.tab:hover{ background:var(--field); }

table tbody tr{ transition:background .12s; }
table tbody tr:hover{ background:rgba(255,255,255,.028); }

.note-card{ display:flex; gap:14px; align-items:flex-start; background:linear-gradient(135deg,rgba(245,179,1,.09),transparent 60%);
  border:1px solid rgba(245,179,1,.32); border-radius:16px; padding:16px; margin-bottom:16px; }
.note-card--brand{ background:linear-gradient(135deg,rgba(229,52,42,.10),transparent 60%); border-color:rgba(229,52,42,.32); }
.note-card__ic{ width:42px; height:42px; flex:0 0 42px; border-radius:12px; display:grid; place-items:center; background:rgba(245,179,1,.14); color:var(--gold); }
.note-card--brand .note-card__ic{ background:rgba(229,52,42,.14); color:#ff6a60; }
.note-card__ic svg{ width:21px; height:21px; }
.note-card__body{ flex:1 1 auto; min-width:0; }
.note-card__title{ font-weight:700; font-size:14.5px; }
.note-card__msg{ font-size:13px; color:var(--muted); margin-top:3px; line-height:1.5; }
.note-card__actions{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }

.srow{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 0; border-top:1px solid var(--line); }
.srow:first-of-type{ border-top:none; }
.srow__t{ font-size:14.5px; font-weight:600; }
.srow__d{ font-size:12.5px; color:var(--muted); margin-top:2px; }

.fbhead{ display:flex; align-items:center; gap:12px; width:100%; background:none; border:0; padding:0; text-align:left; color:inherit; font:inherit; cursor:pointer; }
.fbhead__ring{ width:42px; height:42px; flex:0 0 42px; border-radius:50%; background:var(--field-2); border:1px solid var(--line-2); display:grid; place-items:center; color:var(--text); }
.fbhead__ring svg{ width:20px; height:20px; }
.fbhead__txt{ flex:1; min-width:0; }
.fbhead__t{ font-size:15px; font-weight:600; margin:0; }
.fbhead__chev{ flex:0 0 20px; color:var(--muted); display:grid; place-items:center; transition:transform .28s ease; }
.fbhead__chev svg{ width:20px; height:20px; display:block; }
.fbhead[aria-expanded="true"] .fbhead__chev{ transform:rotate(90deg); }

.fbform{ overflow:hidden; max-height:720px; opacity:1;
         transition:max-height .34s ease, opacity .2s ease .04s, margin-top .34s ease; }
.fbform[hidden]{ display:none; }
.fbform--shut{ max-height:0; opacity:0; margin-top:0 !important; }

.fbcats{ display:flex; flex-direction:column; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.fbcat{ display:flex; align-items:center; gap:11px; width:100%; padding:12px 13px; background:var(--field); border:0; border-bottom:1px solid var(--line); color:var(--text); font:inherit; text-align:left; cursor:pointer; }
.fbcat:last-child{ border-bottom:none; }
.fbcat svg{ width:18px; height:18px; color:var(--muted); flex:0 0 18px; }
.fbcat__l{ font-size:13.5px; font-weight:500; flex:1; }
.fbcat__tick{ width:16px; height:16px; border-radius:50%; border:1.5px solid var(--line-2); flex:0 0 16px; }
.fbcat[aria-pressed="true"]{ background:var(--card-2); }
.fbcat[aria-pressed="true"] svg{ color:var(--text); }
.fbcat[aria-pressed="true"] .fbcat__l{ color:var(--text); font-weight:600; }
.fbcat[aria-pressed="true"] .fbcat__tick{ border-color:var(--gold); background:var(--gold); display:grid; place-items:center; }
.fbcat[aria-pressed="true"] .fbcat__tick::after{ content:""; width:4.5px; height:8px; border:solid #14140c; border-width:0 2px 2px 0; transform:rotate(45deg) translate(-1px,-1px); }

.fbcount{ font-size:11.5px; color:var(--muted-2); margin-top:6px; }
.fbnote{ font-size:12.5px; color:var(--amber); margin:8px 0 0; min-height:1px; }

.fbdone{ display:grid; place-items:center; gap:11px; padding:24px 0 20px; text-align:center; }
.fbdone[hidden]{ display:none; }
.fbdone__ring{ width:54px; height:54px; border-radius:50%; border:2px solid var(--gold); display:grid; place-items:center;
               animation:fbPop .44s cubic-bezier(.2,.9,.3,1.25) both; }
.fbdone__ring svg{ width:26px; height:26px; color:var(--gold); }
.fbdone__ring svg path{ stroke-dasharray:30; stroke-dashoffset:30; animation:fbDraw .34s .2s ease-out forwards; }
.fbdone__t{ font-size:15px; font-weight:600; animation:fbRise .32s .26s both; }
.fbdone__d{ font-size:12.5px; color:var(--muted); margin-top:-4px; animation:fbRise .32s .34s both; }
.fbdone--out{ opacity:0; transition:opacity .3s ease; }

@keyframes fbPop{ from{ transform:scale(.35); opacity:0 } to{ transform:scale(1); opacity:1 } }
@keyframes fbDraw{ to{ stroke-dashoffset:0 } }
@keyframes fbRise{ from{ transform:translateY(7px); opacity:0 } to{ transform:none; opacity:1 } }

@media (prefers-reduced-motion:reduce){
  .fbform, .fbhead__chev, .fbdone--out{ transition:none; }
  .fbdone__ring, .fbdone__t, .fbdone__d{ animation:none; }
  .fbdone__ring svg path{ animation:none; stroke-dashoffset:0; }
}

.steps{ margin:8px 0 0; padding-left:20px; color:var(--text-soft); font-size:14px; line-height:1.7; }
.steps li{ margin-bottom:4px; }


html[data-theme="light"]{
  --bg:#f4f4f6;
  --bg-2:#ffffff;
  --card:#ffffff;
  --card-2:#f7f7f9;
  --field:#ffffff;
  --field-2:#f2f2f5;
  --line:#e3e3e8;
  --line-2:#cdcdd5;
  --text:#16161a;
  --text-soft:#2b2b31;
  --muted:#6a6a73;
  --muted-2:#8e8e98;
  --gold-3:#9a7000;
  --gold-4:#7a5800;
}
html[data-theme="light"] .appbar{ background:rgba(255,255,255,.9); border-bottom-color:var(--line); }
html[data-theme="light"] .iconbtn{ background:var(--field-2); border-color:var(--line); }
html[data-theme="light"] .iconbtn:hover{ background:#eaeaef; border-color:var(--line-2); }
html[data-theme="light"] #themeBtn,
html[data-theme="light"] .ptr{ color:var(--gold-3); }
html[data-theme="light"] .ptr{ background:#fff; border-color:var(--line-2); box-shadow:0 6px 18px rgba(16,17,20,.16); }
html[data-theme="light"] .ptr__track{ stroke:#dcdce3; }
html[data-theme="light"] .wordmark b{ color:var(--text); }
html[data-theme="light"] .tabbar{ background:rgba(255,255,255,.96); border-top-color:var(--line); }
html[data-theme="light"] .progress{ background:rgba(0,0,0,.09); }
html[data-theme="light"] table tbody tr:hover{ background:rgba(0,0,0,.035); }
html[data-theme="light"] .toast{ background:#f6f6f7; color:#111; border-color:rgba(0,0,0,.10); }
html[data-theme="light"] .toast.error{ background:#fdecea; color:#8a1c14; }
html[data-theme="light"] .toast.success{ background:#eafaf0; color:#0f5c33; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html[data-theme="light"] .toast{ background:rgba(255,255,255,.72); }
  html[data-theme="light"] .toast.error{ background:rgba(253,236,234,.78); }
  html[data-theme="light"] .toast.success{ background:rgba(234,250,240,.78); }
}
html[data-theme="light"] .header__logo{ filter:none; }
html[data-theme="light"] .modal{ background:rgba(22,22,26,.45); }
html[data-theme="light"] .card{ box-shadow:0 1px 2px rgba(16,17,20,.06); }
html[data-theme="light"] .wm-gold{ color:var(--gold-3); }
html[data-theme="light"] .gold{ color:var(--gold-4); }
html[data-theme="light"] .tabbtn.active{ color:var(--gold-4); }
html[data-theme="light"] .refbox__code i{ color:var(--gold-4); }
html[data-theme="light"] .refbox{ border-color:rgba(122,88,0,.45); }
html[data-theme="light"] .badge--active{ background:rgba(15,122,69,.12); color:#0b6238; }
html[data-theme="light"] .badge--expired{ background:rgba(179,37,29,.10); color:#b3251d; }
html[data-theme="light"] .badge--warn{ background:rgba(138,91,0,.12); color:#8a5b00; }
html[data-theme="light"] .badge--paused{ background:rgba(29,78,216,.12); color:#1d4ed8; }
html[data-theme="light"] .tl__icon--first{ background:rgba(179,37,29,.10); color:#b3251d; }
html[data-theme="light"] .tl__icon--bonus{ background:rgba(15,122,69,.12); color:#0f7a45; }
html[data-theme="light"] .tl__icon--renew{ background:rgba(15,122,69,.12); color:#0f7a45; }

.theme-seg{ display:flex; gap:6px; margin-top:12px; }
.theme-seg button{
  flex:1 1 0; display:flex; flex-direction:column; align-items:center; gap:6px;
  padding:12px 6px; border-radius:12px; cursor:pointer; font:inherit;
  font-size:12.5px; font-weight:600; letter-spacing:.01em;
  background:var(--field); border:1.5px solid var(--line); color:var(--muted);
  transition:border-color .15s, color .15s, background .15s;
}
.theme-seg button svg{ width:20px; height:20px; }
.theme-seg button:hover{ color:var(--text-soft); }
.theme-seg button.active{ border-color:var(--gold); color:var(--text); background:var(--card-2); }

.appbar__actions{ display:flex; align-items:center; gap:8px; margin-left:auto; }
.iconbtn{
  width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center;
  border-radius:11px; background:var(--field); border:1px solid var(--line);
  color:var(--text-soft); cursor:pointer; padding:0;
  transition:border-color .15s, color .15s, transform .12s;
}
.iconbtn svg{ width:18px; height:18px; }
.iconbtn:hover{ border-color:var(--line-2); color:var(--text); }
.iconbtn:active{ transform:scale(.94); }
.iconbtn:disabled{ opacity:.55; cursor:default; }
.iconbtn.is-spinning svg{ animation:spin .8s linear infinite; }

.ptr{
  position:fixed; top:0; left:50%; z-index:39;
  width:34px; height:34px; margin-left:-17px;
  display:grid; place-items:center;
  border-radius:50%; background:var(--card); border:1px solid var(--line);
  box-shadow:0 8px 22px rgba(0,0,0,.38);
  color:var(--gold);
  transform:translate3d(0,-44px,0) scale(.6); opacity:0;
  pointer-events:none; will-change:transform,opacity;
}
.ptr__svg{ width:20px; height:20px; transform:rotate(-90deg); overflow:visible; }
.ptr__track{ fill:none; stroke:var(--line-2); stroke-width:2.4; }
.ptr__arc{
  fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round;
}
.ptr.is-animating{ transition:transform .3s var(--ease), opacity .22s linear; }
.ptr.is-armed{ border-color:var(--gold); }
.ptr.is-busy{ border-color:var(--line); }
.ptr.is-busy .ptr__svg{ animation:spin .7s linear infinite; }
@media (prefers-reduced-motion:reduce){
  .ptr.is-animating{ transition:none; }
  .ptr.is-busy .ptr__svg{ animation-duration:1.4s; }
}
html,body{ overscroll-behavior-y:none; }
html[data-view="home"], html[data-view="home"] body{ overscroll-behavior-y:contain; }

html[data-view], html[data-view] body{ scrollbar-width:none; -ms-overflow-style:none; }
html[data-view]::-webkit-scrollbar,
html[data-view] body::-webkit-scrollbar{ width:0; height:0; display:none; }

.iconbtn__sun,.iconbtn__moon{ display:none; }
html[data-theme="dark"] .iconbtn__sun{ display:block; }
html[data-theme="light"] .iconbtn__moon{ display:block; }
html:not([data-theme]) .iconbtn__sun{ display:block; }
#themeBtn{ color:var(--gold); }
#themeBtn:hover{ color:var(--gold-2, var(--gold)); }

.btn.is-busy, .btn-login.is-busy{ opacity:.85; cursor:progress; }
.btn:disabled, .btn-login:disabled{ opacity:.6; cursor:not-allowed; }
.spin{
  width:14px; height:14px; flex:0 0 14px; display:inline-block; border-radius:50%;
  border:2px solid currentColor; border-top-color:transparent;
  animation:spin .65s linear infinite; vertical-align:-2px;
}

.btn.is-done, .btn-login.is-done{ opacity:1; cursor:default; }
.btn .spin, .btn-login .spin, .btn .btntick, .btn-login .btntick{ animation-fill-mode:both; }
.btn .spin, .btn-login .spin{ animation:spin .65s linear infinite, btnfxIn .16s ease-out; }
.btntick{
  display:inline-grid; place-items:center; width:19px; height:19px; flex:0 0 19px;
  vertical-align:-4px; animation:btnfxIn .2s cubic-bezier(.2,.9,.3,1.3) both;
}
.btntick svg{ width:19px; height:19px; display:block; }
.btntick svg path{ stroke-dasharray:26; stroke-dashoffset:26; animation:fbDraw .28s .05s ease-out forwards; }
@keyframes btnfxIn{ from{ opacity:0; transform:scale(.6); } to{ opacity:1; transform:none; } }

.pai-booting #loginScreen,
.pai-booting #appScreen,
.pai-booting #dashScreen,
.pai-booting #setupScreen{ display:none !important; }
.pai-boot{ display:none; }
.pai-booting .pai-boot{
  position:fixed; top:0; right:0; bottom:0; left:0; inset:0;
  z-index:60;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:var(--bg); color:var(--muted);
  padding:0 24px; text-align:center;
  user-select:none; -webkit-user-select:none;
}
.pai-boot__mark{
  width:clamp(118px,22vh,min(184px,48vw)); height:auto; opacity:1;
  filter:drop-shadow(0 6px 20px rgba(0,0,0,.5));
  animation:paiBootIn .42s cubic-bezier(.2,.9,.3,1.15) both;
}
html[data-theme="light"] .pai-boot__mark{ filter:none; }

.pai-boot__name{
  margin-top:clamp(14px,2.2vh,20px);
  font-family:var(--head); font-weight:600;
  font-size:clamp(19px,5.2vw,25px); letter-spacing:.15em;
  text-transform:uppercase; color:var(--text); line-height:1.1;
  animation:paiBootRise .42s .05s cubic-bezier(.2,.9,.3,1.05) both;
}
.pai-boot__tag{
  margin-top:7px;
  font-family:var(--font); font-weight:500;
  font-size:10.5px; letter-spacing:.34em; text-transform:uppercase;
  color:var(--muted); line-height:1.1;
  animation:paiBootRise .42s .12s cubic-bezier(.2,.9,.3,1.05) both;
}
.pai-boot__bar{
  margin-top:clamp(26px,4.4vh,40px);
  width:24px; height:24px; border-radius:50%; opacity:1;
  border:2px solid var(--line); border-top-color:var(--gold);
  animation:spin .7s linear infinite;
}
html[data-theme="light"] .pai-boot__bar{ border-top-color:var(--gold-3); }

@keyframes paiBootIn{ from{ transform:scale(.94); } to{ transform:none; } }
@keyframes paiBootRise{ from{ transform:translateY(7px); } to{ transform:none; } }

@media (prefers-reduced-motion:reduce){
  .pai-boot__mark, .pai-boot__name, .pai-boot__tag, .pai-boot__bar{ animation:none; transform:none; }
}

.btnsr{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

@media (prefers-reduced-motion:reduce){
  .btntick svg path{ stroke-dashoffset:0; }
}

.undobar{
  position:fixed; left:50%; transform:translateX(-50%) translateY(140%);
  bottom:calc(env(safe-area-inset-bottom) + 20px); z-index:9998;
  width:min(560px, calc(100vw - 28px));
  display:flex; align-items:center; gap:12px;
  padding:13px 14px 13px 16px; border-radius:14px;
  background:var(--card-2); border:1px solid var(--line-2);
  box-shadow:0 16px 40px rgba(0,0,0,.45);
  transition:transform .26s cubic-bezier(.2,.9,.3,1.2), opacity .2s;
  opacity:0;
}
.undobar.show{ transform:translateX(-50%) translateY(0); opacity:1; }
.undobar__text{ flex:1 1 auto; font-size:13.5px; line-height:1.35; }
.undobar__text b{ color:var(--text); }
.undobar__sub{ display:block; color:var(--muted); font-size:12px; margin-top:2px; }
.undobar__btn{
  flex:0 0 auto; background:transparent; border:1.5px solid var(--gold); color:var(--gold);
  border-radius:10px; padding:9px 16px; font:inherit; font-size:13px; font-weight:700;
  cursor:pointer; letter-spacing:.02em;
}
.undobar__btn:hover{ background:rgba(245,179,1,.12); }
.undobar__btn:disabled{ opacity:.5; cursor:default; }
.undobar__close{
  flex:0 0 auto; background:none; border:none; color:var(--muted-2);
  font-size:20px; line-height:1; cursor:pointer; padding:2px 4px;
}

.tl__item--reverted .tl__title{ text-decoration:line-through; color:var(--muted); }
.tl__item--reverted .tl__icon{ opacity:.5; }
.tag-reverted{
  display:inline-block; margin-left:6px; padding:2px 7px; border-radius:6px;
  background:var(--field-2); color:var(--muted); font-size:10.5px; font-weight:700;
  letter-spacing:.05em; text-transform:uppercase; text-decoration:none; vertical-align:1px;
}

.renew-card{
  display:flex; gap:13px; align-items:flex-start;
  border-radius:16px; padding:16px; margin-bottom:16px;
  background:rgba(245,165,36,.10); border:1px solid rgba(245,165,36,.35);
}
.renew-card--expired{ background:rgba(229,52,42,.10); border-color:rgba(229,52,42,.38); }
.renew-card__ic{
  width:38px; height:38px; flex:0 0 38px; border-radius:10px; display:grid; place-items:center;
  background:rgba(245,165,36,.16); color:var(--amber);
}
.renew-card--expired .renew-card__ic{ background:rgba(229,52,42,.16); color:#ff6a60; }
html[data-theme="light"] .renew-card--expired .renew-card__ic{ color:#b3251d; }
.renew-card__title{ font-weight:700; font-size:14.5px; margin-bottom:3px; }
.renew-card__msg{ color:var(--muted); font-size:13px; line-height:1.45; }
.renew-card__actions{ margin-top:11px; display:flex; gap:8px; flex-wrap:wrap; }


.bio-login{ width:100%; }
.btn-bio{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; }
.btn-bio svg{ width:22px; height:22px; flex:none; }
.btn-bio #bioLoginIcon{ display:inline-flex; flex:none; }
.btn-bio.is-busy{ opacity:.6; pointer-events:none; }

.divider--cap{ font-size:11px; letter-spacing:.22em; text-transform:uppercase; }

.biocard{
  width:100%; display:flex; align-items:center; gap:14px; text-align:left;
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:13px 15px; cursor:pointer; font-family:var(--font); color:var(--text);
  transition:border-color .15s, background .15s, transform .1s;
}
.biocard:hover{ background:var(--card-2); border-color:var(--line-2); }
.biocard:active{ transform:scale(.99); }
.biocard:disabled,.biocard.is-busy{ opacity:.6; cursor:progress; }
.biocard__ic{
  width:50px; height:50px; flex:0 0 50px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--field-2); border:1px solid var(--line);
  color:var(--brand);
}
.biocard__ic svg{ width:26px; height:26px; }
.biocard__txt{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:3px; }
.biocard__t{ font-size:15.5px; font-weight:700; letter-spacing:.01em; }
.biocard__d{ font-size:12.5px; color:var(--muted); }
.biocard__go{ width:17px; height:17px; flex:0 0 auto; color:var(--muted-2); }
html[data-theme="light"] .biocard__ic{ background:rgba(229,52,42,.08); border-color:rgba(229,52,42,.22); }

.devrow{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 0; border-bottom:1px solid var(--line); }
.devrow:last-child{ border-bottom:0; }
.devrow__t{ font-weight:700; font-size:14px; display:flex; align-items:center; gap:8px; }
.devrow__d{ font-size:12px; color:var(--muted); margin-top:2px; }

.att-chip{ display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px;
  font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap;
  background:rgba(245,165,36,.16); color:var(--amber); border:1px solid rgba(245,165,36,.3); }
.att-chip::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.att-chip--ok{ background:rgba(47,191,113,.15); color:#67e29b; border-color:rgba(47,191,113,.3); }
.att-chip:hover{ filter:brightness(1.1); }

.checkin-ok{ text-align:center; padding:14px 0 4px; }
.checkin-ok__tick{ width:56px; height:56px; margin:0 auto 12px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:28px; font-weight:800;
  background:rgba(47,191,113,.15); color:#67e29b; }
.checkin-ok h4{ margin:0 0 4px; font-size:17px; }
.notice{ border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:var(--field-2); }
.notice--warn{ border-color:rgba(245,165,36,.35); background:rgba(245,165,36,.08); }
.attlist__row{ display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center;
  padding:9px 0; border-bottom:1px solid var(--line); font-size:13.5px; }
.attlist__row:last-child{ border-bottom:0; }

.late{ color:var(--amber); font-weight:700; font-size:12.5px; white-space:nowrap; }
.ontime{ color:#67e29b; font-weight:600; font-size:12.5px; white-space:nowrap; }

html[data-theme="light"] .notice{ background:#f2f2f5; }
html[data-theme="light"] .devrow{ border-color:rgba(0,0,0,.09); }
html[data-theme="light"] .attlist__row{ border-color:rgba(0,0,0,.09); }


.badge--program{
  background:transparent; border:1px solid var(--line-2); color:var(--muted);
  font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
}
.badge--gym{ border-color:rgba(245,179,1,.55); color:var(--gold); }
.badge--mt{ border-color:rgba(199,139,255,.5); color:#c78bff; }
.badge--both{ position:relative; border-color:transparent; color:var(--text); }
.badge--both::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(100deg, rgba(245,179,1,.85) 0%, rgba(245,179,1,.5) 38%, rgba(199,139,255,.55) 62%, rgba(199,139,255,.9) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
html[data-theme="light"] .badge--both::before{
  background:linear-gradient(100deg, rgba(154,112,0,.9) 0%, rgba(154,112,0,.55) 38%, rgba(109,40,217,.6) 62%, rgba(109,40,217,.95) 100%);
}


.subtabs{ display:flex; gap:6px; flex-wrap:wrap; margin:0 0 16px; }
.subtab{
  display:inline-flex; align-items:center; gap:7px;
  background:var(--field); border:1px solid var(--line); color:var(--muted);
  font-family:var(--font); font-size:13px; font-weight:600;
  padding:8px 13px; border-radius:999px; cursor:pointer; white-space:nowrap;
  transition:background .15s, color .15s, border-color .15s;
}
.subtab:hover{ color:var(--text); border-color:var(--line-2); }
.subtab.active{ background:var(--gold); border-color:var(--gold); color:#111; }
.subtab__n{
  display:inline-grid; place-items:center; min-width:20px; height:18px; padding:0 6px;
  border-radius:999px; background:rgba(255,255,255,.09); font-size:11px; font-weight:700;
}
.subtab.active .subtab__n{ background:rgba(0,0,0,.18); }
.subtab__n--new{ background:#1a7d4a; color:#fff; }
.subtab.active .subtab__n--new{ background:rgba(0,0,0,.18); color:inherit; }


html[data-theme="light"] .topbar{
  background:rgba(255,255,255,.92);
  border-bottom-color:var(--line);
}
html[data-theme="light"] .topbar__brand b,
html[data-theme="light"] .stat--gold .stat__value,
html[data-theme="light"] .kpi--gold .kpi__value,
html[data-theme="light"] .refcode__code,
html[data-theme="light"] .badge--gym{ color:var(--gold-4); }
html[data-theme="light"] .tab.active{ background:rgba(245,179,1,.16); color:var(--gold-4); }
html[data-theme="light"] .badge--gym{ border-color:rgba(154,112,0,.45); }
html[data-theme="light"] .badge--mt{ color:#6d28d9; border-color:rgba(109,40,217,.4); }
html[data-theme="light"] .badge--gold{ background:rgba(154,112,0,.12); color:var(--gold-3); }

html[data-theme="light"] .kpi{
  background:linear-gradient(150deg,#ffffff 0%,#fbfbfd 60%,#f7f7f9 100%);
  border-color:var(--line);
  box-shadow:0 1px 2px rgba(16,17,20,.06);
}
html[data-theme="light"] .kpi--brand .kpi__ic,
html[data-theme="light"] .kpi--brand .kpi__value,
html[data-theme="light"] .note-card--brand .note-card__ic{ color:#b3251d; }
html[data-theme="light"] .kpi--good .kpi__ic{ color:#0f7a45; }

html[data-theme="light"] .att-chip--ok,
html[data-theme="light"] .checkin-ok__tick,
html[data-theme="light"] .ontime{ color:#0f7a45; }
html[data-theme="light"] .att-chip{ color:#8a5b00; }
html[data-theme="light"] .late{ color:#8a5b00; }

html[data-theme="light"] th{ background:var(--field-2); }
html[data-theme="light"] .chip-group{ background:var(--field-2); }
html[data-theme="light"] .chip.active{ background:var(--gold-4); color:#fff; }
html[data-theme="light"] .subtab__n{ background:rgba(0,0,0,.07); }
html[data-theme="light"] .subtab.active{ background:var(--gold-4); border-color:var(--gold-4); color:#fff; }
html[data-theme="light"] .subtab.active .subtab__n{ background:rgba(255,255,255,.22); }
html[data-theme="light"] .subtab__n--new{ background:#136437; color:#fff; }
html[data-theme="light"] .subtab.active .subtab__n--new{ background:rgba(255,255,255,.22); color:inherit; }
html[data-theme="light"] .btn-outline:hover{ border-color:var(--line-2); }
html[data-theme="light"] .undobar{ box-shadow:0 16px 40px rgba(16,17,20,.18); }
html[data-theme="light"] .undobar__btn{ border-color:var(--gold-3); color:var(--gold-3); }
html[data-theme="light"] .seg button.active{ background:var(--gold-4); border-color:var(--gold-4); color:#fff; }

.hint{ margin-top:12px; border-top:1px solid var(--line); padding-top:11px; }
.hint > summary{
  cursor:pointer; list-style:none; display:flex; align-items:center; gap:8px;
  font-size:13px; font-weight:600; color:var(--muted);
  transition:color .15s;
}
.hint > summary::-webkit-details-marker{ display:none; }
.hint > summary::marker{ content:""; }
.hint > summary::after{
  content:""; margin-left:auto; width:6px; height:6px; flex:0 0 auto;
  border-right:1.7px solid currentColor; border-bottom:1.7px solid currentColor;
  transform:translateY(-2px) rotate(45deg); transition:transform .18s ease;
}
.hint[open] > summary::after{ transform:translateY(1px) rotate(-135deg); }
.hint > summary:hover{ color:var(--text); }
.hint > summary:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:6px; }
.hint__body{ font-size:12.5px; line-height:1.55; color:var(--muted); margin:9px 0 0; }

.hint--plain{ margin-top:0; border-top:0; padding-top:0; }
.hint--danger > summary{ color:#ff6a60; }
.hint--danger > summary:hover{ color:#ff8b83; }
.hint--danger > summary:focus-visible{ outline-color:#ff6a60; }
html[data-theme="light"] .hint--danger > summary{ color:var(--brand); }
html[data-theme="light"] .hint--danger > summary:hover{ color:var(--brand-2); }
html[data-theme="light"] .hint--danger > summary:focus-visible{ outline-color:var(--brand); }

.badge--ok{ background:rgba(47,191,113,.15); color:#67e29b; }
html[data-theme="light"] .badge--ok{ background:rgba(15,122,69,.12); color:#0b6238; }


@media print {
  body * { visibility:hidden !important; }
  @page { margin:18mm; }
}

.mcard .badge,
html[data-theme="light"] .mcard .badge{
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(10px) saturate(140%);
  backdrop-filter:blur(10px) saturate(140%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20), 0 2px 10px rgba(0,0,0,.22);
  font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:6px 12px; border-radius:999px;
}
.mcard .badge i.dot,
html[data-theme="light"] .mcard .badge i.dot{
  width:6px; height:6px; box-shadow:0 0 8px currentColor, 0 0 3px currentColor;
}
.mcard .badge--active,   html[data-theme="light"] .mcard .badge--active{ color:#5ee39b; }
.mcard .badge--warn,     html[data-theme="light"] .mcard .badge--warn{ color:#ffc65c; }
.mcard .badge--expired,  html[data-theme="light"] .mcard .badge--expired{ color:#ffa9a2; }
.mcard .badge--paused,   html[data-theme="light"] .mcard .badge--paused{ color:#9dc3ff; }
.mcard .badge--muted,    html[data-theme="light"] .mcard .badge--muted{ color:var(--muted); }

.badge--premium,
.mcard .badge--premium,
.profile-card .badge--premium,
html[data-theme="light"] .mcard .badge--premium,
html[data-theme="light"] .profile-card .badge--premium{
  --pai-prem-ink:#ffe14d;
  color:var(--pai-prem-ink);
  background:linear-gradient(135deg, rgba(245,179,1,.34), rgba(245,179,1,.14));
  border:1px solid rgba(255,214,90,.62);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    0 0 16px rgba(245,179,1,.34),
    0 2px 10px rgba(0,0,0,.26);
  animation:pai-premium-glow 2.6s ease-in-out infinite;
}
html[data-theme="light"] .profile-card .badge--premium{
  --pai-prem-ink:#6b4d00;
  background:linear-gradient(135deg, rgba(245,179,1,.42), rgba(245,179,1,.22));
  border-color:rgba(154,112,0,.55);
}
.badge--premium i.dot,
.mcard .badge--premium i.dot,
.profile-card .badge--premium i.dot,
html[data-theme="light"] .mcard .badge--premium i.dot,
html[data-theme="light"] .profile-card .badge--premium i.dot{
  background:var(--pai-prem-ink);
  animation:pai-premium-pulse 2.6s ease-in-out infinite;
}
@keyframes pai-premium-glow{
  0%,100%{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.26),
      0 0 12px rgba(245,179,1,.26),
      0 2px 10px rgba(0,0,0,.26);
  }
  50%{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.30),
      0 0 26px rgba(245,179,1,.58),
      0 2px 10px rgba(0,0,0,.26);
  }
}
@media (prefers-reduced-motion:reduce){
  .badge--premium,
  .mcard .badge--premium,
  .profile-card .badge--premium,
  html[data-theme="light"] .mcard .badge--premium,
  html[data-theme="light"] .profile-card .badge--premium{
    animation:none;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.26),
      0 0 16px rgba(245,179,1,.34),
      0 2px 10px rgba(0,0,0,.26);
  }
  .badge--premium i.dot,
  .mcard .badge--premium i.dot,
  .profile-card .badge--premium i.dot,
  html[data-theme="light"] .mcard .badge--premium i.dot,
  html[data-theme="light"] .profile-card .badge--premium i.dot{ animation:none; }
}

.att-day { cursor: pointer; }
.att-day__caret { width: 1.2rem; color: var(--muted); user-select: none; }
.att-sessions > td { background: rgba(127,127,127,.06); padding: 0 0 6px; }
.att-sessions.hidden { display: none; }

.att-shifts { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.att-shift { white-space: nowrap; }
.att-shift__n {
  display: inline-block; min-width: 15px; margin-right: 3px; padding: 0 4px;
  border-radius: 4px; background: var(--line); font-size: 11px; font-weight: 700;
  text-align: center; opacity: .85;
}
.att-shift--empty { opacity: .62; font-style: italic; }
.att-shift--empty:hover { opacity: 1; font-style: normal; }

.att-emp--open { cursor: pointer; }
.att-emp--open:hover { background: var(--surface-2, rgba(255,255,255,.03)); }

.att-sess { width: 100%; margin: 4px 0; font-size: 13px; }
.att-sess th { font-weight: 600; opacity: .7; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.att-sess td, .att-sess th { padding: 6px 10px; }
.att-sess tfoot td { border-top: 1px solid var(--line); }
.att-sess--pending td { opacity: .75; }

.att-more { margin-top: 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

@media (max-width: 720px) {
  .att-shifts { flex-direction: row; flex-wrap: wrap; gap: 3px; }
  .att-sess { font-size: 12px; }
  .att-sess td, .att-sess th { padding: 5px 6px; }
  .att-sess thead { display: none; }
  .att-more { justify-content: center; }
}

.ai-wrap{ position:fixed; left:0; right:0;
  top:var(--ai-top, 150px);
  bottom:var(--ai-bottom, 92px);
  max-width:560px; margin:0 auto; padding:0 16px 6px;
  display:flex; flex-direction:column; gap:10px; }
.ai-list{ display:flex; flex-direction:column; gap:10px; flex:1 1 auto;
  min-height:0; overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none; -ms-overflow-style:none; }
.ai-list::-webkit-scrollbar{ width:0; height:0; display:none; }

.aimsg{ display:flex; align-items:flex-end; gap:8px; }
.aimsg--me{ justify-content:flex-end; }
.aimsg--coach{ justify-content:flex-start; }

.aimsg__av{ flex:0 0 auto; width:30px; height:30px; border-radius:50%; margin-bottom:1px;
  box-shadow:0 0 0 1px var(--line); }
.aimsg__b{ max-width:82%; min-width:0; padding:10px 13px; border-radius:16px; font-size:14.5px; line-height:1.5;
  white-space:pre-wrap; overflow-wrap:anywhere; }
.aimsg--me .aimsg__b{ background:var(--gold); color:#141518; border-bottom-right-radius:5px; font-weight:500; }
.aimsg--coach .aimsg__b{ background:var(--card-2); color:var(--text); border:1px solid var(--line); border-bottom-left-radius:5px;
  max-width:calc(82% - 38px); }

.aimsg__b{ -webkit-user-select:text; user-select:text; }

.aimsg__b--typing{ display:inline-flex; gap:4px; align-items:center; padding:13px; }
.aimsg__b--typing i{ width:6px; height:6px; border-radius:50%; background:var(--muted); animation:aiDot 1.1s infinite ease-in-out; }
.aimsg__b--typing i:nth-child(2){ animation-delay:.16s; }
.aimsg__b--typing i:nth-child(3){ animation-delay:.32s; }
@keyframes aiDot{ 0%,60%,100%{ opacity:.28; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-3px); } }
@media (prefers-reduced-motion: reduce){ .aimsg__b--typing i{ animation:none; opacity:.6; } }

.ai-empty{ text-align:center; padding:26px 12px; color:var(--muted); margin:auto 0; }
.ai-empty__av{ display:block; width:150px; height:158px; margin:0 auto 4px; }
@media (max-height: 620px){
  .ai-empty__av{ width:104px; height:110px; }
  .ai-empty{ padding:12px; }
}
.ai-empty__t{ font-family:var(--head); font-size:19px; color:var(--text); margin-bottom:6px; }
.ai-empty__d{ font-size:13.5px; line-height:1.55; max-width:32ch; margin:0 auto; }

.ai-bar{ flex:0 0 auto;
  display:flex; align-items:flex-end; gap:8px; padding:8px; border-radius:14px;
  background:var(--card); border:1px solid var(--line); }
.ai-input{ flex:1 1 auto; resize:none; border:none; outline:none; background:none; color:var(--text);
  font-family:var(--font); font-size:15px; line-height:1.4; padding:8px 4px; max-height:110px;
  -webkit-user-select:text; user-select:text; }
.ai-input::placeholder{ color:var(--muted-2); }
.ai-count{ align-self:center; font-size:11.5px; color:var(--muted); min-width:0; }
.ai-count--over{ color:#ff6a60; font-weight:700; }
.ai-send{ flex:0 0 auto; padding:9px 15px; font-size:13.5px; }
.ai-send:disabled{ opacity:.45; cursor:not-allowed; }
.ai-note{ flex:0 0 auto; text-align:center; margin:2px 0 0; }

:root{ --vvh-full:100vh; }
@supports (height: 100dvh){ :root{ --vvh-full:100dvh; } }
body.chat-pinned #dashScreen{
  position:fixed; top:0; left:0; right:0;
  height:var(--vvh, var(--vvh-full));
  transform:translateY(var(--vv-top, 0px));
  overflow:hidden;
}
body.kb-open .tabbar{ display:none; }
body.kb-open .ai-empty__av{ display:none; }
body.kb-open .ai-empty{ padding:8px 12px; }
body.kb-open{ overflow:hidden; }

@media (max-width: 400px){
  .tabbtn{ font-size:10.5px; padding:11px 2px 13px; letter-spacing:0; gap:4px; }
  .tabbtn__ic, .tabbtn__ic svg{ width:22px; height:22px; }
}
@media (max-width: 340px){
  .tabbtn{ font-size:9.5px; }
}

html[data-theme="light"] .aimsg--coach .aimsg__b{ background:#fff; border-color:rgba(0,0,0,.1); }
html[data-theme="light"] .ai-bar{ background:#fff; border-color:rgba(0,0,0,.1); }
html[data-theme="light"] .ai-count--over{ color:#b3251d; }

.pmodal{ background:transparent; border:0; box-shadow:none; padding:0; max-width:420px; }
.pmodal__close{
  position:absolute; top:10px; right:12px; z-index:3;
  color:rgba(255,255,255,.72); background:transparent; border:0; font-size:26px; line-height:1; cursor:pointer;
}
.pmodal__close:hover{ color:#fff; }

.pcard{
  position:relative; overflow:hidden; isolation:isolate;
  border-radius:26px; padding:30px 24px 24px; text-align:center;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(245,179,1,.20), transparent 62%),
    linear-gradient(165deg, #24200f 0%, #17150d 46%, #0e0d09 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 26px 60px rgba(0,0,0,.62);
  --text:#f7f7f5;
  --muted:#cfc8b4;
  color:var(--text);
}
.pcard::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; border-radius:inherit; padding:1.5px;
  background:linear-gradient(140deg, rgba(255,214,110,.92) 0%, rgba(255,199,60,.30) 34%, rgba(255,255,255,.10) 52%, rgba(255,199,60,.34) 74%, rgba(255,214,110,.80) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.pcard__sheen{
  position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit;
  background:linear-gradient(105deg, transparent 38%, rgba(255,231,163,.14) 47%, rgba(255,255,255,.20) 50%, rgba(255,231,163,.14) 53%, transparent 62%);
  background-size:260% 100%; background-repeat:no-repeat; background-position:190% 0;
  animation:pai-premium-sheen 7s ease-in-out infinite;
}
.pcard > *:not(.pcard__sheen){ position:relative; z-index:1; }

.pcard__crest{
  width:56px; height:56px; margin:0 auto 14px; border-radius:50%;
  display:grid; place-items:center;
  color:#ffd25e;
  background:radial-gradient(circle at 50% 30%, rgba(245,179,1,.28), rgba(245,179,1,.06));
  border:1px solid rgba(255,214,110,.5);
  box-shadow:0 0 22px rgba(245,179,1,.26);
}
.pcard__crest svg{ width:28px; height:28px; display:block; }

.pcard__eyebrow{
  font-family:var(--head); font-size:11px; font-weight:600; letter-spacing:.28em; text-transform:uppercase;
  color:#ffd25e; margin-bottom:8px;
}
.pcard__name{
  font-family:var(--head); font-size:30px; font-weight:700; line-height:1.1;
  text-transform:uppercase; letter-spacing:.02em; overflow-wrap:anywhere;
}
.pcard__id{ font-size:13px; letter-spacing:.08em; color:var(--muted); margin-top:4px; font-variant-numeric:tabular-nums; }
.pcard__line{ font-size:14.5px; line-height:1.55; color:var(--text); margin:16px 0 0; }
.pcard__line b{ color:#ffd25e; }

.pcard__grants{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:16px; }
.pcard__grant{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:600; letter-spacing:.04em;
  padding:6px 12px; border-radius:999px;
  color:#ffe6a8; background:rgba(245,179,1,.12); border:1px solid rgba(255,214,110,.34);
}
.pcard__grant svg{ width:13px; height:13px; display:block; flex:0 0 auto; }

.pcard__since{ margin-top:16px; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.pcard__open{ margin-top:18px; }

@media (prefers-reduced-motion:reduce){
  .pcard__sheen{ animation:none; background-position:190% 0; }
}

.photoctl{ display:flex; justify-content:center; gap:8px; margin-top:14px; flex-wrap:wrap; }
.profile-card--premium{
  border-color:rgba(255,214,110,.34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 0 26px rgba(245,179,1,.10);
}

.mcard__days b .inf{
  color:inherit;
  font-family:var(--font);
  font-size:1.5em;
  line-height:0;
  font-weight:400;
  letter-spacing:0;
  display:inline-block;
  vertical-align:-.06em;
}

.legal{ max-width:68ch; }
.legal h2{
  font-family:var(--head); font-size:19px; font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; color:var(--text); margin:0 0 12px;
  scroll-margin-top:78px;
}
.legal h3{
  font-family:var(--head); font-size:15px; font-weight:600; letter-spacing:.05em;
  text-transform:uppercase; color:var(--text-soft); margin:22px 0 9px;
  scroll-margin-top:78px;
}
.legal p, .legal li{ font-size:14.5px; line-height:1.65; color:var(--text-soft); margin:0 0 12px; }
.legal ul, .legal ol{ margin:0 0 12px; padding-left:20px; }
.legal li{ margin:0 0 7px; }
.legal li::marker{ color:var(--muted); }
.legal strong{ color:var(--text); font-weight:600; }
.legal a{ color:var(--gold); text-decoration:underline; text-underline-offset:2px; }
.legal a:hover{ color:var(--gold-2); }
html[data-theme="light"] .legal a{ color:var(--gold-4); }
.legal a:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:3px; }
.legal > :last-child{ margin-bottom:0; }

.legal__lead{ font-size:15.5px; line-height:1.6; color:var(--text); }

.legal__meta{ font-size:12.5px; color:var(--muted); margin:0 0 16px; letter-spacing:.01em; }

.legal__toc{ list-style:none; padding:0; margin:0; columns:2; column-gap:26px; }
.legal__toc li{ break-inside:avoid; margin:0 0 8px; font-size:13.5px; }
@media (max-width:560px){ .legal__toc{ columns:1; } }

.legal__tablewrap{ overflow-x:auto; margin:0 0 14px; -webkit-overflow-scrolling:touch; }
.legal table{ border-collapse:collapse; width:100%; font-size:13.5px; min-width:0; }
.legal__tablewrap--wide table{ min-width:560px; }
.legal th, .legal td{ text-align:left; vertical-align:top; white-space:normal; padding:9px 12px 9px 0; border-top:1px solid var(--line); }
.legal thead th{
  border-top:none; border-bottom:1px solid var(--line-2); color:var(--muted);
  font-weight:600; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  padding-bottom:8px; white-space:nowrap;
}
.legal tbody td{ color:var(--text-soft); }
.legal tbody td:first-child{ color:var(--text); font-weight:500; }

.legal__todo{
  display:inline-block; background:var(--brand-soft); color:var(--text);
  border:1px dashed var(--brand); border-radius:6px;
  padding:1px 7px; font-size:12.5px; font-weight:600; letter-spacing:.02em;
  font-family:var(--font);
}

.legal__note{
  background:var(--card-2); border:1px solid var(--line);
  border-left:3px solid var(--gold); border-radius:10px;
  padding:13px 15px; margin:0 0 14px;
}
.legal__note p:last-child{ margin-bottom:0; }
.legal__note--plain{ border-left-color:var(--line-2); }

.legal__foot{ display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; font-size:13.5px; }

.footer-note--legal{ margin-top:8px; font-size:clamp(11.5px,1.5vh,13px); }
.footer-note--legal a{ color:var(--muted); font-weight:500; text-decoration:underline; text-underline-offset:2px; }
.footer-note--legal a:hover{ color:var(--text-soft); }

.klink{ color:var(--gold); text-decoration:underline; text-underline-offset:2px; }
.klink:hover{ color:var(--gold-2); }
html[data-theme="light"] .klink{ color:var(--gold-4); }
.klink:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:4px; }

.pmatrix{ display:flex; flex-direction:column; gap:10px; }

.pmatrix__head{
  display:grid; grid-template-columns:minmax(150px,280px) 1fr;
  gap:10px;
}
.pmatrix__head span{
  font-size:10px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--muted); font-weight:700; text-align:right;
}
.pmatrix__row{
  display:grid; grid-template-columns:minmax(150px,280px) 1fr;
  gap:10px; align-items:center;
}
.pmatrix__rh{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.pmatrix__rh b{ font-size:14px; font-weight:600; color:var(--text); }
.pmatrix__rh span{ font-size:11.5px; line-height:1.4; color:var(--muted); }
.pmatrix__cells{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }

.pcell{ display:flex; flex-direction:column; min-width:0; }
.pcell__k{
  font-size:9.5px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted); font-weight:700; margin-bottom:5px; display:none;
}
.money{
  display:flex; align-items:center; gap:6px; width:100%; height:44px;
  padding:0 10px; background:var(--field); border:1px solid var(--line-2);
  border-radius:10px;
}
.money:focus-within{ border-color:var(--gold); background:var(--field-2); }
.money i{ font-style:normal; font-size:12px; color:var(--muted); flex:0 0 auto; }
.money input{
  width:100%; min-width:0; background:none; border:none; color:var(--text);
  font:inherit; font-size:15px; font-weight:600; padding:0; text-align:right;
  font-variant-numeric:tabular-nums;
}
.money input:focus{ outline:none; }
.money input::placeholder{ color:var(--muted-2); font-weight:400; }
.money input::-webkit-outer-spin-button,
.money input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.money input[type=number]{ -moz-appearance:textfield; appearance:textfield; }
.money--empty{ border-style:dashed; border-color:var(--line); }

@media (max-width:760px){
  .pmatrix{ gap:12px; }
  .pmatrix__head{ display:none; }
  .pmatrix__row{
    display:block; background:var(--card-2); border:1px solid var(--line);
    border-radius:12px; padding:13px;
  }
  .pmatrix__rh{ margin-bottom:11px; }
  .pcell__k{ display:block; }
  .pmatrix__cells{ gap:9px; }
  .pmatrix__cells .money{ padding:0 8px; gap:4px; }
  .pmatrix__cells .money i{ font-size:11px; }
}

/* A month grid does not benefit from extra width: past ~460px the squares just
   grow into empty tiles. Centre it and let the card breathe around it. */
.cal{ max-width:460px; margin:0 auto; }
.cal__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.cal__title{ font-family:var(--head); font-size:16px; letter-spacing:.01em; }
.cal__nav{
  width:34px; height:34px; border-radius:9px; border:1px solid var(--line);
  background:var(--field-2); color:var(--text); font-size:18px; line-height:1; cursor:pointer;
}
.cal__nav:hover{ border-color:var(--line-2); }
.cal__dow,.cal__grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.cal__dow{ margin-bottom:6px; }
.cal__dow span{ text-align:center; font-size:11px; color:var(--muted); letter-spacing:.04em; text-transform:uppercase; }
.cal__cell{
  position:relative; aspect-ratio:1; border-radius:10px; border:1px solid var(--line);
  background:var(--field-2); color:var(--text); padding:0; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
}
.cal__cell--pad{ border:0; background:none; cursor:default; }
.cal__num{ font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; }
.cal__pips{ display:flex; gap:3px; height:5px; }
.cal__pip{ width:5px; height:5px; border-radius:50%; background:currentColor; opacity:.85; }
.cal__pip--open{ background:var(--amber); }
.cal__cell--present{ background:color-mix(in srgb,var(--green) 20%,transparent); border-color:color-mix(in srgb,var(--green) 55%,transparent); color:var(--green); }
.cal__cell--missed{ background:color-mix(in srgb,var(--red) 16%,transparent); border-color:color-mix(in srgb,var(--red) 45%,transparent); color:var(--red); }
.cal__cell--off{ opacity:.55; }
.cal__cell--today{ border-color:var(--gold); border-width:2px; color:var(--gold); }
.cal__cell--future,.cal__cell--outside{ opacity:.3; cursor:default; }
.cal__cell--present .cal__num,.cal__cell--missed .cal__num{ color:inherit; }
.cal__legend{ display:flex; flex-wrap:wrap; gap:14px; margin-top:14px; font-size:12.5px; color:var(--muted); }
.cal__key{ width:10px; height:10px; border-radius:3px; display:inline-block; flex:0 0 auto; }
.cal__key--present{ background:color-mix(in srgb,var(--green) 55%,transparent); }
.cal__key--missed{ background:color-mix(in srgb,var(--red) 45%,transparent); }
.cal__key--off{ background:var(--field-2); border:1px solid var(--line); }
.cal__sum{ margin:10px 0 0; }
@media (max-width:560px){
  .cal__dow,.cal__grid{ gap:4px; }
  .cal__num{ font-size:12px; }
}

.usermenu{ position:relative; }
.usermenu__btn{
  width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
  border:1px solid var(--line); background:var(--field-2); color:var(--text); cursor:pointer;
}
.usermenu__btn:hover,.usermenu.is-open .usermenu__btn{ border-color:var(--gold); color:var(--gold); }
.usermenu__btn svg{ width:19px; height:19px; }
.usermenu__pop{
  position:absolute; right:0; top:calc(100% + 8px); z-index:60; min-width:224px;
  background:var(--card); border:1px solid var(--line); border-radius:14px; padding:8px;
  box-shadow:0 18px 40px rgba(0,0,0,.28);
}
.usermenu__who{ padding:8px 10px 10px; border-bottom:1px solid var(--line); margin-bottom:6px; }
.usermenu__who b{ display:block; font-size:14px; color:var(--text); }
.usermenu__who span{ font-size:12.5px; color:var(--muted); }
.usermenu__row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:6px 10px; font-size:14px; color:var(--text);
}
.usermenu__item{
  width:100%; display:flex; align-items:center; gap:10px; padding:9px 10px;
  border:0; border-radius:9px; background:none; color:var(--text);
  font:inherit; font-size:14px; text-align:left; cursor:pointer;
}
.usermenu__item:hover{ background:var(--field-2); }
.usermenu__item svg{ width:17px; height:17px; flex:0 0 auto; color:var(--muted); }
.usermenu__item--danger{ color:var(--red); }
.usermenu__item--danger svg{ color:var(--red); }

/* The merged Today panel stacks several distinct things, so each gets a quiet
   label rather than running together as one wall of cards. */
.sec-head{
  display:flex; align-items:center; gap:10px; margin:22px 0 10px;
  font-family:var(--head); font-size:12.5px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted);
}
.sec-head:first-child{ margin-top:0; }
.sec-head::after{ content:''; flex:1; height:1px; background:var(--line); }

.listbar{ display:flex; align-items:center; gap:8px; margin-bottom:14px; }
.listbar .inp{ margin:0; }
.listbar .btn{ flex:0 0 auto; }
.listbar .btn svg{ width:17px; height:17px; }
.listmore{ display:flex; justify-content:center; margin-top:12px; }
@media (max-width:560px){
  .listbar{ flex-wrap:wrap; }
  .listbar .f{ flex:1 1 100%; }
  .listbar .btn--primary{ flex:1 1 auto; justify-content:center; }
}

.expsum{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 14px;
  padding-bottom:14px; margin-bottom:4px; border-bottom:1px solid var(--line);
}
.expsum__label{ display:block; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.expsum__total b{ font-family:var(--head); font-size:24px; color:var(--text); }
.expsum__modes{ display:flex; flex-wrap:wrap; gap:8px; }
.expsum__mode{
  font-size:12px; color:var(--muted); background:var(--field-2);
  border:1px solid var(--line); border-radius:8px; padding:5px 9px;
}
.expsum__mode b{ color:var(--text); margin-left:4px; }
.expsum__mode--till b{ color:var(--gold); }
.exprow{ display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid var(--line); }
.exprow:last-child{ border-bottom:0; }
.exprow--void{ opacity:.55; }
.exprow__main{ flex:1 1 auto; min-width:0; }
.exprow__t{ font-size:14px; font-weight:600; color:var(--text); overflow-wrap:anywhere; }
.exprow__m{ font-size:12px; color:var(--muted); margin-top:2px; }
.exprow__side{ flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.exprow__amt{ font-size:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.exprow__void{ flex:0 0 auto; }
