/* AI readiness assessment. Reuses the checker's .ckr styles; these add the score view. Prefix .asm */
.asm-qmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 13px; color: #525B55; margin: 0 0 8px; }
.asm-qmeta .asm-dim { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: #101310; white-space: nowrap; }
.asm-qmeta .asm-dim i { width: 8px; height: 8px; border-radius: 50%; background: #C8F241; display: inline-block; }

/* Score header */
.asm-score { display: grid; grid-template-columns: 150px 1fr; gap: 22px; align-items: center; margin: 6px 0 22px; }
.asm-ring { position: relative; width: 150px; height: 150px; }
.asm-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.asm-ring circle { fill: none; stroke-width: 12; }
.asm-ring .asm-ring-bg { stroke: #ECEDEA; }
.asm-ring .asm-ring-fg { stroke: #C8F241; stroke-linecap: round; stroke-dasharray: 408; stroke-dashoffset: 408; transition: stroke-dashoffset 1.4s cubic-bezier(0.16, 1, 0.3, 1); }
.asm-ring-num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: 'DM Serif Display', serif; font-size: 40px; color: #101310; line-height: 1; }
.asm-ring-num small { font-size: 18px; margin-left: 2px; }
.asm-stage { font-size: 13px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #525B55; margin: 0 0 6px; }
.asm-score .ckr-headline { margin-bottom: 8px; }
.asm-score p.asm-meaning { font-size: 15px; line-height: 1.6; color: #2E3530; margin: 0; }

/* Stage track */
.asm-track { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 0 0 26px; }
.asm-track span { font-size: 12px; font-weight: 600; text-align: center; color: #525B55; padding: 8px 4px 0; border-top: 4px solid #ECEDEA; }
.asm-track span.is-on { color: #101310; border-top-color: #C8F241; }
.asm-track span.is-here { color: #101310; border-top-color: #101310; }

/* Dimension bars */
.asm-dims { display: grid; gap: 10px; margin: 0 0 8px; }
.asm-dim-row { display: grid; grid-template-columns: 130px 1fr auto; gap: 12px; align-items: center; font-size: 14px; }
.asm-dim-row strong { color: #101310; font-weight: 600; }
.asm-bar { height: 10px; background: #ECEDEA; border-radius: 5px; overflow: hidden; }
.asm-bar > span { display: block; height: 100%; width: 0; border-radius: 5px; background: #C8F241; transition: width 1.1s cubic-bezier(0.16, 1, 0.3, 1); }
.asm-dim-row.is-low .asm-bar > span { background: #FF0099; }
.asm-dim-row.is-top .asm-bar > span { background: #101310; }
.asm-dim-row em { font-style: normal; color: #525B55; font-size: 13px; text-align: right; white-space: nowrap; }
.asm-dim-row.is-low em { color: #B4005E; font-weight: 600; }

/* Focus cards reuse .ckr-result; the side label */
.asm-focus-n { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; background: #101310; color: #C8F241; font-size: 13px; font-weight: 700; align-items: center; justify-content: center; margin-right: 8px; vertical-align: middle; }
.asm-next { background: #F3F2EE; border-radius: 14px; padding: 18px 20px; margin: 22px 0 0; }
.asm-next h3 { font-size: 15px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; margin: 0 0 6px; color: #101310; }
.asm-next p { font-size: 15px; line-height: 1.6; color: #2E3530; margin: 0; }

/* Hero card: six mini bars */
.asm-hc-bars { display: grid; gap: 7px; margin-top: 10px; }
.asm-hc-bar { display: grid; grid-template-columns: 78px 1fr; gap: 10px; align-items: center; font-size: 12px; color: #101310; animation: rise-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) both; animation-delay: calc(0.8s + var(--i, 0) * 0.12s); }
.asm-hc-bar i { display: block; height: 8px; border-radius: 4px; background: #ECEDEA; overflow: hidden; }
.asm-hc-bar i::after { content: ''; display: block; height: 100%; width: var(--w, 50%); border-radius: 4px; background: #C8F241; }
.asm-hc-bar.is-low i::after { background: #FF0099; }
.asm-hc-score { display: flex; align-items: baseline; gap: 10px; margin: 12px 0 0; }
.asm-hc-score b { font-family: 'DM Serif Display', serif; font-weight: 400; font-size: 34px; line-height: 1; color: #101310; }
.asm-hc-score span { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #525B55; }

/* Dimension explainer */
.asm-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 18px 0 0; }
.asm-tile { background: #FFFFFF; border: 1px solid #E4E6E1; border-radius: 14px; padding: 18px; }
.asm-tile svg { width: 26px; height: 26px; stroke: #101310; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 10px; }
.asm-tile h3 { font-size: 16px; margin: 0 0 4px; color: #101310; }
.asm-tile p { font-size: 14px; line-height: 1.55; color: #525B55; margin: 0; }
.asm-stages { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; }
.asm-stages li { display: grid; grid-template-columns: 120px 1fr; gap: 14px; padding: 14px 16px; background: #FFFFFF; border: 1px solid #E4E6E1; border-radius: 12px; font-size: 15px; line-height: 1.55; color: #2E3530; }
.asm-stages li strong { color: #101310; }
.asm-stages li small { display: block; color: #525B55; font-size: 13px; }

@media (max-width: 700px) {
  .asm-score { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .asm-dim-row { grid-template-columns: 1fr auto; }
  .asm-dim-row .asm-bar { grid-column: 1 / -1; order: 3; }
  .asm-grid { grid-template-columns: 1fr; }
  .asm-stages li { grid-template-columns: 1fr; gap: 4px; }
  .asm-track span { font-size: 11px; white-space: nowrap; padding-left: 0; padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .asm-ring .asm-ring-fg, .asm-bar > span { transition: none; } .asm-hc-bar { animation: none; } }
@media print { .asm-ring .asm-ring-fg, .asm-bar > span { transition: none; } .asm-bar > span, .asm-ring .asm-ring-fg { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }