/* Content/article styles for LLM + use-case pages (doc-* system). Static, reusable.
   Card frame + CTA now live in shared.css (single source); these are page-type-specific extras. */
[data-theme="dark"] .nav-link-card{background:var(--dark-card-surface-raised);border-color:var(--dark-card-border-accent);color:var(--text-2)}
@media(max-width:640px){.nav-links-bottom{grid-template-columns:1fr}}

/* Use-case page styles: static-first, no JS dependency, stable layout containers. */
.doc-wrap{max-width:1120px;margin:0 auto;padding:0 20px 64px}.doc-section,.doc-section h2,.doc-article h2{margin-top:0;letter-spacing:-.35px;color:var(--text)}.doc-section p,.doc-article p,.doc-article li{color:var(--text-2);line-height:1.7}
.doc-topic>ul,.doc-topic>ol,.doc-mini-lab>ul,.doc-mini-lab>ol{padding-left:22px}.level-label{display:inline-flex;white-space:nowrap;color:var(--accent);background:var(--accent-soft);border:1px solid rgba(94,79,224,.24);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:750}[data-theme="dark"] .level-label{color:var(--accent-hover);background:#5e4fe01f;border-color:#5e4fe066}.doc-section{padding:26px;margin-top:22px}.doc-section details{border-top:1px solid var(--border);padding:14px 0}.doc-section details:first-of-type{border-top:0}.doc-section summary{cursor:pointer;font-weight:750;color:var(--text)}.doc-article{padding:28px;margin-top:22px}.doc-article header{border-bottom:1px solid var(--border);margin-bottom:22px;padding-bottom:18px}.doc-article h2{font-size:22px;line-height:1.2;font-weight:800;letter-spacing:-.2px;margin-top:30px}.doc-article h3{margin-top:22px;color:var(--text)}.doc-accent{color:var(--accent);font-style:normal;font-weight:750}
.doc-note{border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:16px;padding:16px 18px;margin:20px 0;color:var(--text-2)}.doc-note--workflow{display:flex;gap:10px;align-items:flex-start}.doc-note-icon{flex:0 0 auto;margin-top:2px;color:var(--accent)}.doc-note--workflow p{margin:4px 0 0}
.comparison{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0}.comparison div{background:var(--surface-2);border:1px solid var(--border);border-radius:18px;padding:16px}.comparison strong{display:block;margin-bottom:8px;color:var(--text)}[data-theme="dark"] .doc-section{background:var(--dark-card-surface);border-color:var(--dark-card-border)}[data-theme="dark"] .comparison div{background:var(--dark-card-surface-muted);border-color:var(--dark-card-border)}[data-theme="dark"] .doc-section p,[data-theme="dark"] .doc-article p,[data-theme="dark"] .doc-article li{color:#cbd5e1}[data-theme="dark"] .doc-section summary,[data-theme="dark"] .comparison strong{fill:#f4f7fb;color:#f4f7fb}.step-timeline{max-width:900px;margin:24px auto 8px;display:grid;grid-template-columns:1fr;gap:0 36px}.tl-step{position:relative;display:flex;gap:16px;align-items:flex-start;padding:0 0 22px;text-decoration:none;color:inherit}.tl-step::before{content:"";position:absolute;left:18px;top:30px;bottom:-8px;width:2px;background:var(--border-mid)}.tl-step:last-child::before{display:none}.tl-dot{flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:var(--surface);border:2px solid var(--accent);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;position:relative;z-index:1;transition:background var(--transition),color var(--transition)}.tl-step:hover .tl-dot{background:var(--accent-strong);color:#fff}.tl-body{display:flex;flex-direction:column;padding-top:3px}.tl-title{font-weight:700;font-size:17px;color:var(--text);line-height:1.3}.tl-step:hover .tl-title{color:var(--accent)}.tl-lead{font-size:14px;color:var(--text-2);margin-top:2px;line-height:1.5}[data-theme="dark"] .tl-dot{background:#1a2236}.step-detail{scroll-margin-top:calc(var(--pe-nav-height,62px) + var(--pe-sticky-social-height,68px) + 14px)}.step-detail header{display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid var(--border);margin-bottom:18px;padding-bottom:14px}.step-detail header .level-label{margin:0;flex-shrink:0}.step-detail header h2{min-width:0}.step-detail h2{margin:0}.step-detail p{margin:0 0 18px}.step-detail ul,.step-detail ol{margin:16px 0 20px;color:var(--text-2);line-height:1.7;padding-left:22px}.step-detail li{margin:8px 0}
.step-detail .step-phase-title+ul,.step-detail .step-phase-title+ol{margin-top:12px}.step-phase-title{margin:20px 0 8px;color:var(--text);font-size:15px;font-weight:750;letter-spacing:-.01em;line-height:1.35}
.try-box{background:linear-gradient(180deg,rgba(45,212,191,.10),rgba(45,212,191,.04));border:1px solid rgba(45,212,191,.30);border-radius:18px;padding:18px;margin:20px 0}.try-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.try-badge{display:inline-flex;background:var(--success-strong);color:#fff;font-size:11px;font-weight:750;letter-spacing:.4px;text-transform:uppercase;padding:4px 10px;border-radius:999px}.try-hint{font-size:13px;color:var(--text-3)}.try-input{width:100%;box-sizing:border-box;font:inherit;font-size:14px;line-height:1.6;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px 12px;min-height:64px}.try-input:focus{outline:2px solid #0d9488;outline-offset:1px;border-color:#0d9488}.try-input .ph{background:#fde68a;color:#7c5e10;border-radius:4px;padding:0 3px;font-weight:600}.try-box .ok-row{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;align-items:center}.try-edit{display:inline-flex;align-items:center;gap:7px;padding:10px 18px;border-radius:var(--r-md);font-size:13px;font-weight:600;cursor:pointer;background:none;color:var(--text-2);border:1px solid var(--border-mid);transition:background var(--transition),border-color var(--transition),color var(--transition)}.try-edit:hover{border-color:var(--accent-mid);color:var(--text)}.send-btn-big.try-send{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:var(--r-md);font-size:14px;font-weight:700;cursor:pointer;border:1px solid #ffffff1a;background:var(--grad-success);color:#fff;box-shadow:var(--sh-suc);transition:background var(--transition),box-shadow var(--transition),transform var(--transition)}.send-btn-big.try-send:hover{transform:translateY(-1px)}.try-send:focus-visible,.try-edit:focus-visible{outline:2px solid #0d9488;outline-offset:2px}[data-theme="dark"] .try-input{background:var(--dark-card-surface-muted);border-color:var(--dark-card-border)}[data-theme="dark"] .try-input .ph{background:#b8902a;color:#1a1205}[data-theme="dark"] .try-edit{background:#ffffff14;border-color:#ffffff24;color:var(--text-2)}[data-theme="dark"] .try-box{background:linear-gradient(180deg,rgba(45,212,191,.10),rgba(45,212,191,.03));border-color:rgba(45,212,191,.26)}@media(min-width:720px){.step-timeline{grid-template-columns:1fr 1fr;grid-template-rows:repeat(4,auto);grid-auto-flow:column}.step-timeline .tl-step:nth-child(4)::before,.step-timeline .tl-step:nth-child(8)::before{display:none}}@media(max-width:820px){.comparison,.doc-article{padding:22px}.doc-wrap{padding-left:16px;padding-right:16px}}
.doc-topic{border-top:1px solid var(--border);padding-top:24px;margin-top:26px;scroll-margin-top:86px}.doc-topic:first-of-type{border-top:0}.doc-example{background:var(--surface-2);border:1px solid var(--border);border-radius:18px;padding:16px 18px;margin:16px 0;color:var(--text-2);line-height:1.65}.doc-example strong{color:var(--text)}.doc-article a{color:var(--accent)}[data-theme="dark"] .doc-example{background:var(--dark-card-surface-muted);border-color:var(--dark-card-border)}


/* Doc-only components: diagrams, examples and dense technical callouts */
.doc-article{max-width:900px;margin-left:auto;margin-right:auto}.doc-topic p{margin-bottom:12px}.doc-flow{display:grid;gap:12px;margin:20px 0}.doc-flow-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;align-items:start;background:var(--surface-2);border:1px solid var(--border);border-radius:18px;padding:14px 16px}.doc-flow-step{font-weight:800;color:var(--accent)}.doc-flow-row p{margin:0}.doc-insight{background:linear-gradient(180deg,var(--accent-soft),transparent);border:1px solid rgba(94,79,224,.26);border-radius:18px;padding:16px 18px;margin:18px 0;color:var(--text-2);line-height:1.65}.doc-mini-lab{background:var(--surface-2);border:1px solid var(--border);border-radius:20px;padding:18px;margin:22px 0}.doc-mini-lab h2{margin-top:0}.doc-mini-lab ol{margin-bottom:0}.doc-mini-lab li{margin:6px 0}.doc-article .nav-links-bottom{max-width:100%;}[data-theme="dark"] .doc-flow-row,[data-theme="dark"] .doc-mini-lab{background:var(--dark-card-surface-muted);border-color:var(--dark-card-border)}@media(max-width:700px){.doc-flow-row{grid-template-columns:1fr}.doc-flow-step{font-size:14px}}


/* Doc bottom navigation. Card frame + CTA shared via shared.css. */
.doc-wrap>.nav-links-bottom{max-width:900px;margin:32px auto 0}
.doc-wrap>.bottom-cta{max-width:900px;margin:40px auto 0}





.btn-primary:hover{transform:translateY(-1px)}



/* Compact prompt accordion blocks for long reusable prompts on use-case pages. */
.prompt-accordion{padding:16px;margin:18px 0;scroll-margin-top:calc(var(--pe-nav-height,62px) + 18px)}
.prompt-accordion h3,.prompt-group-title{margin:0 0 12px;color:var(--text);font-size:18px;line-height:1.25}
.prompt-accordion details{padding:10px 0;scroll-margin-top:calc(var(--pe-nav-height,62px) + 16px)}
.prompt-accordion details:first-of-type{border-top:0}
.prompt-accordion summary{padding-right:44px}
.prompt-copy-row{display:flex;justify-content:flex-end;position:relative;z-index:2;margin:8px 10px -44px 0;min-height:34px;pointer-events:none}
.prompt-copy-row .pe-copy-icon{pointer-events:auto;background:var(--surface)}
.prompt-accordion .try-input{min-height:0;margin-top:8px;padding-right:52px;white-space:pre-wrap}
.prompt-accordion-compact{padding:14px 16px}
.prompt-accordion-compact .try-input{font-size:13px;line-height:1.55;padding:10px 52px 10px 12px}
@media(max-width:640px){.prompt-accordion summary{padding-right:0}.prompt-copy-row{margin:8px 8px -42px 0}}

/* Small screens: tighten the doc-article top so the gap under the fixed sticky social bar matches the tutorial pages. Desktop unchanged. */
@media(max-width:1024px){.doc-article{margin-top:0;padding-top:6px}}










/* Desktop-only lightbox affordance for document infographics. */

.pe-lightbox-open{overflow:hidden}
@media (max-width:899px),(pointer:coarse){
  .doc-lightbox{display:none}
}
@media(max-width:600px){.comparison{grid-template-columns:1fr}}
/* Restore inter-card spacing on mobile for consecutive doc-article/step-detail cards
   (the .doc-article{margin-top:0} mobile rule above tightens the first card but
   collapsed the gap between stacked cards on use-case sub-pages). */
@media(max-width:1024px){.doc-article + .doc-article{margin-top:16px}}

/* LLM article CTAs match the quieter tutorial close. */
.doc-wrap>.bottom-cta{background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(249,248,255,.96));border-color:var(--border-mid);box-shadow:var(--sh-surface);padding:28px 24px}
.doc-wrap>.bottom-cta h2{color:var(--text)}
.doc-wrap>.bottom-cta p{max-width:640px;color:var(--text-2)}
[data-theme="dark"] .doc-wrap>.bottom-cta{background:var(--dark-card-gradient);border-color:var(--dark-card-border-accent)}
[data-theme="dark"] .doc-wrap>.bottom-cta h2{color:var(--text)}

/* LLM tutorial guidance and section rhythm — refined 2026-07-17 */
.llm-detail-refined>.toc-card{
  margin:0 0 26px;padding:18px;border:1px solid var(--border-mid);border-radius:20px;
  background:var(--surface);box-shadow:0 4px 14px rgba(15,23,42,.045)
}
.llm-detail-refined>.toc-card .toc-title{margin:0 0 12px;color:var(--text);font-size:13px;letter-spacing:.055em}
.llm-detail-refined>.toc-card .toc-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.llm-detail-refined>.toc-card .toc-list li{min-width:0}
.llm-detail-refined>.toc-card .toc-list li a{
  display:flex;height:100%;box-sizing:border-box;align-items:center;gap:9px;padding:12px 13px;
  border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text-2);
  font-size:13px;font-weight:650;line-height:1.35;text-decoration:none;
  transition:none
}
.llm-detail-refined>.toc-card .toc-list li a:hover,
.llm-detail-refined>.toc-card .toc-list li a:focus-visible{
  border-color:rgba(79,70,184,.25);background:rgba(79,70,184,.022);color:var(--text);
  box-shadow:0 3px 10px rgba(15,23,42,.045);transform:none
}
.llm-detail-refined>.toc-card .toc-list li a:focus-visible{outline:2px solid rgba(79,70,184,.28);outline-offset:2px}
.llm-detail-refined>.toc-card .toc-list li a.is-current{
  border-color:rgba(79,70,184,.3);background:rgba(79,70,184,.04);color:var(--text);
  box-shadow:inset 3px 0 0 var(--accent-strong)
}
.llm-detail-refined .toc-num{
  width:26px;height:26px;flex:0 0 26px;background:var(--accent-strong);
  color:#fff;box-shadow:0 2px 6px rgba(94,79,224,.20);font-size:11px
}
.llm-detail-refined>.doc-topic,
.llm-detail-refined>.doc-mini-lab{
  margin:0 0 24px;padding:28px 24px;border:1px solid var(--border-mid);border-radius:20px;
  background:var(--surface);box-shadow:var(--sh-surface);scroll-margin-top:calc(var(--pe-nav-height,62px) + var(--pe-sticky-social-height,68px) + 16px)
}
.llm-detail-refined>.doc-topic:first-of-type{border-top:1px solid var(--border-mid)}
.llm-detail-refined :is(.doc-insight,.doc-note){
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(248,248,255,.96));
  border:1px solid var(--border-mid);border-left:4px solid var(--accent-strong);border-radius:15px;
  box-shadow:0 5px 16px rgba(15,23,42,.045);color:var(--text-2)
}
.llm-detail-refined .doc-insight{padding:15px 17px}
.llm-detail-refined .doc-note{padding:15px 17px}
.llm-detail-refined :is(.doc-insight,.doc-note) strong{color:var(--text)}
.llm-detail-refined .tutorial-chapter-break{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:15px;margin:38px 0 25px;text-align:center
}
.llm-detail-refined .tutorial-chapter-break>span{height:1px;background:linear-gradient(90deg,transparent,rgba(79,70,184,.34))}
.llm-detail-refined .tutorial-chapter-break>span:last-of-type{background:linear-gradient(90deg,rgba(79,70,184,.34),transparent)}
.llm-detail-refined .tutorial-chapter-break>.pe-section-pill{justify-self:center}
.llm-detail-refined .tutorial-chapter-break>p{grid-column:1/-1;max-width:690px;margin:11px auto 0;color:var(--text-2);font-size:14px;line-height:1.55}
[data-theme="dark"] .llm-detail-refined>.toc-card,
[data-theme="dark"] .llm-detail-refined>.doc-topic,
[data-theme="dark"] .llm-detail-refined>.doc-mini-lab,
[data-theme="dark"] .llm-detail-refined :is(.doc-insight,.doc-note){
  background:var(--dark-card-gradient);border-color:var(--dark-card-border-accent)
}
[data-theme="dark"] .llm-detail-refined>.toc-card .toc-list li a{background:var(--dark-card-surface);border-color:var(--dark-card-border-accent);color:var(--text-2)}
[data-theme="dark"] .llm-detail-refined>.toc-card .toc-list li a:hover,
[data-theme="dark"] .llm-detail-refined>.toc-card .toc-list li a:focus-visible{background:#151a29;border-color:#5e4fe048;color:var(--text);box-shadow:0 3px 10px rgba(0,0,0,.16)}
[data-theme="dark"] .llm-detail-refined>.toc-card .toc-list li a.is-current{background:#171c2c;border-color:#5e4fe055;color:var(--text);box-shadow:inset 3px 0 0 var(--accent-strong)}
@media(max-width:820px){.llm-detail-refined>.toc-card .toc-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){
  .llm-detail-refined>.toc-card{padding:15px}
  .llm-detail-refined>.toc-card .toc-list{grid-template-columns:1fr}
  .llm-detail-refined>.doc-topic,.llm-detail-refined>.doc-mini-lab{padding:24px 18px}
  .llm-detail-refined .tutorial-chapter-break{margin:32px 0 22px}
}

/* Refined use-case workflow layout — 2026-07-17 */
.usecase-detail-refined{--uc-violet:var(--accent-strong);--uc-violet-dark:#4f46b8;--uc-line:#d9d7ef}
.usecase-detail-refined .uc-intro-card{margin-top:10px}
.usecase-detail-refined :is(.uc-intro-card .doc-note,.uc-quiet-note){
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(248,248,255,.96));
  border:1px solid var(--border-mid);border-left:4px solid var(--uc-violet);border-radius:15px;
  box-shadow:0 5px 16px rgba(15,23,42,.045);color:var(--text-2);padding:15px 17px
}
.usecase-detail-refined .uc-quiet-note strong{color:var(--text)}
.usecase-detail-refined .uc-path-card{max-width:900px;margin:22px auto 0;padding:25px 24px 18px;border:1px solid var(--border-mid);border-radius:20px;background:var(--surface);box-shadow:var(--sh-surface)}
.usecase-detail-refined .uc-path-head{padding:0 2px 20px;border-bottom:1px solid var(--border)}
.usecase-detail-refined .uc-path-head h2{margin:0;color:var(--text);font-size:22px;letter-spacing:-.25px}
.usecase-detail-refined .uc-path-head p{margin:7px 0 0;color:var(--text-2);line-height:1.6}
.usecase-detail-refined .uc-workflow-timeline{
  --uc-progress:0%;position:relative;display:grid;grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr);
  grid-auto-flow:row;gap:0 16px;max-width:none;margin:18px 0 0;padding:5px 0 2px
}
.usecase-detail-refined .uc-workflow-timeline::before,
.usecase-detail-refined .uc-workflow-timeline::after{
  content:"";position:absolute;z-index:0;left:50%;top:24px;width:2px;transform:translateX(-50%);border-radius:999px
}
.usecase-detail-refined .uc-workflow-timeline::before{bottom:25px;background:var(--uc-line)}
.usecase-detail-refined .uc-workflow-timeline::after{height:var(--uc-progress);max-height:calc(100% - 49px);background:var(--uc-violet);transition:height .24s ease}
.usecase-detail-refined .uc-workflow-timeline .tl-step{
  position:relative;z-index:1;display:grid;align-items:center;gap:0;margin:0;padding:5px 0 13px;border:0;border-radius:14px;background:transparent;text-decoration:none;color:inherit
}
.usecase-detail-refined .uc-workflow-timeline .tl-step::before{display:none}
.usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(odd){grid-column:1/3;grid-template-columns:minmax(0,1fr) 58px}
.usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(even){grid-column:2/4;grid-template-columns:58px minmax(0,1fr)}
.usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(odd) .tl-dot{grid-column:2;grid-row:1}
.usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(odd) .tl-body{grid-column:1;grid-row:1;text-align:right;align-items:flex-end}
.usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(even) .tl-dot{grid-column:1;grid-row:1}
.usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(even) .tl-body{grid-column:2;grid-row:1;text-align:left;align-items:flex-start}
.usecase-detail-refined .uc-workflow-timeline .tl-body{min-width:0;padding:10px 13px;border:1px solid transparent;border-radius:13px;transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease}
.usecase-detail-refined .uc-workflow-timeline .tl-step:hover .tl-body,
.usecase-detail-refined .uc-workflow-timeline .tl-step:focus-visible .tl-body{background:rgba(79,70,184,.026);border-color:rgba(79,70,184,.15);box-shadow:0 3px 10px rgba(15,23,42,.035)}
.usecase-detail-refined .uc-workflow-timeline .tl-step:focus-visible{outline:none}
.usecase-detail-refined .uc-workflow-timeline .tl-dot{
  justify-self:center;width:34px;height:34px;flex-basis:34px;border:2px solid var(--uc-violet);background:var(--surface);color:var(--uc-violet-dark);font-size:13px;box-shadow:0 0 0 5px var(--surface);transition:background-color .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease
}
.usecase-detail-refined .uc-workflow-timeline .tl-step.is-complete .tl-dot,
.usecase-detail-refined .uc-workflow-timeline .tl-step.is-current .tl-dot{background:var(--uc-violet);border-color:var(--uc-violet);color:#fff}
.usecase-detail-refined .uc-workflow-timeline .tl-step.is-current .tl-dot{box-shadow:0 0 0 5px var(--surface),0 4px 12px rgba(67,56,168,.22)}
.usecase-detail-refined .uc-workflow-timeline .tl-title{font-size:15px;line-height:1.3}
.usecase-detail-refined .uc-workflow-timeline .tl-lead{max-width:330px;font-size:13px;line-height:1.45}
.usecase-detail-refined .uc-workflow-timeline .tl-step:hover .tl-title,
.usecase-detail-refined .uc-workflow-timeline .tl-step.is-current .tl-title{color:var(--uc-violet-dark)}
.usecase-detail-refined .uc-phase-break{max-width:900px;margin:38px auto 14px;padding:0 4px 14px;border-bottom:1px solid var(--border-mid)}
.usecase-detail-refined .uc-phase-break>.pe-section-pill{margin:0}
.usecase-detail-refined .uc-phase-break h2{margin:10px 0 4px;color:var(--text);font-size:25px;letter-spacing:-.35px}
.usecase-detail-refined .uc-phase-break p{max-width:700px;margin:0;color:var(--text-2);line-height:1.55}
.usecase-detail-refined .step-detail{position:relative;margin-top:14px;padding:28px 28px 30px}
.usecase-detail-refined .step-detail header{align-items:center;gap:10px;flex-wrap:wrap}
.usecase-detail-refined .step-detail header h2{flex:1 1 300px}
.usecase-detail-refined .uc-output-chip{display:inline-flex;margin-left:auto;padding:5px 9px;border:1px solid rgba(94,79,224,.20);border-radius:999px;background:var(--accent-light);color:var(--accent-dark);font-size:11px;font-weight:700;white-space:nowrap}[data-theme="dark"] .usecase-detail-refined .uc-output-chip{background:#5e4fe01f;border-color:#5e4fe066;color:var(--accent-hover)}
.usecase-detail-refined .step-phase-title{margin-top:23px}
.usecase-detail-refined .uc-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:0;margin:12px 0 20px;list-style:none}
.usecase-detail-refined .uc-checklist li{position:relative;margin:0;padding:12px 13px 12px 37px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);line-height:1.52}
.usecase-detail-refined .uc-checklist li::before{content:"✓";position:absolute;left:13px;top:12px;width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(16,185,129,.11);color:#087f5b;font-size:11px;font-weight:900}
.usecase-detail-refined .try-box{border-radius:16px;box-shadow:0 5px 16px rgba(15,23,42,.035)}
.usecase-detail-refined .uc-next-action{max-width:900px;margin:24px auto 0;padding:27px 24px;border:1px solid var(--border-mid);border-radius:20px;background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(249,248,255,.96));box-shadow:var(--sh-surface);text-align:center}
.usecase-detail-refined .uc-next-kicker{margin-bottom:8px}
.usecase-detail-refined .uc-next-action h2{margin:0;color:var(--text);font-size:23px}
.usecase-detail-refined .uc-next-action p{max-width:660px;margin:9px auto 0;color:var(--text-2);line-height:1.6}
.usecase-detail-refined .uc-next-links{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:17px}
.usecase-detail-refined .uc-primary-link,.usecase-detail-refined .uc-secondary-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 17px;border-radius:12px;font-size:13px;font-weight:750;text-decoration:none}
.usecase-detail-refined .uc-primary-link{background:var(--grad-accent);color:#fff;box-shadow:var(--sh-acc)}
.usecase-detail-refined .uc-secondary-link{border:1px solid var(--border-mid);background:var(--surface);color:var(--text-2)}
[data-theme="dark"] .usecase-detail-refined :is(.uc-intro-card .doc-note,.uc-quiet-note),
[data-theme="dark"] .usecase-detail-refined .uc-next-action{background:var(--dark-card-gradient);border-color:var(--dark-card-border-accent)}
[data-theme="dark"] .usecase-detail-refined .uc-path-card{background:var(--dark-card-surface);border-color:var(--dark-card-border-accent)}
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline{--uc-line:#33364e}
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline .tl-dot{background:var(--dark-card-surface);box-shadow:0 0 0 5px var(--dark-card-surface);color:var(--accent-hover)}
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline .tl-step.is-current .tl-dot{box-shadow:0 0 0 5px var(--dark-card-surface),0 4px 12px rgba(0,0,0,.28)}
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline .tl-step:hover .tl-body,
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline .tl-step:focus-visible .tl-body{background:#151a29;border-color:#5e4fe03d;box-shadow:0 3px 10px rgba(0,0,0,.14)}
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline .tl-step:hover .tl-title,
[data-theme="dark"] .usecase-detail-refined .uc-workflow-timeline .tl-step.is-current .tl-title{color:var(--accent-hover)}
[data-theme="dark"] .usecase-detail-refined .uc-checklist li{background:var(--dark-card-surface-muted);border-color:var(--dark-card-border-accent)}
@media(max-width:720px){
  .usecase-detail-refined .uc-path-card{padding:21px 17px 14px}
  .usecase-detail-refined .uc-workflow-timeline{grid-template-columns:48px minmax(0,1fr);gap:0 8px;padding-top:8px}
  .usecase-detail-refined .uc-workflow-timeline::before,.usecase-detail-refined .uc-workflow-timeline::after{left:24px}
  .usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(n){grid-column:1/-1;grid-template-columns:48px minmax(0,1fr)}
  .usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(n) .tl-dot{grid-column:1;grid-row:1}
  .usecase-detail-refined .uc-workflow-timeline .tl-step:nth-child(n) .tl-body{grid-column:2;grid-row:1;text-align:left;align-items:flex-start;padding:9px 8px}
  .usecase-detail-refined .uc-workflow-timeline .tl-lead{max-width:none}
  .usecase-detail-refined .uc-checklist{grid-template-columns:1fr}
  .usecase-detail-refined .step-detail{padding:24px 18px 26px}
  .usecase-detail-refined .uc-output-chip{width:100%;margin:0;padding:4px 0;border:0;background:transparent;color:var(--text-3)}
  .usecase-detail-refined .uc-phase-break{margin-top:30px}
}
@media(prefers-reduced-motion:reduce){
  .usecase-detail-refined .uc-workflow-timeline::after,
  .usecase-detail-refined .uc-workflow-timeline .tl-body,
  .usecase-detail-refined .uc-workflow-timeline .tl-dot{transition:none}
}
