.settings-icon-btn{
  position:absolute;z-index:25;right:max(22px,env(safe-area-inset-right));top:max(20px,env(safe-area-inset-top));
  width:46px;height:46px;border-radius:14px;border:1px solid rgba(170,195,255,.22);
  color:#e9f4ff;background:linear-gradient(145deg,rgba(25,35,70,.82),rgba(6,10,25,.82));
  box-shadow:0 12px 32px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.08);cursor:pointer;font-size:19px;
}
.settings-icon-btn:hover{transform:translateY(-2px);border-color:rgba(124,232,255,.55);box-shadow:0 0 24px rgba(124,232,255,.13)}
.settings-overlay{z-index:80;background:radial-gradient(circle,rgba(38,48,95,.68),rgba(2,4,12,.94));}
.settings-modal{width:min(520px,92vw);border-radius:24px;padding:24px;}
.settings-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.settings-heading h2{margin:0;font:38px/1 "Black Han Sans",sans-serif}
.settings-heading button{width:38px;height:38px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;font-size:24px}
.settings-row{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 4px;border-bottom:1px solid rgba(255,255,255,.07);color:#dbe4ff;font-size:13px;font-weight:700;cursor:pointer}
.settings-row input{position:absolute;opacity:0;pointer-events:none}
.settings-row i{position:relative;width:48px;height:27px;flex:0 0 auto;border-radius:99px;background:rgba(255,255,255,.10);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:.18s}
.settings-row i:after{content:"";position:absolute;left:4px;top:4px;width:19px;height:19px;border-radius:50%;background:#aeb7d2;transition:.18s;box-shadow:0 3px 8px rgba(0,0,0,.35)}
.settings-row input:checked+i{background:linear-gradient(90deg,#6adfff,#9e79ff);box-shadow:0 0 16px rgba(124,232,255,.22)}
.settings-row input:checked+i:after{left:25px;background:#fff}
.select-row{cursor:default}.select-row select{min-width:160px;padding:10px 12px;border-radius:11px;border:1px solid rgba(255,255,255,.13);background:#10172f;color:#f4f7ff;font:inherit;outline:none}
.settings-modal>.primary-btn{margin-top:20px}

#menu{gap:clamp(18px,3vh,32px)}
.brand-wrap{margin-bottom:2px}
.menu-panel{width:min(1080px,95vw)}
.starter-options{grid-template-columns:repeat(auto-fit,minmax(108px,1fr));}
.starter-option{height:82px}
.resonance-preview span{display:block;margin-top:5px;color:#9faacb;line-height:1.45}
.choice-card{min-height:282px}

@media(max-width:850px){
  .starter-options{grid-template-columns:repeat(4,minmax(0,1fr));max-height:170px;overflow-y:auto;padding-right:3px}
  .starter-option{height:72px}
  .settings-icon-btn{width:42px;height:42px;right:14px;top:14px}
}
@media(max-width:560px){
  #menu{justify-content:flex-start;overflow-y:auto;padding-top:74px}
  #title{font-size:clamp(54px,19vw,86px)}
  .menu-panel{padding:14px}
  .starter-options{grid-template-columns:repeat(3,minmax(0,1fr));max-height:225px}
  .starter-head p{font-size:11px}
  .settings-modal{padding:20px}
  .settings-heading h2{font-size:31px}
  .select-row select{min-width:130px}
}
@media(max-height:680px) and (min-width:700px){
  #menu{justify-content:flex-start;overflow-y:auto;padding-top:28px;gap:14px}
  #title{font-size:clamp(58px,13vh,92px)}
  .menu-panel{padding:14px}
  .starter-options{margin-bottom:10px}
  .starter-option{height:67px}
  .primary-btn{min-height:52px}
}