.workshop-guide-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; width: fit-content; margin: 10px 0 0; padding: 9px 15px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--surface-2); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.workshop-guide-button:hover { border-color: var(--brand); color: var(--brand-text); }
.workshop-guide-button:focus-visible, .workshop-guide-close:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.studio-page-hero > .workshop-guide-button { flex: 0 0 auto; align-self: center; margin: 0; }
#s-chain > .workshop-guide-button { margin: 0 0 12px auto; }
#s-chat .chat-main-head > .workshop-guide-button { margin: 0 0 0 8px; font-size: 12px; white-space: nowrap; }
.workshop-guide-dialog { width: min(1100px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: clamp(16px, 3vw, 28px); overflow: auto; border: 1px solid var(--line); border-radius: 18px; color: var(--ink); background: var(--surface); box-shadow: 0 24px 80px rgba(0,0,0,.45); }
.workshop-guide-dialog::backdrop { background: rgba(0, 5, 12, .78); }
.workshop-guide-head { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.workshop-guide-head span { color: var(--brand-text); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.workshop-guide-head h2 { margin: 5px 0 0; }
.workshop-guide-dialog p { margin: 8px 0 16px; color: var(--muted-3); }
.workshop-guide-dialog video { display: block; width: 100%; max-height: min(70vh, 720px); background: #050a12; border-radius: 10px; }
.workshop-guide-close { width: 44px; height: 44px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: var(--surface-2); font: inherit; font-size: 28px; cursor: pointer; }
@media (max-width: 700px) { .studio-page-hero > .workshop-guide-button { align-self: start; } }
@media (max-width: 700px) { #s-chat .chat-main-head > .workshop-guide-button { width: 44px; flex: 0 0 44px; padding: 0; font-size: 0; } #s-chat .chat-main-head > .workshop-guide-button::before { content: '▶'; font-size: 17px; } }
