.projects-head{display:flex;align-items:end;justify-content:space-between;gap:30px;padding:75px 0 42px}.projects-head h1{font-size:clamp(3rem,7vw,6rem);margin:8px 0}.projects-head p{color:#88968f}.projects-head .button{border:0}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:100px}.project-card,.empty-project{min-height:260px;padding:27px;display:flex;flex-direction:column;border:1px solid #29372f;border-radius:22px;background:#111b17}.project-card>div:first-child{display:flex;justify-content:space-between;gap:10px}.project-language,.project-visibility{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.project-language{background:#8bffbd;color:#07100c}.project-visibility{color:#a8b5ae;background:#1d2a24}.project-card h2{font-size:1.6rem;margin:auto 0 10px}.project-card>p{color:#7d8a83;font-size:.72rem}.project-actions{display:flex!important;justify-content:flex-start!important;align-items:center;gap:13px!important;margin-top:18px;padding-top:16px;border-top:1px solid #26342d}.project-actions a,.project-actions button{padding:0;border:0;background:transparent;color:#8bffbd;font:700 .68rem inherit;cursor:pointer}.project-actions .danger{color:#ff96a6}.project-actions form{margin:0}.empty-project{grid-column:1/-1;text-align:center;align-items:center;justify-content:center}.empty-project>span{font-size:2rem;color:#8bffbd}.empty-project h2{font-size:2rem;margin:18px 0 8px}.empty-project p{color:#87948d}.empty-project .button{border:0;margin-top:14px}.project-modal{width:min(520px,calc(100% - 30px));padding:0;border:1px solid #34433c;border-radius:22px;color:#fff;background:#111b17;box-shadow:0 40px 100px #000}.project-modal::backdrop{background:#030806cc;backdrop-filter:blur(6px)}.project-modal form{padding:30px}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head h2{margin:0}.modal-head button{border:0;background:transparent;color:#fff;font-size:1.7rem;cursor:pointer}.modal-help{color:#829087;font-size:.73rem;line-height:1.55}.project-modal textarea{min-height:110px;resize:vertical;background:#0b130f;border:1px solid #34433c;border-radius:12px;color:#fff;padding:14px;font:inherit}.studio{max-width:none!important;margin:0!important;height:calc(100vh - 84px);display:flex;flex-direction:column;overflow:hidden}.studio-toolbar{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 18px;border-block:1px solid #25322c;background:#0e1713}.studio-toolbar>div{display:flex;align-items:center;gap:13px}.studio-toolbar a{color:#8c9992;font-size:.72rem}.studio-toolbar input{width:min(360px,38vw);border:1px solid transparent;background:transparent;color:#fff;padding:9px;border-radius:9px;font-weight:800}.studio-toolbar input:focus{outline:0;border-color:#32443b;background:#111d18}.save-state{font-size:.68rem;color:#7e8c84}.save-state .error{color:#ff92a4}.studio-toolbar .button{min-height:38px;padding:8px 14px;border:0}.studio-layout{flex:1;min-height:0;display:grid;grid-template-columns:210px minmax(350px,1fr) minmax(360px,.9fr)}.files-pane,.code-pane,.output-pane{min-width:0;min-height:0;background:#0c1411}.files-pane{border-right:1px solid #26332d}.pane-title{height:46px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #26332d;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em}.pane-title button{width:27px;height:27px;border:1px solid #35463d;border-radius:8px;background:#15211c;color:#8bffbd;cursor:pointer}#fileList{padding:8px}#fileList button{width:100%;display:flex;gap:9px;align-items:center;padding:9px;border:0;border-radius:8px;background:transparent;color:#9eaaa4;text-align:left;font-size:.74rem;cursor:pointer}#fileList button:hover,#fileList button.active{background:#19251f;color:#fff}#fileList button span{width:25px;color:#8bffbd;font-size:.6rem;font-weight:900}.code-pane{display:flex;flex-direction:column;border-right:1px solid #26332d}.editor-tabs{height:46px;display:flex;overflow-x:auto;border-bottom:1px solid #26332d}.editor-tabs button{flex:0 0 auto;display:flex;gap:14px;align-items:center;padding:0 14px;border:0;border-right:1px solid #26332d;background:#101916;color:#849088;font-size:.7rem;cursor:pointer}.editor-tabs button.active{background:#0b1210;color:#fff;border-top:2px solid #8bffbd}.editor-tabs button span{color:#69766f;font-size:1rem}.code-wrap{flex:1;min-height:0;display:grid;grid-template-columns:48px 1fr;background:#0b1210}.line-numbers{padding:18px 10px;overflow:hidden;color:#48554e;text-align:right;font:13px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre}.code-wrap textarea{width:100%;height:100%;resize:none;padding:18px;border:0;outline:0;background:transparent;color:#dfe8e3;font:13px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;tab-size:2;white-space:pre}.output-pane{position:relative;display:flex;flex-direction:column}.output-tabs{height:46px;display:flex;border-bottom:1px solid #26332d}.output-tabs button{padding:0 15px;border:0;background:transparent;color:#829088;font-size:.7rem;cursor:pointer}.output-tabs button.active{color:#8bffbd}.preview-actions{position:absolute;right:10px;top:9px;z-index:2;display:flex;gap:5px}.preview-actions button{padding:5px 8px;border:1px solid #35443d;border-radius:6px;background:#17221d;color:#aab6b0;font-size:.6rem;cursor:pointer}#projectPreview{flex:1;width:100%;border:0;background:#fff;align-self:center;transition:width .2s}#projectPreview.mobile{width:390px;max-width:100%}#projectConsole{flex:1;margin:0;padding:18px;overflow:auto;background:#070c0a;color:#a9b6af;font:12px/1.6 ui-monospace,monospace}.runtime-pending{margin:auto;padding:35px;text-align:center}.runtime-pending span{color:#8bffbd;font-weight:800}.runtime-pending p{max-width:430px;color:#84928a;font-size:.8rem}.shared-head{display:flex;align-items:end;justify-content:space-between;gap:25px;padding:70px 0 35px}.shared-head h1{font-size:clamp(2.8rem,6vw,5.5rem);margin:14px 0}.shared-head p{color:#87958e}.shared-preview{height:70vh;margin-bottom:90px;padding:10px;border:1px solid #2b3932;border-radius:20px;background:#111b17}.shared-preview iframe{width:100%;height:100%;border:0;border-radius:13px;background:#fff}.shared-code{padding-bottom:90px}.shared-code>p{color:#9aa69f}.shared-code article{margin-top:15px;border:1px solid #2b3932;border-radius:16px;overflow:hidden}.shared-code article>strong{display:block;padding:11px 15px;background:#14201a}.shared-code pre{margin:0;padding:20px;overflow:auto;background:#080e0b;color:#d8e2dc}@media(max-width:1050px){.projects-grid{grid-template-columns:1fr 1fr}.studio-layout{grid-template-columns:170px 1fr}.output-pane{position:fixed;inset:auto 0 0 0;height:45vh;z-index:8;border-top:1px solid #35443d;transform:translateY(calc(100% - 46px));transition:.25s}.output-pane:focus-within,.output-pane:hover{transform:none}}@media(max-width:650px){.projects-head,.shared-head{align-items:flex-start;flex-direction:column}.projects-grid{grid-template-columns:1fr}.studio-toolbar{align-items:flex-start}.studio-toolbar>div:first-child{display:grid}.studio-toolbar input{width:48vw}.save-state span{display:none}.studio-layout{grid-template-columns:1fr}.files-pane{display:none}.editor-tabs{overflow-x:auto}.shared-head .button{width:100%}}
