/* Reset & Basics */
    * { margin:0; padding:0; box-sizing:border-box; font-family: 'Segoe UI', Tahoma, sans-serif; }
    body { background: #0d1117; color: #fff; line-height: 1.5; }

    /* Header */
    /* -------- Header -------- */
    header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px 5px;
      background: rgba(22, 27, 34, 0.85);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(240, 185, 11, 0.2);
      box-shadow: 0 4px 8px rgba(0,0,0,0.85);
      position: sticky;
      top: 0;
      z-index: 10;
    }

    header h1 {
      color: #f0b90b;
      margin: 0;
      font-size: 22px;
      letter-spacing: 0.5px;
    }

    nav a {
      margin: 0 12px;
      color: #ccc;
      text-decoration: none;
      font-weight: 500;
      font-size: 14px;
      transition: color 0.3s ease;
    }

    nav a:hover {
      color: #f0b90b;
      text-shadow: 0 0 6px #f0b90b;
    }

    /* Section Wrapper */
    .section { max-width:700px; margin:25px auto; display:grid; gap:25px; }

    /* Sell Box */
    .sell-box { background: rgba(22,27,34,0.9); border-radius:15px; padding:25px; border:1px solid #333; box-shadow:0 0 15px rgba(240,185,11,0.2); transition:0.3s; }
    .sell-box:hover { box-shadow:0 0 25px rgba(240,185,11,0.4); }
    .price { font-size:20px; font-weight:bold; color:#f0b90b; margin-bottom:8px; }
    .fee { font-size:13px; color:#aaa; margin-bottom:15px; }

    .input-group { display:flex; align-items:center; border:1px solid #333; padding:12px 10px; border-radius:10px; margin-bottom:10px; background: rgba(30,36,45,0.8);}
    .input-group input { width:70%; background:transparent; border:none; outline:none; color:#fff; font-size:16px; }
    .input-group span { margin-left:5px; color:#f0b90b; cursor:pointer; font-weight:600; }

    .error { color:#f6465d; font-size:13px; margin-bottom:5px; }
    .balance, .orderLimits { font-size:12px; color:#bbb; margin-bottom:4px; }

    .receive-box { background: rgba(30,36,45,0.8); padding:12px; border-radius:10px; margin:15px 0; font-weight:bold; color:#f0b90b; display:flex; align-items:center; justify-content:space-between; }
    
    select.payment-select { width:100%; padding:12px; border:none; border-radius:10px; background: rgba(30,36,45,0.8); color:#fff; margin:10px 0; cursor:pointer; }
    select.payment-select option { background:#161b22; color:#fff; }

    .actions { display:flex; justify-content:space-between; margin-top:20px; }
    .btn-cancel, .btn-sell { padding:12px 20px; border-radius:8px; font-weight:bold; border:none; cursor:pointer; transition:0.3s; }
    .btn-cancel { background:#333; color:#ccc; }
    .btn-cancel:hover { background:#444; }
    .btn-sell { background:#f6465d; color:#fff; }
    .btn-sell:hover { box-shadow: 0 0 10px #f6465d; }

    .btn-sell:disabled { background:#3a3a3a; color:#777; cursor:not-allowed; box-shadow:none; }

    /* Buyer Box */
    .buyer-box { background: rgba(22,27,34,0.9); border-radius:15px; padding:20px; border:1px solid #333; box-shadow:0 0 15px rgba(240,185,11,0.2);}
    .buyer-header { display:flex; align-items:center; margin-bottom:15px; }
    .buyer-header img { width:50px; height:50px; border-radius:50%; margin-right:10px; object-fit:cover; border:2px solid #f0b90b; }
    .buyer-header h3 { color:#f0b90b; margin-right:8px; }
    .buyer-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; font-size:14px; margin-bottom:15px; }
    .buyer-stats div { display:flex; justify-content:space-between; }
    .buyer-terms { background: rgba(30,36,45,0.8); border-radius:10px; padding:12px; font-size:13px; color:#ccc; }
    .badge { background:#f0b90b; color:#000; font-size:11px; padding:3px 6px; border-radius:4px; margin-right:5px; }

    /* Footer */
    footer { text-align:center; margin-top:25px; padding:15px; font-size:12px; color:#888; border-top:1px solid #333; }

    /* Wallet Popup */
    .popup { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.85); display:flex; justify-content:center; align-items:center; }
    .popup-content { background:#161b22; padding:25px; border-radius:15px; text-align:center; width:320px; box-shadow:0 0 20px rgba(240,185,11,0.3); }
    .popup-content h3 { color:#f0b90b; margin-bottom:15px; }
    .popup-content button { background:#f0b90b; border:none; padding:10px 20px; border-radius:8px; font-weight:bold; cursor:pointer; transition:0.3s; }
    .popup-content button:hover { box-shadow:0 0 15px #f0b90b; }

    /* Animations */
    @keyframes glow { 0%,100%{ box-shadow:0 0 10px #f0b90b; } 50%{ box-shadow:0 0 25px #f0b90b; } }

    @media(max-width: 720px) {
      header h1 { font-size: 18px; }
      nav a { font-size: 12px; margin: 0 6px; }
      .hero h2 { font-size: 24px; }
      .hero p { font-size: 13px; }
      .order { padding: 14px; }
      .order-header strong { font-size: 14px; }
      .order-price { font-size: 17px; }
      .btn-sell { font-size: 11px; padding: 7px 12px; }
    }