*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Inter',sans-serif;background:#080808;min-height:100vh;color:#fff;overflow-x:hidden;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;}
html{touch-action:manipulation;}

/* ===== TAB BAR ===== */
.tab-bar{display:flex;align-items:center;background:rgba(10,10,10,0.97);padding:0;border-bottom:1px solid rgba(255,51,51,0.1);backdrop-filter:blur(24px);position:sticky;top:0;z-index:100;gap:2px;}
.tab{display:flex;align-items:center;gap:.55rem;padding:.85rem 1.3rem;cursor:pointer;transition:all .3s;position:relative;border:none;background:none;user-select:none;text-decoration:none;-webkit-tap-highlight-color:transparent;}
.tab::after{content:'';position:absolute;bottom:0;left:50%;width:0;height:2.5px;background:linear-gradient(90deg,#ff3333,#ff5544);transition:all .3s;transform:translateX(-50%);border-radius:2px 2px 0 0;}
.tab:hover{background:rgba(255,51,51,0.04);}
.tab:hover::after{width:50%;}
.tab.active{background:rgba(255,51,51,0.06);}
.tab.active::after{width:100%;height:3px;box-shadow:0 0 14px rgba(255,51,51,0.5);}
.tab-icon{width:18px;height:18px;flex-shrink:0;opacity:.4;transition:all .3s;}
.tab.active .tab-icon{opacity:1;filter:drop-shadow(0 0 6px rgba(255,51,51,0.5));}
.tab-title{font-size:.82rem;color:#555;font-weight:500;transition:all .3s;white-space:nowrap;}
.tab:hover .tab-title{color:#888;}
.tab.active .tab-title{color:#fff;font-weight:700;}

/* ===== PAGE ===== */
.page-content{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 50px);padding:2rem;}

/* ===== COPY NOTIFICATION ===== */
.copy-notification{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);background:rgba(255,51,51,0.12);border:2px solid rgba(255,51,51,0.4);color:#fff;padding:1.5rem 3rem;border-radius:16px;font-size:1.1rem;font-weight:700;box-shadow:0 20px 60px rgba(255,51,51,0.3);z-index:1000;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);pointer-events:none;backdrop-filter:blur(20px);}
.copy-notification.show{transform:translate(-50%,-50%) scale(1);}
.copy-notification::before{content:'✓';margin-right:.75rem;font-size:1.3rem;}

/* ===== PAGE SUBTITLE ===== */
.page-subtitle{color:#ff3333;margin-bottom:2rem;font-size:2.2rem;font-weight:900;}

/* ===== MOBILE ===== */
@media(max-width:768px){
  .tab-bar{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .tab-bar::-webkit-scrollbar{display:none;}
  .tab-title{font-size:.7rem;}
  .tab{padding:.6rem .65rem;gap:.25rem;flex-shrink:0;}
  .tab-icon{width:15px;height:15px;}
  .page-content{padding:1rem .75rem;}
  .page-subtitle{font-size:1.6rem;}
}
@media(max-width:400px){
  .tab{padding:.55rem .5rem;}
  .tab-title{font-size:.65rem;}
}