/* Mascot welcome screen, scoped away from the coaching application's forms. */
#welcomePortalScreen.welcome-overlay{
 background:radial-gradient(ellipse at 12% 10%,#e0f8ec,transparent 65%),radial-gradient(ellipse at 90% 90%,#ede5ff,transparent 60%),#f0faf8;
 padding:24px 16px calc(24px + env(safe-area-inset-bottom,0px));overflow-y:auto;height:100%;min-height:100dvh;
 align-items:center;font-family:Nunito,'Segoe UI',system-ui,sans-serif;color:#164f60;
}
#welcomePortalScreen *{box-sizing:border-box;font-family:inherit}
#welcomePortalScreen .welcome-container{max-width:540px;width:100%;margin:auto;padding:26px 24px 28px;background:#ffffffed;border:2px solid #fff;border-radius:32px;backdrop-filter:none;box-shadow:0 8px 0 #dceee9,0 20px 48px #255e6115;text-align:center}
#welcomePortalScreen .welcome-badge{margin:0 0 10px;padding:7px 14px;background:#e6f6f2;color:#28746d;border:1px solid #d2ebe3;font-size:11px;font-weight:800;line-height:1.4}
#welcomePortalScreen .welcome-mascot{display:block;width:138px;height:150px;object-fit:contain;margin:0 auto 2px;animation:dmPortalWave 4s ease-in-out infinite}
#welcomePortalScreen .welcome-title{margin:0 0 6px;font-size:38px;line-height:1.15;font-weight:900;color:#104b5b;letter-spacing:-1px}
#welcomePortalScreen .welcome-title span{color:#069ca8}
#welcomePortalScreen .welcome-subtitle{max-width:340px;margin:0 auto;color:#64808a;font-size:14px;line-height:1.5;font-weight:500}
#welcomePortalScreen .welcome-prompt{font-size:16px;font-weight:800;color:#164f60;margin:20px 0 12px}
#welcomePortalScreen .welcome-card-grid{display:grid;grid-template-columns:1fr;gap:16px}
#welcomePortalScreen .welcome-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px 14px;align-items:center;position:relative;min-width:0;padding:16px;border:2px solid #fff;border-radius:24px;text-align:left;text-decoration:none;box-shadow:0 4px 0 var(--edge),0 8px 15px #366c6b10;transition:transform .15s,box-shadow .15s;background:var(--panel);color:#164f60}
#welcomePortalScreen .card-english{--panel:#dff6ef;--edge:#b7dfd1;--cta:#087f87}
#welcomePortalScreen .card-coach{--panel:#eee5ff;--edge:#d2c0ed;--cta:#7850a0}
#welcomePortalScreen .welcome-card-icon{height:64px;width:64px;padding:0;background:transparent;border-radius:0;display:block;background-image:url('ingilizce/bottom-nav-icons-v2.png');background-repeat:no-repeat;background-size:300% 300%}
#welcomePortalScreen .welcome-card-icon.ing{background-color:transparent;background-size:300% 300%;background-position:50% 56%}
#welcomePortalScreen .welcome-card-icon.koc{background-color:transparent;background-position:100% 0%}
#welcomePortalScreen .welcome-card-body{min-width:0}
#welcomePortalScreen .welcome-card-body h3{font-size:20px;line-height:1.2;font-weight:900;color:#164f60;margin:0 0 5px}
#welcomePortalScreen .welcome-card-body p{font-size:12px;line-height:1.5;font-weight:500;color:#58757e;margin:0}
#welcomePortalScreen .welcome-card-arrow{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:6px;margin:4px 0 0;min-height:42px;padding:9px 16px;border-radius:13px;background:var(--cta);color:#fff;font-size:14px;font-weight:800;white-space:normal;box-shadow:inset 0 1px 0 #ffffff20}
#welcomePortalScreen .welcome-card:hover{transform:translateY(-2px);background:var(--panel);box-shadow:0 6px 0 var(--edge),0 10px 18px #366c6b15}
#welcomePortalScreen .welcome-card:active{transform:translateY(3px);box-shadow:0 1px 0 var(--edge)}
#welcomePortalScreen .welcome-card:focus-visible{outline:3px solid #0697a0;outline-offset:4px}
@keyframes dmPortalWave{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}}
@media(max-width:370px){#welcomePortalScreen.welcome-overlay{padding:16px 12px}#welcomePortalScreen .welcome-container{padding:20px 16px}#welcomePortalScreen .welcome-mascot{width:112px;height:120px}#welcomePortalScreen .welcome-title{font-size:34px}#welcomePortalScreen .welcome-card{grid-template-columns:54px minmax(0,1fr);padding:14px;gap:8px 10px}#welcomePortalScreen .welcome-card-icon{width:54px;height:54px}#welcomePortalScreen .welcome-card-body h3{font-size:18px}}
@media(max-height:720px){#welcomePortalScreen .welcome-mascot{width:100px;height:106px}#welcomePortalScreen .welcome-container{padding-top:18px}#welcomePortalScreen .welcome-prompt{margin-top:14px}}
@media(prefers-reduced-motion:reduce){#welcomePortalScreen .welcome-mascot{animation:none}#welcomePortalScreen .welcome-card{transition:none}}