main.wrap { position:relative; z-index:1; width:min(1180px, calc(100% - 28px)); margin:16px auto 28px; background:transparent; }
main.wrap .crumb { display:flex; align-items:center; gap:8px; margin:0 0 10px; }
main.wrap .crumb .back { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 16px; border-radius:10px; background:#f5d76e; color:#111; font-size:13px; font-weight:700; text-decoration:none; }
main.wrap .crumb .back.alt { background:rgba(6,16,43,.72); color:#e8eef8; border:1px solid rgba(255,255,255,.08); }
main.wrap .panel { position:relative !important; margin-top:3px; background:#071226; border:1px solid rgba(245,215,110,.28); border-radius:18px; padding:16px; color:#e8eef8; overflow:hidden; }
main.wrap .top { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:12px; }
main.wrap .top h1 { margin:0; font-size:22px; }
main.wrap .top p { margin:4px 0 0; color:#93c5fd; font-size:13px; }
main.wrap .gen { border:0; border-radius:10px; background:#2563eb; color:#fff; font-weight:700; padding:10px 16px; }
main.wrap .tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
main.wrap .tabs button { border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); color:#e8eef8; border-radius:12px; padding:12px 8px; font-weight:700; }
main.wrap .tabs button.on { color:#111; border-color:transparent; }
main.wrap .tabs button.on[data-mode="diskon"] { background:#f5d76e; }
main.wrap .tabs button.on[data-mode="bb"] { background:#67e8f9; }
main.wrap .tabs button.on[data-mode="full"] { background:#fff; }
main.wrap .tabs button.on[data-mode="prize123"] { background:#fb7185; }
main.wrap .meta { display:flex; justify-content:space-between; gap:12px; align-items:center; margin:12px 0; color:#cbd5e1; font-size:13px; }
main.wrap .meta b { color:#f5d76e; font-size:15px; }
main.wrap .rates { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
main.wrap .rates span { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:999px; padding:6px 10px; font-size:12px; }
main.wrap .who { margin:0 0 10px; color:#bbf7d0; }
main.wrap .sheet, main.wrap .head, main.wrap .autobet, main.wrap .line { position:static !important; top:auto !important; left:auto !important; right:auto !important; transform:none !important; height:auto !important; }
main.wrap .sheet { display:block !important; overflow-x:auto; width:100% !important; }
main.wrap .head, main.wrap .autobet, main.wrap .line { display:grid; grid-template-columns:34px 110px minmax(96px,1fr) minmax(96px,1fr) minmax(96px,1fr) 148px 148px 30px; gap:6px; align-items:center; width:100%; }
main.wrap .head, main.wrap .autobet { display:grid !important; }
main.wrap .head { color:#94a3b8; font-size:12px; letter-spacing:.04em; text-transform:uppercase; padding-bottom:6px; }
main.wrap .head span { text-align:center; }
main.wrap .head span:nth-child(2) { text-align:left; }
main.wrap .line { margin-top:8px; }
main.wrap .line > span:first-child { text-align:center; font-size:12px; }
main.wrap .autobet { margin:8px 0 !important; }
main.wrap .line input, main.wrap .autobet input { width:100%; min-width:0; box-sizing:border-box; background:#0b1220; color:#fff; border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:9px 8px; }
main.wrap .line .nomor { text-align:left; }
main.wrap .line .diskon, main.wrap .line .bayar { text-align:right; }
main.wrap .line input[readonly] { color:#f5d76e; }
main.wrap .line .bb, main.wrap #bb-all { width:16px !important; height:16px; justify-self:center; padding:0; }
main.wrap .actions { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
main.wrap .actions button { border:0; border-radius:10px; padding:10px 18px; font-weight:700; background:#f5d76e; color:#111; }
main.wrap .actions #hapus { background:transparent; color:#fecaca; border:1px solid rgba(254,202,202,.45); }
main.wrap .split { display:grid !important; grid-template-columns:minmax(0,1fr) 300px !important; gap:12px; align-items:start; }
main.wrap .info { background:#071226; border:1px solid rgba(245,215,110,.28); border-radius:18px; padding:16px 16px 6px; color:#e8eef8; }
main.wrap .info h2 { margin:0 0 8px; font-size:13px; letter-spacing:.08em; color:#67e8f9; }
main.wrap .info ul { margin:0 0 14px; padding-left:18px; }
main.wrap .info li { margin:6px 0; font-size:13px; line-height:1.45; }
main.wrap .board { position:relative !important; display:block; margin:0 0 10px; }
main.wrap .gamesel { display:grid; gap:6px; grid-template-columns:repeat(5,minmax(0,1fr)); margin-top:8px; }
main.wrap .markets { display:none !important; }
main.wrap .markets a, main.wrap .gamesel a, main.wrap .gamesel span { display:flex; align-items:center; justify-content:center; min-height:40px; padding:8px; text-align:center; background:rgba(6,16,43,.72); color:#e8eef8; text-decoration:none; border:1px solid rgba(255,255,255,.08); border-radius:10px; font-size:12px; font-weight:700; }
main.wrap .markets a.on, main.wrap .gamesel a.on { background:#f5d76e; color:#111; }
main.wrap .pool, main.wrap .shorts, main.wrap .m-tools { display:none; }
main.wrap .mark { width:64px; height:64px; border-radius:16px; display:grid; place-items:center; background:#1d4ed8; color:#fff; font-size:28px; font-weight:800; }
@media (max-width:980px) {
    main.wrap .split { grid-template-columns:1fr !important; }
}
@media (max-width:800px) {
    main.wrap .crumb, main.wrap .top { display:none; }
    main.wrap .pool { display:flex; justify-content:space-between; gap:12px; align-items:center; margin:0 0 10px; padding:14px; background:#071226; border:1px solid rgba(245,215,110,.28); border-radius:16px; }
    main.wrap .pool h2 { margin:0 0 6px; color:#fb7185; font-size:18px; }
    main.wrap .pool p { margin:0; color:#e2e8f0; font-size:12px; }
    main.wrap .pool b { display:block; margin-top:8px; color:#fff; font-size:22px; }
    main.wrap .shorts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:10px; }
    main.wrap .shorts a, main.wrap .shorts button, main.wrap .shorts span { min-height:64px; border:0; border-radius:14px; background:#071226; color:#e8eef8; font-size:11px; font-weight:700; text-decoration:none; display:flex; align-items:center; justify-content:center; padding:8px; }
    main.wrap .gamesel { grid-template-columns:repeat(3,minmax(0,1fr)); }
    main.wrap .m-tools { display:block; margin-bottom:10px; }
    main.wrap .periode { margin:0 0 8px; color:#fb7185; font-weight:800; font-size:14px; }
    main.wrap #generator { width:100%; border:0; border-radius:10px; background:#2563eb; color:#fff; font-weight:700; padding:10px; }
    main.wrap .tabs { grid-template-columns:1fr 1fr; }
    main.wrap .tabs button { font-size:12px; padding:10px 4px; }
    main.wrap #hitung { background:#0d9488; color:#fff; }
    main.wrap .actions #hapus { background:#dc2626; color:#fff; border:0; }
    main.wrap .head, main.wrap .autobet, main.wrap .line { grid-template-columns:24px 68px minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.2fr) 18px !important; gap:4px !important; }
    main.wrap .line input, main.wrap .autobet input { font-size:11px !important; padding:7px 3px !important; }
    main.wrap .head { font-size:9px !important; letter-spacing:0 !important; }
}
@media (max-width: 800px) {
    main.wrap {
        margin-top: 1px !important;
        padding-top: 0 !important;
        overflow: visible !important;
    }
    main.wrap .menubg {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-top: 0 !important;
        background: #071226;
        box-sizing: border-box;
        padding: 23px 22px 4px !important;
    }
    main.wrap .pool { margin-top: 0 !important; }
}
@media (min-width: 801px) {
    main.wrap {
        width: min(1180px, calc(100vw - 28px)) !important;
        max-width: 1180px !important;
        margin: 1px auto 0 !important;
        padding: 16px 0 28px !important;
        background: #071226 !important;
        border-radius: 0 !important;
    }
    main.wrap > .menubg {
        width: 1180px !important;
        max-width: 1180px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }
    main.wrap > .crumb,
    main.wrap .board,
    main.wrap .gamesel,
    main.wrap .pool,
    main.wrap .split {
        width: 1120px !important;
        max-width: 1120px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
    main.wrap .split {
        display: grid !important;
        grid-template-columns: 820px 260px !important;
        justify-content: center !important;
        gap: 12px !important;
    }
    main.wrap .panel {
        width: 820px !important;
        max-width: 820px !important;
        min-width: 0 !important;
    }
    main.wrap aside {
        width: 260px !important;
        max-width: 260px !important;
        min-width: 0 !important;
    }
}
main.wrap #dd-form .sheet { overflow: hidden !important; width: 100% !important; }
main.wrap #dd-form .head,
main.wrap #dd-form .autobet,
main.wrap #dd-form .line {
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1.05fr) minmax(0, 1.45fr) minmax(0, 1.25fr) minmax(0, 1.25fr) 22px !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
}
main.wrap #dd-form .line input,
main.wrap #dd-form .autobet input {
    width: 100% !important;
    max-width: none !important;
}
main.wrap #dd-form .bb,
main.wrap #dd-form #dd-all {
    width: 16px !important;
    justify-self: end;
}
main.wrap #dd-form .line.off { display: none !important; }
