/* KASKOW Lab — Penjual */
.lsl-money { display: flex; align-items: center; border-radius: 11px; border: 1px solid var(--lab-line); background: var(--lab-card); overflow: hidden; transition: border-color .15s, box-shadow .15s; }
.lsl-money:focus-within { border-color: var(--lab-acc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lab-acc) 16%, transparent); }
.lsl-money span { padding: 0 10px 0 12px; font-size: .82rem; font-weight: 800; color: var(--muted); }
.lsl-money .lab-in { flex: 1; border: 0; box-shadow: none !important; padding-left: 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.lsl-side { min-width: 0; }
.lsl-sticky { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 12px; }
.lsl-scs { display: flex; flex-direction: column; gap: 12px; }
.lsl-sc { padding: 12px; border-radius: 14px; border: 1px dashed var(--lab-line); }
.lsl-sc-h { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; }
.lsl-sc-h .lab-in { flex: 1; height: 36px; font-weight: 700; }
.lsl-fees { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.lsl-fees label { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.lsl-fees small { font-size: .7rem; font-weight: 700; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lsl-fees .lab-in { height: 36px; font-variant-numeric: tabular-nums; }
.lsl-res { display: flex; flex-direction: column; gap: 12px; }
.lsl-card h3 { justify-content: space-between; }
.lsl-card.best { border-color: color-mix(in srgb, #16a34a 45%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, #16a34a 12%, transparent); }
.lsl-hero { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; padding: 14px 16px; border-radius: 14px; color: #fff; background: linear-gradient(140deg, var(--lab-acc2), var(--lab-acc)); box-shadow: 0 16px 30px -20px var(--lab-acc); }
.lsl-hero.neg { background: linear-gradient(140deg, #f87171, #dc2626); }
.lsl-card .lsl-hero small, .lsl-hero small { color: #fff; font-size: .74rem; font-weight: 700; opacity: .92; }
.lsl-hero b { font-size: 1.7rem; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.lsl-hero span { font-size: .78rem; font-weight: 600; opacity: .92; }
.lsl-row { display: flex; justify-content: space-between; gap: 12px; padding: 7px 2px; font-size: .84rem; border-bottom: 1px dashed color-mix(in srgb, var(--text) 9%, transparent); }
.lsl-row span { color: var(--muted); }
.lsl-row b { font-variant-numeric: tabular-nums; text-align: right; }
.lsl-row.strong span { color: var(--text); font-weight: 800; }
.lsl-row.strong b { color: var(--lab-acc); }
.lsl-big { font-size: 1.6rem; font-weight: 800; color: var(--lab-acc); font-variant-numeric: tabular-nums; margin: 4px 0; }
.lsl-big.bad { color: #dc2626; }
.lsl-card small { display: block; color: var(--muted); font-size: .78rem; line-height: 1.5; }
.lsl-card > b { font-size: .9rem; }
.lsl-warn { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: rgba(239,68,68,.08); color: #b91c1c; font-size: .8rem; line-height: 1.45; }
[data-theme="dark"] .lsl-warn { color: #fca5a5; }
.lsl-parts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
.lsl-table { max-height: 520px; overflow: auto; }
.lsl-table code { font-family: var(--lab-mono); font-size: .84rem; font-weight: 700; color: var(--lab-acc); }
.lsl-table tr.dup td { background: rgba(239,68,68,.08); }
.lsl-items { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.lsl-item { display: grid; grid-template-columns: minmax(0, 1fr) 64px 64px 110px 34px; gap: 6px; align-items: center; }
.lsl-item.nd { grid-template-columns: minmax(0, 1fr) 70px 80px 34px; }
.lsl-item .lab-in { height: 38px; min-width: 0; }
.lsl-thumb { height: 34px; max-width: 90px; object-fit: contain; border-radius: 8px; border: 1px solid var(--lab-line); background: #fff; }
/* pratinjau A4 */
.lsl-paper-wrap { padding: 14px; border-radius: 16px; background: color-mix(in srgb, var(--text) 5%, transparent); max-height: calc(100vh - 220px); overflow: auto; }
.lsl-paper { width: 100%; aspect-ratio: 1 / 1.414; background: #fff; color: #111827; border-radius: 4px; box-shadow: 0 16px 36px -20px rgba(15,23,42,.6); overflow: hidden; container-type: inline-size; }
.lsl-doc { padding: 6cqw 7cqw; font-size: 1.75cqw; line-height: 1.45; font-family: Helvetica, Arial, sans-serif; border-top: 1cqw solid #ea580c; min-height: 100%; }
.lsl-dh { display: flex; justify-content: space-between; gap: 4cqw; padding-bottom: 2.5cqw; border-bottom: 1px solid #e5e7eb; }
.lsl-dh b { display: block; font-size: 2.6cqw; }
.lsl-dh small { display: block; color: #6b7280; font-size: 1.5cqw; }
.lsl-dh .r { text-align: right; }
.lsl-dh h4 { margin: 0 0 .8cqw; font-size: 3.4cqw; color: #ea580c; letter-spacing: .02em; }
.lsl-dlogo { max-height: 8cqw; max-width: 22cqw; object-fit: contain; display: block; margin-bottom: 1cqw; }
.lsl-to { display: flex; flex-direction: column; margin: 3cqw 0 2.5cqw; }
.lsl-to small, .lsl-rc small, .lsl-df small { color: #6b7280; font-size: 1.45cqw; }
.lsl-to b { font-size: 2.1cqw; }
.lsl-to span { color: #6b7280; font-size: 1.6cqw; }
.lsl-rc { display: grid; grid-template-columns: 1.6fr 1fr auto; gap: 2cqw; align-items: center; padding: 2cqw; margin-bottom: 2.5cqw; border-radius: 1cqw; background: #fff7ed; border: 1px solid #fed7aa; }
.lsl-rc div { display: flex; flex-direction: column; }
.lsl-rc .lsl-amt { font-size: 3cqw; font-weight: 800; color: #ea580c; }
.lsl-dt { width: 100%; border-collapse: collapse; font-size: 1.6cqw; }
.lsl-dt th { background: #f3f4f6; color: #6b7280; text-align: left; padding: 1cqw; font-size: 1.45cqw; }
.lsl-dt td { padding: 1cqw; border-bottom: 1px solid #eef0f2; }
.lsl-dt .n { text-align: right; white-space: nowrap; }
.lsl-tot { margin: 2cqw 0 0 auto; width: 46%; display: flex; flex-direction: column; gap: .6cqw; font-size: 1.6cqw; }
.lsl-tot div { display: flex; justify-content: space-between; }
.lsl-tot span { color: #6b7280; }
.lsl-tot .g { padding: 1.2cqw 1.4cqw; border-radius: .8cqw; background: #fff7ed; font-size: 2.1cqw; }
.lsl-tot .g b { color: #ea580c; }
.lsl-tb { margin: 1.5cqw 0 0; color: #6b7280; font-size: 1.45cqw; }
.lsl-df { display: flex; justify-content: space-between; gap: 4cqw; margin-top: 4cqw; }
.lsl-df > div:first-child { display: flex; flex-direction: column; gap: .4cqw; max-width: 55%; font-size: 1.55cqw; }
.lsl-df .sig { display: flex; gap: 4cqw; }
.lsl-df .sig > div { display: flex; flex-direction: column; align-items: center; min-width: 22cqw; }
.lsl-df .sig i { display: block; height: 10cqw; }
.lsl-df .sig img { height: 10cqw; max-width: 24cqw; object-fit: contain; }
.lsl-df .sig b { width: 100%; padding-top: .6cqw; border-top: 1px solid #9ca3af; text-align: center; font-size: 1.6cqw; }
@media (max-width: 860px) { .lsl-sticky { position: static; } .lsl-paper-wrap { max-height: none; } .lsl-fees { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .lsl-item { grid-template-columns: minmax(0, 1fr) 54px 54px 34px; } .lsl-item .lab-in[data-it$=":p"] { grid-column: 1 / 4; } .lsl-parts { grid-template-columns: 1fr; } }
