.guide-intro{margin-top:10px;color:#b6d7cb;font:12px system-ui,sans-serif;}
.guide-intro button{border:0;background:transparent;color:#d5f3df;text-decoration:underline;text-underline-offset:4px;min-height:44px;padding:4px 8px;cursor:pointer;font:inherit;}
.guide-intro button:focus-visible{outline:2px solid #9bd4b4;outline-offset:3px;}
.guide-start{border:1px solid #5c897b;background:#133a37;border-radius:6px;padding:12px;margin:14px 0;display:flex;align-items:center;gap:12px;justify-content:space-between;text-align:left;}
.guide-start p{margin:4px 0 0;font-size:12px;color:#c1d9d0;}
.guide-start .btn{font-size:12px;white-space:nowrap;min-height:44px;}
#practiceGuide{position:absolute;z-index:9;top:80px;left:50%;transform:translateX(-50%);width:min(440px,calc(100% - 28px));padding:12px 16px;background:#061d24f5;border:1px solid #709c8c;border-radius:7px;box-shadow:0 8px 28px #0006;}
.guide-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;}
#guideProgress{color:#a4c4b7;font:10px ui-monospace,monospace;letter-spacing:.08em;}
#guideSkip{background:transparent;border:0;color:#c4d7d6;min-height:44px;padding:4px 0 4px 12px;cursor:pointer;text-decoration:underline;}
#guideTitle{font:600 18px system-ui,sans-serif;margin:0 0 6px;color:#e0f3e9;}
#guideHint{margin:0;font:13px/1.45 system-ui,sans-serif;color:#c7deda;}
#guideAction{margin-top:10px;min-height:44px;font-size:12px;}
#practiceGuide[data-feedback="true"]{border-color:#b5e7a8;}
body:has(.overlay:not(.hidden)) #practiceGuide{visibility:hidden;}
@media(max-width:560px){#practiceGuide{top:106px;padding:8px 12px;}#guideTitle{font-size:16px;}.guide-start{align-items:flex-start;flex-direction:column;gap:8px;}.guide-start .btn{width:100%;}}
@media(max-height:520px) and (min-width:561px){
  #practiceGuide{top:108px;left:14px;transform:none;width:248px;padding:8px 12px;}
  #guideTitle{font-size:16px;}#guideHint{font-size:12px;}
  #guideProgress{font-size:9px;letter-spacing:.02em;white-space:nowrap;}
  #guideSkip{font-size:10px;white-space:nowrap;padding-left:0;}
  body:has(#practiceGuide:not(.hidden)) #practiceDock{left:auto;right:14px;transform:none;width:calc(100% - 300px);max-width:530px;}
  body:has(#practiceGuide:not(.hidden)) .practice-actions{flex-wrap:wrap;}
}