.cmp{background:#e9efec;flex-direction:column;min-height:100vh;display:flex}.cmp-bar{z-index:2;color:#fff;background:#0d1117;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 20px;display:flex;position:sticky;top:0}.cmp-bar b{font-size:15px;font-weight:800}.cmp-bar select{min-width:240px;height:36px;font:inherit;border:0;border-radius:10px;padding:0 10px;font-weight:700}.cmp-bar button{color:#fff;height:36px;font:inherit;cursor:pointer;background:0 0;border:1px solid #ffffff59;border-radius:10px;padding:0 14px;font-weight:700}.cmp-path{opacity:.7;font-family:ui-monospace,monospace;font-size:13px}.cmp-bar a{color:#5fe3ab;margin-left:auto;font-size:14px;font-weight:700}.cmp-stage{flex:1;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:28px;padding:24px;display:grid}.cmp figure{gap:10px;min-width:0;margin:0;display:grid}.cmp figcaption{color:#4a5568;font-size:13px;font-weight:800}.cmp-bezel{background:#0b0f0d;border-radius:56px;padding:12px;position:relative;box-shadow:0 30px 60px -28px #0000008c,inset 0 0 0 2px #2a2f2c}.cmp-glass{background:#fff;border-radius:44px;overflow:hidden}.cmp-bezel iframe{background:#fff;border:0;display:block}.cmp-status{color:#0d1117;justify-content:space-between;align-items:center;height:47px;padding:6px 30px 0 34px;font-size:15px;display:flex}.cmp-status i{border:1.5px solid #0d1117;border-radius:4px;width:26px;height:12px;position:relative}.cmp-status i:after{content:"";background:#0d1117;border-radius:2px;position:absolute;inset:1.5px 5px 1.5px 1.5px}.cmp-island{z-index:1;pointer-events:none;background:#0b0f0d;border-radius:20px;width:120px;height:34px;position:absolute;top:23px;left:50%;transform:translate(-50%)}.cmp-screen{background:#fff;border-radius:14px;padding-top:34px;position:relative;overflow:hidden;box-shadow:0 30px 60px -30px #00000073,0 0 0 1px #cfd8d3}.cmp-dots{background:#f1f4f2;border-bottom:1px solid #dde4e0;align-items:center;gap:6px;height:34px;padding:0 14px;display:flex;position:absolute;top:0;left:0;right:0}.cmp-dots i{background:#ff5f57;border-radius:50%;width:11px;height:11px}.cmp-dots i:nth-child(2){background:#febc2e}.cmp-dots i:nth-child(3){background:#28c840}.cmp-screen iframe{transform-origin:0 0;border:0;display:block}@media (max-width:1000px){.cmp-stage{grid-template-columns:1fr;justify-items:center}.cmp-desk{width:100%}}