/* The title is a playable arcade entrance, not a records dashboard. */
#overlay>.titleCard{padding:16px 24px 22px !important;max-width:440px !important;width:min(calc(100% - 24px),440px) !important;}
.titleCard .titleIdentity{position:relative;display:block;min-height:234px;padding:180px 0 12px;text-align:center;}
.titleStage{position:absolute;left:0;top:8px;width:100%;height:174px;pointer-events:none;}
.titleCard .spinpopTitle{font-size:46px !important;font-weight:950;line-height:1.08;text-align:center;color:#f3f4ee !important;}
.titleCard .spinpopSub{font-size:11px !important;color:#96b4b1;margin-top:5px;}
.titleCard .titleSettingsBtn{top:25px;right:24px;width:34px;height:34px;display:grid;place-items:center;background:#172026;border:1px solid #3b474b;border-radius:8px;}
.titleSettingsBtn img,.menuBtn img{width:20px;height:20px;filter:invert(91%) sepia(9%) saturate(225%) hue-rotate(105deg);}
.titleCard .statGrid{border-top:0;border-bottom:0;margin:0 0 16px;padding:6px 0;}
.titleCard .statBox{padding:0 12px;text-align:center;}
.titleCard .statBox:first-child{padding-left:12px;}
.titleCard .statBox .k{font-size:10px !important;line-height:1.5 !important;color:#a2b3b0;}
.titleCard .statBox .v{font-size:23px;color:#edf3ed;}
.titleCard .statBox .v{overflow-wrap:anywhere;font-variant-numeric:tabular-nums;}
.titleCard .statBox+.statBox{border-left:1px solid #303b3c;}
.titleCard .titleStartBlock{margin-bottom:16px;}
.titleCard .titleStartBtn{height:58px;display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(115deg,#ccf5cc,#83dfc4 58%,#a5edcf) !important;border:1px solid #dcf9d4;border-bottom-color:#65ba9b;color:#173b34;font-size:22px;line-height:1;box-shadow:inset 0 1px 0 #f7fff8a3,inset 0 -1px 0 #286e6526,0 3px 0 #346f62,0 8px 20px #4ed5b324;transition:transform .12s,box-shadow .12s,border-color .12s;}
.titleStartMark{display:grid;place-items:center;flex:none;width:26px;height:30px;}
.titleStartBtn img{display:block;width:22px;height:22px;filter:invert(17%) sepia(19%) saturate(1069%) hue-rotate(111deg);}
.titleCard .titleStartBtn>span{position:relative;z-index:1;}
#overlay>.titleCard .titleStartBtn::before{content:"";display:block;position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#d6ffde80,transparent 65%);box-shadow:inset 0 0 0 1px #efffe6;opacity:.12;animation:spinpopStartCharge 3.6s ease-in-out .35s infinite;}
#overlay>.titleCard .titleStartBtn::after{content:"";display:block;position:absolute;inset:0 auto 0 0;width:44%;pointer-events:none;background:linear-gradient(110deg,transparent 8%,#ffffff1a 27%,#faffefed 47%,#ffffffa3 53%,#ffffff15 74%,transparent 92%);opacity:0;transform:translateX(-180%) skewX(-15deg);animation:spinpopStartGlint 3.6s ease-in-out .35s infinite;}
.titleStartMark img{animation:spinpopStartCue 3.6s ease-in-out .35s infinite;}
@keyframes spinpopStartGlint{0%{transform:translateX(-180%) skewX(-15deg);opacity:0}5%{opacity:.82}28%{transform:translateX(345%) skewX(-15deg);opacity:.82}34%,100%{transform:translateX(345%) skewX(-15deg);opacity:0}}
@keyframes spinpopStartCharge{0%,36%,100%{opacity:.12}14%{opacity:.65}}
@keyframes spinpopStartCue{0%,7%,32%,100%{transform:translateX(0)}17%{transform:translateX(3px)}}
.titleCard .titleStartBtn:hover{background:linear-gradient(115deg,#c2f5df,#99e3d2 58%,#b1ecdb) !important;border-color:#e1f7e8;}
.titleCard .titleStartBtn:active{transform:translateY(2px);box-shadow:inset 0 2px 5px #21584e24,0 1px 0 #346f62;}
body.spReducedFx #overlay>.titleCard .titleStartBtn::before,body.spReducedFx #overlay>.titleCard .titleStartBtn::after{display:none;animation:none;}
body.spReducedFx .titleStartMark img{animation:none;}
.titleCard .weekdayMissionPanel{border:0 !important;border-left:3px solid #98d6c9 !important;border-top:1px solid #30413d !important;border-bottom:1px solid #30413d !important;border-radius:0 !important;background:#15201e !important;padding:0 !important;margin-bottom:14px !important;min-height:58px;}
.titleCard .weekdayMissionPanel.locked{border-left-color:#727d77 !important;background:#151c1b !important;}
.titleCard .weekdayMissionPanel.locked{min-height:58px;}
.titleCard .weekdayMissionRow{display:grid;grid-template-columns:minmax(0,1fr) 72px 86px;gap:8px;min-height:56px;padding:8px 10px;}
.titleCard .weekdayMissionMain{min-width:0;}
.titleCard .weekdayMissionName{font-size:12px;line-height:1.25;white-space:normal;overflow:visible;}
.titleCard .weekdayMissionRank,.titleCard .weekdayMissionGo{min-width:0;min-height:38px;width:100%;border-radius:6px;padding:4px 6px;box-shadow:none;}
.titleCard .weekdayMissionRank{display:flex;flex-direction:column;align-items:center;justify-content:center;}
.titleCard .weekdayMissionGo{white-space:normal;overflow:visible;font-size:10px;line-height:1.2;overflow-wrap:anywhere;}
.titleCard .metaRow{grid-template-columns:minmax(0,1fr) minmax(0,1.18fr);gap:16px;margin:0 0 14px;padding:10px 0;border-top:0;border-bottom:1px solid #293637;}
.titleCard .metaMini{min-height:60px;padding:0;}
.titleCard .metaMini+.metaMini{border-left:0;padding-left:0;}
.titleCard .pointsMini{justify-content:flex-start;}
.titleCard .metaMini .k{font-size:10px;color:#a2b3b0;}
.titleCard .pointsMini .v{font-size:23px;color:#f0ca95;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;}
.titleCard .totalEarned{color:#82908e !important;}
.titleCard .titleSkinMini{display:grid;grid-template-columns:minmax(0,1fr) 48px;grid-template-rows:auto 1fr;column-gap:10px;align-items:start;}
.titleCard .titleSkinMini>.k{grid-column:1;grid-row:1;}
.titleCard .titleSkinSummary{display:contents;}
#overlay>.titleCard .titleSkinMini .skinPreview{grid-column:2;grid-row:1 / span 2;width:48px !important;height:48px !important;min-width:48px !important;max-width:48px !important;min-height:48px !important;max-height:48px !important;justify-self:end;align-self:center;}
.titleCard .titleSkinDetails{grid-column:1;grid-row:2;min-width:0;margin-top:4px;}
.titleCard .titleSkinMini .v{font-size:14px !important;line-height:1.2 !important;overflow-wrap:anywhere;}
.titleCard .titleSkinOwnedBonus{color:#b9ddce;white-space:normal;overflow-wrap:anywhere;}
.titleCard .titleSkinItemSpawn{color:#9fbcba;max-width:none;white-space:normal;overflow:visible;word-break:keep-all;overflow-wrap:anywhere;}
.titleCard .menuBtns{gap:8px;}
.titleCard .menuBtn{min-height:46px;gap:9px;background:#121b20 !important;border-color:#354447;color:#ccded6 !important;}
.titleCard .menuBtn .ico{display:flex;align-items:center;justify-content:center;}
.titleCard .menuBtn .txt{font-size:13px;}
.titleCard .menuBtn:hover{border-color:#8bb7ae;background:#1a292a !important;}
.titleCard .titleSkinMini:focus-visible,.titleCard .menuBtn:focus-visible{outline:2px solid #add4c9;outline-offset:3px;}
@media(max-width:350px){
  #overlay>.titleCard{padding:12px 16px 18px !important;}
  .titleCard .spinpopTitle{font-size:40px !important;}
  .titleCard .statBox .v{font-size:18px;}
  .titleCard .titleSettingsBtn{top:21px;right:16px;}
  .titleCard .weekdayMissionRow{grid-template-columns:minmax(0,1fr) 64px 78px;gap:6px;padding:8px;}
  .titleCard .metaRow{gap:12px;}
  .titleCard .pointsMini .v{font-size:20px;}
  .titleCard .metaMini{min-height:56px;}
  .titleCard .titleSkinMini{grid-template-columns:minmax(0,1fr) 44px;column-gap:8px;}
  #overlay>.titleCard .titleSkinMini .skinPreview{width:44px !important;height:44px !important;min-width:44px !important;max-width:44px !important;min-height:44px !important;max-height:44px !important;}
}
@media(max-height:700px){
  .titleCard .titleIdentity{min-height:184px;padding-top:135px;}
  .titleStage{height:130px;top:4px;}
  .titleCard .statGrid{margin-bottom:12px;}
  .titleCard .weekdayMissionPanel{margin-bottom:12px !important;}
  .titleCard .metaRow{margin-bottom:12px;padding:9px 0;}
}
@media(prefers-reduced-motion:reduce){.titleCard .titleStartBtn{transition:none;}#overlay>.titleCard .titleStartBtn::before,#overlay>.titleCard .titleStartBtn::after{display:none;animation:none;}.titleStartMark img{animation:none;}}
