.tutorial-entry{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 215px;align-items:center;gap:24px;padding:32px 35px;margin-bottom:30px;border:1px solid #786089;border-radius:5px;background:linear-gradient(115deg,#242541f7,#142c40e8),url('/assets/tokyo-night-1988.png') center/cover;overflow:hidden}
.tutorial-entry .eyebrow{font-size:10.5px;color:#f7a5d9}.tutorial-entry h2{font-size:26px;line-height:1.5;margin:14px 0}.tutorial-entry p{font-size:12px;color:#c4cee7;line-height:2}.tutorial-entry-tags{display:flex;flex-wrap:wrap;gap:7px;margin:19px 0}.tutorial-entry-tags span{font-size:10.5px;border:1px solid #546281;border-radius:3px;padding:6px 8px;color:#bcdcea}.tutorial-entry .btn{min-height:48px}.tutorial-entry small{display:block;font-size:10.5px;line-height:1.8;color:#a5b4cf;margin-top:14px}.tutorial-entry-cards{position:relative;display:flex;justify-content:center;gap:5px;padding-bottom:30px}.tutorial-entry-cards .playing-card{width:83px;height:117px;font-size:25px;transform:rotate(-12deg);box-shadow:0 10px 25px #0006}.tutorial-entry-cards .playing-card+.playing-card{transform:rotate(12deg);margin-left:-10px;translate:0 10px}.tutorial-entry-cards>span:last-child{position:absolute;bottom:0;left:0;width:100%;text-align:center;letter-spacing:2px;font-size:10px;color:#a8ddf0}
.tutorial-guide{color:#ebf2ff}.tutorial-topline{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.5px;color:#95d6e5}.tutorial-topline b{color:#f5afd9;font-weight:600;font-size:9px}.tutorial-progress{height:3px;background:#3c4764;margin:15px 0 22px;overflow:hidden;border-radius:2px}.tutorial-progress span{display:block;height:100%;background:linear-gradient(90deg,#77e1e4,#fa94d1)}
.tutorial-focus-label{font-size:10px;color:#9ce5e8;line-height:1.7}.tutorial-guide h2{text-wrap:balance;font:600 24px/1.55 var(--serif);margin:9px 0 16px;letter-spacing:.4px;outline:none}.tutorial-explanation{font-size:13px;line-height:2;color:#c8d6eb;margin:0 0 18px}.tutorial-feedback{border-left:2px solid #78d2c4;background:#23484566;padding:9px 11px;font-size:11px;line-height:1.9;color:#b0f1df;margin:0 0 14px}
.tutorial-numbers{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-top:1px solid #46516e;border-bottom:1px solid #46516e;padding:13px 0;margin-bottom:20px}.tutorial-numbers>span{font-size:9px;color:#a5b8d2}.tutorial-numbers strong{display:block;font:600 22px Georgia,serif;color:#eff8ff;margin-top:6px}.tutorial-numbers small{font:9px var(--sans);color:#a5bfd6}
.tutorial-guide>.btn,.tutorial-guide .tutorial-complete-actions .btn,.tutorial-guide .tutorial-help .btn{white-space:normal;line-height:1.7;min-height:48px;font-size:12px;width:100%;padding:12px 10px;justify-content:center}.tutorial-primary{box-shadow:0 0 0 3px #f086bd18!important}.tutorial-help{font-size:10px;color:#c1cde4;margin-top:19px}.tutorial-help summary{cursor:pointer;min-height:36px;padding:9px 0}.tutorial-help p{font-size:11px;line-height:1.9;color:#b6c5de;margin:8px 0 14px}.tutorial-guide .tutorial-note{font-size:9px;line-height:1.8;color:#a4b2cf;margin:14px 0 0}.tutorial-skip{font-size:10px;color:#c4b2ce;border:0;border-bottom:1px solid #6d5d79;background:none;padding:9px 0;min-height:40px;margin-top:8px;cursor:pointer}.tutorial-bet{border:0;padding:0;margin:0 0 20px;display:flex;gap:8px}.tutorial-bet legend{font-size:11px;color:#c6d8ed;margin-bottom:10px}.tutorial-bet button{flex:1;min-height:44px;border:1px solid #607c9c;color:#d7e9ff;border-radius:3px;background:#203b52;font-size:12px;cursor:pointer}.tutorial-bet button[aria-pressed=true]{color:#fff3fc;background:#6c3a68;border-color:#f5a4d8;box-shadow:inset 0 0 0 1px #f5a4d8}.tutorial-winning{margin:0 0 19px;padding:12px;background:#234a5266;border:1px solid #548c93;border-radius:4px}.tutorial-winning>span{font-size:10px;color:#baf1ee}.tutorial-winning>div{display:flex;gap:5px;margin:10px 0}.tutorial-winning .playing-card.compact{width:37px;height:52px;font-size:15px}.tutorial-winning .playing-card .suit{font-size:20px}.tutorial-winning p{font-size:10px;color:#a7c4d8;line-height:1.9;margin:12px 0 0}.tutorial-winning b{color:#b4f1e0;font-weight:600}.tutorial-complete-actions{display:grid;gap:10px}
@media(max-width:650px){.tutorial-entry{grid-template-columns:1fr;padding:25px 22px;gap:0}.tutorial-entry h2{font-size:22px}.tutorial-entry p{font-size:11px}.tutorial-entry .btn{width:100%;font-size:12px}.tutorial-entry-cards{display:none}.tutorial-entry-tags{gap:5px}.tutorial-entry-tags span{font-size:10px}.tutorial-entry small{font-size:10.5px}}
/* The lesson on the table every game uses (ui/tutorial.js): the step's spot glows, the lesson card sits in
   the action panel, and only the real button the step asks for can be pressed. */
@keyframes lesson-glow{0%,100%{box-shadow:0 0 0 2px #ff5bd8,0 0 16px 3px #ff4fd899}50%{box-shadow:0 0 0 2px #ff5bd8,0 0 30px 9px #ff4fd855}}
.night-table[data-lesson=hand] .flat-me .flat-hole,.night-table[data-lesson=pot] .flat-pot,.night-table[data-lesson=board] .flat-board,.night-table[data-lesson=result] .flat-me .flat-hole{position:relative;z-index:3;border-radius:10px;animation:lesson-glow 1.6s ease-in-out infinite}
.night-table[data-lesson=board] .flat-board{padding:4px}
.lesson-card h2{font-size:19px;line-height:1.5;margin:6px 0 8px}
.lesson-card .tutorial-explanation{font-size:12.5px;line-height:1.85;margin:0 0 12px}
.lesson-card .tutorial-progress{margin:9px 0 12px}
.lesson-card .tutorial-feedback{margin-bottom:8px}
.lesson-card .tutorial-bet{margin:0 0 12px}.lesson-card .tutorial-winning{margin:0 0 12px}
.lesson-actions .lesson-off{opacity:.3;filter:grayscale(.7);pointer-events:none}
.lesson-actions .lesson-go{position:relative;z-index:1;animation:lesson-glow 1.6s ease-in-out infinite}
.lesson-foot{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.lesson-foot .tutorial-help{flex:1;margin-top:8px}.lesson-foot .tutorial-skip{flex:none;margin-top:8px}
@media(max-width:900px){.lesson-card h2{font-size:17px;margin:4px 0 6px}.lesson-card .tutorial-explanation{font-size:12px;line-height:1.75;margin-bottom:10px}.lesson-card .tutorial-progress{margin:7px 0 9px}.lesson-card .tutorial-winning{padding:8px 10px}.lesson-card .tutorial-winning>div{margin:6px 0 0}.lesson-card .tutorial-winning p{display:none}.lesson-card .tutorial-winning .playing-card.compact{width:30px;height:42px;font-size:12px}.lesson-card .tutorial-feedback{font-size:11px;padding:6px 10px}}
@media (prefers-reduced-motion:reduce){.night-table[data-lesson] *,.lesson-actions .lesson-go{animation:none!important}.night-table[data-lesson=hand] .flat-me .flat-hole,.night-table[data-lesson=pot] .flat-pot,.night-table[data-lesson=board] .flat-board,.night-table[data-lesson=result] .flat-me .flat-hole,.lesson-actions .lesson-go{box-shadow:0 0 0 2px #ff5bd8,0 0 16px 3px #ff4fd899}}
