.topbar{
  background:#000;
}

.logo{
  width:198px;
  height:66px;
  padding:7px 12px;
  background:#000;
}

.icon-btn{
  width:46px;
  height:46px;
  padding:0;
  display:grid;
  place-items:center;
  color:var(--text);
  background:#0b0e0b;
  border-color:#343a32;
  box-shadow:inset 0 0 0 1px #ffffff05;
}

.icon-btn svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.icon-btn i{
  top:3px;
  right:3px;
  width:9px;
  height:9px;
  box-shadow:0 0 0 3px var(--void);
}

@media(max-width:760px){
  .logo{
    width:150px;
    height:54px;
    padding:5px 10px;
  }
}

.history-booking{
  display:grid;
  grid-template-columns:120px 1fr auto auto;
  gap:18px;
  align-items:center;
  padding:20px;
  border:1px solid var(--border);
  border-radius:20px;
  background:linear-gradient(145deg,#111510,#0a0c0a);
}

.history-booking img{width:120px;height:90px;object-fit:cover;border-radius:13px}.history-booking h3{margin:0 0 5px}.history-booking p{margin:0;color:var(--muted)}.history-booking small{display:block;color:var(--green);margin-top:8px}
.notification-filter{display:flex;gap:8px;overflow:auto;margin-bottom:16px}.notification-filter button{padding:9px 15px;border:1px solid var(--border);border-radius:999px;background:var(--carbon);color:var(--muted)}.notification-filter button.active{color:var(--void);background:var(--lime);border-color:var(--lime);font-weight:800}
.premium-notifications{display:grid;gap:10px}.premium-notifications article{border:1px solid var(--border);border-radius:17px!important;background:linear-gradient(145deg,#111510,#0a0c0a);padding:20px}.premium-notifications article.unread{border-color:#bffc0844;background:linear-gradient(90deg,#bffc080b,#0a0c0a)}.premium-notifications article>button{border:0;background:transparent;color:var(--muted)}.premium-notifications .notif-icon{width:48px;height:48px}.notif-icon.booking{color:var(--green);background:#38d77d12}.notif-icon.match{color:var(--lime)}.notif-icon.spot{color:var(--amber);background:#ffb84a12}.notif-icon.wallet{color:#8eb8ff;background:#438cff14}
.profile-actions,.photo-settings>div:last-child,.confirm-actions{display:flex;gap:10px;flex-wrap:wrap}.photo-settings{display:flex;align-items:center;gap:22px}.profile-photo.mini{width:95px;height:95px;position:relative;overflow:hidden;flex:none}.profile-photo.mini span{position:relative;z-index:2}.profile-photo.has-photo::before{content:"";position:absolute;inset:0;background-image:var(--profile-img);background-position:var(--profile-x) var(--profile-y);background-size:cover;background-repeat:no-repeat;transform:scale(var(--profile-zoom))}.confirm-dialog{text-align:center}.confirm-icon{width:62px;height:62px;border-radius:50%;margin:0 auto 16px;display:grid;place-items:center;background:#bffc0812;border:1px solid #bffc0844;color:var(--lime);font-size:28px}.danger-icon{color:var(--red);background:#ff5a5f12;border-color:#ff5a5f44}.confirm-actions{justify-content:center;margin-top:22px}.confirm-check{display:flex!important;grid-template-columns:none!important;align-items:center;justify-content:center;gap:9px!important;padding:12px;border:1px solid var(--border);border-radius:12px}.confirm-check input{accent-color:var(--red)}button:disabled{opacity:.4;cursor:not-allowed;transform:none!important}
.rules-admin-grid{display:grid;gap:18px}.rule-admin-row{display:grid;grid-template-columns:32px 38px 1fr repeat(4,auto);gap:10px;align-items:center;padding:14px 0;border-bottom:1px solid #ffffff0d}.rule-admin-row p{margin:0;color:var(--secondary)}.rule-admin-row>button{border:1px solid var(--border);background:#0a0c0a;color:var(--secondary);border-radius:8px;padding:7px 9px}.rule-admin-row>button.danger-text{color:var(--red)}.drag-handle{color:var(--muted);letter-spacing:-3px}.modal textarea{min-height:130px;resize:vertical;background:#090b09;border:1px solid var(--border);border-radius:12px;color:var(--text);padding:14px}

@media(max-width:760px){
  .history-booking{grid-template-columns:85px 1fr;gap:12px}.history-booking img{width:85px;height:80px}.history-booking .badge{grid-column:1}.history-booking .btn{grid-column:2}
  .premium-notifications article{grid-template-columns:48px 1fr auto}.premium-notifications article>small{display:none}
  .photo-settings{align-items:flex-start;flex-direction:column}
  .rule-admin-row{grid-template-columns:25px 30px 1fr}.rule-admin-row>button{grid-row:2}.rule-admin-row>button:nth-of-type(1){grid-column:2}.rule-admin-row>button:nth-of-type(2){grid-column:3}.rule-admin-row>button:nth-of-type(3){grid-column:2}.rule-admin-row>button:nth-of-type(4){grid-column:3}
}

.home-hero{
  background-image:none;
}

.home-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background-image:linear-gradient(90deg,#05060515,#050605e8 73%),linear-gradient(0deg,#050605 0%,transparent 65%),var(--home-img);
  background-position:center,center,var(--home-x) var(--home-y);
  background-size:auto,auto,cover;
  background-repeat:no-repeat;
  transform:scale(var(--home-zoom));
  transition:transform .25s ease;
}

.home-hero .hero-copy,.home-hero .hero-rail{
  z-index:2;
}

.benefits-section .section-head{
  justify-content:center;
  text-align:center;
}

.benefits div{
  text-align:center;
}

.green-card{
  overflow:hidden;
  display:grid;
  grid-template-columns:42% 1fr;
  gap:20px;
  align-items:stretch;
}

.green-card .card-photo{
  border-radius:17px;
  background-image:linear-gradient(#0001,#0005),var(--card-img);
  background-position:center,var(--card-x) var(--card-y);
  background-size:auto,cover;
  transform:scale(var(--card-zoom));
  transform-origin:center;
}

.green-card .card-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  z-index:2;
}

.green-card .card-copy small{
  margin-bottom:auto;
}

.editable-photo{
  position:relative;
  overflow:hidden;
  flex:none;
  padding:0;
  color:var(--text);
  transform:translateY(-24px);
}

.editable-photo>span{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
}

.editable-photo.has-photo::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--profile-img);
  background-position:var(--profile-x) var(--profile-y);
  background-size:cover;
  background-repeat:no-repeat;
  transform:scale(var(--profile-zoom));
}

.editable-photo>i{
  position:absolute;
  z-index:3;
  left:5px;
  bottom:5px;
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#0b0e0b;
  border:1px solid var(--border);
  font-style:normal;
  font-size:15px;
}

.media-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

.media-control{
  padding:20px;
  border:1px solid var(--border);
  border-radius:18px;
  background:var(--carbon);
}

.media-control h3{margin:18px 0 5px}.media-control p{color:var(--muted);min-height:42px}.media-control .btn{margin-right:6px}
.media-preview{height:230px;border-radius:14px;border:1px solid var(--border);background-image:var(--media-img);background-position:var(--media-x) var(--media-y);background-size:cover;background-repeat:no-repeat;transform:translateZ(0)}
.media-preview.greenCard{height:180px;background-color:var(--lime);background-blend-mode:multiply}.crop-modal{width:min(640px,100%)}
.crop-stage{height:330px;overflow:hidden;border:2px solid var(--lime);border-radius:18px;background-image:var(--crop-img);background-position:var(--cx) var(--cy);background-size:cover;background-repeat:no-repeat;transform:translateZ(0);cursor:grab;touch-action:none}
.crop-stage:active{cursor:grabbing}.crop-stage.circle{width:300px;height:300px;border-radius:50%;margin:auto}.crop-stage.card{height:270px}.crop-stage{background-size:calc(100% * var(--cz)) auto}.zoom-label{display:grid!important;grid-template-columns:auto 1fr;align-items:center;gap:14px}.zoom-label input{accent-color:var(--lime);padding:0!important}.results-bar .text-btn{display:flex;align-items:center;gap:7px}

@media(max-width:760px){
  .home-hero::after{background-image:linear-gradient(0deg,#050605 3%,#05060544 55%,#05060555),var(--home-img);background-position:center,var(--home-x) var(--home-y);background-size:auto,cover}
  .green-card{grid-template-columns:40% 1fr;gap:12px;padding:22px}
  .green-card .card-copy b{font-size:27px}
  .media-grid{grid-template-columns:1fr}
  .crop-stage{height:270px}
  .crop-stage.circle{width:240px;height:240px}
}
