/* ═══ SPLASH SCREEN ═══ */
#screen-splash{background:var(--earth);align-items:center;justify-content:flex-end}
.splash-bg{position:absolute;inset:0;background-image:url('splash.jpeg');background-size:cover;background-position:center top;opacity:0.55}
.splash-grain{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.08'/%3E%3C/svg%3E");opacity:0.4}
.splash-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,8,4,0.95) 0%,rgba(20,8,4,0.6) 50%,rgba(20,8,4,0.2) 100%)}
.splash-content{position:relative;z-index:2;padding:0 32px calc(56px + var(--safe-bottom));width:100%;text-align:left}
.splash-eyebrow{font-size:11px;letter-spacing:0.22em;text-transform:uppercase;color:var(--hay);margin-bottom:8px;font-weight:400;opacity:0;animation:fadeUp 0.8s ease 0.2s forwards}
.splash-barn{font-size:13px;color:rgba(255,255,255,0.5);font-weight:300;margin-bottom:6px;opacity:0;animation:fadeUp 0.8s ease 0.4s forwards;letter-spacing:0.06em}
.splash-title{font-family:'Cormorant Garamond',serif;font-size:64px;font-weight:300;color:var(--white);line-height:1;margin-bottom:8px;opacity:0;animation:fadeUp 0.8s ease 0.5s forwards}
.splash-title span{color:var(--hay);font-style:italic}
.splash-sub{font-size:14px;color:rgba(255,255,255,0.6);font-weight:300;margin-bottom:40px;opacity:0;animation:fadeUp 0.8s ease 0.7s forwards}
.splash-btn{display:block;width:100%;padding:18px;background:var(--hay);color:var(--earth);font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;border:none;cursor:pointer;border-radius:4px;opacity:0;animation:fadeUp 0.8s ease 0.9s forwards;transition:background 0.2s}
.splash-btn:active{background:var(--hay-light)}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* ═══ ROLE SELECT ═══ */
#screen-role{justify-content:center;align-items:center;padding:32px}
.role-logo{font-family:'Cormorant Garamond',serif;font-size:30px;color:var(--earth);text-align:center;margin-bottom:2px}
.role-logo span{color:var(--hay);font-style:italic}
.role-barn{font-size:12px;color:var(--text-muted);text-align:center;margin-bottom:6px;letter-spacing:0.06em}
.role-sub{font-size:13px;color:var(--text-muted);text-align:center;margin-bottom:28px}
.role-cards{display:flex;flex-direction:column;gap:10px;width:100%;max-width:340px}
.role-card{background:var(--white);border:1px solid var(--sand);border-radius:12px;padding:16px 20px;cursor:pointer;transition:all 0.15s;display:flex;align-items:center;gap:14px}
.role-card:active{background:var(--cream-dark)}
.role-card-icon{font-size:24px;flex-shrink:0}
.role-card-title{font-size:14px;font-weight:500;color:var(--earth)}
.role-card-desc{font-size:11px;color:var(--text-muted);margin-top:2px}
.role-back{margin-top:20px;background:none;border:none;color:var(--text-muted);font-size:12px;cursor:pointer;text-decoration:underline}

/* ═══ LOGIN SCREENS ═══ */
#screen-login-rider,#screen-login-parent,#screen-login-staff{justify-content:center;align-items:center;padding:32px}
#screen-login,#screen-reset-password{align-items:center;justify-content:center;padding:24px}
.login-card{width:100%;max-width:380px;text-align:center}
.login-logo{font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:300;color:var(--earth);margin-bottom:2px}
.login-logo span{color:var(--hay);font-style:italic}
.login-barn{font-size:11px;color:var(--text-muted);margin-bottom:28px;letter-spacing:0.06em}
.login-label{display:block;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px;text-align:left}
.login-input{width:100%;padding:14px 16px;border:1px solid var(--sand);border-radius:6px;font-family:'DM Sans',sans-serif;font-size:16px;color:var(--text);background:var(--white);outline:none;transition:border-color 0.2s;margin-bottom:16px}
.login-input:focus{border-color:var(--hay)}
.login-select{width:100%;padding:14px 16px;border:1px solid var(--sand);border-radius:6px;font-family:'DM Sans',sans-serif;font-size:16px;color:var(--text);background:var(--white);outline:none;margin-bottom:12px;appearance:none;-webkit-appearance:none}
.login-divider{font-size:12px;color:var(--text-muted);margin-bottom:12px}
.login-btn{width:100%;padding:16px;background:var(--earth);color:var(--white);border:none;border-radius:6px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;cursor:pointer;transition:background 0.2s;margin-bottom:12px}
.login-btn:active{background:var(--earth-mid)}
.login-back{background:none;border:none;color:var(--text-muted);font-size:12px;cursor:pointer;text-decoration:underline;margin-top:8px}
.login-demo-divider{font-size:11px;color:var(--text-muted);margin:4px 0 10px;text-align:center;letter-spacing:0.04em}
.login-demo-btn{width:100%;padding:12px;background:transparent;border:1px solid var(--border);color:var(--text-muted);border-radius:6px;font-family:'DM Sans',sans-serif;font-size:13px;cursor:pointer;margin-bottom:8px;transition:background 0.15s,color 0.15s}
.login-demo-btn:active{background:var(--surface-2);color:var(--text)}