/* Story mode and card choreography. These rules apply only to the Matgo game. */
.matgo-app{scroll-margin-top:100px}.matgo-app .mg-heading{align-items:flex-start}.matgo-app .mg-heading h1{font-size:38px;margin:5px 0 7px;letter-spacing:-1.7px}.matgo-app .mg-controls{max-width:630px;justify-content:flex-end}.matgo-app .mg-controls button,.matgo-app .mg-controls select{font-size:12px;padding:9px 10px}.matgo-app button:disabled{cursor:default}.matgo-app .mg-controls button:disabled,.matgo-app .mg-controls select:disabled{opacity:.55}.mg-mode-switch{display:flex;border:1px solid var(--line,#ddd);border-radius:9px;padding:3px;gap:3px}.matgo-app .mg-mode-switch button{border:0;padding:6px 12px;background:transparent}.matgo-app .mg-mode-switch button[aria-pressed=true]{background:#d0ad65;color:#243e31;font-weight:800}
.mg-adventure{border:1px solid var(--line,#ddd);background:var(--card,#fff);border-radius:15px;padding:16px 18px;margin:0 0 18px}.mg-adventure-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.mg-adventure-title h2{font-size:18px;margin:4px 0 0;letter-spacing:-.5px}.mg-stamp-count{font-size:23px;font-weight:850;color:#b98a40;white-space:nowrap}.mg-map{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.mg-map button{display:flex;align-items:center;gap:9px;min-width:0;text-align:left;padding:11px 9px;border:1px solid var(--line,#dfe3e1);border-radius:10px;background:transparent;color:inherit;cursor:pointer}.mg-map button>span:last-child{min-width:0}.mg-map b{display:block;font-size:12px;line-height:1.5}.mg-map small{display:block;font-size:10px;line-height:1.5;color:var(--mute);margin-top:3px}.mg-map button:disabled{opacity:.5}.mg-map .mg-stage-current{border-color:#d3b16e;background:#c5a36215;box-shadow:0 0 0 1px #d3b16e33}.mg-stage-seal{display:flex;align-items:center;justify-content:center;width:32px;height:36px;flex:0 0 32px;background:#ac987815;color:#b28a44;border:1px solid #b28a4466;border-radius:45% 45% 35% 35%;font-family:serif;font-size:20px}.mg-stage-clear .mg-stage-seal{background:#b1483c;color:#fff;border-color:#b1483c}
.matgo-app .mg-layout{grid-template-columns:minmax(0,1fr) 292px;gap:16px}.matgo-app .mg-board{border-width:5px;padding:15px 18px;background-color:#214631;background-image:radial-gradient(ellipse at 50% 45%,#39714d80,transparent 80%),repeating-linear-gradient(30deg,#ffffff02 0 1px,transparent 1px 4px);border-color:#7e5f40;border-radius:17px}.mg-rival{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px}.mg-rival-id{display:flex;align-items:center;gap:8px;min-width:145px}.mg-rival-id strong{display:block;font-size:15px}.mg-rival-id small{display:block;font-size:10px;color:#b8d1bc;margin-top:3px}.mg-portrait{width:70px;height:77px;display:block;flex-shrink:0}.mg-rival-id .mg-portrait{width:43px;height:48px;background:#ffffff12;border-radius:50%;border:1px solid #d6bc7b55}.mg-computer-avatar{display:flex;align-items:center;justify-content:center;width:42px;height:42px;background:#ffffff15;border-radius:50%;font-size:11px}.matgo-app .mg-hidden{position:static;display:flex;justify-content:center;flex:1;margin:0}.matgo-app .mg-hidden .mg-back{width:17px;height:27px}.matgo-app .mg-capture-piles{margin-top:9px;gap:8px}.matgo-app .mg-mini-cards{height:39px}.matgo-app .mg-mini-cards img{height:39px;width:24px;flex-basis:24px}.matgo-app .mg-mini-cards img+img{margin-left:calc(var(--overlap) - 24px)}.matgo-app .mg-empty-pile{height:39px;width:24px}
.mg-turn-flow{display:flex;align-items:center;justify-content:center;gap:22px;margin:12px 0 7px;font-size:10px;color:#a2bda7}.mg-turn-flow>span{display:flex;align-items:center;gap:5px}.mg-turn-flow i{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid #acc0a750;width:17px;height:17px;font-size:9px;font-style:normal}.mg-turn-flow .mg-flow-active{color:#ffe1a0;font-weight:800}.mg-flow-active i{background:#e6c478;color:#2d4634;border-color:#e6c478}.matgo-app .mg-coach{margin:6px 0;min-height:40px;padding:8px 10px;font-size:12px}.matgo-app .mg-center{position:relative;min-height:223px;padding:15px 0;grid-template-columns:56px minmax(0,1fr);gap:16px}.matgo-app .mg-field{min-height:193px;max-width:470px;gap:18px 23px}.matgo-app .mg-field .mg-card{width:56px}.matgo-app .mg-last{width:30px;margin-top:5px}.matgo-app .mg-pile{font-size:9px}.matgo-app .mg-pile .mg-back{width:43px;height:70px}.matgo-app .mg-hand{padding:17px 3px 11px;min-height:126px;gap:9px}.matgo-app .mg-hand .mg-card{width:calc((100% - 81px)/10);max-width:65px;min-width:30px}.matgo-app .mg-playerline{margin-top:9px}.matgo-app .mg-playerline strong{font-size:14px}.matgo-app .mg-score{font-size:26px;min-width:42px;text-align:right}.matgo-app .mg-score small{font-size:11px}.mg-pending{position:absolute;left:0;bottom:8px;z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;width:100px;padding:9px;background:#143824ed;border:1px solid #f4c96b;border-radius:8px;box-shadow:0 3px 8px #0005}.mg-pending small{font-size:10px;line-height:1.5;color:#f4dba3;text-align:center}.matgo-app .mg-pending .mg-card{width:45px}
.matgo-app .mg-guide{display:flex;flex-direction:column;gap:15px;padding:18px;font-size:12px;line-height:1.7}.mg-guide>section+section{border-top:1px solid var(--line,#dce1db);padding-top:13px}.matgo-app .mg-guide h2{font-size:18px;margin:3px 0 8px}.matgo-app .mg-guide h3{margin:0 0 8px;font-size:13px}.matgo-app .mg-guide p{font-size:12px;margin:7px 0}.mg-live-lesson .mg-kicker{font-size:9px}.mg-live-text{min-height:61px}.mg-coach-example{display:flex;justify-content:center;align-items:center;gap:12px;padding:8px;border-radius:8px;background:#b09c6d0c;margin:8px 0}.mg-coach-example img{width:36px;height:59px;border-radius:2px;box-shadow:0 2px 4px #0003}.mg-coach-example span{font-size:21px;color:#b99a5b}.mg-coach-example small{font-size:11px;color:var(--mute)}.mg-progress-label{display:flex;justify-content:space-between;font-size:11px;margin-top:6px}.mg-progress-label b{color:#ba9756}.mg-progress-track{height:4px;background:#a7a79820;border-radius:4px;overflow:hidden;margin:4px 0}.mg-progress-track span{display:block;height:100%;background:#c6a464;border-radius:4px;transition:width .3s}.matgo-app .mg-side-steps li{margin:7px 0;font-size:11px}.mg-rule-jump{font-size:12px;font-weight:750;color:#b18a49}.matgo-app .mg-log{font-size:10px;line-height:1.7}
.mg-scene{position:absolute;inset:0;z-index:15;display:flex;align-items:center;justify-content:center;padding:22px;background:#0c251fe8;backdrop-filter:blur(4px);border-radius:10px}.mg-scene-card{max-width:470px;width:100%;text-align:center;padding:26px 28px;background:linear-gradient(145deg,#fff8e8,#eee1c4);color:#273b30;border:1px solid #e3c785;border-radius:17px;box-shadow:0 15px 45px #0005;line-height:1.7}.mg-scene-card>.mg-portrait{width:106px;height:116px;margin:0 auto 12px}.mg-scene-card .mg-kicker{display:block;color:#90703c;font-size:10px;letter-spacing:1.4px}.mg-scene-card h2{font-size:27px;line-height:1.35;letter-spacing:-1px;margin:9px 0 12px}.mg-scene-card p{font-size:14px;margin:12px 0 17px}.mg-scene-card>strong{font-size:14px;color:#766044}.mg-scene-card>small{display:block;font-size:10px;color:#7d7156;margin-top:14px}.mg-scene-mission{font-size:12px;padding:9px;border-top:1px solid #a897672f;border-bottom:1px solid #a897672f;margin-bottom:16px}.mg-scene button{font:inherit;padding:11px 20px;border:1px solid #c6b48e;border-radius:8px;background:transparent;color:#384936;cursor:pointer;font-weight:750;font-size:13px}.mg-scene button.mg-primary{background:#27553c;color:#fff5da;border-color:#27553c;box-shadow:0 3px 0 #173c2b}.mg-scene-actions{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:16px}.mg-final-score{display:flex;align-items:center;justify-content:center;gap:14px;font-size:13px;margin:16px 0}.mg-final-score b{font-size:32px;color:#946527}.mg-earned-stars{font-size:27px;letter-spacing:5px;color:#ac7e24}.mg-result .mg-scene-card h2{color:#3e6040}.mg-decision .mg-scene-card{max-width:420px}
.mg-flight{position:fixed;z-index:10000;pointer-events:none;transform-origin:top left;perspective:650px;will-change:transform;filter:drop-shadow(3px 6px 6px #0005)}.mg-flight-inner{position:absolute;inset:0;transform-style:preserve-3d}.mg-flight-front,.mg-flight-back{position:absolute;inset:0;width:100%;height:100%;border-radius:3px;backface-visibility:hidden;-webkit-backface-visibility:hidden}.mg-flight-back{background:#ad292b;border:2px solid #d7b784;transform:rotateY(180deg)}.mg-callout{position:fixed;z-index:10001;pointer-events:none;color:#ffe6a2;font-size:clamp(35px,5vw,65px);font-weight:950;text-shadow:0 4px 0 #774522,0 7px 15px #0009;letter-spacing:-2px;white-space:nowrap}
.mg-handbook{margin-top:28px;scroll-margin-top:110px}.mg-handbook>header{margin-bottom:18px}.mg-handbook h2{font-size:28px;letter-spacing:-1px;margin:5px 0 9px}.mg-handbook>header>p{font-size:14px;color:var(--mute);margin:0}.mg-manual-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.mg-manual-grid article{position:relative;border:1px solid var(--line,#dce1db);background:var(--card,#fff);border-radius:13px;padding:22px;line-height:1.8;font-size:12px;overflow:hidden}.mg-manual-grid h3{font-size:17px;letter-spacing:-.4px;line-height:1.5;margin:0 0 15px;padding-right:26px}.mg-manual-no{position:absolute;top:17px;right:17px;font-size:23px;font-weight:800;color:#b8a16c50}.mg-manual-grid p{color:var(--mute);margin:10px 0}.mg-manual-grid ol{padding-left:18px;margin:12px 0 0}.mg-manual-grid li{margin:8px 0}.mg-guide-cards{display:flex;gap:7px;margin:9px 0}.mg-guide-cards img{width:41px;height:67px;object-fit:fill;border-radius:2px;box-shadow:0 2px 4px #0003}.mg-family-list>div{display:flex;align-items:center;gap:12px;margin:11px 0}.mg-family-list img{width:33px;height:54px;border-radius:2px}.mg-family-list p{margin:0;font-size:11px;line-height:1.65}.mg-family-list b,.mg-family-list span{display:block}.mg-family-list b{font-size:12px;color:var(--text,inherit);margin-bottom:3px}.mg-combo strong{font-size:12px}.mg-ribbon-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:14px}.mg-ribbon-examples b{font-size:10px}.mg-ribbon-examples .mg-guide-cards{gap:3px}.mg-ribbon-examples img{width:calc((100% - 6px)/3);height:auto;aspect-ratio:103.2/168.2;max-width:32px}.mg-combo p{font-size:11px}.mg-go-demo{font-size:25px;font-weight:850;letter-spacing:1px;color:#aa8551;padding:9px 0}.mg-go-demo span{font-size:18px;color:var(--mute);padding:0 6px}.mg-manual-tip{margin-top:16px;background:#bb9b4b12;border-left:3px solid #be9951;padding:9px 12px;font-size:11px}.mg-manual-grid dl{display:grid;grid-template-columns:55px 1fr;gap:12px 8px;margin:0}.mg-manual-grid dt{font-weight:800;color:#ad8549}.mg-manual-grid dd{margin:0;color:var(--mute);font-size:11px}
@media(min-width:1500px){.matgo-app .mg-center{min-height:242px}.matgo-app .mg-field{max-width:520px}.matgo-app .mg-field .mg-card{width:61px}.matgo-app .mg-hand .mg-card{max-width:71px}}
@media(max-width:1100px){.matgo-app .mg-layout{grid-template-columns:minmax(0,1fr) 255px}.matgo-app .mg-board{padding:13px}.mg-map button{gap:6px;padding:9px 7px}.mg-stage-seal{width:25px;height:30px;flex-basis:25px;font-size:17px}.mg-map b{font-size:11px}.mg-map small{font-size:9px}.matgo-app .mg-hidden .mg-back{width:12px;height:22px}.matgo-app .mg-field .mg-card{width:49px}.matgo-app .mg-field{gap:16px 10px}.matgo-app .mg-hand{gap:6px;min-height:113px}.matgo-app .mg-hand .mg-card{width:calc((100% - 54px)/10);min-width:25px}.mg-rival-id{min-width:130px}.mg-manual-grid article{padding:17px}.mg-ribbon-examples{grid-template-columns:1fr}.mg-ribbon-examples>div{display:flex;align-items:center;justify-content:space-between}.mg-ribbon-examples .mg-guide-cards{margin:4px 0}.mg-ribbon-examples img{width:25px;height:41px}}
@media(max-width:900px){.matgo-app .mg-heading{flex-direction:column;gap:13px}.matgo-app .mg-controls{max-width:none;justify-content:flex-start}.matgo-app .mg-layout{grid-template-columns:1fr}.matgo-app .mg-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.mg-guide>section+section{padding-top:0;border-top:0}.mg-rule-jump{grid-column:1/-1}.mg-map{overflow-x:auto;grid-template-columns:repeat(5,minmax(155px,1fr));padding-bottom:5px}.mg-map b{font-size:12px}.mg-map small{font-size:10px}.mg-stage-seal{width:30px;height:34px;flex-basis:30px}.matgo-app .mg-field .mg-card{width:60px}.matgo-app .mg-field{max-width:480px;gap:18px 23px}.matgo-app .mg-hand .mg-card{max-width:66px;min-width:30px}.matgo-app .mg-hidden .mg-back{width:19px;height:28px}.mg-manual-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mg-ribbon-examples{grid-template-columns:repeat(3,minmax(0,1fr))}.mg-ribbon-examples>div{display:block}.mg-ribbon-examples img{width:calc((100% - 6px)/3);height:auto;max-width:30px}}
@media(max-width:520px){.matgo-app .mg-heading h1{font-size:31px}.matgo-app .mg-heading p{font-size:12px}.matgo-app .mg-controls{gap:6px}.matgo-app .mg-controls button,.matgo-app .mg-controls select{font-size:10px;padding:8px}.matgo-app .mg-mode-switch button{padding:5px 8px}.mg-adventure{padding:13px 12px;border-radius:12px}.mg-adventure-title h2{font-size:15px}.mg-adventure-title .mg-kicker{font-size:8px;letter-spacing:1px}.mg-stamp-count{font-size:19px}.mg-map{grid-template-columns:repeat(5,153px)}.matgo-app .mg-board{padding:11px;border-width:4px}.mg-rival{gap:6px;min-height:45px}.mg-rival-id{gap:6px;min-width:123px}.mg-rival-id .mg-portrait{width:35px;height:39px}.mg-rival-id strong{font-size:12px}.mg-rival-id small{font-size:8px}.matgo-app .mg-hidden{gap:2px;justify-content:flex-end}.matgo-app .mg-hidden .mg-back{width:9px;height:17px;border-width:1px}.matgo-app .mg-score{font-size:22px;min-width:36px}.matgo-app .mg-score small{font-size:9px}.matgo-app .mg-capture-piles{gap:5px;margin-top:7px}.matgo-app .mg-mini-cards{height:31px}.matgo-app .mg-mini-cards img{height:31px;width:19px;flex-basis:19px}.matgo-app .mg-mini-cards img+img{margin-left:calc(var(--overlap) - 19px)}.matgo-app .mg-empty-pile{height:31px;width:19px}.matgo-app .mg-pile-label{font-size:9px}.mg-turn-flow{gap:12px;font-size:9px;margin-top:10px}.mg-turn-flow i{width:15px;height:15px;font-size:8px}.matgo-app .mg-coach{font-size:11px;min-height:44px;padding:7px 9px;line-height:1.6}.matgo-app .mg-center{grid-template-columns:34px minmax(0,1fr);gap:10px;min-height:200px;padding:13px 0}.matgo-app .mg-field{min-height:170px;gap:16px 7px}.matgo-app .mg-field .mg-card{width:40px}.matgo-app .mg-month-group .mg-card+.mg-card{margin-left:-22px}.matgo-app .mg-pile .mg-back{width:30px;height:49px}.matgo-app .mg-last{width:24px}.matgo-app .mg-hand{gap:13px 11px;min-height:0;max-width:320px;padding:17px 2px 10px}.matgo-app .mg-hand .mg-card{width:calc((100% - 44px)/5);max-width:48px;min-width:0}.matgo-app .mg-guide{padding:16px;gap:18px 15px;font-size:12px}.mg-live-lesson{grid-column:1/-1}.mg-live-text{min-height:0}.mg-coach-example{float:right;width:110px;margin:0 0 0 10px}.mg-coach-example img{width:29px;height:47px}.mg-coach-example span{font-size:15px}.mg-side-steps li{font-size:10px}.matgo-app .mg-guide p{font-size:11px}.mg-scene{padding:12px}.mg-scene-card{padding:23px 17px}.mg-scene-card>.mg-portrait{width:83px;height:91px}.mg-scene-card h2{font-size:24px}.mg-scene-card p{font-size:13px}.mg-scene-card .mg-kicker{font-size:9px;letter-spacing:.7px}.mg-scene button{font-size:12px;padding:11px 14px}.mg-scene-card>small{font-size:9px}.mg-pending{width:80px;padding:6px;left:-3px}.mg-pending small{font-size:8px}.matgo-app .mg-pending .mg-card{width:34px}.mg-handbook h2{font-size:24px}.mg-handbook>header>p{font-size:12px}.mg-manual-grid{grid-template-columns:1fr;gap:12px}.mg-manual-grid article{padding:20px}.mg-manual-grid h3{font-size:17px}.mg-ribbon-examples{grid-template-columns:repeat(3,minmax(0,1fr))}.mg-ribbon-examples img{max-width:30px}.mg-callout{font-size:37px}}
@media(prefers-reduced-motion:reduce){.mg-progress-track span{transition:none}.mg-flight{will-change:auto}}
/* Keep the play surface in place while card states and coaching text update. */
.matgo-app{overflow-anchor:none}
.matgo-app .mg-layout{scroll-margin-top:145px}
.matgo-app .mg-heading h1{line-height:1.12}
.matgo-app .mg-heading>.mg-kicker,.matgo-app .mg-kicker{line-height:1.35}
.matgo-app .mg-heading p{line-height:1.5;font-size:13px}
.mg-adventure-title h2{line-height:1.3;margin:4px 0 0}
.mg-adventure-title{margin-bottom:10px}
.mg-adventure{padding:13px 16px}
.mg-map button{padding-top:9px;padding-bottom:9px}
.matgo-app .mg-hand{min-height:136px}
@media(max-width:900px){.matgo-app .mg-layout{scroll-margin-top:145px}}
@media(max-width:520px){.matgo-app .mg-hand{min-height:197px}.mg-adventure{padding:12px}.matgo-app .mg-layout{scroll-margin-top:135px}}
.mg-review-bar{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding:12px;background:#102d20;border-radius:8px;color:#eed7a3;font-size:13px}
.mg-review-bar button{border:1px solid #d3b37366;color:#f9e9c1;background:#ffffff0c;border-radius:7px;padding:8px 13px;font:inherit;cursor:pointer}
/* The handbook below must not pull the viewport when the live coach changes. */
html:has(.matgo-app){overflow-anchor:none}
.matgo-app .mg-live-lesson{min-height:245px}
.matgo-app .mg-log{min-height:66px}
@media(max-width:520px){.matgo-app .mg-live-lesson{min-height:170px}}