.dialog-content { margin-top: 30px; color: #b9bec8; font-size: 15px; line-height: 1.9; }
.dialog-content h3 { margin: 30px 0 10px; color: #fafafa; font-size: 24px; }
.dialog-content h4 { color: #eee; font-size: 19px; }
.dialog-content a { color: #ffc486; text-underline-offset: 4px; }
.dialog-content button, .content-action { display: inline-block; padding: 11px 18px; border: 1px solid #b67941; border-radius: 6px; color: #fff; background: #442714; cursor: pointer; font: inherit; }
.dialog-content button:focus-visible, .dialog-content a:focus-visible { outline: 2px solid #a6dfff; outline-offset: 4px; }
.detail-poster { display: block; width: 100%; height: auto; border-radius: 8px; }
.dialog-content > .detail-poster { max-width: 480px; margin: 0 auto; }
.demo-panel, .meal-preview, .development-panel { padding: 24px; margin: 24px 0; border-left: 2px solid #e79b5c; background: #10151d; }
.demo-panel > span, .meal-preview > span { display: block; margin-bottom: 14px; color: #b5bac2; font-size: 12px; }
.meal-preview button { margin-right: 8px; background: transparent; }
.meal-preview button[aria-pressed=true] { background: #633c20; }
.content-note { color: #969daa; font-size: 13px; }
.resource-callout { margin-top: 36px; padding-top: 16px; border-top: 1px solid #30343f; }
.resource-callout img { display: block; background: white; border: 10px solid white; border-radius: 8px; }
.poster-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.poster-gallery figure { margin: 0; min-width: 0; }
.poster-gallery figcaption { padding: 12px 0; display: grid; gap: 4px; }
.poster-gallery figcaption strong { color: #fff; }
.poster-gallery figcaption span { font-size: 12px; }
@media(max-width:600px) { .poster-gallery { grid-template-columns:1fr; } .dialog-content { font-size:14px; } .dialog-content h3 { font-size:21px; } .demo-panel,.meal-preview,.development-panel { padding:18px; } }
