#tutorial{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:18px;box-sizing:border-box;color:#314735;background:#fff8e8;border:3px solid #2e1f52;border-radius:22px;overflow:auto}#tutorial::backdrop{background:#231a3a99}#tutorial .collection-top{top:-18px;background:#fff8e8;z-index:2}#tutorialTitle{font-size:clamp(21px,5vw,28px);outline-offset:4px;margin:8px 0}#tutorialProgress{font-size:13px;margin:0}#tutorialBody>p{line-height:1.5}.tutorial-stage{display:flex;flex-direction:column;align-items:center;gap:16px}.tutorial-hand{display:flex;justify-content:center;gap:12px;width:100%}.tutorial-card{display:flex;flex-direction:column;align-items:center;width:130px;padding:10px;background:#fff8e8;border:3px solid #2e1f52;border-radius:16px;color:#2e1f52;gap:6px}.tutorial-card svg{width:72px;height:72px}.tutorial-card span{font-size:12px}.tutorial-card[aria-pressed=true]{outline:4px solid #e9b52d;outline-offset:2px}.tutorial-field{width:min(220px,85%);padding:0;background:none;border:0;text-align:initial}.tutorial-field .garden-scene{height:150px}.tutorial-choices{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}#tutorialFeedback{min-height:24px;font-weight:700}.tutorial-success{color:#286337;font-weight:700}#tutorialOpen{margin-top:10px}#tutorialBody .primary{white-space:normal;max-width:100%}

body:not(.beginner-tips) #phaseDescription{display:none!important}body.beginner-tips #phaseDescription{display:block!important;max-width:65ch;font-size:14px;line-height:1.4}#tipsToggle{font-size:13px;padding:4px 8px;min-height:32px;margin:0}#tipsEnabled{width:20px;height:20px;vertical-align:middle;accent-color:#417944}
#tutorial .collection-top{margin:-18px -18px 14px;padding:14px 16px;width:auto;box-sizing:border-box}#tutorial .collection-top>div{min-width:0}#tutorial .dialog-close{flex-shrink:0}
#tutorial .text-button{color:#314735;text-decoration:underline}

#tutorial .tutorial-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:14px}
#tutorial .tutorial-choice{appearance:none;display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:12px 14px;box-sizing:border-box;border:3px solid #2e1f52;border-radius:14px;background:#f7d978;color:#2e1f52;font:inherit;font-weight:800;line-height:1.3;text-align:center;white-space:normal;box-shadow:0 4px 0 #2e1f52;cursor:pointer}
#tutorial .tutorial-choice:hover{background:#ffe69a}#tutorial .tutorial-choice:active{transform:translateY(2px);box-shadow:0 2px 0 #2e1f52}#tutorial .tutorial-choice:focus-visible{outline:3px solid #417944;outline-offset:4px}
@media(max-width:420px){#tutorial .tutorial-choices{grid-template-columns:1fr}}