html,body{margin:0;padding:0;height:100%;overflow:hidden;background-color:#000000;}body{font-family:'Inter',sans-serif;background-color:transparent;color:#d1d5db;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}.page-wrapper{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;position:relative;z-index:1;display:flex;flex-direction:column;}main{flex-grow:1;}.fixed-background-img{filter:blur(5px) brightness(40%);z-index:-10;position:fixed;top:0;left:0;width:100%;height:100%;object-fit:cover;}.btn-primary{background-color:#facc15;color:#000000;font-weight:600;padding:0.75rem 1.5rem;border-radius:0.5rem;transition:background-color 0.3s ease,transform 0.3s ease;}.btn-primary:hover{background-color:#f59e0b;transform:scale(1.02);}.btn-primary:disabled{opacity:0.5;cursor:not-allowed;transform:none;background-color:#6b7280;}
        .earn-money-btn{background:rgba(255,255,255,.08);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border:1px solid rgba(255,255,255,.25);box-shadow:inset 0 0 2px 1px rgba(255,255,255,.25),inset 0 0 10px 4px rgba(255,255,255,.1),0 8px 24px rgba(0,0,0,.3);color:rgba(255,255,255,.95);padding:0.75rem 1.5rem;border-radius:0.5rem;font-weight:600;text-decoration:none;transition:background 0.3s ease,transform 0.3s ease,box-shadow 0.3s ease;cursor:pointer;}
        .earn-money-btn i{color:rgba(255,255,255,.85);transition:color 0.3s ease;}
        .earn-money-btn:hover{background:rgba(255,255,255,.15);transform:translateY(-2px);box-shadow:inset 0 0 2px 1px rgba(255,255,255,.3),inset 0 0 12px 4px rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.4);}
        .earn-money-btn:hover i{color:#facc15;}
        .card{background-color:#111111;border-radius:0.75rem;border:1px solid #333333;}.quantity-btn{width:2rem;height:2rem;line-height:2rem;font-weight:bold;text-align:center;border-radius:0.25rem;background-color:#374151;color:#fff;transition:background-color 0.2s;cursor:pointer;}.quantity-btn:hover{background-color:#4b5563;}.quantity-btn.disabled{opacity:0.4;cursor:not-allowed;pointer-events:none;background-color:#1f2937;}.custom-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8);z-index:1000;align-items:center;justify-content:center;}.custom-modal.show{display:flex;}.modal-content{background-color:#111111;border:2px solid #facc15;border-radius:0.75rem;padding:2rem;max-width:400px;width:90%;text-align:center;box-shadow:0 0 20px rgba(250,204,21,0.3);}.modal-buttons{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem;}.modal-btn{padding:0.75rem 1.5rem;border-radius:0.5rem;font-weight:600;cursor:pointer;transition:all 0.3s ease;border:none;}.modal-btn.confirm{background-color:#ef4444;color:white;}.modal-btn.confirm:hover{background-color:#dc2626;transform:scale(1.05);}.modal-btn.cancel{background-color:#374151;color:white;}.modal-btn.cancel:hover{background-color:#4b5563;transform:scale(1.05);}.stock-warning{color:#ef4444;font-size:0.8rem;margin-top:4px;}.unavailable-badge{background:#7f1d1d;color:#fca5a5;font-size:0.7rem;padding:0.2rem 0.6rem;border-radius:1rem;margin-left:8px;}.stock-info{color:#9ca3af;font-size:0.75rem;margin-top:2px;}
        .summary-card {
            background-color: #111111;
            border: 1px solid #333333;
            border-radius: 0.75rem;
            position: relative;
            overflow: hidden;
        }
        .summary-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 4px;
            background: linear-gradient(90deg, #facc15, #f59e0b);
            opacity: 0.8;
        }
        .summary-card .header-icon {
            background: #1f1f1f;
            border-radius: 50%;
            width: 2.5rem;
            height: 2.5rem;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid #333333;
            color: #facc15;
        }
        .summary-card .total-box {
            background: #0f0f0f;
            border-radius: 0.5rem;
            padding: 0.75rem 1rem;
            border: 1px solid #2a2a2a;
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 0.5rem;
        }
        .rules-card {
            background-color: #111111;
            border: 1px solid #333333;
            border-radius: 0.75rem;
            position: relative;
            overflow: hidden;
        }
        .rules-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            width: 4px;
            background: #facc15;
            opacity: 0.7;
        }
        .rules-card .rules-content {
            border-left: 2px solid #2a2a2a;
            padding-left: 1rem;
            margin-left: 0.25rem;
        }
        .rules-card .rules-content .text-yellow-400 {
            font-weight: 700;
        }
        .cart-item{display:grid;grid-template-columns:72px 1fr auto;grid-template-areas:"img head side" "img desc side" "img meta side" "img warn side" "img qty side";gap:0.15rem 0.65rem;padding:0.7rem;align-items:start;background-color:#111111;border-radius:0.75rem;border:1px solid #333333;box-shadow:0 4px 12px rgba(0,0,0,.5);}
        .cart-item-img-wrap{grid-area:img;flex-shrink:0;display:flex;align-self:stretch;min-height:72px;}
        .cart-item-img{width:100%;height:100%;object-fit:cover;border-radius:0.5rem;display:block;}
        .cart-item-head{grid-area:head;display:flex;align-items:center;gap:0.25rem;flex-wrap:wrap;min-width:0;}
        .cart-item-name{font-size:0.95rem;font-weight:600;color:#ffffff;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
        .cart-item-desc{grid-area:desc;font-size:0.7rem;color:#6b7280;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;}
        .cart-item-desc:empty{display:none;}
        .cart-item-meta{grid-area:meta;display:flex;align-items:baseline;gap:0.5rem;flex-wrap:wrap;font-size:0.75rem;line-height:1.2;}
        .cart-item-unit{font-weight:700;color:#facc15;}
        .cart-item-warnings{grid-area:warn;line-height:1.2;}
        .cart-item-warnings:empty{display:none;}
        .cart-item-qty-row{grid-area:qty;display:flex;align-items:center;gap:0.4rem;margin-top:0.3rem;}
        .cart-item-qty-num{width:1.75rem;text-align:center;color:#ffffff;font-weight:600;font-size:0.9rem;}
        .cart-item-side{grid-area:side;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:0.5rem;flex-shrink:0;align-self:stretch;}
        .cart-item-total{font-size:1.05rem;font-weight:800;color:#facc15;font-family:'Montserrat',sans-serif;}
        .cart-item-delete{background:transparent;border:none;color:#ef4444;cursor:pointer;padding:0.15rem;transition:color 0.2s;display:inline-flex;align-items:center;justify-content:center;}
        .cart-item-delete:hover{color:#f87171;}
        @media (min-width:768px){
            .cart-item{grid-template-columns:64px 1fr auto;gap:0.2rem 0.75rem;padding:1rem;}
            .cart-item-img{width:100%;height:100%;}
            .cart-item-name{font-size:1rem;}
            .cart-item-desc{font-size:0.75rem;}
            .cart-item-meta{font-size:0.875rem;}
            .cart-item-qty-row{justify-content:flex-start;margin-top:0.25rem;}
            .cart-item-side{align-self:center;justify-content:center;}
            .cart-item-total{font-size:1.25rem;}
        }
        .bottom-nav-bar {
            padding-top: 0.5rem;
            padding-bottom: max(20px, env(safe-area-inset-bottom));
        }
        .bottom-nav-bar .nav-item {
            gap: 0.2rem;
        }
        .bottom-nav-bar .nav-item span {
            font-size: 0.65rem;
            line-height: 1.1;
        }

@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}html{scroll-behavior:auto !important}}