.project-preview{--preview-accent:var(--accent);isolation:isolate;background:radial-gradient(at 15% 0,#48547533,#0000 65%),#1b1822;border:1px solid #c7b2e027;border-radius:20px;min-width:0;padding:26px 18px 14px;position:relative}.preview-depth{z-index:-1;transform:translate(var(--px,0),var(--py,0)) rotate(-2deg);border:1px solid #c7b2e020;border-radius:14px;transition:transform .3s;position:absolute;inset:10px 24px 35px}.preview-depth span{border:1px solid #c7b2e016;border-radius:14px;position:absolute;inset:5px 0 -5px;transform:rotate(3deg)}.preview-browser{background:#15141c;border:1px solid #d2b9ff38;border-top-color:#e1ceff66;border-radius:13px;position:relative;overflow:hidden;box-shadow:0 12px 28px #100a1833,0 4px #2c2237}.preview-topline{background:linear-gradient(#292630,#1c1922);border-bottom:1px solid #cbb6e118;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.preview-topline bdi{color:#d0c5db;font:500 12px Segoe UI,sans-serif}.window-dots{gap:4px;display:flex}.window-dots i{background:#a799ad;border-radius:50%;width:4px;height:4px}.preview-indicator{background:#c4acff;border-radius:50%;width:4px;height:4px;box-shadow:0 0 7px #bfa4ff66}.infra-screen{background:#f4f6fa;height:330px;position:relative;overflow:hidden}.actual-project-image{object-fit:cover;object-position:top;width:100%;height:100%}.infra-start{color:#fff;background:linear-gradient(#0000,#18151fee);justify-content:space-between;align-items:end;gap:14px;padding:38px 16px 16px;font-size:12px;display:flex;position:absolute;inset:auto 0 0}.infra-start>span{max-width:22ch}.infra-start button{color:#241b2e;background:#f2edf9;border:0;border-radius:10px;align-items:center;gap:10px;min-height:44px;padding:8px 14px;font-size:14px;display:inline-flex}.demo-mount{background:#211c2a;display:none;position:absolute;inset:0}.project-preview[data-active=true] .demo-mount{display:block}.demo-mount iframe,[data-expanded-mount] iframe{background:#fff;border:0;width:100%;height:100%}iframe:not([data-loaded=true]){visibility:hidden}.demo-feedback{text-align:center;z-index:2;color:var(--ink);background:#211c2a;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;display:flex;position:absolute;inset:0}.demo-feedback p{max-width:36ch;font-size:16px}.demo-feedback button{font:inherit;min-height:44px;color:var(--ink);border:1px solid var(--accent);background:#33273f;border-radius:10px;padding:8px 18px}.preview-foot{color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding-top:16px;font-size:12px;line-height:1.8;display:flex}.preview-frame-controls{flex-wrap:wrap;gap:8px;display:flex}.preview-frame-controls button{min-height:44px;font:inherit;color:var(--ink);border:1px solid var(--line);background:#ffffff08;border-radius:9px;align-items:center;gap:8px;padding:7px 10px;display:inline-flex}.project-demo-dialog{width:min(1180px,94vw);max-width:94vw;height:90dvh;max-height:94dvh;color:var(--ink);background:#211c2a;border:1px solid #c6b4d94d;border-radius:16px;padding:0}.project-demo-dialog::backdrop{backdrop-filter:blur(6px);background:#0c0813d9}.demo-dialog-bar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:15px;padding:10px 16px;font-size:14px;display:flex}.demo-dialog-bar button{border:1px solid var(--line);background:0 0;border-radius:10px;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:8px 12px;display:flex}[data-expanded-mount]{height:calc(100% - 65px);position:relative}.mini-career,.mini-security,.mini-website{min-height:310px;padding:26px}.preview-kicker{color:var(--accent);margin-bottom:10px;font-size:13px}.preview-title{margin-bottom:18px;font-size:26px;font-weight:500;line-height:1.5}.evidence-path{align-items:center;gap:10px;max-width:420px;margin:18px 0;display:flex}.evidence-path span{border:1px solid var(--line);min-width:32px;height:32px;color:var(--muted);border-radius:50%;place-items:center;font:13px Segoe UI,sans-serif;display:grid}.evidence-path span[data-active=true]{border-color:var(--accent);color:var(--ink);background:#bfa4ff18}.evidence-path i{background:var(--line);flex:1;height:1px}.sample-evidence{border-inline-start:2px solid var(--accent);padding-inline-start:16px}.sample-evidence>span{color:var(--muted);font-size:13px}.sample-evidence strong{margin:6px 0;font-size:20px;font-weight:500;display:block}.sample-evidence p{color:var(--muted);max-width:58ch;font-size:16px}.preview-action{min-height:44px;color:var(--ink);border:0;border-bottom:1px solid var(--line);background:0 0;align-items:center;gap:16px;margin-top:16px;padding:8px 0;font-size:15px;display:inline-flex}.log-events{gap:5px;display:grid}.log-events button{text-align:start;border:1px solid #0000;border-bottom-color:var(--line);min-height:48px;color:var(--muted);background:0 0;border-radius:10px;align-items:center;gap:12px;padding:10px;font-size:15px;display:flex}.log-events button[aria-pressed=true]{color:var(--ink);background:#bfa4ff10;border-color:#bfa4ff55}.log-events bdi{color:var(--muted);font:12px Segoe UI,sans-serif}.log-level{color:#b8c9eb;font:12px Consolas,monospace}.log-events .ui-icon{margin-inline-start:auto}.log-context{color:var(--muted);max-width:65ch;min-height:60px;margin-top:16px;font-size:16px}.mini-controls{gap:10px;margin-bottom:16px;display:flex}.mini-controls button{border:1px solid var(--line);background:#2e2638;border-radius:10px;justify-content:center;align-items:center;gap:10px;min-height:44px;padding:8px 14px;font-size:14px;display:flex}.mini-controls button[aria-pressed=true]{border-color:var(--accent)}.site-in-site{isolation:isolate;border:1px solid var(--line);color:#f2edf9;background:#1b1723;border-radius:12px;min-height:270px;padding:24px;transition:background .25s,color .25s;position:relative;overflow:hidden}.mini-tk{margin-bottom:22px;font:700 20px Segoe UI,sans-serif;display:block}.mini-tk i{color:var(--accent)}.site-in-site p{color:#bcb3c8;font-size:15px}.site-in-site strong{z-index:1;max-width:70%;font-size:32px;font-weight:600;display:block;position:relative}.mini-site-role{z-index:1;margin-top:45px;font-size:14px;display:block;position:relative}.mini-orbit{inset-inline-end:25px;z-index:0;border:9px solid #89729f66;border-radius:28px;width:110px;height:110px;position:absolute;top:86px;transform:rotate(-18deg);box-shadow:inset 0 1px 3px #fff3,0 12px 20px #0003}.mini-orbit i{border:1px solid #c9abff;border-radius:12px;position:absolute;inset:13px}.mini-orbit i+i{background:#bfa4ff22;inset:29px}.mini-light{color:#241b31;background:#f0ebf5}.mini-light p{color:#65556f}.mini-caption{color:var(--muted);margin-top:12px;font-size:14px}.project-preview:not([data-ready]) :is(.infra-start,.preview-action,.mini-controls){display:none}.project-preview:not([data-ready]) .log-events button{pointer-events:none}.project-preview:not([data-ready]) .log-events button:not([aria-pressed=true]){display:none}.case-art .project-preview{max-width:1000px;margin:auto}.case-art .infra-screen{height:470px}@media (width<=700px){.project-preview{border-radius:16px;padding:18px 12px 12px}.infra-screen{height:260px}.case-art .infra-screen{height:310px}.infra-start{gap:10px;padding:40px 12px 12px}.infra-start>span{display:none}.preview-foot,.preview-topline bdi{font-size:12px}.mini-career,.mini-security,.mini-website{padding:20px 16px}.preview-title{font-size:24px}.log-events button{flex-wrap:wrap;gap:8px;font-size:14px}.log-events bdi{font-size:12px}.log-context{font-size:15px}.site-in-site{padding:20px 16px}.site-in-site strong{font-size:27px}.mini-site-role{font-size:13px}.mini-orbit{width:95px;height:95px;inset-inline-end:10px}.project-demo-dialog{border-radius:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh}.demo-dialog-bar{padding:8px 10px;font-size:12px}}.motion-paused .preview-depth{transform:none!important}
