.home-help-entry { display:flex; justify-content:flex-end; margin:0 0 4px; }
.home-help-entry button, .home-help-demo { min-width:44px; min-height:44px; padding:8px; border:0; background:transparent; color:#576b62; font:inherit; font-size:13px; cursor:pointer; }
.home-help-demo { flex:none; text-decoration:underline; text-decoration-color:#b9c5bd; text-underline-offset:4px; }
.home-help-entry button:hover, .home-help-demo:hover { color:#216e5c; }
.home-help-entry button:focus-visible, .home-help-demo:focus-visible, #home-help-dialog button:focus-visible { outline:2px solid #397864; outline-offset:2px; }
#home-help-dialog { box-sizing:border-box; width:min(560px,calc(100% - 24px)); max-width:none; max-height:calc(100dvh - 24px); margin:auto; padding:0; border:1px solid #d9dfd7; border-radius:16px; background:#fffdf8; color:#33483e; font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; font-size:15px; line-height:1.75; overflow:hidden; box-shadow:0 16px 64px #182b2430; }
#home-help-dialog:not([open]) { display:none; }
#home-help-dialog[open] { display:flex; flex-direction:column; }
#home-help-dialog::backdrop { background:rgba(23,34,29,.52); }
#home-help-dialog *, #home-help-dialog *::before, #home-help-dialog *::after { box-sizing:border-box; }
#home-help-dialog [hidden] { display:none!important; }
#home-help-dialog .home-help-header { flex:none; display:flex; align-items:center; gap:8px; padding:12px 12px 12px 20px; border-bottom:1px solid #e7e8df; }
#home-help-dialog .home-help-heading { flex:1; min-width:0; }
#home-help-dialog h2 { flex:1; margin:0; font-family:inherit; font-size:18px; font-weight:600; line-height:1.5; color:#33483e; }
#home-help-dialog button { min-width:44px; min-height:44px; padding:8px 12px; border:1px solid #d9dfd7; border-radius:8px; background:transparent; color:#435d50; font:inherit; font-size:14px; line-height:1.5; cursor:pointer; touch-action:manipulation; }
#home-help-dialog button:hover { background:#edf2eb; }
#home-help-dialog button:disabled { opacity:.42; cursor:default; }
#home-help-dialog [data-home-help-close] { flex:none; padding:4px; border:0; font-size:26px; }
#home-help-dialog .home-help-body { min-height:0; padding:16px 20px 20px; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; }
#home-help-dialog p { margin:0 0 14px; color:inherit; font-size:15px; line-height:1.85; }
#home-help-dialog [data-home-help-progress] { margin:0 0 4px; font-size:12px; line-height:1.4; color:#737a68; font-variant-numeric:tabular-nums; }
#home-help-dialog .home-help-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; border:0; }
#home-help-dialog figure { margin:0; }
#home-help-dialog [data-home-help-media] { display:block; width:100%; max-width:390px; height:auto; aspect-ratio:390 / 844; margin:0 auto; background:#f5f5ef; }
#home-help-dialog .home-help-footer { flex:none; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 20px max(12px,env(safe-area-inset-bottom)); border-top:1px solid #e7e8df; background:#fffdf8; }
#home-help-dialog [data-home-help-next], #home-help-dialog [data-home-help-dismiss] { background:#356c56; color:#fff; border-color:#356c56; min-width:88px; }
#home-help-dialog [data-home-help-next]:hover, #home-help-dialog [data-home-help-dismiss]:hover { background:#2a5a47; border-color:#2a5a47; color:#fff; }
#home-help-dialog [data-home-help-dismiss] { margin-left:auto; }
#home-help-dialog [data-home-help-error] { margin:12px 0 0; color:#726b54; font-size:13px; }
#home-help-dialog .home-help-navigation, #home-help-dialog .home-help-playback { display:flex; align-items:center; gap:4px; }
#home-help-dialog.is-guide { width:min(414px,calc(100% - 16px)); max-height:calc(100dvh - 16px); border-radius:12px; }
#home-help-dialog.is-guide .home-help-header { padding:8px 8px 8px 16px; }
#home-help-dialog.is-guide h2 { font-size:16px; line-height:1.5; }
#home-help-dialog.is-guide .home-help-body { padding:0; }
#home-help-dialog.is-guide .home-help-footer { gap:8px; padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); }
#home-help-dialog.is-guide .home-help-footer button { padding:8px; font-size:13px; }
#home-help-dialog.is-guide [data-home-help-next] { min-width:64px; }
#home-help-dialog .home-help-playback button { border-color:transparent; color:#66715f; }
#home-help-dialog.is-guide [data-home-help-error] { margin:0; padding:12px 16px; }
@media(orientation:portrait) {
  /* 390/844 preserves the recording; 176px reserves the dialog header and controls. */
  #home-help-dialog.is-guide [data-home-help-media] { width:min(100%,390px,calc((100dvh - 176px) * .4620853)); max-width:100%; max-height:calc(100dvh - 176px); }
}
@media(max-width:360px) {
  .home-help-demo { padding:6px; font-size:12px; }
  #home-help-dialog { width:calc(100% - 16px); max-height:calc(100dvh - 16px); }
  #home-help-dialog .home-help-header { padding-left:16px; }
  #home-help-dialog .home-help-body, #home-help-dialog .home-help-footer { padding-left:16px; padding-right:16px; }
  #home-help-dialog h2 { font-size:17px; }
}
@media(max-height:480px) {
  #home-help-dialog { max-height:calc(100dvh - 16px); }
  #home-help-dialog .home-help-header, #home-help-dialog .home-help-footer { padding-top:4px; padding-bottom:4px; }
}
