.output-panel{background:var(--warna-permukaan);border:1px solid var(--warna-garis);border-radius:var(--radius);flex-direction:column;height:100%;min-height:200px;display:flex;overflow:hidden}.output-tabs{background:var(--warna-permukaan-redup);border-bottom:1px solid var(--warna-garis);align-items:center;gap:.25rem;padding:.4rem .5rem 0;display:flex}.output-status{color:var(--warna-teks-lembut);margin-left:auto;font-size:.85rem}.output-isi{flex:1;min-height:0;position:relative;overflow:auto}.output-preview{height:100%;min-height:220px;position:relative}.wadah-sandbox,.sandbox-frame{background:#fff;border:0;width:100%;height:100%;min-height:220px;display:block}.output-panel[data-lebar-perangkat] .output-preview[hidden]{opacity:0;pointer-events:none;display:block;position:absolute;inset:0;overflow:hidden}.toolbar-lebar{flex-wrap:wrap;align-items:center;gap:.35rem;padding:.35rem .5rem;display:flex}.toolbar-lebar .btn[aria-pressed=true]{color:var(--warna-utama-gelap);background:var(--warna-utama-lembut);border-color:var(--warna-utama)}.label-preview{min-width:0;color:var(--warna-teks-lembut);flex:1;font-size:.8rem}.output-panel[data-lebar-perangkat] .wadah-sandbox{background:var(--warna-garis-halus)}.output-panel[data-lebar-perangkat] .sandbox-frame{outline-offset:-1px;outline:1px solid #64748b}.preview-perangkat,.perangkat-bingkai{display:contents}.perangkat-kepala,.perangkat-kaki{display:none}.preview-perangkat[data-perangkat]{background:radial-gradient(at top,#eef2ff,#e2e8f0);flex:none;min-height:0;display:block;position:relative;overflow:hidden}.preview-perangkat[data-perangkat] .perangkat-bingkai{width:calc(var(--lebar-preview) + 32px);transform:translateX(-50%) scale(var(--skala-preview));transform-origin:top;background:#17171b;border:2px solid #a8a5b5;border-radius:48px;padding:14px;display:block;position:absolute;top:16px;left:50%;box-shadow:0 12px 30px #0f172a30,inset 0 0 0 2px #34343e}.preview-perangkat[data-perangkat] .wadah-sandbox{width:var(--lebar-preview);height:var(--tinggi-layar);border-radius:8px;min-height:0;display:block;overflow:hidden}.preview-perangkat[data-perangkat] .sandbox-frame{width:var(--lebar-preview);height:var(--tinggi-layar);min-height:0}.preview-perangkat[data-perangkat] .perangkat-kepala{justify-content:center;align-items:center;height:32px;display:flex}.preview-perangkat[data-perangkat] .perangkat-kepala span{background:#000;border-radius:20px;width:106px;height:24px;box-shadow:inset -12px 0 #0c0c16}.preview-perangkat[data-perangkat] .perangkat-kaki{justify-content:center;align-items:center;height:24px;display:flex}.preview-perangkat[data-perangkat] .perangkat-kaki span{background:#ddd;border-radius:4px;width:110px;height:4px}.preview-perangkat[data-perangkat=tablet] .perangkat-bingkai{background:#242429;border-radius:28px}.preview-perangkat[data-perangkat=tablet] .perangkat-kepala span{background:#090911;width:8px;height:8px;box-shadow:inset 0 0 0 2px #303044}.preview-perangkat[data-perangkat=desktop] .perangkat-bingkai{background:#25262b;border-color:#aeb3be;border-radius:20px 20px 8px 8px}.preview-perangkat[data-perangkat=desktop] .perangkat-kepala span{background:#101014;border-radius:0 0 8px 8px;width:90px;height:16px}.preview-perangkat[data-perangkat=desktop] .perangkat-kaki{background:linear-gradient(#dce0e7,#8e94a0);border-radius:0 0 12px 12px;height:38px;margin:0 -14px -14px;box-shadow:inset 0 -5px #737985}.preview-perangkat[data-perangkat=desktop] .perangkat-kaki span{background:#9096a1;border-radius:0 0 10px 10px;align-self:flex-start;width:150px;height:10px}.output-console{font-family:var(--font-kode);padding:.5rem .75rem;font-size:.88rem}.output-console .kosong{color:var(--warna-teks-lembut);font-family:var(--font-teks);margin:0}.baris{border-bottom:1px dashed var(--warna-garis-halus);white-space:pre-wrap;word-break:break-word;padding:.2rem .25rem;display:grid}.baris small{color:var(--warna-teks-lembut)}.baris-warn{color:var(--warna-peringatan-teks);background:var(--warna-peringatan-tipis)}.baris-error{color:var(--warna-gagal);background:var(--warna-gagal-lembut)}.baris-alert{color:var(--warna-utama-gelap)}.baris-sistem{color:var(--warna-teks-lembut);font-style:italic}.output-hasil{padding:.75rem}.toast{z-index:2;color:#fff;background:#1e293b;border-radius:8px;align-items:center;gap:.5rem;padding:.4rem .7rem;display:flex;position:absolute;top:.5rem;right:.5rem}.toast button{color:#fff;cursor:pointer;background:0 0;border:0;font-size:1.1rem}
