*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,sans-serif}body{color:#fff;background:#111;overflow:hidden}#layout{grid-template-columns:420px 1fr;height:100vh;display:grid}#sidebar{background:#181818;border-right:1px solid #333;padding:24px;overflow-y:auto}.card{flex-direction:column;gap:12px;display:flex}input{color:#fff;background:#222;border:none;border-radius:12px;padding:12px}button{color:#000;cursor:pointer;background:#fff;border:none;border-radius:16px;padding:16px;font-weight:700}#viewer{width:100%;height:100%}#progressContainer{background:#222;border-radius:8px;width:100%;height:12px;margin-top:15px;overflow:hidden}#progressBar{background:#4caf50;width:0%;height:100%;transition:all .3s}#spinner{text-align:center;margin-top:10px;padding:10px}#liveURL{word-break:break-all;margin-top:15px;font-size:12px}#copyBtn,#openBtn{width:100%;margin-top:10px}@media (width<=768px){#layout{flex-direction:column;display:flex}#sidebar{height:auto;max-height:50vh}#viewer{height:50vh;min-height:300px}}button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}#dashboard{width:100%;height:100vh}.clientItem{background:#222;border-radius:12px;margin-top:12px;padding:12px}.clientItem strong{margin-bottom:10px;display:block}.clientItem button{margin-top:8px}#previewFrame{background:#fff;border:none;width:100%;height:100%}.dashboardPage{color:#fff;background:#0f0f0f;grid-template-columns:380px 1fr;height:100vh;display:grid}.dashboardSidebar{background:#151515;border-right:1px solid #2c2c2c;padding:28px;overflow-y:auto}.dashHeader h1{margin-bottom:8px;font-size:2rem}.dashHeader p{color:#aaa;margin-bottom:24px;font-size:.95rem}.dashSearchBox input{color:#fff;background:#0f0f0f;border:1px solid #333;border-radius:14px;width:100%;margin-bottom:18px;padding:14px}.clientList{flex-direction:column;gap:12px;display:flex}.clientCard{text-align:left;color:#fff;cursor:pointer;background:#202020;border:1px solid #333;border-radius:16px;padding:16px}.clientCard:hover{background:#2a2a2a}.clientName{margin-bottom:6px;font-size:1rem;font-weight:700;display:block}.clientPath{color:#999;word-break:break-all;font-size:.8rem;display:block}.dashboardMain{justify-content:center;align-items:center;padding:40px;display:flex}.clientDetails{width:100%;max-width:720px}.emptyState{text-align:center;color:#aaa}.detailsCard{background:#181818;border:1px solid #333;border-radius:26px;padding:32px}.detailsCard h2{margin-bottom:22px;font-size:2rem}.detailsLabel{color:#aaa;margin-bottom:8px}.urlBox{word-break:break-all;color:#8ee99a;background:#0f0f0f;border:1px solid #333;border-radius:14px;margin-bottom:24px;padding:16px}.detailsActions{grid-template-columns:1fr 1fr;gap:14px;display:grid}@media (width<=800px){.dashboardPage{grid-template-columns:1fr}.dashboardSidebar{border-bottom:1px solid #2c2c2c;border-right:none}.dashboardMain{padding:24px}.detailsActions{grid-template-columns:1fr}}.clientThumb{object-fit:cover;background:#111;border-radius:12px;width:100%;height:120px;margin-bottom:12px}.emptyThumb{color:#777;border:1px dashed #444;justify-content:center;align-items:center;display:flex}.detailsThumb{object-fit:contain;background:#111;border-radius:18px;width:100%;max-height:260px;margin-bottom:22px}