@charset "UTF-8";

/* Brand refinement: warm charcoal, copper light, and the geometry of a lens. */
.site-header {
  background: #171612f2;
  border-bottom-color: #d9b78716;
}
.brand-name {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  font-size: 23px;
  line-height: 1.2;
  letter-spacing: 2px;
}
.brand-name > span {
  display: block;
  color: #b9a78f;
  font-size: 8px;
  letter-spacing: 2.4px;
}
#site-nav a { font-size: 13px; }
.nav-guide { margin-left: auto; padding: 8px 14px; border: 1px solid #d9b78740; border-radius: 6px; color: #dcc9ad; font-size: 13px; }
.nav-guide:hover { color: #fff; border-color: #d9b787a0; }
.download-guide { text-align: center; margin-top: 30px; }
.nav-trial {
  background: #dcbc95;
  min-height: 42px;
  border-radius: 5px;
}

.hero {
  background: #141310;
  min-height: clamp(700px, calc(100svh - 80px), 900px);
  border-bottom: 1px solid #d9b7871a;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 36%, #c49a6520, transparent 54%),
    linear-gradient(90deg, #09090766, transparent 24%, transparent 76%, #09090766);
}
.hero-copy { padding-block: 68px 116px; }
.hero-kicker {
  gap: 14px;
  color: #c4b398;
  font-size: 11px;
  letter-spacing: 2.2px;
}
.hero-kicker > i {
  width: 3px;
  height: 3px;
  background: #c8a878;
  box-shadow: none;
}
.hero-kicker .kicker-brand { color: #b9a990; }
.hero-kicker .kicker-product { color: #ddd0bc; letter-spacing: 2px; }
.hero h1 {
  margin: 31px 0 25px;
  font-size: clamp(78px, 7.7vw, 112px);
  font-weight: 600;
  line-height: 1.26;
  letter-spacing: -4px;
  color: #f4f0e7;
}
.hero h1 > span {
  background-image: linear-gradient(105deg, #c39663 4%, #eed3ad 45%, #d5ac7b 72%, #c39866 100%);
}
.hero-description {
  color: #b8b0a3;
  font-size: 15px;
  letter-spacing: .6px;
  line-height: 1.95;
}
.hero-actions { margin-top: 32px; gap: 14px; }
.hero-actions .button-large {
  min-height: 60px;
  min-width: 202px;
  border-radius: 5px;
  font-size: 15px;
  gap: 32px;
}
.hero-actions .button-gold {
  background: linear-gradient(115deg, #e3c5a0, #c9a273);
  box-shadow: 0 6px 26px #bd8d491b, inset 0 1px 0 #ffecd766;
  border-color: #e0c19b;
}
.hero-actions .button-gold:hover {
  background: linear-gradient(115deg, #eed5b4, #dcbc92);
  box-shadow: 0 8px 35px #bd8d4930;
}
.trial-arrow {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  background: #49392314;
  border: 1px solid #49392316;
  border-radius: 50%;
}
.trial-arrow svg { width: 16px; height: 16px; }
.hero-actions .button-outline {
  min-width: 180px;
  color: #d6cebf;
  background: #1a181355;
  border-color: #d2b28736;
}
.hero-actions .button-outline:hover { background: #d2b2870c; border-color: #d2b28772; }
.platform-availability { gap: 16px; margin-top: 24px; font-size: 12px; color: #c7bfb1; }
.platform-availability svg { width: 14px; height: 14px; }
.platform-note { font-size: 11px; color: #9e9485; }
.platform-hint { font-size: 11px; color: #9e9485; margin-top: 10px; }

.hero-optics {
  position: absolute;
  pointer-events: none;
  z-index: -1;
  width: min(75vw, 1040px);
  aspect-ratio: 1;
  left: 50%;
  top: 43%;
  transform: translate(-50%, -50%);
}
.optics-orbit { position: absolute; border-radius: 50%; }
.orbit-outer {
  inset: 0;
  border: 1px solid #d4ad7723;
  background: radial-gradient(circle, transparent 60%, #d4ad7704 71%, transparent 72%);
}
.orbit-outer::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 50%;
  border: 1px solid #d4ad770d;
}
.orbit-inner { inset: 14%; border: 1px solid #d4ad7711; }
.optics-axis { position: absolute; }
.axis-horizontal {
  top: 50%;
  left: -13%;
  right: -13%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #d4ad771e 16%, transparent 35%, transparent 65%, #d4ad771e 84%, transparent);
}
.axis-vertical {
  left: 50%;
  top: -10%;
  bottom: -10%;
  width: 1px;
  background: linear-gradient(transparent, #d4ad7715 12%, transparent 28%, transparent 72%, #d4ad7715 88%, transparent);
}
.optics-point {
  position: absolute;
  left: calc(50% - 2px);
  width: 5px;
  height: 5px;
  border: 1px solid #cda37180;
  transform: rotate(45deg);
  background: #141310;
}
.point-top { top: -2px; }
.point-bottom { bottom: -2px; }
.hero-glow {
  bottom: -425px;
  width: 1150px;
  height: 850px;
  background: radial-gradient(ellipse, #ad79362b, #9866340a 42%, transparent 70%);
}
.hero-signature {
  position: absolute;
  left: max(40px, calc((100% - 1160px) / 2));
  top: 48%;
  display: flex;
  flex-direction: column;
  gap: 13px;
  color: #beaa8b;
  pointer-events: none;
}
.hero-signature > span:first-child { font-size: 11px; letter-spacing: 5px; }
.hero-signature > span:last-child {
  max-width: 100px;
  font-size: 8px;
  letter-spacing: 1.4px;
  line-height: 1.9;
  color: #857867;
}
.hero-side-note {
  position: absolute;
  right: max(40px, calc((100% - 1160px) / 2));
  top: 40%;
  display: flex;
  align-items: center;
  writing-mode: vertical-rl;
  gap: 20px;
  color: #a0917b;
  font-size: 9px;
  letter-spacing: 3px;
  pointer-events: none;
}
.hero-side-note i { width: 1px; height: 44px; background: #b89b6e42; }
.hero-bottom { color: #a39782; bottom: 27px; font-size: 9px; letter-spacing: 1.5px; }
.hero-bottom a { color: #c9b99f; font-size: 11px; }
.intro-strip { background: #efeee8; }
.intro-strip .wrap .intro-label { color: #6e6b5f; }
.floating-trial { background: #d9b88f; color: #302719; }

/* Co-branding uses the original Chenyu logo on a light ground. */
.compute-section {
  color: #f0ece3;
  background: radial-gradient(ellipse at 92% 10%, #b88a4820, transparent 50%), #171612;
  border-block: 1px solid #d4ad771c;
}
.compute-section .eyebrow { color: #bca17c; }
.compute-heading {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 60px;
  align-items: start;
  margin-top: 32px;
}
.compute-heading h2 {
  font-size: clamp(40px, 4.5vw, 62px);
  font-weight: 550;
  line-height: 1.4;
  letter-spacing: -1.8px;
}
.compute-heading h2 > span { color: #d8b68c; }
.compute-partner { padding-top: 5px; }
.compute-brands {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  width: 100%;
  max-width: 450px;
  padding: 27px 30px;
  border: 1px solid #fff9ed38;
  border-radius: 8px;
  background: #f1ede4;
}
.compute-zhijing { display: flex; align-items: center; gap: 13px; flex-shrink: 0; }
.compute-zhijing img { display: block; width: 52px; height: 52px; border-radius: 10px; }
.compute-zhijing > span { color: #302b22; font-size: 30px; font-weight: 550; letter-spacing: 1px; }
.compute-multiply { color: #ae9e87; font-size: 27px; font-weight: 300; }
.compute-chenyu { display: block; width: 180px; height: auto; min-width: 0; }
.compute-lead { margin-top: 23px; color: #b7ad9e; font-size: 14px; line-height: 1.9; }
.compute-source { display: inline-flex; align-items: center; gap: 18px; margin-top: 20px; color: #d4b78f; font-size: 11px; }
.compute-source svg { width: 18px; height: 18px; }
.compute-source:hover { color: #f0d6b3; }
.compute-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 60px;
  border-top: 1px solid #d4ad7730;
}
.compute-points article { padding: 30px 30px 0 0; }
.compute-points article + article { border-left: 1px solid #d4ad7730; padding-left: 36px; }
.compute-number { color: #ad9270; font-size: 10px; letter-spacing: 1.2px; }
.compute-points h3 { margin-top: 20px; font-size: 22px; font-weight: 500; letter-spacing: -.5px; }
.compute-points p { margin-top: 14px; color: #a99f90; font-size: 13px; line-height: 1.9; }
@media (max-width: 1000px) {
  .compute-heading { gap: 35px; grid-template-columns: 1fr 1fr; }
  .compute-brands { padding: 24px 20px; gap: 18px; }
  .compute-zhijing { gap: 10px; }
  .compute-zhijing img { width: 42px; height: 42px; }
  .compute-zhijing > span { font-size: 25px; }
  .compute-chenyu { width: 145px; }
  .compute-points h3 { font-size: 19px; }
  .compute-points article + article { padding-left: 25px; }
}
@media (max-width: 760px) {
  .compute-section { padding-block: 72px; }
  .compute-heading { grid-template-columns: 1fr; gap: 30px; margin-top: 24px; }
  .compute-heading h2 { font-size: clamp(36px, 7.8vw, 50px); letter-spacing: -1px; }
  .compute-partner { padding-top: 0; }
  .compute-brands { justify-content: flex-start; padding: 24px; }
  .compute-chenyu { width: 165px; }
  .compute-lead { font-size: 13px; margin-top: 20px; }
  .compute-points { grid-template-columns: 1fr; margin-top: 37px; }
  .compute-points article { padding: 25px 0; }
  .compute-points article + article { border-left: 0; border-top: 1px solid #d4ad7730; padding-left: 0; }
  .compute-points article:last-child { padding-bottom: 0; }
  .compute-points h3 { margin-top: 10px; font-size: 22px; }
  .compute-points p { margin-top: 8px; font-size: 12px; }
}
@media (max-width: 400px) {
  .compute-brands { padding: 20px 16px; gap: 15px; }
  .compute-zhijing img { width: 36px; height: 36px; border-radius: 7px; }
  .compute-zhijing > span { font-size: 22px; }
  .compute-zhijing { gap: 8px; }
  .compute-multiply { font-size: 23px; }
  .compute-chenyu { width: 140px; }
}

/* Both photographs keep the same full framing for an aligned comparison. */
.skin-section {
  background: #efeee8;
  border-bottom: 1px solid #d5d0c3;
  padding-block: 104px 76px;
}
.skin-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 40px;
  margin-bottom: 36px;
}
.skin-heading h2 {
  margin-top: 20px;
  color: #28261f;
  font-size: clamp(32px, 3.8vw, 52px);
  font-weight: 550;
  line-height: 1.35;
  letter-spacing: -1.7px;
}
.skin-heading h2 > span { color: #9c7348; margin-right: .15em; }
.skin-lead {
  padding-bottom: 4px;
  color: #746d5f;
  font-size: 13px;
  line-height: 1.95;
}
.skin-showcase { margin: 0; }
.skin-comparison {
  --comparison-position: 50%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid #cbc5b6;
  border-radius: 8px;
  background: #dedad0;
}
.skin-comparison-image { display: block; width: 100%; height: auto; }
.comparison-before-image {
  position: absolute;
  inset: 0;
  height: 100%;
  clip-path: inset(0 calc(100% - var(--comparison-position)) 0 0);
}
.comparison-labels {
  position: absolute;
  top: 24px;
  left: 24px;
  right: 24px;
  display: flex;
  justify-content: space-between;
  gap: 15px;
  pointer-events: none;
}
.comparison-labels > span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 13px;
  border: 1px solid #f6ecdc30;
  border-radius: 4px;
  background: #171612c9;
  color: #f4ede2;
  font-size: 12px;
  letter-spacing: .5px;
}
.comparison-labels small { color: #c9baa6; font-size: 9px; letter-spacing: 1.5px; }
.comparison-labels > span:last-child { color: #e5c5a0; }
.comparison-range {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  appearance: none;
  opacity: 0;
  cursor: ew-resize;
  touch-action: pan-y;
}
.comparison-range::-webkit-slider-thumb { appearance: none; width: 44px; height: 44px; }
.comparison-range::-moz-range-thumb { width: 44px; height: 44px; border: 0; }
.comparison-divider {
  position: absolute;
  left: var(--comparison-position);
  top: 0;
  bottom: 0;
  width: 2px;
  transform: translateX(-50%);
  background: #f7eee0;
  box-shadow: 0 0 12px #00000020;
  pointer-events: none;
}
.comparison-handle {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid #f9ecd9;
  background: #f1e4d0;
  color: #6f5030;
  box-shadow: 0 3px 18px #00000035;
}
.comparison-handle svg { width: 25px; height: 25px; }
.comparison-range:focus-visible ~ .comparison-divider .comparison-handle { outline: 3px solid #d5a568; outline-offset: 4px; }
.skin-caption {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
  color: #827765;
  font-size: 11px;
  letter-spacing: .5px;
}
.skin-selling-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 40px;
  border-block: 1px solid #cfc7b8;
}
.skin-benefit {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  min-height: 228px;
  padding: 30px 34px;
}
.skin-benefit + .skin-benefit { border-left: 1px solid #cfc7b8; }
.skin-benefit-label { color: #967b59; font-size: 10px; letter-spacing: 1.5px; }
.skin-benefit h3 { margin-top: 18px; color: #302b23; font-size: 24px; font-weight: 550; letter-spacing: -.7px; line-height: 1.5; }
.skin-benefit p { margin-top: 13px; color: #746d5f; font-size: 12px; line-height: 1.9; }
.skin-benefit-batch { background: #e4ddcf80; }
.skin-benefit .skin-batch-rate { display: flex; align-items: baseline; gap: 10px; margin-top: 10px; color: #82613f; white-space: nowrap; }
.skin-batch-rate > strong { font-size: 68px; font-weight: 500; line-height: 1; letter-spacing: -3px; }
.skin-batch-rate > span:first-child { font-size: 14px; }
.skin-batch-rate > span:last-child { font-size: 12px; letter-spacing: .5px; }

@media (max-width: 800px) {
  .skin-section { padding-block: 80px 60px; }
  .skin-heading { display: block; }
  .skin-heading h2 { font-size: 38px; }
  .skin-lead { margin-top: 17px; font-size: 13px; }
  .skin-benefit { min-height: 210px; padding: 25px 21px; }
  .skin-benefit h3 { font-size: 20px; }
  .skin-benefit p { font-size: 11px; }
  .skin-batch-rate > strong { font-size: 58px; }
  .skin-benefit .skin-batch-rate { gap: 7px; }
}
@media (max-width: 620px) {
  .skin-section { padding-block: 64px 46px; }
  .skin-heading { margin-bottom: 27px; }
  .skin-heading h2 { margin-top: 17px; font-size: clamp(28px, 6.8vw, 36px); letter-spacing: -1px; }
  .skin-lead { font-size: 12px; line-height: 1.95; }
  .comparison-labels { top: 12px; left: 12px; right: 12px; gap: 8px; }
  .comparison-labels > span { padding: 6px 9px; font-size: 10px; letter-spacing: 0; }
  .comparison-labels small { display: none; }
  .comparison-handle { width: 36px; height: 36px; }
  .comparison-handle svg { width: 21px; height: 21px; }
  .skin-caption { gap: 10px; font-size: 9px; letter-spacing: 0; }
  .skin-selling-points { grid-template-columns: 1fr; margin-top: 28px; }
  .skin-benefit { min-height: 0; padding: 27px 22px; }
  .skin-benefit + .skin-benefit { border-left: 0; border-top: 1px solid #cfc7b8; }
  .skin-benefit h3 { margin-top: 12px; font-size: 22px; }
  .skin-benefit p { margin-top: 9px; font-size: 12px; }
  .skin-batch-rate > strong { font-size: 64px; }
  .skin-benefit .skin-batch-rate { margin-top: 16px; gap: 11px; }
}

@media (min-width: 1600px) {
  .hero { min-height: 850px; }
  .hero-copy { padding-block: 74px 122px; }
}
@media (max-width: 1100px) {
  .hero-signature, .hero-side-note { display: none; }
  .hero-optics { width: 92vw; }
  .hero h1 { font-size: 88px; }
}
@media (max-width: 800px) {
  .brand-name { font-size: 21px; }
  .brand-name > span { font-size: 7px; letter-spacing: 1.9px; }
  .hero { min-height: clamp(650px, calc(100svh - 72px), 850px); }
  .hero h1 { font-size: 76px; letter-spacing: -3px; }
  .hero-copy { padding-block: 62px 104px; }
  .hero-description { font-size: 14px; }
  .hero-kicker { font-size: 10px; }
  .hero-actions .button-large { min-width: 180px; min-height: 56px; font-size: 14px; }
  .hero-optics { width: 106vw; top: 43%; }
}
@media (max-width: 620px) {
  .brand-name { font-size: 21px; gap: 2px; }
  .brand-name > span { font-size: 6px; letter-spacing: 1.8px; }
  .nav-trial { min-height: 36px; font-size: 11px; }
  .hero { min-height: clamp(610px, calc(100svh - 68px), 790px); }
  .hero-copy { padding-block: 63px 105px; }
  .hero-kicker { font-size: 9px; letter-spacing: 1.5px; gap: 10px; }
  .hero-kicker .kicker-product { letter-spacing: 1.1px; }
  .hero h1 {
    font-size: clamp(43px, 12.6vw, 72px);
    letter-spacing: -2px;
    line-height: 1.33;
    margin-top: 28px;
    margin-bottom: 23px;
  }
  .hero-description { font-size: 12px; line-height: 2; letter-spacing: .15px; }
  .hero-actions { margin-top: 29px; gap: 10px; }
  .hero-actions .button-large {
    min-width: 0;
    min-height: 54px;
    padding-inline: 20px;
    font-size: 13px;
    gap: 20px;
  }
  .hero-actions .button-outline { padding-inline: 20px; }
  .trial-arrow { width: 23px; height: 23px; }
  .platform-availability { gap: 13px; font-size: 11px; margin-top: 25px; }
  .platform-note { font-size: 10px; }
  .platform-hint { max-width: 300px; margin-inline: auto; font-size: 10px; line-height: 1.9; }
  .hero-optics { width: 147vw; top: 43%; }
  .orbit-outer { border-color: #d4ad7729; }
  .hero-bottom { bottom: 24px; font-size: 7px; letter-spacing: .9px; }
  .hero-bottom a { font-size: 10px; }
  .hero-glow { bottom: -370px; width: 840px; height: 700px; }
}
@media (max-width: 360px) {
  .hero-kicker { font-size: 8px; letter-spacing: 1px; }
  .hero-actions .button-large { padding-inline: 16px; gap: 17px; font-size: 12px; }
  .hero-description { font-size: 11px; }
}

/* Keep the longer brand slogan deliberate at every screen size. */
.hero h1.hero-slogan {
  font-size: clamp(48px, 6.2vw, 86px);
  letter-spacing: -2.5px;
  line-height: 1.3;
}
.slogan-break { display: none; }
@media (max-width: 620px) {
  .hero h1.hero-slogan {
    font-size: clamp(43px, 12.6vw, 64px);
    line-height: 1.3;
    letter-spacing: -1.8px;
  }
  .slogan-break { display: inline; }
}
/* Handoff preview: sanitized standalone portrait, same pixels as the public website. */
.portrait-frame img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; object-fit: cover; transform-origin: 43% 42%; }

/* Same-origin academy enrollment dialog. */
.enrollment-dialog {
  width: min(620px, calc(100% - 32px));
  padding: 0;
  max-height: calc(100dvh - 36px);
  border: 1px solid #d5c6b4;
  background: #f7f4ef;
  border-radius: 18px;
  color: #302920;
  overscroll-behavior: contain;
}
.enrollment-dialog::backdrop { background: #15120fd4; }
.trial-header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 72px;
  padding: 18px 28px;
  background: #f7f4eff7;
  backdrop-filter: blur(12px);
  border-bottom: 1px solid #e5ddd2;
}
.trial-header-brand { display: flex; align-items: center; gap: 11px; font-size: 21px; font-weight: 600; letter-spacing: 2px; }
.trial-header-brand img { border-radius: 9px; }
.trial-header-brand small { display: block; font-size: 8px; letter-spacing: 1.2px; font-weight: 400; color: #927d66; }
.enrollment-dialog .dialog-close { position: static; width: 32px; height: 32px; flex-shrink: 0; background: #eae3d9; color: #796956; }
.enrollment-dialog .dialog-close:hover { background: #ded3c3; }
.trial-body { padding: 27px 32px 28px; }
.trial-enrollment-intro .eyebrow { font-size: 9px; letter-spacing: 2px; }
.trial-enrollment-intro h2 { margin-top: 12px; font-size: 34px; font-weight: 580; letter-spacing: -.8px; line-height: 1.45; }
.trial-enrollment-intro h2 span { color: inherit; }
.trial-enrollment-intro h2 strong { color: #a47d52; font-weight: inherit; }
.trial-enrollment-intro #trial-intro { margin-top: 10px; font-size: 13px; color: #71675b; line-height: 1.9; }
.trial-enrollment-intro .trial-scope { margin-top: 5px; font-size: 11px; color: #897e71; }
.trial-mode-notice { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 9px 11px; margin-top: 23px; padding: 14px 16px; border: 1px solid #dfc9ad; border-radius: 8px; background: #f0e5d6; }
.trial-mode-label { flex-shrink: 0; font-size: 10px; color: #815b32; background: #dbc09b; border-radius: 3px; padding: 2px 7px; font-weight: 600; letter-spacing: .4px; }
.trial-mode-notice p { flex: 1; min-width: 160px; font-size: 11px; line-height: 1.9; color: #7c654b; }
.trial-mode-notice[data-mode="unconfigured"] { background: #eeebe5; border-color: #dcd5c9; }
.trial-mode-notice[data-mode="unconfigured"] .trial-mode-label { background: #dcd5c9; color: #756857; }
.trial-inline-button { border: 0; background: transparent; color: #8d653a; padding: 2px 0; font-size: 11px; text-decoration: underline; }
.trial-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0; margin: 22px 0 25px; gap: 12px; }
.trial-steps li { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid #dfd7cb; padding-bottom: 10px; font-size: 11px; color: #a09485; }
.trial-steps li span { font-size: 9px; letter-spacing: .5px; }
.trial-steps li[aria-current="step"] { color: #8b613a; border-color: #b69163; }
.trial-form { display: grid; gap: 18px; }
.trial-field { min-width: 0; }
.trial-field label { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 600; color: #51473b; }
.trial-field input { width: 100%; min-width: 0; min-height: 45px; padding: 11px 13px; border: 1px solid #dcd1c3; border-radius: 6px; background: #fffdfa; color: #302920; font: inherit; font-size: 13px; line-height: 1.5; outline-offset: 2px; }
.trial-field input::placeholder { color: #a3988c; }
.trial-field input:focus { border-color: #b89064; outline: 2px solid #bd9c6e26; }
.trial-field input:disabled { background: #eeeae3; color: #a49a8d; }
.trial-field-help { margin-top: 7px; font-size: 10px; color: #958877; line-height: 1.8; }
.trial-code-row { display: grid; grid-template-columns: minmax(0, 1fr) 126px; gap: 10px; }
.trial-code-row button { min-height: 45px; padding: 9px; border: 1px solid #c8ae8e; border-radius: 6px; background: #eee3d3; color: #80613e; font-size: 11px; white-space: nowrap; }
.trial-code-row button:hover:enabled { background: #e6d5bf; }
.trial-code-row button:disabled { border-color: #ded7cd; color: #aaa093; background: #eeeae3; cursor: default; }
.trial-verified { margin-top: 8px; color: #6a7b50; font-size: 11px; }
.trial-demo-code { margin-top: 10px; padding: 10px 12px; border: 1px dashed #c4a375; background: #f1e6d5; color: #8d6130; border-radius: 5px; font-size: 12px; overflow-wrap: anywhere; }
.trial-form-message { font-size: 11px; line-height: 1.9; color: #95593d; background: #eedfd4; padding: 10px 12px; border-radius: 5px; }
.trial-submit { width: 100%; min-height: 48px; margin-top: 2px; justify-content: space-between; padding-inline: 17px; font-size: 13px; }
.trial-submit:disabled { color: #968875; background: #dfd4c4; box-shadow: none; cursor: default; transform: none; }
.trial-form-note { text-align: center; font-size: 10px; color: #978977; margin-top: -8px; line-height: 1.9; }
.trial-result { margin-top: 24px; padding: 22px; border: 1px solid #4c4031; border-radius: 9px; background: #24201a; color: #eadfce; }
.trial-result-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.trial-result-badge { font-size: 9px; padding: 3px 7px; border: 1px solid #b0906566; border-radius: 4px; color: #cfb38e; }
.trial-result-working { font-size: 10px; color: #b1a086; }
.trial-result h3 { font-size: 22px; font-weight: 550; }
.trial-result #trial-result-copy { font-size: 12px; color: #c5b6a0; line-height: 1.9; margin-top: 8px; }
.trial-result-expiry { font-size: 11px; color: #b7a388; margin-top: 13px; }
.trial-request-line { margin-top: 16px; padding-top: 13px; border-top: 1px solid #cba67d21; color: #97866e; font-size: 9px; line-height: 1.9; }
.trial-request-line span { display: block; color: #b8a48a; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; }
.trial-query-button { width: 100%; padding: 10px 12px; min-height: 42px; margin-top: 17px; border: 1px solid #a0835c66; border-radius: 5px; background: #382e22; color: #d9be99; font-size: 12px; }
.trial-query-button:hover:enabled { background: #443626; }
.trial-downloads { margin-top: 25px; border-top: 1px solid #dfd5c7; padding-top: 19px; }
.trial-downloads summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; font-size: 12px; font-weight: 500; color: #7b6851; padding: 4px 0; }
.trial-downloads summary::after { content: '+'; font-size: 17px; line-height: 1; }
.trial-downloads[open] summary::after { content: '−'; }
.trial-downloads summary span { font-size: 9px; font-weight: 400; color: #a3937f; margin-left: auto; padding-top: 2px; }
.enrollment-dialog .dialog-platforms { margin-top: 18px; gap: 12px; }
.enrollment-dialog .dialog-platforms .release-card { background: #efe9df; border-color: #dfd3c0; min-width: 0; padding: 18px; }
.enrollment-dialog .dialog-platforms .release-action[aria-disabled="true"] { background: #e4d9c8; color: #96836a; border-color: #d5c5b0; }
.enrollment-dialog .dialog-footnote { color: #93816a; }
.account-use-options { margin-top: 3px; }
.account-summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 17px; border: 1px solid #ddd0bc; border-radius: 7px; background: #ede5d9; }
.account-summary > div { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 3px 12px; min-width: 0; }
.account-summary-label { grid-column: 1 / -1; font-size: 9px; letter-spacing: 1px; color: #9b856a; }
.account-summary strong { font-size: 14px; font-weight: 550; color: #59472f; overflow-wrap: anywhere; }
.account-summary #trial-account-phone { font-size: 11px; color: #917a5e; white-space: nowrap; }
.account-summary button { white-space: nowrap; flex-shrink: 0; font-size: 10px; }
.account-choice-message { margin-top: 15px; }
.account-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 19px; }
.account-choice-card { padding: 21px 19px 17px; border: 1px solid #d9c7af; border-radius: 8px; background: #f0e7da; min-width: 0; display: flex; flex-direction: column; }
.account-choice-trial { background: #272119; color: #e8d6ba; border-color: #4e3d28; }
.account-choice-label { font-size: 8px; letter-spacing: 1.4px; color: #a7885f; }
.account-choice-card h3 { font-size: 21px; font-weight: 550; letter-spacing: -.5px; margin-top: 12px; }
.account-choice-card p { font-size: 11px; line-height: 1.95; color: #a49174; margin-top: 11px; }
.account-choice-purchase h3 { color: #6e5231; }
.account-choice-purchase p { color: #947d60; }
.account-choice-card .button { width: 100%; min-height: 43px; gap: 12px; justify-content: space-between; padding: 11px 13px; margin-top: 21px; font-size: 11px; white-space: nowrap; }
.account-choice-card .button svg { width: 15px; height: 15px; }
.account-choice-card .button:disabled { opacity: .5; cursor: default; transform: none; }
.account-choice-note { display: block; font-size: 9px; line-height: 1.9; margin-top: 11px; color: #9e8b6f; }
.account-purchase-button { border-color: #bd9f79; color: #82603a; background: #e3d2b9; }
.account-purchase-button:hover:enabled { background: #dac4a4; }
.account-purchase-note { margin-top: 16px; padding: 15px 17px; border: 1px dashed #bba17e; border-radius: 7px; background: #efe4d3; color: #8c6a42; }
.account-purchase-note strong { font-size: 13px; font-weight: 550; }
.account-purchase-note p { margin-top: 5px; font-size: 11px; line-height: 1.9; color: #9c805e; }
@media (max-width: 620px) {
  .enrollment-dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 0; border-radius: 13px; }
  .trial-header { padding: 13px 19px; min-height: 62px; }
  .trial-body { padding: 23px 20px; }
  .trial-enrollment-intro h2 { font-size: 30px; }
  .trial-enrollment-intro #trial-intro { font-size: 12px; }
  .trial-enrollment-intro .trial-scope { font-size: 10px; line-height: 1.8; }
  .trial-mode-notice { padding: 12px; gap: 7px; }
  .trial-mode-notice p { font-size: 10px; }
  .trial-steps { gap: 8px; margin-block: 21px; }
  .trial-steps li { font-size: 10px; gap: 4px; }
  .trial-field input { font-size: 16px; min-height: 46px; }
  .trial-code-row { grid-template-columns: minmax(0, 1fr) 108px; gap: 8px; }
  .trial-code-row button { font-size: 10px; }
  .trial-result { padding: 18px; }
  .trial-result h3 { font-size: 21px; }
  .trial-downloads summary { font-size: 11px; }
  .trial-downloads summary span { font-size: 8px; }
  .enrollment-dialog .dialog-platforms .release-card { padding: 16px 12px; }
  .account-summary { padding: 14px; }
  .account-summary > div { grid-template-columns: 1fr; gap: 4px; }
  .account-summary strong { font-size: 13px; }
  .account-choice-grid { grid-template-columns: 1fr; gap: 12px; }
  .account-choice-card { padding: 19px; }
  .account-choice-card h3 { font-size: 21px; }
  .account-choice-card .button { font-size: 12px; min-height: 44px; }
}
@media (max-width: 360px) {
  .trial-header { padding-inline: 15px; }
  .trial-body { padding-inline: 16px; }
  .trial-enrollment-intro h2 { font-size: 28px; }
  .trial-steps li { font-size: 9px; }
  .trial-code-row { grid-template-columns: minmax(0, 1fr) 96px; }
  .trial-downloads summary span { display: none; }
  .enrollment-dialog .dialog-platforms { grid-template-columns: 1fr; }
}
