/* A real, guided hand: seat colors, card motion and collected piles teach the rules. */
#tutorial{width:calc(100% - 24px);max-width:650px;max-height:calc(100dvh - 24px);padding:24px 28px;overflow-y:auto}
#tutorial .close{z-index:3;right:12px;top:8px}
.vt-steps{display:flex;list-style:none;padding:0;margin:0 22px 18px 0;justify-content:space-between;gap:5px}
.vt-steps li{display:flex;gap:5px;align-items:center;color:#8b948b;font-size:10px}
.vt-steps li>span{display:grid;place-items:center;width:21px;height:21px;border:1px solid #bec6b9;border-radius:50%;font-size:10px}
.vt-steps .active{color:#244f40;font-weight:700}.vt-steps .active>span{background:#244f40;color:white;border-color:#244f40}.vt-steps .done>span{background:#e2eadb;color:#365b39}
#tutorial .vt-heading{font-size:31px;margin:6px 0 9px;line-height:1.15}
#tutorial .vt-subtitle{font-size:15px;margin:0 0 15px;color:#526656}
#tutorial .vt-short{font-size:14px;text-align:center;margin:10px 0;color:#304f3e;font-weight:600}
.vt-table{position:relative;height:270px;border-radius:70px;background:radial-gradient(ellipse at 50% 45%,#3f715a,#163f35);border:7px solid #6f86734a;box-shadow:inset 0 0 0 1px #bdd4ba70;isolation:isolate;margin:12px 0;color:#fff9e8}
.vt-intro-table{height:240px}.vt-seat{position:absolute;display:flex;align-items:center;gap:5px;flex-direction:column;z-index:2;font-size:11px;color:#deeee3}
.vt-seat.north{top:8px;left:50%;transform:translateX(-50%)}.vt-seat.south{bottom:7px;left:50%;transform:translateX(-50%)}.vt-seat.west{top:50%;left:8px;transform:translateY(-50%)}.vt-seat.east{top:50%;right:8px;transform:translateY(-50%)}
.vt-person{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#d2e8d4;color:#164636;border:2px solid #99c9a5;font-size:16px;line-height:1}
.vt-seat.them .vt-person{background:#f8d4aa;border-color:#eac496;color:#775026}.vt-seat.current .vt-person{box-shadow:0 0 0 4px #f1d07d;animation:vt-pulse 1.8s infinite}
.vt-mini{display:flex;justify-content:center;margin-left:4px}.vt-mini i{width:11px;height:15px;background:repeating-linear-gradient(45deg,#90aa91 0 2px,#3d6e57 2px 4px);border:1px solid #d3ddc1;border-radius:2px;margin-left:-3px;animation:vt-deal .5s backwards;animation-delay:calc(var(--i) * 90ms)}
.vt-team-cross{position:absolute;inset:38px 38px;z-index:-1}.vt-team-cross svg{width:100%;height:100%}.vt-team-cross path{fill:none;stroke-width:3;stroke-dasharray:7 6;opacity:.55}
.vt-table-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.vt-intro-table>.vt-table-center{font:28px Georgia;background:#234e3f;padding:5px 9px;border-radius:6px}
.vt-legend{display:flex;justify-content:center;gap:28px;font-size:12px}.vt-legend .us{color:#235c3f}.vt-legend .them{color:#985b26}
.vt-goal{display:flex;align-items:center;justify-content:center;gap:15px;padding:16px 0;margin:7px 0 12px}.vt-trophy{font-size:36px}.vt-goal strong{font:64px/.9 Georgia;color:#285e45}.vt-goal>span:last-child{font-size:16px;max-width:120px;line-height:1.4}
.vt-deck{display:flex;flex-direction:column;align-items:center;width:57px;height:82px;background:#e4e5cb;color:#34533c;border-radius:6px;box-shadow:4px 3px #849779,8px 6px #bbc8a5;border:1px solid #b5c0a2}.vt-deck span{font-size:32px;line-height:1.5}.vt-deck b{font-size:11px}
.vt-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;flex-shrink:0;width:62px;height:87px;padding:6px 8px;border:1px solid #d8d6bf;background:#fffef1;color:#203d34;border-radius:6px;box-shadow:0 3px 5px #0002;font:23px/1 Georgia}
.vt-card>span{align-self:flex-end;font-size:31px}.vt-card.red{color:#ad4236}.vt-card small.vt-converted{font:10px system-ui;position:absolute;top:7px;right:5px;color:#ad4236;background:#fff2d1;border-radius:4px;padding:2px}
.vt-card.vt-glow{border:3px solid #c4932e;cursor:pointer;animation:vt-pulse 1.8s infinite}.vt-card.vt-glow:after{content:'☝';position:absolute;right:-14px;bottom:-15px;font:23px system-ui;filter:drop-shadow(1px 1px 1px #725b33);pointer-events:none}
.vt-card.vt-glow:hover{transform:translateY(-4px)}.vt-card.vt-glow:focus-visible{outline:3px solid #c4932e;outline-offset:5px}
.vt-offer{display:flex;align-items:center;gap:12px}.vt-point{font-size:28px}.vt-trump-badge{color:#ffdd96;font-size:12px}.vt-trump-card{border:2px solid #bb9b42;box-shadow:0 0 0 2px #e3d79a66}
.vt-hand{display:flex;gap:9px;justify-content:center;padding:7px 0 15px;min-height:98px}.vt-hand .vt-card{width:64px;height:87px}
.vt-rank{display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 0 17px}.vt-rank>.vt-card{width:40px;height:54px;font-size:18px;padding:3px 5px}.vt-rank>.vt-card>span{font-size:20px}.vt-rank>span{font-size:11px;margin-right:8px}.vt-rank .vt-converted{display:none}
.vt-play{position:absolute;z-index:1;display:grid;place-items:center;animation:vt-arrive .35s ease-out}
.vt-play.north{top:65px;left:50%;transform:translateX(-50%)}.vt-play.south{bottom:54px;left:50%;transform:translateX(-50%)}.vt-play.west{left:calc(50% - 118px);top:50%;transform:translateY(-50%)}.vt-play.east{right:calc(50% - 118px);top:50%;transform:translateY(-50%)}
.vt-play .vt-card{width:48px;height:65px;font-size:20px;padding:4px 6px}.vt-play .vt-card>span{font-size:24px}.vt-order{position:absolute;top:-7px;right:-6px;width:17px;height:17px;background:#fff7d9;border-radius:50%;color:#4b5d40;display:grid;place-items:center;font-size:9px;box-shadow:0 1px 2px #0003}
.vt-play.winning .vt-card{outline:3px solid #f4cf73;box-shadow:0 0 15px #f7dc8899}.vt-crown{position:absolute;left:-20px;font-size:22px;color:#ffe5a4}
.vt-trump-corner{position:absolute;top:15px;left:26px;font-size:10px;color:#f9da94}
.vt-score{display:flex;gap:20px;padding:7px 0 10px}.vt-score>div{flex:1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:5px}.vt-score span{font-size:11px}.vt-score b{font:25px Georgia}.vt-score .us{color:#2f6948}.vt-score .them{color:#995621}.vt-score-dots{grid-column:1/-1;display:flex;gap:4px}.vt-score-dots i{width:9px;height:9px;border-radius:50%;background:#e1e3d9}.vt-score .us .filled{background:#4f8657}.vt-score .them .filled{background:#c28b52}
.vt-rounds>span{display:block;text-align:center;font-size:11px;color:#53664f;margin-bottom:7px}.vt-round-slots{display:flex;justify-content:center;gap:12px}.vt-round{display:flex;align-items:center;justify-content:center;width:38px;height:30px;position:relative;border:1px solid #b6c0ae;border-radius:4px;background:#edf0e4;color:#9caa93;font-size:12px;box-shadow:2px 2px #dce1d2}.vt-round i{font-style:normal;font-size:19px;margin-right:3px}.vt-round.us{background:#d2e4ca;color:#2a633c;border-color:#5d835b}.vt-round.them{background:#f3ddc2;color:#956335;border-color:#b78a59}
.vt-winner{display:flex;gap:10px;justify-content:center;font-size:14px;margin:9px 0}.vt-winner.us{color:#285a3c}.vt-winner.them{color:#935925}
.vt-practice{font-size:10px;color:#6a7a65}.vt-round.fresh{animation:vt-score .45s ease-out}
.vt-earned{display:flex;gap:13px;justify-content:center;align-items:center;font-size:20px;padding:25px 0}.vt-earned span{color:#7f936e}.vt-celebrate strong{animation:vt-score .7s ease-out}
#tutorial #lesson>.primary{display:block;width:100%;min-height:44px;margin:5px 0 9px;font-size:14px}#tutorial #lesson>.text-button{display:block;margin:8px auto}
.vt-action-space{min-height:44px}.vt-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;color:#89927f;font-size:9px}.vt-footer .text-button{font-size:10px;white-space:nowrap}
@keyframes vt-pulse{50%{box-shadow:0 0 0 5px #d3ad4e36}}@keyframes vt-deal{from{transform:translateY(-35px) scale(.4);opacity:0}to{transform:none;opacity:1}}@keyframes vt-arrive{from{opacity:0;filter:brightness(1.5)}to{opacity:1;filter:none}}@keyframes vt-score{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:520px){
 #tutorial{padding:20px 14px;width:calc(100% - 16px);max-height:calc(100dvh - 16px)}
 #tutorial .vt-heading{font-size:27px}#tutorial .vt-subtitle{font-size:13px}.vt-steps{margin-bottom:14px}.vt-steps li{gap:3px}.vt-steps small{font-size:8px}.vt-steps li>span{width:16px;height:16px;font-size:8px}
 .vt-table{height:240px;border-radius:46px;border-width:5px}.vt-intro-table{height:217px}.vt-seat{font-size:9px;gap:3px}.vt-person{width:25px;height:25px;font-size:14px}.vt-seat.west{left:5px}.vt-seat.east{right:5px}.vt-seat.north{top:7px}.vt-seat.south{bottom:6px}
 .vt-hand{gap:6px;min-height:86px}.vt-hand .vt-card{width:49px;height:70px;font-size:21px;padding:4px 5px}.vt-hand .vt-card>span{font-size:25px}
 .vt-play .vt-card{width:39px;height:53px;font-size:18px;padding:3px 5px}.vt-play .vt-card>span{font-size:21px}.vt-play.north{top:55px}.vt-play.south{bottom:45px}.vt-play.west{left:calc(50% - 87px)}.vt-play.east{right:calc(50% - 87px)}.vt-trump-corner{font-size:8px;left:20px;top:16px}
 .vt-score{gap:14px}.vt-score span{font-size:10px}.vt-score-dots{gap:3px}.vt-score-dots i{width:8px;height:8px}.vt-rounds>span{font-size:10px}.vt-round-slots{gap:10px}.vt-round{height:25px;width:33px;font-size:10px}.vt-round i{font-size:16px}
 .vt-goal{padding:11px 0;gap:14px}.vt-goal strong{font-size:57px}.vt-goal>span:last-child{font-size:14px}.vt-legend{font-size:11px;gap:20px}.vt-earned{font-size:17px;gap:9px}
 #tutorial .vt-short{font-size:12px;margin:7px 0}.vt-rank{padding-bottom:10px;gap:5px}.vt-rank>span{font-size:10px;margin-right:2px}.vt-rank>.vt-card{width:34px;height:47px}.vt-rank>.vt-card>span{font-size:18px}
 .vt-winner{font-size:12px;margin:7px 0}.vt-footer{font-size:8px}.vt-goal.vt-celebrate{padding:28px 0}
}
@media(prefers-reduced-motion:reduce){#tutorial *{animation:none!important;transition:none!important}}
#tutorial .vt-definition{font-size:14px;line-height:1.5;margin:8px 0;padding:10px 12px;background:#e5ecdc;border-radius:8px;color:#294f38}
#tutorial .vt-rank-title{font-size:13px;line-height:1.4;margin:12px 0 8px;font-weight:600;color:#34523d}
.vt-rank{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:10px;padding:4px 0 12px}
.vt-rank figure{margin:0;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;min-width:0}
.vt-rank figure .vt-card{width:52px;height:70px;font-size:22px;padding:5px 7px}.vt-rank figure .vt-card>span{font-size:27px}.vt-rank figure .vt-converted{display:block}
.vt-rank figcaption{font-size:12px;font-weight:700;line-height:1.3}.vt-rank figure>small{font-size:11px;line-height:1.4;color:#5c6f57}
.vt-hint{margin:7px 0;border:1px solid #cbd5bf;border-radius:7px;background:#f3f5eb}
.vt-hint summary{cursor:pointer;padding:10px 12px;font-size:12px;font-weight:600;color:#34523d}
#tutorial .vt-hint p{font-size:13px;line-height:1.5;margin:0;padding:0 12px 12px;color:#3c553c}
@media(max-width:520px){.vt-rank{gap:7px}.vt-rank figcaption{font-size:11px}.vt-rank figure>small{font-size:10px}#tutorial .vt-definition{font-size:12px}.vt-rank figure .vt-card{width:45px;height:60px}.vt-rank figure .vt-card>span{font-size:23px}}
.vt-suit-key{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0 16px;text-align:center}.vt-suit-key b{display:block;font-size:30px;line-height:1.2}.vt-suit-key span{font-size:12px}.vt-suit-key .red{color:#ad4236}
.vt-trump-example{background:#e5ecdc;border-radius:15px;padding:22px;margin:22px 0}.vt-example-badge{display:block;text-align:center;color:#32563c;margin-bottom:22px;font-size:16px}.vt-comparison{display:flex;align-items:center;justify-content:center;gap:28px}.vt-comparison figure{margin:0;display:flex;align-items:center;flex-direction:column;gap:10px}.vt-comparison .vt-card{width:85px;height:116px;font-size:32px;padding:9px}.vt-comparison .vt-card>span{font-size:42px}.vt-comparison figcaption{font-size:14px}.vt-comparison small{font-size:11px}.vt-comparison .winner .vt-card{outline:4px solid #779844;outline-offset:5px}.vt-beats{font-size:35px;color:#416442}
@media(max-width:400px){.vt-comparison{gap:20px}.vt-comparison .vt-card{width:68px;height:96px}.vt-comparison figcaption{font-size:12px}.vt-trump-example{padding:20px 14px}}
.vt-follow-context{display:flex;flex-wrap:wrap;gap:8px;padding:0 12px 12px;font-size:12px}.vt-follow-context b{padding:6px 8px;background:#e3ead9;border-radius:5px}
.vt-follow-row{padding:12px;margin:0 12px 12px;border:1px solid #ccd7c1;border-radius:7px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10px}.vt-follow-row strong{font-size:13px}.vt-follow-row>div{display:flex;gap:10px;justify-content:flex-end}.vt-follow-row>span{grid-column:1/-1;font-size:13px;color:#345139}.vt-follow-row .vt-card{width:40px;height:55px;font-size:18px;padding:4px 5px}.vt-follow-row .vt-card>span{font-size:21px}
@media(max-width:360px){.vt-hand{gap:5px}.vt-hand .vt-card{width:44px;height:64px}.vt-steps small{font-size:7px}}
@media(max-height:760px){
 #tutorial{padding:16px 12px}.vt-steps{margin-bottom:8px}#tutorial .vt-heading{font-size:23px;margin:4px 0 6px}.vt-table{height:170px;margin:7px 0}.vt-intro-table{height:190px}.vt-person{width:20px;height:20px;font-size:12px}.vt-seat{font-size:8px;gap:1px}.vt-play.north{top:35px}.vt-play.south{bottom:35px}.vt-play .vt-card{width:32px;height:43px;font-size:16px}.vt-play .vt-card>span{font-size:19px}.vt-play.west{left:calc(50% - 70px)}.vt-play.east{right:calc(50% - 70px)}.vt-score{padding:3px 0 5px}.vt-score b{font-size:20px}.vt-score-dots i{height:6px;width:6px}.vt-rounds>span{margin-bottom:4px}.vt-round{height:21px}.vt-hand{min-height:74px;padding:5px 0 9px}.vt-hand .vt-card{height:60px}.vt-hand .vt-card>span{font-size:23px}#tutorial .vt-short{margin:4px 0;font-size:11px}.vt-footer{margin-top:5px}.vt-action-space{min-height:35px}#tutorial #lesson>.primary{margin:3px 0 5px}.vt-goal{padding:8px 0}.vt-goal strong{font-size:48px}
}
