.phase-selector{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;padding:.75rem;padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0px));margin-bottom:env(safe-area-inset-bottom,0px);background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.2);border-radius:.5rem;position:fixed;bottom:1rem;left:1rem;right:1rem}.phase-controls{gap:.5rem;display:flex}.phase-controls button{flex:1;padding:.5rem 1rem!important}@media (orientation:portrait){.phase-controls{grid-template-rows:repeat(2,1fr);grid-template-columns:1fr 1fr;gap:.5rem;height:auto;display:grid}.phase-controls button{flex:none;width:auto;padding:.75rem .5rem!important;font-size:.75rem!important}}@media screen and (max-height:700px),screen and (max-width:360px){.phase-selector{padding:.5rem;padding-bottom:calc(.5rem + env(safe-area-inset-bottom,0px));bottom:.5rem;left:.5rem;right:.5rem}.phase-controls button{padding:.5rem .25rem!important;font-size:.7rem!important}.phase-explanation{margin-top:.5rem!important;padding:.5rem!important;font-size:.75rem!important}}

.orientation-warning{z-index:10000;box-sizing:border-box;background-color:#000;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;margin:0;padding:2rem 1rem;display:flex;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}.orientation-content{text-align:center;box-sizing:border-box;flex-direction:column;flex-shrink:0;align-items:center;gap:1.5rem;width:100%;max-width:400px;padding:1rem;display:flex}.orientation-icon{background:rgba(255,255,255,.1);border:.125rem solid rgba(255,255,255,.3);border-radius:.75rem;justify-content:center;align-items:center;width:5rem;height:5rem;animation:2s ease-in-out infinite rotatePhone;display:flex}.phone-icon{background:0 0;border:.125rem solid #fff;border-radius:.5rem;width:2.5rem;height:3.75rem;position:relative}.phone-icon:before{content:"";background:#fff;border-radius:.0625rem;width:1.25rem;height:.125rem;position:absolute;top:.3125rem;left:50%;transform:translate(-50%)}.phone-icon:after{content:"";border:.125rem solid #fff;border-radius:50%;width:.75rem;height:.75rem;position:absolute;bottom:.3125rem;left:50%;transform:translate(-50%)}.orientation-title{color:#fff;text-shadow:0 0 10px rgba(255,255,255,.3);letter-spacing:.0625rem;text-transform:uppercase;margin:0;font-family:Nimbus,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:1.5rem;font-weight:700}.orientation-message{color:rgba(255,255,255,.8);margin:0;font-family:Nimbus,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:1rem;font-weight:300;line-height:1.6}.orientation-subtitle{color:rgba(255,255,255,.6);margin:-1rem 0 0;font-family:Nimbus,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:.8rem;font-weight:400}@keyframes rotatePhone{0%,to{transform:rotate(0)}25%{transform:rotate(-15deg)}75%{transform:rotate(15deg)}}@media screen and (max-height:500px){.orientation-content{gap:1.2rem;padding:.8rem}.orientation-title{font-size:1.3rem}.orientation-message{font-size:.9rem}.orientation-subtitle{margin-top:-.8rem;font-size:.7rem}}@media screen and (max-width:568px) and (orientation:landscape){.orientation-content{gap:1.2rem}.orientation-icon{width:3.75rem;height:3.75rem}.phone-icon{width:1.875rem;height:2.8125rem}.orientation-title{font-size:1.2rem}.orientation-message{font-size:.9rem}.orientation-subtitle{font-size:.7rem}}