:root {
  --electric: #51e5f4;
  --electric-blue: #2d89ff;
  --night: #031125;
  --night-2: #071d3b;
  --glass: rgba(7, 27, 54, .78);
  --glass-line: rgba(121, 225, 240, .24);
  --soft-surface: #f4f8fc;
}

body {
  background:
    radial-gradient(circle at 88% 8%, rgba(45, 137, 255, .17), transparent 28rem),
    linear-gradient(180deg, #071a35 0 310px, #edf3f9 310px 100%);
}

.app-header {
  position: sticky;
  z-index: 15;
  top: 0;
  min-height: 72px;
  border-bottom: 1px solid rgba(81, 229, 244, .55);
  background: rgba(3, 17, 37, .9);
  box-shadow: 0 10px 35px rgba(2, 12, 27, .2);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.official-app-title i {
  animation: livePulse 2.2s ease-in-out infinite;
}

.page-shell {
  width: min(1240px, calc(100% - 36px));
  margin-top: 18px;
}

.pilot-banner {
  margin-bottom: 9px;
  padding: 8px 12px;
  border-color: rgba(81, 229, 244, .22);
  color: #d8edf4;
  background: rgba(7, 29, 59, .76);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.pilot-banner > span {
  padding: 5px 8px;
  background: linear-gradient(135deg, #148ea0, #17a9b7);
  box-shadow: 0 0 24px rgba(81, 229, 244, .2);
}

.pilot-banner p {
  color: #b8cddd;
  font-size: 13px;
  line-height: 1.35;
}

.pilot-banner p strong { color: #fff; }
.pilot-window {
  display: inline-block;
  margin-right: 7px;
  color: var(--electric);
  font-size: .88em;
  font-weight: 900;
  letter-spacing: .035em;
  white-space: nowrap;
}

.identified-official {
  position: relative;
  z-index: 3;
  margin-bottom: 12px;
  border-color: rgba(95, 218, 234, .24);
  color: #fff;
  background: linear-gradient(120deg, rgba(9, 36, 74, .98), rgba(8, 28, 55, .94));
  box-shadow: 0 18px 48px rgba(2, 12, 29, .2);
}

.official-avatar {
  border: 1px solid rgba(81, 229, 244, .5);
  background: linear-gradient(145deg, #0e4076, #1268a8);
  box-shadow: inset 0 0 20px rgba(81, 229, 244, .14), 0 8px 20px rgba(0, 0, 0, .2);
}

.identified-official h1 { color: #fff; }
.identified-official p { color: #a9c2d7; }
.identified-official .step { color: var(--electric); }
.verified-pill { color: #baf7df; background: rgba(23, 166, 115, .2); }
.logout-button { color: #c7d8e8; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); }
.logout-button:hover { color: #fff; border-color: var(--electric); }

/* Stadium performance cockpit */
.performance-cockpit {
  position: relative;
  min-height: 430px;
  display: grid;
  grid-template-columns: minmax(300px, .8fr) minmax(520px, 1.2fr);
  align-items: end;
  gap: 34px;
  margin-bottom: 18px;
  padding: clamp(28px, 5vw, 60px);
  overflow: hidden;
  border: 1px solid rgba(96, 221, 237, .26);
  border-radius: 30px;
  color: #fff;
  isolation: isolate;
  background: #071b35 url('/referee-action-global.webp') 66% center / cover no-repeat;
  box-shadow: 0 30px 75px rgba(3, 17, 37, .3);
}

.performance-cockpit::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  background: linear-gradient(90deg, rgba(3, 15, 33, .94) 0%, rgba(3, 18, 37, .74) 41%, rgba(3, 18, 37, .08) 76%);
}

.performance-cockpit::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(rgba(81, 229, 244, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(81, 229, 244, .06) 1px, transparent 1px);
  background-size: 42px 42px;
  -webkit-mask-image: linear-gradient(90deg, #000, transparent 64%);
  mask-image: linear-gradient(90deg, #000, transparent 64%);
}

.cockpit-copy { align-self: center; max-width: 460px; }
.cockpit-heading-row { display: grid; align-items: start; gap: 12px; }
.cockpit-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--electric);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .17em;
}
.cockpit-kicker i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--electric);
  box-shadow: 0 0 18px rgba(81, 229, 244, .9);
  animation: livePulse 1.8s ease-in-out infinite;
}
.cockpit-copy h2 {
  max-width: 440px;
  margin: 14px 0 12px;
  color: #fff;
  font-size: clamp(36px, 5vw, 66px);
  line-height: .96;
  letter-spacing: -.055em;
}
.technical-help-button {
  width: max-content;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 14px 9px 9px;
  border: 1px solid rgba(255,160,170,.72);
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg,#e5364f,#a9132c);
  box-shadow: 0 0 0 0 rgba(232,55,80,.55), 0 10px 28px rgba(116,5,27,.42);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .1em;
  cursor: pointer;
  animation: technicalHelpPulse 2.1s ease-out infinite;
}
.technical-help-button i { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: #b31a30; background: #fff; font-size: 16px; font-style: normal; }
.technical-help-button.quiet { min-height:36px; padding:6px 11px 6px 6px; border-color:rgba(180,211,229,.48); color:#d6e8f3; background:rgba(255,255,255,.08); box-shadow:none; animation:none; }
.technical-help-button.quiet i { width:23px; height:23px; color:#0e5278; background:#e5f2f8; }
.phone-guide-link { text-decoration: none; justify-content: center; }
.technical-help-button:hover, .technical-help-button:focus-visible { transform: translateY(-2px); outline: 3px solid rgba(255,255,255,.24); outline-offset: 2px; }
.cockpit-copy p {
  max-width: 410px;
  margin: 0;
  color: #c1d4e2;
  font-size: 16px;
  line-height: 1.55;
}
.cockpit-status {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  padding: 9px 12px;
  border: 1px solid rgba(81, 229, 244, .22);
  border-radius: 999px;
  background: rgba(5, 24, 48, .58);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.cockpit-status span, .cockpit-status strong { font-size: 11px; letter-spacing: .09em; }
.cockpit-status span { color: #a9c9da; }
.cockpit-status strong { color: var(--electric); }

.cockpit-data {
  align-self: end;
  display: grid;
  grid-template-columns: 150px 1.25fr .8fr .7fr;
  gap: 10px;
  min-width: 0;
}
.readiness-dial, .signal-card {
  min-height: 142px;
  border: 1px solid rgba(124, 224, 240, .25);
  border-radius: 20px;
  background: rgba(4, 22, 44, .78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 40px rgba(0,0,0,.2);
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}
.readiness-dial { position: relative; display: grid; place-items: center; }
.readiness-dial svg { width: 112px; height: 112px; transform: rotate(-90deg); }
.readiness-dial circle { fill: none; stroke-width: 8; }
.dial-track { stroke: rgba(255,255,255,.09); }
.dial-value {
  stroke: var(--electric);
  stroke-linecap: round;
  stroke-dasharray: 308;
  stroke-dashoffset: calc(308 - (308 * var(--score, 0) / 100));
  filter: drop-shadow(0 0 7px rgba(81, 229, 244, .55));
  transition: stroke-dashoffset .8s cubic-bezier(.2,.8,.2,1);
}
.readiness-dial > div { position: absolute; display: grid; place-items: center; }
.readiness-dial strong { font-size: 28px; letter-spacing: -.05em; }
.readiness-dial span { color: #8eabbf; font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.signal-card { position: relative; padding: 18px; overflow: hidden; }
.signal-card > span { color: #8da9bc; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.signal-card > strong { display: block; margin-top: 7px; color: #fff; font-size: 28px; }
.signal-card > strong small { color: #8faabd; font-size: 11px; font-weight: 700; }
.hr-signal svg { position: absolute; right: 10px; bottom: 13px; left: 10px; width: calc(100% - 20px); height: 48px; overflow: visible; }
.signal-grid { fill: none; stroke: rgba(255,255,255,.08); stroke-width: 1; }
.signal-line {
  fill: none;
  stroke: var(--electric);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 5px rgba(81,229,244,.8));
  stroke-dasharray: 520;
  animation: heartTrace 3.8s linear infinite;
}
.load-signal i {
  position: absolute;
  right: 16px;
  bottom: 18px;
  width: 54px;
  height: 54px;
  border: 7px solid rgba(45,137,255,.14);
  border-top-color: #2d89ff;
  border-right-color: var(--electric);
  border-radius: 50%;
  animation: dataOrbit 5s linear infinite;
}
.completion-signal { display: flex; flex-direction: column; justify-content: space-between; }
.completion-signal > small { color: var(--electric); font-size: 9px; font-weight: 900; letter-spacing: .13em; }

/* Daily launch cards */
.quest-section {
  position: relative;
  margin-top: 18px;
  padding: clamp(22px, 4vw, 38px);
  overflow: hidden;
  border: 1px solid #d7e4ef;
  border-radius: 28px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 22px 60px rgba(4, 24, 52, .14);
}
.quest-section::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--electric-blue), var(--electric), #17a673);
}
.quest-heading h2 { font-size: clamp(38px, 6vw, 64px); }
.quest-heading p { font-size: 15px; }
.date-control { border-color: #c5d8e8; background: #f6f9fc; }

.quest-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.quest-button {
  min-height: 150px;
  padding: 18px;
  border-color: color-mix(in srgb, var(--quest-accent) 18%, #dfe6ef);
  border-radius: 21px;
  background:
    radial-gradient(circle at 100% 0, color-mix(in srgb, var(--quest-accent) 16%, transparent), transparent 45%),
    linear-gradient(145deg, #fff, #f7fafc);
  box-shadow: 0 12px 30px rgba(6, 27, 55, .08);
  transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s, border-color .22s;
  -webkit-tap-highlight-color: transparent;
}
.quest-button::before {
  content: "OPEN";
  position: absolute;
  right: 17px;
  bottom: 17px;
  color: var(--quest-accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
}
.quest-button::after { opacity: .1; transform: scale(1.2); }
.quest-button:hover, .quest-button:focus-visible {
  transform: translateY(-5px) scale(1.012);
  box-shadow: 0 22px 40px color-mix(in srgb, var(--quest-accent) 15%, transparent);
  outline: none;
}
.quest-button:active, .quest-button.is-pressed { transform: translateY(-1px) scale(.985); }
.quest-button .quest-number {
  width: 40px;
  height: 40px;
  border-radius: 13px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--quest-accent) 20%, transparent);
}
.quest-button strong { font-size: 17px; }
.quest-button small { max-width: 75%; font-size: 14px; }
.quest-button i { display: none; }
.quest-button.completed::before { content: "SENT ✓"; color: var(--green); }

/* Workspace */
.form-workspace {
  --workspace-padding: clamp(20px, 4vw, 40px);
  position: relative;
  margin-top: 18px;
  padding: var(--workspace-padding);
  overflow: hidden;
  border-radius: 28px;
  background: rgba(255,255,255,.97);
}
.form-workspace::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0 0 auto;
  height: calc(var(--workspace-padding) + 176px);
  background:
    linear-gradient(90deg, rgba(3,17,37,.78), rgba(3,17,37,.34), rgba(3,17,37,.04)),
    url('/referees-global-tunnel.webp') center 41% / cover no-repeat;
}
.form-workspace > * { position: relative; z-index: 1; }
.workspace-heading {
  display: grid;
  grid-template-columns: 1fr;
  align-content: start;
  gap: 8px;
  min-height: 176px;
  padding: 6px 0 18px;
  border-bottom-color: rgba(255,255,255,.2);
}
.workspace-heading > div { grid-column: 1; max-width: 820px; }
.workspace-heading h2 { position: relative; z-index: 2; color: #fff; text-decoration: none; }
.workspace-heading p { max-width: 820px; color: #fff; font-size: 15px; font-weight: 800; line-height: 1.38; text-shadow: 0 2px 12px rgba(1,12,27,.85); }
.workspace-heading .step { color: var(--electric); }
.back-button {
  flex: 0 0 auto;
  justify-self: start;
  width: 124px;
  min-width: 124px;
  max-width: 124px;
  min-height: 40px;
  padding: 8px 14px;
  color: #fff;
  border-color: #f06a78;
  background: linear-gradient(135deg, #d7394d, #b61f38);
  box-shadow: 0 8px 22px rgba(173, 26, 48, .38);
  backdrop-filter: blur(10px);
}
.back-button:hover, .back-button:focus-visible {
  border-color: #ff9aa5;
  background: linear-gradient(135deg, #e64a5d, #c4273f);
  outline: 2px solid rgba(255,255,255,.34);
  outline-offset: 2px;
}
.test-badge { color: #fff; background: rgba(45,137,255,.8); }
.entry-form {
  margin: 18px -4px -4px;
  padding: 4px;
  border-radius: 22px;
}
.form-section-title { margin-top: 18px; }
.form-section-title > span {
  background: linear-gradient(145deg, #0d3f77, #1268a8);
  box-shadow: 0 8px 18px rgba(9,37,75,.16);
}
.form-section-title h3 { font-size: 19px; }
.form-section-title p { font-size: 14px; }

.form-progress {
  flex: 0 0 100%;
  width: 100%;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 9px;
  margin-top: 10px;
}
.form-progress-track { height: 5px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.16); }
.form-progress-track i { display: block; width: var(--progress, 0%); height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--electric-blue), var(--electric)); transition: width .4s ease; }
.form-progress span { color: #d7e7f2; font-size: 10px; font-weight: 900; letter-spacing: .08em; }

/* Progressive touch controls */
.enhanced-field-error{display:block;color:#a42238;font-size:13px;line-height:1.5;margin-top:8px;font-weight:700}
.ui-source {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.choice-control, .preset-control { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.choice-option, .preset-option {
  position: relative;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 11px;
  border: 1px solid #cad8e5;
  border-radius: 14px;
  color: #32465d;
  background: linear-gradient(145deg, #fff, #f3f7fb);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 6px 15px rgba(6,27,55,.05);
  transition: transform .16s, border-color .16s, color .16s, background .16s, box-shadow .16s;
  -webkit-tap-highlight-color: transparent;
}
.choice-option:hover, .preset-option:hover { transform: translateY(-2px); border-color: #74b7e7; }
.choice-option:active, .preset-option:active { transform: scale(.97); }
.choice-option.active, .preset-option.active {
  border-color: #1c82d5;
  color: #fff;
  background: linear-gradient(135deg, #0d4f91, #138cac);
  box-shadow: 0 10px 22px rgba(18,104,168,.22), inset 0 1px 0 rgba(255,255,255,.2);
}
.choice-option.active::after, .preset-option.active::after {
  content: "✓";
  position: absolute;
  top: 5px;
  right: 7px;
  color: #b7f7ff;
  font-size: 10px;
}

.motion-slider {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px 14px;
  min-height: 116px;
  padding: 15px;
  border: 1px solid #d1dfeb;
  border-radius: 18px;
  background:
    radial-gradient(circle at 100% 0, rgba(81,229,244,.12), transparent 44%),
    linear-gradient(145deg, #fff, #f5f9fc);
  box-shadow: 0 9px 22px rgba(6,27,55,.06);
}
.slider-readout { grid-column: 2; grid-row: 1; display: flex; align-items: baseline; gap: 4px; }
.slider-readout strong { color: #092c55; font-size: 25px; line-height: 1; letter-spacing: -.04em; }
.slider-readout small { color: #63809a; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.motion-range {
  grid-column: 1 / -1;
  width: 100%;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  accent-color: #138cac;
  cursor: ew-resize;
  -webkit-appearance: none;
  appearance: none;
}
.motion-range::-webkit-slider-runnable-track { height: 8px; border-radius: 999px; background: linear-gradient(90deg, #0d5ca4, var(--electric)); box-shadow: inset 0 1px 2px rgba(4,25,50,.18); }
.motion-range::-webkit-slider-thumb { width: 27px; height: 27px; margin-top: -10px; border: 4px solid #fff; border-radius: 50%; background: #0d5ca4; box-shadow: 0 3px 12px rgba(9,61,112,.36), 0 0 0 4px rgba(81,229,244,.15); -webkit-appearance: none; appearance: none; }
.motion-range::-moz-range-track { height: 8px; border-radius: 999px; background: linear-gradient(90deg, #0d5ca4, var(--electric)); }
.motion-range::-moz-range-thumb { width: 21px; height: 21px; border: 4px solid #fff; border-radius: 50%; background: #0d5ca4; box-shadow: 0 3px 12px rgba(9,61,112,.36); }
.slider-scale { grid-column: 1 / -1; display: flex; justify-content: space-between; margin-top: -10px; color: #8194a8; font-size: 10px; font-weight: 800; }
.enhanced-invalid .motion-slider, .enhanced-invalid .choice-control, .enhanced-invalid .preset-control { outline: 3px solid rgba(218,76,80,.16); border-radius: 16px; }

/* Polar Flow secure training bridge */
.polar-flow-panel {
  position: relative;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) minmax(210px, auto);
  align-items: center;
  gap: 18px 22px;
  margin: 24px 0 8px;
  padding: 23px;
  overflow: hidden;
  border: 1px solid rgba(81, 229, 244, .28);
  border-radius: 23px;
  color: #fff;
  background:
    radial-gradient(circle at 86% 20%, rgba(45, 137, 255, .25), transparent 24rem),
    linear-gradient(128deg, #04152e, #092e5d 66%, #0b5367);
  box-shadow: 0 22px 48px rgba(4, 25, 53, .2), inset 0 1px 0 rgba(255,255,255,.06);
  isolation: isolate;
}
.polar-flow-panel::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .36;
  background:
    linear-gradient(rgba(81, 229, 244, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(81, 229, 244, .08) 1px, transparent 1px);
  background-size: 31px 31px;
  -webkit-mask-image: linear-gradient(90deg, #000, transparent 76%);
  mask-image: linear-gradient(90deg, #000, transparent 76%);
}
.polar-flow-panel::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -85px;
  bottom: -115px;
  width: 270px;
  height: 270px;
  border: 1px solid rgba(81, 229, 244, .15);
  border-radius: 50%;
  box-shadow: 0 0 0 38px rgba(81, 229, 244, .025), 0 0 0 76px rgba(81, 229, 244, .018);
}
.polar-flow-orbit {
  position: relative;
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  background: rgba(3,17,37,.46);
  box-shadow: inset 0 0 28px rgba(45,137,255,.2), 0 0 28px rgba(81,229,244,.08);
}
.polar-flow-orbit::before,
.polar-flow-orbit::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}
.polar-flow-orbit::before {
  inset: 7px;
  border: 2px solid transparent;
  border-top-color: var(--electric);
  border-right-color: rgba(45,137,255,.72);
  animation: polarOrbit 5.5s linear infinite;
}
.polar-flow-orbit::after {
  inset: 16px;
  border: 1px solid rgba(81,229,244,.22);
}
.polar-flow-orbit i {
  position: absolute;
  top: 5px;
  left: 50%;
  width: 8px;
  height: 8px;
  margin-left: -4px;
  border-radius: 50%;
  background: #e41d49;
  box-shadow: 0 0 16px rgba(228,29,73,.9);
}
.polar-flow-orbit b { position: relative; z-index: 1; font-size: 18px; letter-spacing: -.04em; }
.polar-flow-copy > span {
  color: var(--electric);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
}
.polar-flow-copy h3 { margin: 7px 0 5px; color: #fff; font-size: 20px; letter-spacing: -.02em; }
.polar-flow-copy p { max-width: 700px; margin: 0; color: #c6d9e8; font-size: 13px; line-height: 1.48; }
.polar-flow-copy p strong { color: #fff; font-weight: 950; }
.polar-flow-copy small { display: block; margin-top: 7px; color: #83a7bd; font-size: 10px; line-height: 1.4; }
.polar-flow-actions { display: grid; justify-items: stretch; gap: 8px; min-width: 210px; }
.polar-connection-badge {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #a8c0d1;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .1em;
}
.polar-connection-badge::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f0a844;
  box-shadow: 0 0 12px rgba(240,168,68,.75);
  animation: livePulse 2s ease-in-out infinite;
}
.polar-connection-badge.connected { color: #b9f5dd; }
.polar-connection-badge.connected::before { background: #22ca91; box-shadow: 0 0 13px rgba(34,202,145,.8); }
.polar-connection-badge.attention { color: #ffdca8; }
.polar-action {
  min-height: 45px;
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 13px;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .09em;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s, box-shadow .18s, background .18s;
}
.polar-action:hover { transform: translateY(-2px); border-color: rgba(81,229,244,.6); }
.polar-action:active { transform: scale(.98); }
.polar-action:disabled { cursor: wait; opacity: .58; transform: none; }
.polar-action.primary {
  border-color: rgba(81,229,244,.38);
  background: linear-gradient(120deg, #1261af, #1398ad);
  box-shadow: 0 10px 22px rgba(9,91,135,.28), inset 0 1px 0 rgba(255,255,255,.14);
}
.polar-action.quiet { color: #a7bfd1; background: rgba(255,255,255,.05); }
.polar-flow-message {
  grid-column: 2 / 4;
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: 10px 13px;
  border: 1px solid rgba(124,224,240,.14);
  border-radius: 12px;
  color: #a9c5d7;
  background: rgba(2,13,29,.34);
  font-size: 11px;
  line-height: 1.4;
}
.polar-auto-facts {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.polar-auto-facts span {
  position: relative;
  min-width: 0;
  padding: 11px 12px 10px 28px;
  overflow: hidden;
  border: 1px solid rgba(124,224,240,.14);
  border-radius: 12px;
  background: rgba(2,13,29,.27);
}
.polar-auto-facts span::before {
  content: "";
  position: absolute;
  top: 16px;
  left: 12px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22ca91;
  box-shadow: 0 0 12px rgba(34,202,145,.78);
  animation: livePulse 2.2s ease-in-out infinite;
}
.polar-auto-facts b, .polar-auto-facts small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.polar-auto-facts b { color: #f4feff; font-size: 12px; }
.polar-auto-facts small { margin-top: 2px; color: #7fa2b8; font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.polar-session-list {
  grid-column: 1 / -1;
  display: grid;
  gap: 9px;
  padding-top: 2px;
}
.polar-session-context { color: #79ddea; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.polar-session-card {
  display: grid;
  gap: 12px;
  padding: 15px;
  border: 1px solid rgba(153,212,229,.17);
  border-radius: 16px;
  background: rgba(4,18,38,.68);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  transition: transform .18s, border-color .18s, background .18s, box-shadow .18s;
  animation: polarCardIn .36s both;
}
.polar-session-card:hover { transform: translateY(-2px); border-color: rgba(81,229,244,.42); }
.polar-session-card.selected {
  border-color: rgba(81,229,244,.75);
  background: linear-gradient(120deg, rgba(10,55,92,.9), rgba(10,81,94,.78));
  box-shadow: 0 0 0 3px rgba(81,229,244,.08), inset 0 1px 0 rgba(255,255,255,.06);
}
.polar-session-card.saved { border-color:rgba(38,202,145,.48); background:linear-gradient(120deg,rgba(5,45,48,.86),rgba(7,66,76,.74)); }
.polar-session-card.saved .polar-session-head::after { content:"SAVED"; padding:5px 7px; border-radius:999px; color:#bff7dd; background:rgba(38,202,145,.14); font-size:8px; font-weight:950; letter-spacing:.08em; }
.polar-session-head, .polar-session-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.polar-session-head span { color: #89a9be; font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.polar-session-head strong { color: #fff; font-size: 12px; text-transform: uppercase; }
.polar-session-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.polar-session-metrics span { min-width: 0; padding: 10px 11px; border-radius: 11px; background: rgba(255,255,255,.055); }
.polar-session-metrics b, .polar-session-metrics small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.polar-session-metrics b { color: #fff; font-size: 15px; }
.polar-session-metrics small { margin-top: 3px; color: #7297af; font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.polar-zone-breakdown { display: grid; gap: 9px; padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 13px; background: rgba(1,13,30,.34); }
.polar-zone-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.polar-zone-title strong { color: #eafcff; font-size: 9px; letter-spacing: .11em; }
.polar-zone-title span { color: #82a4b9; font-size: 9px; }
.polar-zone-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.polar-zone { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 6px; min-width: 0; padding: 9px 8px 8px; overflow: hidden; border-radius: 10px; background: rgba(255,255,255,.055); }
.polar-zone::after { content: ""; position: absolute; inset: auto 0 0; height: 3px; background: rgba(255,255,255,.1); }
.polar-zone i { position: absolute; z-index: 1; inset: auto 0 0; width: var(--zone-share); height: 3px; background: currentColor; }
.polar-zone b, .polar-zone strong, .polar-zone small, .polar-zone-range { position: relative; z-index: 2; }
.polar-zone b { font-size: 9px; }
.polar-zone strong { color: #fff; font-size: 12px; text-align: center; }
.polar-zone small { color: #a9c0ce; font-size: 8px; font-weight: 900; white-space: nowrap; }
.polar-zone-range { grid-column: 1 / -1; color: #c6dce7; font-size: 9px; font-weight: 800; letter-spacing: .015em; white-space: nowrap; }
.polar-zone.z1 { color: #8bbed4; }
.polar-zone.z2 { color: #56d7c8; }
.polar-zone.z3 { color: #b8de55; }
.polar-zone.z4 { color: #ffbc48; }
.polar-zone.z5 { color: #ff5d67; }
.polar-zone-unavailable { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px dashed rgba(255,188,72,.28); border-radius: 12px; background: rgba(64,37,7,.23); }
.polar-zone-unavailable strong { color: #ffd995; font-size: 9px; letter-spacing: .08em; }
.polar-zone-unavailable span { color: #a9bdc9; font-size: 10px; text-align: right; }
.polar-session-foot > small { color: #82a4b9; font-size: 10px; }
.polar-session-foot button {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid rgba(81,229,244,.34);
  border-radius: 10px;
  color: #d9fbff;
  background: rgba(17,137,158,.28);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .07em;
  cursor: pointer;
}
.polar-session-card.selected .polar-session-foot button { color: #07203d; background: var(--electric); }
.polar-session-card.saved .polar-session-foot button { border-color:rgba(38,202,145,.45); color:#d9fff0; background:rgba(38,202,145,.14); }
.polar-empty { display: grid; gap: 4px; padding: 14px; border: 1px dashed rgba(126,195,216,.24); border-radius: 14px; background: rgba(2,13,29,.25); }
.polar-empty strong { color: #fff; font-size: 12px; }
.polar-empty span { color: #8caabd; font-size: 11px; }
.polar-file-rescue {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(81,229,244,.22);
  border-radius: 15px;
  background: linear-gradient(120deg, rgba(4,18,38,.7), rgba(8,65,83,.52));
}
.polar-file-rescue div { display: grid; gap: 4px; }
.polar-file-rescue strong { color: #77eaf2; font-size: 9px; letter-spacing: .12em; }
.polar-file-rescue span { color: #a8c3d4; font-size: 11px; line-height: 1.45; }
.polar-action.file { min-width: 170px; border-color: rgba(81,229,244,.45); background: rgba(17,137,158,.22); }

@media (max-width: 720px) {
  .polar-file-rescue { grid-template-columns: 1fr; }
  .polar-action.file { width: 100%; }
  .polar-zone-title, .polar-zone-unavailable { align-items: flex-start; flex-direction: column; }
  .polar-zone-unavailable span { text-align: left; }
  .polar-zone-grid { grid-template-columns: repeat(5, minmax(104px, 1fr)); overflow-x: auto; padding-bottom: 3px; }
  .polar-zone { grid-template-columns: 1fr; gap: 2px; text-align: center; }
  .polar-zone-range { grid-column: 1; font-size: 8px; }
}

label.polar-value-verified {
  position: relative;
  padding: 10px;
  border: 1px solid rgba(27,176,142,.38);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(232,252,246,.92), rgba(239,250,255,.96));
  box-shadow: inset 0 1px 0 #fff, 0 7px 18px rgba(5,84,80,.06);
}
label.polar-value-verified > span::after {
  content: "POLAR VERIFIED";
  display: inline-flex;
  margin-left: 7px;
  padding: 3px 6px;
  border-radius: 999px;
  color: #08745d;
  background: #d7f8ec;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .07em;
  vertical-align: middle;
}
label.polar-value-verified .motion-slider {
  border-color: rgba(26,161,132,.25);
  background: rgba(255,255,255,.72);
  box-shadow: none;
}
label.polar-value-verified .motion-range { cursor: default; filter: saturate(.65); opacity: .76; }
label.polar-value-verified .motion-slider.source-locked .slider-readout strong { color: #08745d; }

.training-category-fieldset, .coach-capture {
  border-color: #c4dce7;
  background: linear-gradient(145deg, #f7fbff, #edf8fa);
}
.training-category-buttons { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.training-category-buttons button {
  min-height: 134px;
  overflow: hidden;
  border-radius: 18px;
  background: linear-gradient(145deg, #fff, #f3f8fc);
  box-shadow: 0 9px 22px rgba(6,27,55,.06);
}
.training-category-buttons button::before {
  content: "";
  position: absolute;
  inset: auto -24px -34px auto;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: rgba(81,229,244,.12);
}
.training-category-buttons button.active {
  border-color: #1a9fb1;
  color: #fff;
  background: linear-gradient(145deg, #092f5a, #0d6f85);
  box-shadow: 0 15px 28px rgba(8,77,104,.2);
}
.training-category-buttons button.active strong, .training-category-buttons button.active small { color: #fff; }
.training-category-buttons button.active small { opacity: .72; }
.training-aim-row { border-radius: 16px; }
.source-status { border: 1px solid #c7e5e9; border-radius: 14px; }
.content-field {
  margin-top: 20px;
  padding: 18px;
  border: 1px solid #95d5c0;
  border-radius: 19px;
  background: linear-gradient(145deg, #f8fffc, #edf9f4);
}
.content-field textarea { min-height: 160px; font-size: 16px; }

.submit-button, .primary-button {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  background: linear-gradient(115deg, #0c5a9e, #1499ad 58%, #18a977);
  background-size: 180% 100%;
  box-shadow: 0 14px 28px rgba(10,91,128,.25);
  transition: transform .18s, box-shadow .18s, background-position .5s;
}
.submit-button::after, .primary-button::after {
  content: "";
  position: absolute;
  top: -50%;
  bottom: -50%;
  left: -60%;
  width: 34%;
  transform: skewX(-22deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
  animation: actionSweep 4s ease-in-out infinite;
}
.submit-button:hover, .primary-button:hover { transform: translateY(-2px); background-position: 100% 0; box-shadow: 0 18px 34px rgba(10,91,128,.32); }
.submit-button:active, .primary-button:active { transform: scale(.985); }

.load-output {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(81,229,244,.25);
  background: linear-gradient(120deg, #061a38, #0b3768 64%, #0d6575);
}
.load-output::after { content: ""; position: absolute; right: -26px; bottom: -45px; width: 130px; height: 130px; border: 18px solid rgba(81,229,244,.1); border-radius: 50%; animation: dataOrbit 8s linear infinite; }

.recent-section { border-radius: 25px; }
.recent-entry { background: #f8fbfd; }
footer { justify-content: center; flex-wrap: wrap; text-align: center; }

.mobile-dock { display: none; }
.official-refresh-fab { position:fixed; right:18px; bottom:20px; z-index:84; min-width:104px; min-height:48px; display:flex; align-items:center; justify-content:center; gap:7px; padding:8px 14px; border:1px solid rgba(255,255,255,.24); border-radius:999px; color:#fff; background:linear-gradient(145deg,#083866,#0d7f98); box-shadow:0 12px 30px rgba(4,34,63,.28); font-size:11px; font-weight:900; cursor:pointer; }
.official-refresh-fab i { font-size:20px; font-style:normal; line-height:1; }
.official-refresh-fab.refreshing i { animation:rm-refresh-spin .75s linear infinite; }
.official-refresh-fab:disabled { opacity:.75; cursor:wait; }
@keyframes rm-refresh-spin { to { transform:rotate(360deg); } }

@keyframes livePulse {
  0%, 100% { transform: scale(.86); opacity: .68; box-shadow: 0 0 8px rgba(81,229,244,.4); }
  50% { transform: scale(1.16); opacity: 1; box-shadow: 0 0 22px rgba(81,229,244,.92); }
}
@keyframes heartTrace { from { stroke-dashoffset: 520; } to { stroke-dashoffset: 0; } }
@keyframes dataOrbit { to { transform: rotate(360deg); } }
@keyframes actionSweep { 0%, 55% { left: -60%; } 78%, 100% { left: 130%; } }
@keyframes polarOrbit { to { transform: rotate(360deg); } }
@keyframes polarCardIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes technicalHelpPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(232,55,80,.5), 0 10px 28px rgba(116,5,27,.42); }
  55% { box-shadow: 0 0 0 10px rgba(232,55,80,0), 0 10px 32px rgba(116,5,27,.5); }
}

@media (max-width: 1080px) {
  .performance-cockpit { grid-template-columns: 1fr; align-items: end; background-position: 70% center; }
  .cockpit-copy { max-width: 520px; }
  .cockpit-data { grid-template-columns: 140px 1.2fr .8fr .7fr; }
}

@media (max-width: 760px) {
  body { padding-bottom: calc(104px + env(safe-area-inset-bottom)); background: linear-gradient(180deg, #071a35 0 250px, #edf3f9 250px 100%); }
  .app-header { min-height: 62px; padding: 10px 16px; }
  .official-app-title { font-size: 10px; }
  .official-label strong { font-size: 14px; }
  .page-shell { width: min(100% - 18px, 1240px); margin: 9px auto 40px; }
  .pilot-banner { display: grid; grid-template-columns: auto 1fr; gap: 9px; padding: 10px 12px; }
  .pilot-banner p { font-size: 12px; line-height: 1.35; }
  .identified-official { grid-template-columns: 48px 1fr auto; gap: 11px; padding: 12px; border-radius: 17px; }
  .official-avatar { width: 48px; height: 48px; border-radius: 13px; }
  .identified-official h1 { font-size: 19px; }
  .identified-official p { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
  .profile-photo-actions { grid-column: 3; justify-items: end; }
  .verified-pill { display: none; }
  .logout-button { width: 38px; height: 38px; padding: 0; overflow: hidden; color: transparent; border-radius: 50%; }
  .logout-button::after { content: "×"; display: grid; place-items: center; position: absolute; inset: 0; color: #d4e4ef; font-size: 22px; }

  .performance-cockpit {
    min-height: 520px;
    grid-template-columns: 1fr;
    align-content: space-between;
    gap: 22px;
    padding: 26px 19px 18px;
    border-radius: 24px;
    background-position: 69% center;
    animation: mobilePhotoDrift 14s ease-in-out infinite alternate;
  }
  .performance-cockpit::before { background: linear-gradient(180deg, rgba(3,15,33,.9) 0%, rgba(3,15,33,.37) 52%, rgba(3,15,33,.9) 100%); }
  .performance-cockpit::after { opacity: .55; }
  .cockpit-copy { align-self: start; max-width: 88%; }
  .cockpit-heading-row { gap: 9px; }
  .cockpit-copy h2 { max-width: 330px; margin: 10px 0 2px; font-size: clamp(35px, 11vw, 50px); }
  .technical-help-button { min-height: 40px; padding: 7px 12px 7px 7px; font-size: 9px; }
  .technical-help-button i { width: 25px; height: 25px; }
  .cockpit-copy p { max-width: 330px; color: #d3e1ea; font-size: 14px; }
  .cockpit-status { margin-top: 14px; }
  .cockpit-data { grid-template-columns: 104px 1fr 1fr; gap: 7px; }
  .readiness-dial, .signal-card { min-height: 104px; border-radius: 16px; }
  .readiness-dial { grid-row: 1 / 3; min-height: 215px; }
  .readiness-dial svg { width: 94px; height: 94px; }
  .readiness-dial strong { font-size: 24px; }
  .hr-signal { grid-column: 2 / 4; }
  .load-signal, .completion-signal { padding: 13px; }
  .signal-card > strong { font-size: 23px; }
  .load-signal i { width: 38px; height: 38px; border-width: 5px; right: 10px; bottom: 12px; }

  .quest-section { margin-top: 12px; padding: 19px 14px 16px; border-radius: 23px; }
  .quest-heading { display: grid; grid-template-columns: 1fr 126px; align-items: end; gap: 12px; }
  .quest-heading h2 { font-size: 42px; }
  .quest-heading p { max-width: none; font-size: 13px; }
  .date-control { width: 126px; padding: 9px; }
  .quest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .quest-button { min-height: 116px; padding: 12px; border-radius: 18px; }
  .quest-button strong { font-size: 14px; }
  .quest-button small { max-width: 85%; font-size: 12px; }
  .quest-button::before { right: 12px; bottom: 12px; }

  .form-workspace { --workspace-padding: 13px; padding: 13px 11px 15px; border-radius: 23px; }
  .form-workspace::before { height: 209px; background-position: 51% 42%; }
  .workspace-heading { min-height: 196px; grid-template-columns: 1fr; align-content: start; padding: 1px 1px 10px; }
  .workspace-heading > div { grid-column: 1; width: 100%; max-width: 100%; margin-top: 3px; }
  .workspace-heading .form-progress { grid-column: 1 / -1; grid-row: 3; width: 100%; margin-top: 8px; }
  .workspace-heading h2 { font-size: 31px; }
  .workspace-heading p { max-width: 100%; font-size: 13px; line-height: 1.32; }
  .entry-form { margin-top: 11px; padding: 2px; }
  .form-section-title { align-items: flex-start; margin: 16px 0 10px; }
  .form-section-title h3 { font-size: 18px; }
  .form-section-title p { font-size: 13px; }
  .form-grid, .identity-grid, .three-columns, .two-columns, .four-columns { gap: 10px; }
  label > span, fieldset legend { font-size: 14px; }
  .choice-control, .preset-control { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .choice-option, .preset-option { min-height: 52px; padding: 9px; font-size: 12px; }
  .motion-slider { min-height: 109px; padding: 13px; }
  .slider-readout strong { font-size: 23px; }
  .polar-flow-panel { grid-template-columns: 62px 1fr; gap: 11px; padding: 13px; border-radius: 19px; }
  .polar-flow-orbit { width: 62px; height: 62px; }
  .polar-flow-orbit::before { inset: 5px; }
  .polar-flow-orbit::after { inset: 12px; }
  .polar-flow-copy h3 { font-size: 17px; }
  .polar-flow-copy p { font-size: 12px; }
  .polar-flow-copy small { font-size: 9px; }
  .polar-flow-actions { grid-column: 1 / -1; grid-template-columns: 1fr auto; align-items: center; min-width: 0; }
  .polar-flow-actions .polar-connection-badge { grid-column: 1 / -1; justify-self: start; }
  .polar-action.primary { min-width: 0; }
  .polar-flow-message { grid-column: 1 / -1; }
  .polar-auto-facts { grid-template-columns: 1fr 1fr; }
  .polar-session-metrics { grid-template-columns: 1fr 1fr; }
  .polar-session-head, .polar-session-foot { align-items: flex-start; flex-direction: column; }
  .polar-session-foot button { width: 100%; min-height: 42px; }
  .training-category-fieldset, .coach-capture { padding: 11px; border-radius: 18px; }
  .training-category-buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .training-category-buttons button { min-height: 108px; padding: 10px; }
  .training-aim-row { grid-template-columns: 1fr; }
  .submit-button { position: relative; bottom: auto; width: 100%; min-height: 58px; margin-top: 24px; border-radius: 17px; }
  #travelForm:not(.travel-status-chosen) .submit-button { display: none; }
  .recent-section { padding: 18px 14px; }
  footer { padding-bottom: 20px; }

  .mobile-dock {
    position: fixed;
    z-index: 30;
    right: 12px;
    bottom: max(8px, env(safe-area-inset-bottom));
    left: 12px;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 2px;
    padding: 4px 3px;
    border: 1px solid rgba(124,224,240,.25);
    border-radius: 19px;
    background: rgba(3,17,37,.93);
    box-shadow: 0 16px 40px rgba(2,12,27,.35);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
  .official-refresh-fab { right:14px; bottom:calc(78px + env(safe-area-inset-bottom)); min-width:94px; min-height:44px; padding:7px 12px; }
  .mobile-dock button {
    min-height: 50px;
    display: grid;
    place-items: center;
    gap: 2px;
    padding: 6px 1px;
    border: 0;
    border-radius: 14px;
    color: #8faabd;
    background: transparent;
    font-size: 8px;
    font-weight: 800;
    cursor: pointer;
  }
  .mobile-dock button span { white-space: nowrap; }
  .mobile-dock button i { font-size: 15px; font-style: normal; line-height: 1; }
  .mobile-dock button.active { color: #fff; background: linear-gradient(145deg, #0b427b, #0f7d91); box-shadow: inset 0 0 0 1px rgba(81,229,244,.18); }
}

@media (max-width: 390px) {
  .official-app-title span { font-size: 0; }
  .official-app-title span::after { content: "MONITORING"; font-size: 9px; }
  .performance-cockpit { min-height: 500px; }
  .cockpit-copy h2 { font-size: 36px; }
  .quest-heading { grid-template-columns: 1fr 116px; }
  .quest-grid { gap: 8px; }
  .quest-button { min-height: 108px; }
  .choice-control, .preset-control { grid-template-columns: 1fr 1fr; }
}

@keyframes mobilePhotoDrift {
  from { background-position: 66% center; }
  to { background-position: 72% center; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
/* Private coach channel */
.official-notification-bar {
  position: sticky;
  z-index: 14;
  top: 80px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 9px;
  margin: 0 0 12px auto;
}
.official-notification-bar .coach-alert-button { position: static; margin: 0; box-shadow: 0 8px 22px rgba(8,38,64,.12); }
.news-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 11px 9px 15px;
  border: 1px solid rgba(81,229,244,.52);
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(135deg,#0b5597,#0b93ba);
  box-shadow: 0 8px 22px rgba(5,71,116,.22);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .1em;
  cursor: pointer;
}
.news-button:hover,.news-button:focus-visible { outline: 3px solid rgba(81,229,244,.24); outline-offset: 2px; transform: translateY(-1px); }
.news-badge { min-width: 22px; height: 22px; display: grid; place-items: center; padding: 0 6px; border-radius: 999px; color: #062244; background: #58ebf5; font-size: 10px; box-shadow: 0 0 0 0 rgba(81,229,244,.55); }
.news-button.has-unread .news-badge { animation: newsBadgePulse 1.9s ease-out infinite; }
@keyframes newsBadgePulse { 60% { box-shadow: 0 0 0 8px rgba(81,229,244,0); } }
.coach-inbox {
  display:grid;
  gap:11px;
  margin-top:14px;
  padding:clamp(14px,3vw,20px);
  border-color:#bcdde3;
  background:linear-gradient(145deg,#fff 0%,#f5fcfd 100%);
}
.coach-inbox-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.coach-inbox-heading h2 { margin:5px 0 4px; color:#071f3b; font-size:clamp(22px,4vw,30px); }
.coach-inbox-heading p { margin:0; color:#687b8f; font-size:13px; line-height:1.45; }
.coach-refresh { min-height:38px; padding:8px 12px; border:1px solid #bfd0dc; border-radius:9px; color:#234a68; background:#fff; font-size:10px; font-weight:900; letter-spacing:.07em; }
.official-coach-thread { max-height:230px; display:flex; flex-direction:column; gap:8px; overflow-y:auto; padding:11px; border:1px solid #dce6ec; border-radius:15px; background:#f4f7f9; }
.official-coach-empty { display:grid; justify-items:center; gap:4px; padding:28px 12px; color:#7c8d9c; text-align:center; }
.official-coach-empty strong { color:#415b70; font-size:14px; }.official-coach-empty span { font-size:12px; }
.official-coach-message { max-width:84%; display:grid; gap:4px; padding:11px 13px; border:1px solid #d8e2e9; border-radius:13px 13px 13px 4px; background:#fff; }
.official-coach-message.official { align-self:flex-end; border-color:#a8dce3; border-radius:13px 13px 4px 13px; background:#e8f9fb; }
.official-coach-message strong { color:#355268; font-size:11px; }.official-coach-message p { margin:0; color:#1a3044; font-size:13px; line-height:1.45; white-space:pre-wrap; }.official-coach-message small { color:#8191a0; font-size:10px; }
.official-coach-form { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:10px; }
.official-coach-form label { display:grid; gap:6px; }.official-coach-form label>span { color:#50667a; font-size:10px; font-weight:900; letter-spacing:.07em; }.official-coach-form textarea { min-height:62px; resize:vertical; }
.official-coach-form .primary-button { min-height:44px; }
@media(max-width:620px){.coach-inbox-heading{flex-direction:column}.coach-refresh{width:100%}.official-coach-form{grid-template-columns:1fr}.official-coach-form .primary-button{width:100%}.official-coach-message{max-width:92%}}

/* Training source: Polar dose or no-Polar session */
.training-source-choice {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 12px 18px;
  margin: 17px 0 8px;
  padding: 15px 17px;
  border: 1px solid #c6dce8;
  border-radius: 18px;
  background: linear-gradient(135deg,#f7fbfd,#eef7fa);
}
.training-source-choice > div:first-child > span { color: #0d659a; font-size: 9px; font-weight: 950; letter-spacing: .15em; }
.training-source-choice h3 { margin: 4px 0; color: #071f3b; font-size: 18px; }
.training-source-choice p { margin: 0; color: #5c7284; font-size: 12px; line-height: 1.45; }
.training-source-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; min-width: 390px; }
.training-source-actions button { min-height: 48px; padding: 10px 12px; border: 1px solid #b8cbd8; border-radius: 13px; color: #264a64; background: #fff; font-size: 10px; font-weight: 950; letter-spacing: .06em; cursor: pointer; }
.training-source-actions button.active { border-color: #19afc2; color: #fff; background: linear-gradient(135deg,#156fb4,#10a9b8); box-shadow: 0 8px 20px rgba(12,105,154,.2); }
.manual-training-hint { grid-column: 1 / -1; padding: 10px 12px; border-left: 4px solid #16a675; border-radius: 9px; background: #ecfaf5; color: #23664f !important; }
.manual-training-hint strong { color: #08754f; }

/* Integrated installation and technical help */
.technical-help-dialog {
  width: min(680px,calc(100% - 28px));
  max-height: min(820px,calc(100dvh - 28px));
  padding: 0;
  overflow: auto;
  border: 1px solid rgba(112,224,240,.34);
  border-radius: 24px;
  color: #fff;
  background: #061a38;
  box-shadow: 0 30px 90px rgba(1,11,28,.62);
}
.technical-help-dialog::backdrop { background: rgba(2,12,28,.72); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.technical-help-shell { display: grid; }
.technical-help-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 22px; background: radial-gradient(circle at 85% 10%,rgba(29,153,202,.3),transparent 45%),linear-gradient(135deg,#071d3d,#0a3d68); }
.technical-help-head span { color: #51e5f4; font-size: 9px; font-weight: 950; letter-spacing: .16em; }
.technical-help-head h2 { margin: 6px 0 4px; color: #fff; font-size: clamp(25px,5vw,35px); }
.technical-help-head p { margin: 0; color: #bed1df; font-size: 13px; }
.technical-help-head button { width: 42px; height: 42px; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: #fff; background: rgba(255,255,255,.08); font-size: 27px; cursor: pointer; }
.technical-help-body { display: grid; gap: 8px; padding: 15px; background: #f3f7fa; }
.technical-help-body details { border: 1px solid #d7e2e9; border-radius: 14px; color: #244058; background: #fff; }
.technical-help-body summary { padding: 14px 16px; color: #092745; font-size: 14px; font-weight: 900; cursor: pointer; }
.technical-help-body details p, .technical-help-body details ol { margin: 0; padding: 0 17px 16px 34px; color: #536b7e; font-size: 13px; line-height: 1.55; }
.technical-help-body details p { padding-left: 17px; }
.installation-alert { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 9px; padding: 12px 14px; border: 1px solid #f1bec4; border-radius: 13px; color: #6f2632; background: #fff1f3; font-size: 13px; line-height: 1.45; }
.installation-alert > strong { padding: 4px 7px; border-radius: 7px; color: #fff; background: #ce2942; font-size: 9px; letter-spacing: .1em; }
.installation-steps { list-style: none; counter-reset: install-step; display: grid; gap: 11px; padding: 0 16px 17px !important; }
.installation-steps li { counter-increment: install-step; display: grid; grid-template-columns: 29px minmax(0,1fr); column-gap: 10px; align-items: start; }
.installation-steps li::before { content: counter(install-step); width: 29px; height: 29px; display: grid; place-items: center; grid-row: 1 / 3; border-radius: 50%; color: #fff; background: linear-gradient(145deg,#0b68af,#0ca4b5); font-size: 12px; font-weight: 950; }
.installation-steps li > strong { color: #092745; font-size: 14px; line-height: 1.35; }
.installation-steps li > span { margin-top: 2px; color: #536b7e; font-size: 13px; line-height: 1.48; }
.technical-help-foot { display: flex; flex-wrap: wrap; gap: 6px 10px; padding: 15px 20px; color: #c5d8e4; background: #071a35; font-size: 12px; }
.technical-help-foot strong { color: #51e5f4; }
.news-items { gap: 11px; }
.news-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 16px; padding: 16px; border: 1px solid #d7e5ec; border-radius: 15px; background: #fff; }
.news-item > div { min-width: 0; display: grid; gap: 5px; }
.news-item > div > span { color: #0c79a7; font-size: 9px; font-weight: 950; letter-spacing: .13em; }
.news-item h3 { margin: 0; color: #092b49; font-size: 17px; line-height: 1.18; }
.news-item p { margin: 0; color: #5e7487; font-size: 12px; line-height: 1.5; }
.news-item.action { border-color: #efca83; background: linear-gradient(135deg,#fffaf0,#fff); }
.news-item.action > div > span { color: #ae6d0c; }
.news-action-button { min-height: 43px; padding: 10px 13px; border: 0; border-radius: 10px; color: #fff; background: linear-gradient(135deg,#0c67a9,#0c9bab); font-size: 9px; font-weight: 950; letter-spacing: .07em; cursor: pointer; white-space: nowrap; }
.news-item.action .news-action-button { background: linear-gradient(135deg,#b97814,#dc9a2c); }
.polar-link-request { grid-column: 1 / -1; min-width: 0; padding: 13px 14px; border: 1px solid #8dd8e3; border-radius: 13px; background: linear-gradient(135deg,#effbfd,#fff); }
.polar-link-request > span { color: #0b6e91 !important; }
.polar-link-request small { color: #426b7c !important; line-height: 1.5; }

@media(max-width:760px) {
  .pilot-banner { grid-template-columns: 116px minmax(0,1fr); align-items: center; gap: 8px; margin-bottom: 8px; padding: 7px 9px; border-radius: 12px; }
  .pilot-banner > span { justify-content: center; padding: 5px 6px; font-size: 8px; letter-spacing: .1em; }
  .pilot-banner p { display: grid; gap: 1px; font-size: 10px; line-height: 1.22; }
  .pilot-banner p strong { font-size: 11px; }
  .pilot-banner .pilot-window { margin: 0; font-size: 10px; }
  .pilot-banner .pilot-detail { display: none; }
  .workspace-heading { grid-template-columns: 1fr; }
  .workspace-heading .back-button { width: 118px; min-width: 118px; min-height: 42px; justify-self: start; padding: 7px 10px; border-radius: 11px; font-size: 10px; letter-spacing: .04em; }
  .training-source-choice { grid-template-columns: 1fr; padding: 12px; }
  .training-source-actions { min-width: 0; grid-template-columns: 1fr; }
  .training-source-actions button { min-height: 46px; }
  .technical-help-dialog { width: calc(100% - 18px); max-height: calc(100dvh - 18px); border-radius: 20px; }
  .technical-help-head { padding: 17px; }
  .technical-help-body { padding: 10px; }
  .technical-help-body summary { padding: 13px 14px; font-size: 14px; }
  .installation-steps { gap: 12px; padding: 0 13px 15px !important; }
  .official-notification-bar { top: 72px; justify-content: stretch; }
  .official-notification-bar > button { flex: 1 1 0; min-width: 0; }
  .official-notification-bar .coach-alert-button { width: auto; }
  .news-item { grid-template-columns: 1fr; }
  .news-action-button { width: 100%; white-space: normal; }
}

@media(prefers-reduced-motion:reduce) { .news-button.has-unread .news-badge { animation: none; } }
.today-action{padding:24px;margin:18px 0;background:white;border:1px solid #bedfe7;border-radius:18px;color:#13374d}.today-action h3{font-size:23px;margin:8px 0}.today-main-tabs{display:flex;gap:8px;margin-bottom:20px}.today-main-tabs button{flex:1;padding:12px;border:1px solid #d5e6ed;border-radius:8px;background:#eff7fa;color:#12394f;font-weight:800}.today-cycle{font-size:12px;letter-spacing:.06em;color:#087f91}.today-primary{padding:15px 22px;background:#087f91;border:0;border-radius:10px;color:white;font:inherit;font-weight:bold}.today-secondary{background:transparent;border:0;text-decoration:underline;color:#087f91;cursor:pointer}.additional-entries{margin-top:16px}.additional-entries summary{padding:12px;cursor:pointer;font-weight:bold}.today-plan{width:min(660px,94vw);max-height:90vh;border:0;border-radius:18px;padding:24px;color:#12394f}.today-plan::backdrop{background:#14364da0}.today-plan article{border-bottom:1px solid #d5e6ed;padding:12px 0}.today-plan button{padding:12px;border:0;background:#087f91;border-radius:8px;color:white}.mobile-dock{grid-template-columns:repeat(3,1fr)!important}
