.cpn-act{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;min-width:32px;height:32px;padding:0 12px;border:0;border-radius:999px;background:var(--ts-tint-2);color:var(--ts-fg-secondary);font:inherit;font-size:13px;font-weight:500;text-decoration:none;cursor:pointer;transition:background-color .16s var(--ts-ease),color .16s var(--ts-ease),scale .22s var(--ts-ease)}.cpn-act[aria-label]{padding:0}.cpn-act{position:relative}@media (hover:hover){.cpn-act:hover{background:var(--ts-tint-3);color:var(--ts-fg)}}.cpn-act:active{scale:.94}.cpn-primary,.cpn-primary:hover{background:var(--ts-fg);color:var(--ts-fg-inverse)}@media (hover:hover){.cpn-primary:hover{opacity:.88}}.cpn{width:min(980px,calc(100vw - 32px));height:min(620px,calc(100dvh - 48px));max-width:none;max-height:none;margin:auto;padding:0;overflow:visible;border:0;background:none;color:var(--ts-fg);box-shadow:none;animation:cpn-in .32s var(--ts-ease) both}.cpn[open]{display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-gap:10px;gap:10px}.cpn::-webkit-backdrop{background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:cpn-fade .24s ease both}.cpn::backdrop{background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:cpn-fade .24s ease both}.cpn[data-closing]{animation:cpn-out .2s var(--ts-ease-exit) both}.cpn[data-closing]::-webkit-backdrop{animation:cpn-fade .2s ease reverse both}.cpn[data-closing]::backdrop{animation:cpn-fade .2s ease reverse both}@keyframes cpn-in{0%{opacity:0;scale:.97;translate:0 12px}}@keyframes cpn-out{to{opacity:0;scale:.98;translate:0 8px}}@keyframes cpn-fade{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.cpn::-webkit-backdrop{animation:none!important}.cpn,.cpn::backdrop{animation:none!important}}html:has(dialog.cpn[open]){overflow:hidden}dialog.cpn[tabindex]:focus-visible{outline:0;box-shadow:none}.cpn :focus-visible{outline:2px solid var(--ts-accent);outline-offset:2px;box-shadow:none}.cpn-side,.cpn-stage{min-width:0;overflow:hidden;border-radius:24px;background:var(--ts-raised);box-shadow:0 0 0 1px rgba(var(--ts-fg-rgb),.08),0 24px 64px rgba(0,0,0,.28)}.cpn-stage{--ts-backdrop:var(--ts-raised);--ts-on-backdrop:var(--ts-fg);--ts-on-backdrop-rgb:var(--ts-fg-rgb);position:relative;display:flex;flex-direction:column;background:var(--ts-tint-1)}.cpn-stage[data-view=code]{background:var(--ts-sunken)}.cpn-bar{display:flex;align-items:center;gap:8px;min-width:0;padding:12px}.cpn-seg{position:relative;display:grid;grid-template-columns:1fr 1fr;flex-shrink:0;padding:3px;border-radius:999px;background:var(--ts-tint-2)}.cpn-seg:before{content:"";position:absolute;inset:3px auto 3px 3px;width:calc(50% - 3px);border-radius:999px;background:var(--ts-fg);transition:translate .32s var(--ts-ease)}.cpn-stage[data-view=code] .cpn-seg:before{translate:100% 0}.cpn-seg button{position:relative;height:28px;padding:0 14px;border:0;border-radius:999px;background:none;color:var(--ts-fg-muted);font:inherit;font-size:13px;font-weight:500;white-space:nowrap;cursor:pointer;transition:color .16s var(--ts-ease)}@media (hover:hover){.cpn-files button:hover,.cpn-seg button:hover{color:var(--ts-fg)}}.cpn-filebar{display:flex;align-items:center;gap:8px;margin:0 12px;padding-right:4px;border-bottom:1px solid rgba(var(--ts-fg-rgb),.08)}.cpn-seg button[aria-selected=true]{color:var(--ts-fg-inverse)}.cpn-files{display:flex;flex:1 1;gap:18px;min-width:0;padding-left:12px;overflow-x:auto;scrollbar-width:none}.cpn-files button{display:inline-flex;align-items:center;gap:7px;height:40px;margin-bottom:-1px;padding:0;border:0;border-bottom:2px solid transparent;background:none;color:var(--ts-fg-muted);font:inherit;font-size:13px;font-weight:500;white-space:nowrap;cursor:pointer;transition:color .16s var(--ts-ease),border-color .16s var(--ts-ease)}.cpn-files button[aria-selected=true]{border-bottom-color:var(--ts-fg);color:var(--ts-fg)}.cpn-files b{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--ts-tint-2);font-size:11px;font-weight:600;transition:background-color .16s var(--ts-ease),color .16s var(--ts-ease)}.cpn-files [aria-selected=true] b{background:var(--ts-fg);color:var(--ts-fg-inverse)}.cpn-files small{color:var(--ts-fg-muted);font-size:12px;font-weight:400}.cpn-filebar .cpn-act{height:28px;padding:0 10px;font-size:12px}.cpn-view{display:grid;flex:1 1;place-items:center;min-height:0;padding:24px 32px 48px;overflow:auto}.cpn-view>*{max-width:100%}.cpn-code{margin:0;padding:16px 24px 24px;color:var(--ts-fg);font:12.5px/1.65 ui-monospace,SF Mono,Menlo,monospace;-moz-tab-size:2;tab-size:2}.cpn-code,.cpn-stack{flex:1 1;min-height:0;overflow:auto}.cpn-stack{display:grid;grid-template-columns:minmax(0,1fr);grid-gap:10px;gap:10px;align-content:start;padding:14px}.cpn-file{min-width:0;border-radius:16px;background:var(--ts-raised);box-shadow:0 0 0 1px rgba(var(--ts-fg-rgb),.08)}.cpn-file header{display:flex;align-items:center;gap:8px;padding:10px 10px 10px 14px;border-bottom:1px solid rgba(var(--ts-fg-rgb),.06);color:var(--ts-fg-muted)}.cpn-file header svg{flex-shrink:0}.cpn-file header span{min-width:0;overflow:hidden;color:var(--ts-fg);font:12.5px ui-monospace,SF Mono,Menlo,monospace;text-overflow:ellipsis;white-space:nowrap}.cpn-file header small{font-size:12px;white-space:nowrap}.cpn-file .cpn-act{height:26px;margin-left:auto;padding:0 10px;background:none;font-size:12px}@media (hover:hover){.cpn-file .cpn-act:hover{background:var(--ts-tint-2)}}.cpn-file pre{max-height:280px;margin:0;padding:12px 14px;overflow:auto;color:var(--ts-fg);font:12px/1.6 ui-monospace,SF Mono,Menlo,monospace;-moz-tab-size:2;tab-size:2}.cpn-file.cpn-card{background:var(--ts-tint-1);box-shadow:none}.cpn-file.cpn-card pre{max-height:420px}.cpn-code[hidden],.cpn-stack[hidden],.cpn-view[hidden]{display:none}.cpn-side{display:flex;flex-direction:column;gap:12px;padding:20px;overflow-y:auto}.cpn-side header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.cpn-side h2{margin:0;font-size:24px;font-weight:600;line-height:1.15;letter-spacing:-.03em}.cpn-about{margin:0;color:var(--ts-fg-secondary);font-size:14px;line-height:1.55;text-wrap:pretty}.cpn-cta{display:flex;gap:8px;margin-top:auto}.cpn-cta .cpn-act{flex:1 1;height:44px;padding:0 18px;font-size:14px}.cpn-note{margin:0;color:var(--ts-fg-muted);font-size:12px;line-height:1.5}.cpn-cta .cpn-act[aria-label]{flex:none;width:44px;padding:0}.pro-tag{display:inline-flex;flex:none;align-items:center;height:18px;padding:0 7px;border-radius:999px;background:var(--ts-tint-3);color:var(--ts-fg-muted);font-size:11px;font-weight:600;letter-spacing:.02em;line-height:1}.tile-name+.pro-tag{margin-right:auto}.cpn-ttl{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}.cpn-lock{display:grid;justify-items:center;align-content:center;grid-gap:10px;gap:10px;height:100%;min-height:240px;padding:24px;color:var(--ts-fg);font:14px/1.5 var(--ts-font);text-align:center}.cpn-lock svg{color:var(--ts-fg-muted)}.cpn-lock .cpn-lock-h{margin:0;color:var(--ts-fg);font-size:18px;font-weight:600;letter-spacing:-.03em}.cpn-lock p{max-width:36ch;margin:0 0 6px;color:var(--ts-fg-muted);text-wrap:pretty}.cpn-lock .cpn-act{height:40px;padding:0 20px;font-size:14px}.cpn-lock-key{display:inline-flex;align-items:center;min-height:32px;padding-inline:8px;color:var(--ts-fg-muted);font-size:13px;font-weight:500;text-decoration:none}@media (hover:hover){.cpn-lock-key:hover{color:var(--ts-fg)}}.cpn-bar .cpn-act{margin-left:auto}@media (pointer:coarse){.cpn-act:after{content:"";position:absolute;inset-block:calc(50% - 22px);inset-inline:min(0px,calc(50% - 22px))}.cpn-seg button{height:38px}.cpn-files button{height:44px}}@media (max-width:860px){.cpn{height:calc(100dvh - 24px)}.cpn[open]{grid-template-columns:1fr;grid-template-rows:minmax(0,55fr) auto;gap:8px}.cpn-side{max-height:40dvh;padding:16px}.cpn-side h2{font-size:22px}}@media (max-width:600px){.cpn{width:100%;height:100dvh;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}.cpn-view{padding:16px 12px 24px}.cpn-code,.cpn-file pre,.cpn-side,.cpn-stack,.cpn-view{overscroll-behavior:contain}.cpn-side header{position:-webkit-sticky;position:sticky;top:0;z-index:1;margin:-16px -16px 0;padding:16px;background:var(--ts-raised)}}