/* Quiet match rituals: the same felt, cream paper and restrained gold. */
#match-moments{position:fixed;inset:0;z-index:80;overflow:hidden;background:#003e2e}
#match-moments[hidden]{display:none}
.moment-intro{height:100%;width:100%;padding:12px 24px max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:14px;isolation:isolate;background:radial-gradient(ellipse at 50% 43%,#17634d80,transparent 60%),#003e2e;color:#fff9e9;overflow:hidden}
.moment-intro:before,.result.match-finale:before{content:'';position:absolute;inset:16% -25%;border:1px solid #e8ca7920;border-radius:50%;transform:rotate(-28deg);z-index:-1;pointer-events:none}
.moment-intro header{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:390px;flex:none;height:44px}
.moment-intro header .durava-logo{font-size:28px;color:#fff9e9}
.moment-intro .moment-back{width:44px;height:44px;padding:10px;border-radius:50%;color:#fff9e9;background:#ffffff08}
.moment-intro .moment-back svg{width:24px;height:24px}
.moment-intro header>i{width:44px}
.moment-story{min-height:0;flex:1;width:100%;max-width:390px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}
.moment-eyebrow{font-size:10px;line-height:15px;letter-spacing:2.8px;text-transform:uppercase;font-weight:600;color:#e9cf87;margin:0}
.moment-intro h1{font-family:var(--display);font-weight:700;font-size:clamp(37px,11vw,49px);line-height:1.02;letter-spacing:-1.5px;color:#fff9e9;margin:0}
.moment-intro .moment-note{font-size:14px;line-height:20px;color:#d7e2d8;margin:0}
.moment-fan{position:relative;width:210px;height:177px;flex:none;margin:8px 0 2px;isolation:isolate}
.moment-fan:before{content:'';position:absolute;inset:45px 3px 5px;border:1px solid #e6c97940;border-radius:50%;transform:rotate(-12deg);z-index:-1}
.moment-fan>.card{position:absolute;top:8px;left:62px;--card-w:88px!important;height:132px;box-shadow:0 10px 20px #001c2266;transform-origin:50% 90%}
.moment-fan>.card:nth-child(1){transform:translate(-42px,13px) rotate(-19deg)}
.moment-fan>.card:nth-child(2){transform:translate(42px,13px) rotate(19deg)}
.moment-fan>.card:nth-child(3){transform:translateY(-3px) rotate(-3deg)}
.moment-matchup{display:flex;align-items:center;justify-content:center;gap:13px;width:100%;max-width:350px;padding:13px 0;border-top:1px solid #fff2;border-bottom:1px solid #fff2}
.moment-person,.moment-opponents{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0}
.moment-person>div{width:43px;height:43px;flex:none;border-radius:50%;border:1px solid #e6c9798c;background:#e6c97912;color:#f7df9c;display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:22px}
.moment-person>span{font-size:13px;line-height:17px}
.moment-person small{display:block;color:#bdcfc4;font-size:10px}
.moment-versus{font-family:var(--display);font-style:italic;font-size:15px;color:#e9cf87}
.moment-opponents{gap:10px}
.moment-opponents .moment-person{flex-direction:column;gap:4px}
.moment-opponents .moment-person>div{width:32px;height:32px;font-size:17px;border-color:#e2ebda55;color:#fff9e9;background:#ffffff07}
.moment-opponents .moment-person>span{font-size:11px;line-height:14px}
.match-summary{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 8px;color:#d7e1d7;font-size:11px;line-height:17px}
.match-summary span{border:1px solid #e9cf872e;border-radius:20px;padding:4px 10px;white-space:nowrap;background:#ffffff04}
.moment-bottom{width:100%;max-width:350px;display:grid;justify-items:center;gap:10px;flex:none}
.moment-bottom .btn{width:100%;height:51px;min-height:44px;border-radius:18px;background:#e6c979;color:#123d2e;border:1px solid #e6c979;font-size:18px;box-shadow:0 3px 12px #001f2222}
.moment-progress{height:2px;width:78px;overflow:hidden;background:#e6c97925;border-radius:2px}
.moment-progress i{display:block;width:100%;height:100%;background:#e6c979;transform-origin:left}
.moment-bottom>p{font-size:11px;line-height:15px;color:#b9cec0;text-align:center;margin:0}
body[data-page=game] .result.match-finale{position:fixed;inset:59px 12px 12px;max-width:436px;margin:0 auto;padding:25px 22px 22px;z-index:30;isolation:isolate;overflow:hidden;border:1px solid #e6c9793d;border-radius:25px;background:radial-gradient(ellipse at 50% 22%,#1a674c7d,transparent 66%),#003e2e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;text-align:center;color:#fff9e9}
body[data-page=game] .match-finale h2{font-family:var(--display);font-size:43px;line-height:1.05;letter-spacing:-1.4px;margin:0;outline:none}
body[data-page=game] .match-finale .finale-copy{font-size:15px;line-height:22px;color:#dce5db;max-width:310px;margin:0;text-wrap:pretty}
.moment-seal{position:relative;width:142px;height:142px;display:grid;place-items:center;flex:none;margin:4px 0 8px}
.moment-seal:before,.moment-seal:after{content:'';position:absolute;inset:0;border:1px solid #e6c97940;border-radius:50%}
.moment-seal:after{inset:8px;border-color:#e6c97924}
.moment-seal .result-symbol{font-family:Georgia,serif;font-size:66px;line-height:1;color:#e6c979;text-shadow:0 6px 18px #001a2288}
.moment-seal .seal-star{position:absolute;top:12px;color:#e6c979;font-size:13px}
.moment-seal .seal-star:last-child{top:auto;bottom:12px}
.moment-spark{position:absolute;top:30%;left:6%;font-size:18px;color:#e6c979;opacity:0;pointer-events:none}
.moment-spark:nth-of-type(2){top:18%;left:88%;font-size:12px}
.moment-spark:nth-of-type(3){top:47%;left:90%;font-size:16px}
.moment-spark:nth-of-type(4){top:55%;left:9%;font-size:11px}
body[data-page=game] .match-finale .match-summary{margin:2px 0 8px}
body[data-page=game] .result.match-finale .game-actions{display:grid;grid-template-columns:1fr;gap:8px;min-height:0;width:100%;max-width:320px;margin-top:7px;flex:none}
body[data-page=game] .result.match-finale .game-actions>.btn{height:50px;min-height:44px;border-radius:17px;font-size:17px;padding:8px 12px;background:none;border:1px solid #fff6;color:#fff9e9}
body[data-page=game] .result.match-finale .game-actions>.primary{background:#e6c979;border-color:#e6c979;color:#123d2e}
body[data-page=game] .match-finale.result--loss .moment-seal .result-symbol{font-size:56px}
@media(max-width:350px){.moment-intro{padding-left:18px;padding-right:18px;gap:9px}.moment-story{gap:9px}.moment-matchup{gap:9px}.moment-person{gap:6px}.moment-opponents{gap:7px}.moment-matchup>.moment-person>div{width:36px;height:36px;font-size:19px}.moment-matchup>.moment-person>span{font-size:12px}.moment-opponents .moment-person>div{width:28px;height:28px;font-size:15px}.moment-opponents .moment-person>span{font-size:10px}.moment-matchup{padding:10px 0}.match-summary{gap:5px;font-size:10px}.match-summary span{padding:3px 8px}}
@media(max-height:650px){.moment-intro{gap:8px;padding-top:7px;padding-bottom:12px}.moment-story{gap:8px}.moment-intro h1{font-size:39px}.moment-fan{height:139px;width:190px;margin:0}.moment-fan>.card{--card-w:72px!important;height:108px;left:59px;top:5px}.moment-fan>.card:nth-child(1){transform:translate(-36px,10px) rotate(-19deg)}.moment-fan>.card:nth-child(2){transform:translate(36px,10px) rotate(19deg)}.moment-fan:before{inset:35px 5px 3px}.moment-matchup{padding:9px 0}.moment-bottom{gap:7px}.moment-bottom .btn{height:47px}body[data-page=game] .result.match-finale{padding:16px;gap:9px}.moment-seal{width:106px;height:106px;margin:0 0 4px}.moment-seal .result-symbol{font-size:53px}body[data-page=game] .match-finale h2{font-size:37px}body[data-page=game] .match-finale .finale-copy{font-size:14px;line-height:20px}body[data-page=game] .match-finale .match-summary{margin:0}body[data-page=game] .result.match-finale .game-actions{margin-top:2px;gap:7px}body[data-page=game] .result.match-finale .game-actions>.btn{height:47px;font-size:16px}}
@media(max-height:540px){.moment-intro{padding:6px 18px 10px;gap:6px}.moment-intro header{height:40px}.moment-intro header .durava-logo{font-size:24px}.moment-story{gap:6px}.moment-eyebrow{font-size:9px;line-height:12px}.moment-intro h1{font-size:31px}.moment-note{font-size:12px!important;line-height:16px!important}.moment-fan{height:104px;width:164px}.moment-fan>.card{--card-w:54px!important;height:81px;left:55px;top:4px}.moment-fan>.card:nth-child(1){transform:translate(-29px,9px) rotate(-19deg)}.moment-fan>.card:nth-child(2){transform:translate(29px,9px) rotate(19deg)}.moment-matchup{padding:6px 0}.moment-person>div{width:32px;height:32px;font-size:18px}.moment-opponents .moment-person>div{width:25px;height:25px;font-size:14px}.moment-bottom{gap:6px}.moment-bottom>p{font-size:10px;line-height:12px}.moment-bottom .btn{height:44px;font-size:16px}.moment-seal{width:78px;height:78px}.moment-seal .result-symbol{font-size:39px}.moment-seal .seal-star{top:4px;font-size:10px}.moment-seal .seal-star:last-child{bottom:4px}body[data-page=game] .match-finale h2{font-size:30px;line-height:1.03}body[data-page=game] .match-finale .finale-copy{font-size:13px;line-height:17px}body[data-page=game] .result.match-finale{inset:53px 10px 8px;gap:7px;padding:12px}body[data-page=game] .result.match-finale .game-actions{grid-template-columns:1fr 1fr;max-width:none}body[data-page=game] .result.match-finale .game-actions>.btn{font-size:13px;height:46px;white-space:normal;line-height:16px}body[data-page=game] .result.match-finale .game-actions>.btn svg{display:none}}
@media(max-height:420px){.moment-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:40px minmax(0,1fr) auto;gap:5px 14px}.moment-intro header{grid-column:1/-1;margin:auto;max-width:620px}.moment-story{display:contents}.moment-story>.moment-eyebrow,.moment-story>h1,.moment-story>.moment-note{grid-column:1;text-align:center;align-self:end}.moment-story>.moment-eyebrow{display:none}.moment-story>h1{grid-row:2;align-self:start;font-size:29px;margin-top:6px}.moment-story>.moment-note{grid-row:2;align-self:center;margin-top:35px}.moment-fan{grid-column:2;grid-row:2;align-self:start;justify-self:center;margin-top:3px;height:108px}.moment-matchup{grid-column:1;grid-row:2;align-self:end;max-width:290px;border:0;padding:0;margin-bottom:2px}.moment-matchup .moment-person{gap:4px}.moment-matchup .moment-person>div{width:26px;height:26px;font-size:15px}.moment-opponents .moment-person{flex-direction:column}.moment-opponents .moment-person>div{width:22px;height:22px;font-size:12px}.moment-story>.match-summary{grid-column:2;grid-row:2;align-self:end;justify-self:center;max-width:200px}.moment-bottom{grid-column:1/-1;max-width:390px;margin:auto;gap:5px}.moment-bottom>p{display:none}body[data-page=game] .result.match-finale{display:grid;grid-template-columns:70px minmax(0,1fr);grid-template-rows:auto auto auto auto auto;gap:7px 12px;align-content:center;max-width:620px}.match-finale>.moment-eyebrow{grid-column:1/-1}.match-finale>.moment-seal{grid-column:1;grid-row:2/4;width:70px;height:70px;margin:0}.match-finale>h2{grid-column:2;grid-row:2;text-align:left;font-size:29px!important}.match-finale>.finale-copy{grid-column:2;grid-row:3;text-align:left}.match-finale>.match-summary{grid-column:1/-1;grid-row:4}.match-finale>.game-actions{grid-column:1/-1;grid-row:5}}
@media(max-width:370px) and (max-height:420px){.moment-intro{grid-template-columns:1fr;grid-template-rows:36px minmax(0,1fr) auto;gap:5px}.moment-story>h1{grid-column:1;grid-row:2;align-self:start;font-size:29px;margin-top:1px}.moment-story>.moment-note{display:none}.moment-fan{display:none}.moment-matchup{grid-column:1;grid-row:2;align-self:center;max-width:270px;margin:13px auto 0;border:0}.moment-story>.match-summary{grid-column:1;grid-row:2;align-self:end;max-width:none}.moment-bottom{grid-column:1;grid-row:3}}
/* The decisive card lifts from its actual landing place before the result. */
#match-moments:has(.last-card-moment){background:#002d23e8;backdrop-filter:blur(4px)}
.last-card-moment{width:100%;height:100%;padding:22px 24px max(22px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;color:#fff9e9;gap:16px;overflow:hidden}
.last-card-moment>.durava-logo{font-size:28px}
.last-card-story{flex:1;min-height:0;width:100%;max-width:350px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}
.last-card-hero{position:relative;width:240px;height:242px;display:grid;place-items:center;isolation:isolate}
.last-card-hero>i{position:absolute;inset:12px 4px;border:1px solid #e6c97966;border-radius:50%;background:radial-gradient(ellipse,#e6c9792e,transparent 68%);z-index:-1}
.last-card-hero>.card{--card-w:132px!important;height:198px;transform-origin:center;box-shadow:0 14px 40px #001d23b3,0 0 0 1px #e6c97988}
.last-card-hero>span{position:absolute;left:4px;top:32%;font-size:25px;color:#e6c979;opacity:0}
.last-card-hero>span:last-child{left:auto;right:5px;top:64%;font-size:18px}
.last-card-moment h1{font-family:var(--display);font-size:39px;line-height:1.08;letter-spacing:-1px;margin:0;text-wrap:balance}
.last-card-copy{font-size:15px;line-height:21px;color:#dce5db;margin:0}
body[data-page=game] .game-ended .felt{z-index:5}
@media(max-height:540px){.last-card-moment{padding:12px 18px;gap:10px}.last-card-story{gap:8px}.last-card-hero{width:170px;height:145px}.last-card-hero>.card{--card-w:80px!important;height:120px}.last-card-moment h1{font-size:30px}.last-card-copy{font-size:13px;line-height:18px}.last-card-moment>.durava-logo{font-size:24px}}
@media(max-height:420px){.last-card-moment{padding:10px 18px;gap:8px}.last-card-story{display:grid;grid-template-columns:90px minmax(0,1fr);grid-template-rows:auto auto auto;align-content:center;justify-items:center;gap:8px 14px;max-width:470px}.last-card-hero{grid-column:1;grid-row:1/5;width:90px;height:133px}.last-card-hero>.card{--card-w:64px!important;height:96px}.last-card-hero>span{font-size:16px}.last-card-story>.moment-eyebrow,.last-card-story>h1,.last-card-copy,.last-card-story>.match-summary{grid-column:2}.last-card-moment h1{font-size:28px}.last-card-moment .moment-bottom{max-width:330px}}
@media(max-width:350px) and (min-height:421px) and (max-height:650px){.moment-intro h1{font-size:clamp(27px,9vw,31px);letter-spacing:-.8px}.moment-intro .moment-note{font-size:12px;line-height:17px}.moment-fan{width:170px;height:117px}.moment-fan>.card{--card-w:62px!important;height:93px;left:54px}.moment-fan>.card:nth-child(1){transform:translate(-31px,9px) rotate(-19deg)}.moment-fan>.card:nth-child(2){transform:translate(31px,9px) rotate(19deg)}.moment-story{gap:8px}.moment-matchup{padding:8px 0}.moment-bottom>p{font-size:10px;line-height:13px}}
