.combat-tutorial-btn{display:flex;align-items:center;gap:16px;width:100%;padding:14px 20px 14px 14px;text-align:left;cursor:pointer;border:2px dashed var(--brand);border-radius:14px;background:color-mix(in srgb,#ffcc33 14%,var(--surface-2));color:var(--text);transition:transform 0.2s ease,box-shadow 0.2s ease}.combat-tutorial-btn:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,0,0,0.15)}.combat-tutorial-face{flex:none;width:90px;height:auto;aspect-ratio:1 / 1;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,0.25))}.combat-tutorial-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.combat-tutorial-title{font-size:1.35rem;font-weight:800;color:var(--brand-text)}.combat-tutorial-desc{font-size:0.9rem;line-height:1.4;color:var(--text-muted)}.combat-tutorial-go{flex:none;padding:8px 18px;border-radius:999px;background:#ffcc33;color:#3a2a00;font-weight:800;white-space:nowrap}#combat-tab.tut-on{padding-bottom:280px}.tut-panel{position:fixed;right:16px;bottom:16px;z-index:900;display:flex;align-items:flex-end;gap:0;width:min(620px,calc(100vw - 32px));pointer-events:none}.tut-portrait{flex:none;width:210px;height:auto;aspect-ratio:5 / 6;object-fit:contain;margin-right:-22px;filter:drop-shadow(0 6px 12px rgba(0,0,0,0.35));animation:tut-bob 3s ease-in-out infinite}.tut-bubble{pointer-events:auto;position:relative;flex:1;min-width:0;margin-bottom:18px;padding:14px 16px 12px;border-radius:16px;background:var(--surface);color:var(--text);border:2px solid #ff7ab8;box-shadow:0 12px 30px rgba(0,0,0,0.3)}.tut-bubble::before{content:"";position:absolute;left:-11px;bottom:26px;width:18px;height:18px;background:var(--surface);border-left:2px solid #ff7ab8;border-bottom:2px solid #ff7ab8;transform:rotate(45deg)}.tut-name{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;color:#d6337f;margin-bottom:4px}.tut-text{margin:0 0 10px;font-size:0.95rem;line-height:1.45}.tut-actions{display:flex;justify-content:space-between;align-items:center;gap:10px}.tut-exit{background:none;border:none;padding:0;color:var(--text-muted);font-size:0.8rem;text-decoration:underline;cursor:pointer}.tut-next{margin-left:auto}.tut-panel.nudge .tut-bubble{animation:tut-shake 0.4s ease}.tut-target{position:relative;z-index:5;outline:3px solid #ffcc33!important;outline-offset:3px;border-radius:10px;animation:tut-glow 1.2s ease-in-out infinite}.tut-arrow{position:fixed;z-index:901;width:0;height:0;border-left:16px solid transparent;border-right:16px solid transparent;border-top:24px solid #ffcc33;pointer-events:none;transform:translate(-50%,-100%);animation:tut-point 0.9s ease-in-out infinite;filter:drop-shadow(0 3px 3px rgba(0,0,0,0.45))}.tut-arrow.hidden{display:none}@keyframes tut-glow{0%,100%{box-shadow:0 0 0 0 rgba(255,204,51,0.75)}50%{box-shadow:0 0 0 10px rgba(255,204,51,0)}}@keyframes tut-point{0%,100%{transform:translate(-50%,-110%)}50%{transform:translate(-50%,-80%)}}@keyframes tut-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes tut-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}@media (prefers-reduced-motion: reduce){.tut-target,.tut-arrow,.tut-portrait,.tut-panel.nudge .tut-bubble{animation:none}}@media (max-width: 600px){.combat-tutorial-btn{flex-wrap:wrap}.combat-tutorial-face{width:70px}.combat-tutorial-go{width:100%;text-align:center}.tut-panel{right:8px;left:8px;bottom:8px;width:auto}.tut-portrait{width:120px;margin-right:-14px}.tut-text{font-size:0.88rem}#combat-tab.tut-on{padding-bottom:290px}#combat-tab.tut-on .tcg-sheet{top:8px;bottom:auto;max-height:calc(100vh - 300px);border-radius:18px;margin:0 8px}#combat-tab.tut-on .tcg-sheet-scrim{z-index:899}#combat-tab.tut-on .tut-arrow{z-index:960}.tut-tap{white-space:nowrap}}
