*{box-sizing:border-box;font-family:Arial,sans-serif}
body{margin:0;background:#fff;color:#333}

/* header */
header{
 display:flex;justify-content:space-between;align-items:center;
 padding:15px 25px;border-bottom:1px solid #eee;
 position:relative;
}
header h1{color:#e53935;margin:0}
.balance{font-weight:bold;color:#e53935;margin-right:15px}
.btn{padding:10px 18px;border:none;border-radius:8px;cursor:pointer;font-weight:bold}
.btn-red{background:#e53935;color:#fff}

/* profile dropdown */
.profile{
 position:relative;
 display:flex;align-items:center;
}
.profile img{
 width:40px;height:40px;border-radius:50%;cursor:pointer;margin-right:10px;object-fit:cover;
}
.menu{
 display:none;position:absolute;right:0;top:50px;background:#222;width:180px;border-radius:8px;
}
.menu button{
 width:100%;background:none;border:none;color:white;padding:10px;text-align:left;cursor:pointer;
}
.menu button:hover{background:#333}

/* layout */
.container{max-width:1100px;margin:30px auto;padding:0 20px}
.app-card{border:1px solid #eee;border-radius:16px;padding:20px}

/* plans */
.plans{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
 gap:20px;margin-top:20px
}
.plan{
 border:1px solid #eee;border-radius:16px;
 padding:20px;text-align:center
}
.plan h3{color:#e53935}

/* info cards */
.cards{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
 gap:20px;margin-top:40px
}
.card{
 background:#fff5f5;border:1px solid #ffd6d6;
 padding:20px;border-radius:16px
}

/* modal */
.modal{
 display:none;position:fixed;inset:0;
 background:rgba(0,0,0,.4);
 justify-content:center;align-items:center
}
.modal-box{
 background:#fff;width:90%;max-width:420px;
 border-radius:20px;padding:25px;
 animation:pop .3s ease
}
@keyframes pop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
.modal-box img{width:70px;margin:auto;display:block}

/* support */
.support{
 position:fixed;right:20px;bottom:20px;
 background:#e53935;color:#fff;
 padding:12px 16px;border-radius:50px;
 text-decoration:none;font-weight:bold
}

/* auth */
.auth{text-align:center;margin-top:60px}
.auth input{width:100%;max-width:300px;padding:10px;margin:8px}
.hidden{display:none}