.asm-hero-visual { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.05fr); gap: var(--space-7); align-items: center; }
.asm-hero-visual h1 { font-size: var(--text-3xl); }
.asm-hero-visual .asm-intro { font-size: var(--text-md); }
.asm-showcase { border: 1px solid var(--border-light); border-radius: var(--radius-lg); background: var(--bg-elevated); overflow: hidden; box-shadow: var(--shadow-lg); }
.asm-preview-bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--border-light); font-size: var(--text-base); }
.asm-preview-bar strong { letter-spacing: .02em; }.asm-preview-bar strong span { color: var(--primary); }
.asm-example-label { border: 1px solid var(--border-light); padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); color: var(--text-sub); font-size: var(--text-xs); }
.asm-preview-heading { padding: var(--space-5) var(--space-5) var(--space-4); }
.asm-page .asm-preview-heading h2 { font-size: var(--text-2xl); margin: 0 0 var(--space-3); }
.asm-preview-heading p { font-size: var(--text-sm); margin: 0; }
.asm-preview-switch { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-1); margin: 0 var(--space-5); padding: var(--space-1); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); }
.asm-preview-switch button { min-height: 44px; border: 0; border-radius: var(--radius-sm); padding: var(--space-2) var(--space-1); color: var(--text-sub); background: transparent; font-size: var(--text-sm); cursor: pointer; font-weight: 600; }
.asm-preview-switch button[aria-pressed=true] { color: var(--primary); background: var(--primary-subtle); }
.asm-preview-body { padding: var(--space-5); min-height: 368px; }
.asm-preview-body [hidden] { display: none; }
.asm-domain-root { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border: 1px solid var(--border-light); border-radius: var(--radius-sm); }
.asm-domain-root svg { width: 28px; height: 28px; color: var(--primary); flex: none; }
.asm-domain-root small,.asm-domain-root strong { display: block; }.asm-domain-root small { color: var(--text-muted); font-size: var(--text-xs); }.asm-domain-root strong { font-size: var(--text-md); }
.asm-asset-tree { list-style: none; margin: 0 0 0 var(--space-5); padding: var(--space-3) 0 0 var(--space-5); border-left: 1px solid var(--border-light); }
.asm-asset-tree li { position: relative; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-3) 0; }
.asm-asset-tree li::before { content: ''; position: absolute; left: calc(-1 * var(--space-5)); top: 26px; width: var(--space-4); border-top: 1px solid var(--border-light); }
.asm-asset-tree strong { display: block; font-size: var(--text-sm); overflow-wrap: anywhere; }.asm-asset-tree div>span { display: block; color: var(--text-muted); font-size: var(--text-xs); }
.asm-asset-label { color: var(--text-sub); font-size: var(--text-xs); }.asm-asset-new strong,.asm-asset-new .asm-asset-label { color: var(--primary); }
.asm-page .asm-scene-note { margin: var(--space-4) 0 0; padding-top: var(--space-4); border-top: 1px solid var(--border); font-size: var(--text-sm); }
.asm-page .asm-preview-disclaimer { margin: 0; padding: var(--space-4) var(--space-5); border-top: 1px solid var(--border); background: var(--bg); color: var(--text-muted); font-size: var(--text-xs); }
.asm-review-label { display: inline-block; color: var(--accent-orange); font-size: var(--text-xs); font-weight: 650; }
.asm-exposure-target { display: flex; flex-direction: column; gap: var(--space-2); }.asm-exposure-target strong { font-size: var(--text-md); overflow-wrap: anywhere; }.asm-exposure-target>span:last-child { color: var(--text-sub); font-size: var(--text-sm); }
.asm-diff { display: grid; grid-template-columns: 1fr auto 1fr; gap: var(--space-3); align-items: center; padding: var(--space-4) 0; margin: var(--space-3) 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.asm-diff div>span { display: block; color: var(--text-muted); font-size: var(--text-xs); }.asm-diff strong { font-size: var(--text-sm); font-weight: 600; }.asm-diff>span { color: var(--text-muted); }.asm-diff div:last-child strong { color: var(--accent-orange); }
.asm-evidence { margin: 0; }.asm-evidence div { margin-bottom: var(--space-3); }.asm-evidence dt { color: var(--text-muted); font-size: var(--text-xs); }.asm-evidence dd { margin: 0; font-size: var(--text-sm); }
.asm-action-ticket { border: 1px solid var(--border-light); border-radius: var(--radius-sm); padding: var(--space-4); }.asm-action-ticket>div { display: flex; justify-content: space-between; gap: var(--space-2); font-size: var(--text-xs); color: var(--text-muted); }
.asm-page .asm-action-ticket h3 { font-size: var(--text-md); margin: var(--space-3) 0 var(--space-1); }.asm-action-ticket p { font-size: var(--text-sm); margin: 0; overflow-wrap: anywhere; }.asm-action-ticket dl { font-size: var(--text-xs); margin: var(--space-3) 0 0; }.asm-action-ticket dl>div { display: flex; gap: var(--space-3); }.asm-action-ticket dt { color: var(--text-muted); }.asm-action-ticket dd { margin: 0; }
.asm-action-timeline { list-style: none; margin: var(--space-4) 0 0; padding: 0; font-size: var(--text-sm); }.asm-action-timeline li { position: relative; padding: 0 0 var(--space-3) var(--space-5); border-left: 1px solid var(--border-light); margin-left: var(--space-1); }.asm-action-timeline li::before { content: ''; position: absolute; left: -4px; top: 7px; width: 7px; height: 7px; border-radius: 50%; background: var(--text-muted); }.asm-action-timeline .asm-awaiting { color: var(--primary); padding-bottom: 0; }.asm-action-timeline .asm-awaiting::before { background: var(--primary); }
@media(max-width:1000px) { .asm-hero-visual { grid-template-columns: 1fr; gap: var(--space-6); }.asm-showcase { width: 100%; max-width: 620px; }.asm-preview-body { min-height: 0; } }
@media(max-width:400px) { .asm-preview-bar,.asm-preview-heading,.asm-preview-body,.asm-page .asm-preview-disclaimer { padding-inline: var(--space-4); }.asm-preview-switch { margin-inline: var(--space-4); }.asm-asset-tree { margin-left: var(--space-3); padding-left: var(--space-4); }.asm-asset-tree li::before { left: calc(-1 * var(--space-4)); width: var(--space-3); }.asm-diff { gap: var(--space-2); } }