*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#0d1422;color:#edf3ff}body{overflow:hidden}.demo3d-shell{height:100vh;display:grid;grid-template-rows:68px minmax(0,1fr)}.demo3d-topbar{display:grid;grid-template-columns:240px 280px 310px 1fr;align-items:center;gap:14px;padding:0 16px;border-bottom:1px solid #26334b;background:#0c1321;z-index:20}.demo3d-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}.demo3d-brand>span{width:40px;height:40px;border-radius:10px;background:#121b2e url('cadnex-mark-system.svg') center/100% 100% no-repeat;box-shadow:0 0 0 1px #33415c}.demo3d-brand strong{font-size:18px;letter-spacing:.04em}.demo3d-brand b{font-size:8px;padding:5px 7px;border:1px solid #31436a;border-radius:6px;color:#9dacf9;background:#18243d;letter-spacing:.12em}.demo3d-object,.demo3d-file{display:grid;gap:4px}.demo3d-object small,.demo3d-file small{font-size:7px;color:#7d8ca5;font-weight:900;letter-spacing:.12em}.demo3d-object strong{font-size:10px}.demo3d-file select{height:42px;border:1px solid #33415d;border-radius:9px;background:#131d31;color:#eef3ff;padding:0 34px 0 11px;font-weight:800;font-size:10px}.demo3d-actions{justify-self:end;display:flex;align-items:center;gap:8px}.demo3d-actions span{font-size:8px;color:#8d9ab0}.demo3d-actions a{min-height:38px;display:inline-flex;align-items:center;padding:0 12px;border:1px solid #34435f;border-radius:9px;color:#eaf0fb;text-decoration:none;font-size:9px;font-weight:850}.demo3d-actions a.primary{border:0;background:linear-gradient(135deg,#5878ff,#2e9be6)}.demo3d-layout{display:grid;grid-template-columns:270px minmax(0,1fr) 330px;min-height:0}.demo3d-left,.demo3d-inspector{overflow:auto;background:#101827}.demo3d-left{border-right:1px solid #26334a;padding:14px}.demo3d-inspector{border-left:1px solid #26334a;padding:16px}.demo3d-info{padding:12px;border:1px solid #293955;border-radius:13px;background:linear-gradient(145deg,#17223a,#111a2b)}.demo3d-info small,.demo3d-title span{font-size:7px;font-weight:900;letter-spacing:.13em;color:#7687ff}.demo3d-info h2{font-size:16px;margin:5px 0 4px}.demo3d-info p{margin:0;font-size:8px;line-height:1.55;color:#8795ac}.demo3d-left section+section{margin-top:16px}.demo3d-title{height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 4px}.demo3d-title b{font-size:7px;color:#75839b}.demo3d-layer{position:relative;min-height:38px;display:grid;grid-template-columns:16px 1fr auto;gap:8px;align-items:center;padding:0 8px;border-radius:8px;color:#aab5c7;font-size:9px;cursor:pointer}.demo3d-layer:hover{background:#162137}.demo3d-layer input{position:absolute;opacity:0}.demo3d-layer i{width:12px;height:12px;border:1px solid #57667e;border-radius:3px;background:#111a2b}.demo3d-layer:has(input:checked) i{background:#5d78ff;border-color:#5d78ff;box-shadow:inset 0 0 0 2px #111a2b}.demo3d-layer b{font-size:7px;color:#738197}.demo3d-source{width:100%;min-height:58px;margin-top:7px;display:grid;grid-template-columns:38px 1fr;gap:9px;align-items:center;border:1px solid #293955;border-radius:12px;background:#131d31;color:#eaf0fb;text-align:left;padding:8px;cursor:pointer}.demo3d-source:hover,.demo3d-source.active{border-color:#6079ff;background:#172442}.demo3d-source>span{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:#0d1526;color:#9eacff;font-size:8px;font-weight:950}.demo3d-source div{display:grid;gap:3px;min-width:0}.demo3d-source b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo3d-source small{font-size:7px;color:#7d8ca5}.demo3d-note{padding:11px;border:1px solid #2d3d59;border-radius:12px;background:#121c2f}.demo3d-note b{font-size:9px;color:#8fa0ff}.demo3d-note p{margin:5px 0 0;font-size:7px;line-height:1.55;color:#7f8da3}.demo3d-stage-shell{min-width:0;min-height:0;display:grid;grid-template-rows:50px minmax(0,1fr);background:#edf2f7}.demo3d-toolbar{display:flex;align-items:center;gap:8px;padding:7px 10px;background:#f9fbfd;border-bottom:1px solid #d6dce6;color:#26324a;overflow:auto}.demo3d-toolbar>div{display:flex;gap:3px;padding-right:8px;border-right:1px solid #dde2ea}.demo3d-toolbar button{height:35px;border:1px solid transparent;border-radius:7px;background:transparent;color:#647187;padding:0 9px;font:inherit;font-size:9px;font-weight:800;white-space:nowrap}.demo3d-toolbar button:hover,.demo3d-toolbar button.active{background:#192844;color:#fff;border-color:#526cff}.demo3d-ready{margin-left:auto;display:flex;align-items:center;gap:6px;color:#728095;font-size:8px;font-weight:850;white-space:nowrap}.demo3d-ready i{width:7px;height:7px;border-radius:50%;background:#42cdbf;box-shadow:0 0 0 4px rgba(66,205,191,.14)}.demo3d-stage{position:relative;min-height:0;overflow:hidden;background:linear-gradient(180deg,#f6f8fb,#e9eef5)}#demo3dViewport canvas{display:block;width:100%;height:100%;outline:0}.demo3d-hud{position:absolute;left:12px;top:12px;z-index:5;display:flex;gap:6px;pointer-events:none}.demo3d-hud span{min-width:90px;padding:8px 10px;border:1px solid rgba(177,189,205,.68);border-radius:8px;background:rgba(255,255,255,.9);display:grid;gap:2px;box-shadow:0 8px 18px rgba(46,60,82,.08)}.demo3d-hud small{font-size:6px;color:#7f8a9d;font-weight:900}.demo3d-hud b{font-size:13px;color:#19243a}.demo3d-section,.demo3d-4d{position:absolute;left:50%;bottom:16px;z-index:8;transform:translateX(-50%);min-width:min(480px,80%);padding:10px;border:1px solid #ccd5e2;border-radius:10px;background:rgba(255,255,255,.94);display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;color:#27344b;box-shadow:0 14px 32px rgba(29,44,69,.14)}.demo3d-section[hidden],.demo3d-4d[hidden]{display:none}.demo3d-section small,.demo3d-4d small{font-size:7px;color:#6574e7;font-weight:900}.demo3d-section input,.demo3d-4d input{accent-color:#6277f3}.demo3d-section button{width:28px;height:28px;border:1px solid #d2d9e4;border-radius:7px;background:#f7f9fc}.demo3d-4d{grid-template-columns:auto 1fr 46px}.demo3d-4d>span{grid-column:1/-1;font-size:7px;color:#7b8799;display:flex;gap:8px}.demo3d-4d>span i{width:8px;height:8px;border-radius:2px;background:#9aa5b5}.demo3d-4d>span i:nth-of-type(2){background:#667cff}.demo3d-4d>span i:nth-of-type(3){background:#39bcae}.demo3d-toast{position:absolute;left:50%;bottom:76px;z-index:20;transform:translate(-50%,12px);padding:9px 13px;border-radius:9px;background:#111b2e;color:#fff;font-size:9px;opacity:0;pointer-events:none;transition:.2s;box-shadow:0 10px 30px rgba(0,0,0,.2)}.demo3d-toast.show{opacity:1;transform:translate(-50%,0)}.demo3d-inspector-empty{height:100%;display:grid;place-content:center;justify-items:center;text-align:center;color:#7e8ca3}.demo3d-inspector-empty>span{width:56px;height:56px;border:1px solid #34425f;border-radius:14px;background:#141f34;display:grid;place-items:center;color:#8392ff;font-size:20px}.demo3d-inspector-empty strong{margin-top:12px;color:#e8eefb;font-size:13px}.demo3d-inspector-empty p{max-width:240px;margin:7px 0 0;font-size:9px;line-height:1.6}.demo3d-card{display:grid;gap:13px}.demo3d-card>small{font-size:7px;font-weight:900;letter-spacing:.12em;color:#8392ff}.demo3d-card h2{margin:0;font-size:19px;line-height:1.15}.demo3d-chip{width:max-content;padding:5px 8px;border:1px solid #34435f;border-radius:999px;background:#151f34;color:#aeb8ff;font-size:8px;font-weight:850}.demo3d-props{display:grid;border-top:1px solid #283650}.demo3d-props div{padding:9px 0;border-bottom:1px solid #283650;display:grid;grid-template-columns:90px 1fr;gap:8px}.demo3d-props small{color:#73829a;font-size:8px}.demo3d-props b{font-size:9px;overflow-wrap:anywhere}.demo3d-inspector-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.demo3d-inspector-actions button{min-height:38px;border:1px solid #35435e;border-radius:8px;background:#151f34;color:#eaf0fb;font:inherit;font-size:8px;font-weight:850}.demo3d-inspector-actions .primary{grid-column:1/-1;border:0;background:linear-gradient(135deg,#5f70ff,#338ee9)}.demo3d-issue{padding:9px;border:1px solid #52384a;border-radius:8px;background:#1d1826}.demo3d-issue b{font-size:9px;color:#f0c5ca}.demo3d-issue p{margin:4px 0 0;font-size:8px;color:#9a8c9a}.demo3d-measure-label{position:absolute;z-index:10;padding:6px 8px;border-radius:7px;background:#14213a;color:#fff;font-size:8px;font-weight:800;pointer-events:none}
@media(max-width:1120px){.demo3d-topbar{grid-template-columns:220px 1fr 270px}.demo3d-object{display:none}.demo3d-layout{grid-template-columns:240px minmax(0,1fr) 290px}.demo3d-toolbar button span{display:none}}@media(max-width:760px){body{overflow:auto}.demo3d-shell{height:auto;min-height:100vh}.demo3d-topbar{grid-template-columns:1fr auto;padding:9px 10px}.demo3d-file{grid-column:1/-1}.demo3d-actions span,.demo3d-actions .primary{display:none}.demo3d-layout{grid-template-columns:1fr;min-height:780px}.demo3d-left{display:none}.demo3d-inspector{position:fixed;left:12px;right:12px;bottom:12px;z-index:30;max-height:44vh;border:1px solid #33435f;border-radius:14px;display:none}.demo3d-inspector.open{display:block}.demo3d-stage-shell{min-height:760px}.demo3d-hud span{min-width:70px}.demo3d-hud span:nth-child(n+3){display:none}}