.diag-nav-spacer{height:72px}.perspective-bar{z-index:100;backdrop-filter:blur(12px);background:#1a120bf7;border-bottom:1px solid #b8922a1f;position:sticky;top:72px}.persp-inner{align-items:center;gap:10px;max-width:960px;height:44px;margin:0 auto;padding:0 48px;font-family:DM Sans,sans-serif;font-size:12px;display:flex}.persp-back{color:var(--gold);text-decoration:none}.persp-back:hover{opacity:.75}.persp-sep{color:#f5f0e833}.persp-title{color:#f5f0e880}.persp-badge{letter-spacing:3px;color:var(--gold);background:#b8922a1a;border:1px solid #b8922a33;margin-left:auto;padding:3px 10px;font-family:Bebas Neue,sans-serif;font-size:10px}.diag-page{background:var(--espresso);color:var(--cream)}.diag-header{background:var(--chocolate);border-bottom:1px solid #b8922a26;max-width:960px;margin:0 auto;padding:48px}.diag-pillar-label{letter-spacing:5px;color:var(--gold);margin-bottom:16px;font-family:Bebas Neue,sans-serif;font-size:11px}.diag-headline{color:var(--cream);margin:16px 0;font-family:DM Serif Display,serif;font-size:clamp(32px,5vw,52px);line-height:1.1}.diag-intro{color:#f5f0e8a6;border-left:2px solid var(--gold);max-width:680px;margin:0;padding-left:20px;font-size:15px;line-height:1.7}.diag-tool-wrap{max-width:960px;margin:0 auto;padding:48px}.diag-post-ctas{background:var(--chocolate);border-top:1px solid #b8922a1f;padding:48px}.diag-post-inner{max-width:960px;margin:0 auto}.diag-post-label{letter-spacing:4px;color:var(--gold);margin-bottom:20px;font-family:Bebas Neue,sans-serif;font-size:11px}.diag-post-row{flex-wrap:wrap;gap:16px;display:flex}.diag-post-btn-outline{letter-spacing:2px;color:var(--gold);border:1px solid #b8922a66;padding:12px 24px;font-family:Bebas Neue,sans-serif;font-size:13px;text-decoration:none;transition:all .2s}.diag-post-btn-outline:hover{background:#b8922a14}.diag-post-btn-primary{letter-spacing:2px;background:var(--gold);color:var(--espresso);padding:12px 24px;font-family:Bebas Neue,sans-serif;font-size:13px;text-decoration:none;transition:all .2s}.diag-post-btn-primary:hover{background:var(--cream)}.cld-wrap{flex-direction:column;gap:12px;width:100%;display:flex}.cld-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.cld-examples{color:#f5f0e859;align-items:center;gap:8px;display:flex}.cld-select{background:var(--chocolate);color:var(--cream);cursor:pointer;appearance:none;border:1px solid #b8922a33;border-radius:2px;outline:none;padding:6px 10px;font-family:DM Sans,sans-serif;font-size:12px}.cld-select:focus{border-color:#b8922a80}.cld-modes{gap:6px;display:flex}.cld-mode-btn{color:#f5f0e88c;cursor:pointer;background:#f5f0e80a;border:1px solid #f5f0e814;border-radius:2px;align-items:center;gap:6px;padding:8px 14px;font-family:DM Sans,sans-serif;font-size:12px;font-weight:500;transition:background .15s,border-color .15s,color .15s;display:flex}.cld-mode-btn:hover{color:#f5f0e8e6;background:#b8922a0f;border-color:#b8922a40}.cld-mode-active{color:#10b981!important;background:#10b9811f!important;border-color:#10b98166!important}.cld-hint{color:#f5f0e84d;min-height:18px;font-family:DM Sans,sans-serif;font-size:12px;font-style:italic}.cld-canvas-wrap{background:var(--chocolate);border:1px solid #f5f0e80f;overflow:hidden}.cld-svg{touch-action:none;width:100%;height:60vh;min-height:320px;display:block}.cld-loops{background:var(--chocolate);border:1px solid #f5f0e80f;padding:20px}.cld-loops-title{letter-spacing:3px;color:#f5f0e866;margin-bottom:12px;font-family:Bebas Neue,sans-serif;font-size:11px}.cld-loops-empty{color:#f5f0e838;font-family:DM Sans,sans-serif;font-size:12px;font-style:italic}.cld-loops-list{flex-direction:column;gap:10px;display:flex}.cld-loop-row{align-items:flex-start;gap:10px;display:flex}.cld-loop-badge{letter-spacing:1px;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-family:Bebas Neue,sans-serif;font-size:13px;display:flex}.cld-badge-r{color:#6ee7b7;background:#10b9811a;border:1px solid #10b9814d}.cld-badge-b{color:#fdba74;background:#f973161a;border:1px solid #f973164d}.cld-loop-path{color:#f5f0e873;padding-top:4px;font-family:DM Sans,sans-serif;font-size:12px;line-height:1.65}.cld-loop-r{color:#6ee7b7}.cld-loop-b{color:#fdba74}@media (width<=768px){.diag-header,.diag-tool-wrap,.diag-post-ctas{padding:28px 20px}.persp-inner{padding:0 20px}.cld-toolbar{flex-direction:column;align-items:flex-start}.cld-modes{flex-wrap:wrap}.cld-svg{height:50vh}}