.mobile-ide{display:flex;flex-direction:column;width:100%;height:100dvh;background:#0b1120;overflow:hidden}.mobile-ide__content{flex:1 1;overflow:hidden}.mobile-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#94a3b8;font-size:16px;font-weight:500}.app-header{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#0f172a;border-bottom:1px solid #1f2937;flex-shrink:0}.app-header__left,.app-header__right{display:flex;align-items:center;gap:8px}.app-header__logo{display:flex;align-items:center;gap:10px;text-decoration:none}.app-header__logo span{color:#f8fafc;font-size:18px;font-weight:700;letter-spacing:-.3px}.app-header__icon{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:none;border-radius:10px;background:transparent;color:#cbd5e1;transition:background .2s ease,color .2s ease,transform .15s ease;-webkit-tap-highlight-color:transparent}.app-header__icon:hover{background:rgba(255,255,255,.05)}.app-header__icon:active{transform:scale(.95)}.app-header__icon svg{stroke-width:2}.compiler-bar{height:56px;justify-content:space-between;gap:12px;background:#111827;border-bottom:1px solid #1f2937;flex-shrink:0}.compiler-bar,.compiler-bar__language{display:flex;align-items:center;padding:0 14px}.compiler-bar__language{flex:1 1;max-width:-moz-fit-content;max-width:fit-content;height:42px;gap:10px;border:1px solid #1f2937;border-radius:12px;background:#0f172a;color:#f8fafc;font-size:14px;font-weight:600;transition:background .2s ease,border-color .2s ease;-webkit-tap-highlight-color:transparent}.compiler-bar__language:active{background:#1e293b;border-color:#334155}.compiler-bar__language span{flex:1 1;text-align:left}.compiler-bar__run{height:42px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 18px;border:none;border-radius:12px;background:#22c55e;color:#ffffff;font-size:14px;font-weight:700;transition:transform .15s ease,opacity .2s ease,box-shadow .2s ease;box-shadow:0 4px 12px rgba(34,197,94,.25);-webkit-tap-highlight-color:transparent}.compiler-bar__run:active{transform:scale(.97)}.compiler-bar__run:disabled{opacity:.7}.compiler-bar__run svg{flex-shrink:0}.compiler-bar__dropdown{position:relative;flex:1 1;max-width:-moz-fit-content;max-width:fit-content}.compiler-bar__menu{position:absolute;top:calc(100% + 8px);left:0;min-width:220px;display:flex;flex-direction:column;padding:6px;background:#0f172a;border:1px solid #1f2937;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.35);z-index:100}.compiler-bar__option{width:100%;height:42px;display:flex;align-items:center;gap:10px;padding:0 12px;border:none;border-radius:8px;background:transparent;color:#f8fafc;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;-webkit-tap-highlight-color:transparent}.compiler-bar__option:hover{background:#1e293b}.compiler-bar__option:active{background:#334155}.compiler-bar__option.active{background:#2563eb;color:#ffffff}.compiler-bar__option svg{flex-shrink:0}.compiler-bar__language svg:last-child{transition:transform .2s ease}.compiler-bar__language svg:last-child.open{transform:rotate(180deg)}.sidebar-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;z-index:998}.sidebar-backdrop.show{opacity:1;visibility:visible}.sidebar{position:fixed;top:0;left:0;bottom:0;width:290px;max-width:85vw;display:flex;flex-direction:column;background:#0f172a;border-right:1px solid #1f2937;transform:translateX(-100%);transition:transform .25s ease;z-index:999}.sidebar.open{transform:translateX(0)}.sidebar-header{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #1f2937}.sidebar-header span{color:#f8fafc;font-size:20px;font-weight:700}.sidebar-header button{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:none;border-radius:10px;background:transparent;color:#94a3b8}.sidebar-section{padding:20px 16px 8px}.sidebar-section h3{margin-bottom:12px;color:#64748b;font-size:11px;font-weight:700;letter-spacing:1px}.sidebar-item{display:flex;align-items:center;height:46px;padding:0 14px;border-radius:12px;color:#cbd5e1;text-decoration:none;font-size:14px;font-weight:500;transition:background .2s ease,color .2s ease}.sidebar-item:hover{background:#1e293b}.sidebar-item.active{background:rgba(79,124,255,.12);color:#4f7cff}.bottom-nav{height:72px;background:rgba(15,23,42,.98);border-top:1px solid #1f2937;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);flex-shrink:0}.bottom-nav,.bottom-nav__item{display:flex;align-items:center}.bottom-nav__item{flex:1 1;height:100%;flex-direction:column;justify-content:center;gap:4px;border:none;background:transparent;color:#64748b;transition:color .2s ease,background .2s ease;-webkit-tap-highlight-color:transparent}.bottom-nav__item span{font-size:11px;font-weight:600}.bottom-nav__item.active{color:#4f7cff}.bottom-nav__item:active{background:rgba(255,255,255,.04)}.editor-screen{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden;background:#0b1120}.editor-screen__tab{display:flex;align-items:center;height:42px;padding:0 16px;background:#111827;border-bottom:1px solid #1f2937;color:#f8fafc;font-size:13px;font-weight:600;flex-shrink:0}.editor-screen__body{flex:1 1;overflow:hidden}.editor-screen__body .margin,.editor-screen__body .monaco-editor,.editor-screen__body .monaco-editor-background{background:#0b1120!important}.editor-screen__body .monaco-editor{padding-top:4px}.output-screen{display:flex;flex-direction:column;flex:0 0 320px;width:100%;background:#0b1120}.output-screen__header{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:#111827;border-bottom:1px solid #1f2937;flex-shrink:0}.output-screen__title{display:flex;align-items:center;gap:10px;color:#f8fafc;font-size:13px;font-weight:600}.output-screen__copy{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:none;border-radius:8px;background:transparent;color:#94a3b8;transition:.2s}.output-screen__copy:active{transform:scale(.95)}.output-screen__body{flex:1 1;overflow-y:auto;padding:12px 16px;background:#020617;font-family:JetBrains Mono,monospace;font-size:13px;line-height:1.55;color:#e2e8f0}.output-screen__body pre{white-space:pre-wrap;word-break:break-word}.output-screen__empty{display:flex;align-items:center;justify-content:center;height:100%;color:#64748b;font-size:14px;text-align:center}.output-screen__body::-webkit-scrollbar{width:6px}.output-screen__body::-webkit-scrollbar-thumb{background:#334155;border-radius:999px}.output-screen__progress{width:100%;height:6px;background:#1f2937;border-radius:999px;overflow:hidden}.output-screen__progress-bar{height:100%;width:0;background:#3b82f6;transition:width .18s linear}.files-screen{display:flex;flex-direction:column;width:100%;height:100%;background:#0b1120}.files-screen__header{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid #1f2937;background:#111827;flex-shrink:0}.files-screen__header span{color:#f8fafc;font-size:14px;font-weight:600}.files-screen__add{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:none;border-radius:10px;background:transparent;color:#94a3b8;transition:background .2s ease,color .2s ease;-webkit-tap-highlight-color:transparent}.files-screen__add:active{background:rgba(255,255,255,.06);color:#ffffff}.files-screen__list{flex:1 1;overflow-y:auto;padding:12px}.file-item{width:100%;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;margin-bottom:10px;border:1px solid #1f2937;border-radius:14px;background:#111827;color:#cbd5e1;transition:background .2s ease,border-color .2s ease}.file-item.active{border-color:#4f7cff;background:rgba(79,124,255,.12);color:#ffffff}.file-item__left{display:flex;align-items:center;gap:12px}.file-item__left span{font-size:14px;font-weight:500}.files-screen__list::-webkit-scrollbar{width:6px}.files-screen__list::-webkit-scrollbar-thumb{background:#334155;border-radius:999px}.settings-screen{display:flex;flex-direction:column;width:100%;height:100%;background:#0b1120}.settings-screen__header{height:48px;display:flex;align-items:center;padding:0 16px;border-bottom:1px solid #1f2937;background:#111827;flex-shrink:0}.settings-screen__header span{color:#f8fafc;font-size:14px;font-weight:600}.settings-screen__list{flex:1 1;overflow-y:auto;padding:12px}.settings-item{width:100%;display:flex;align-items:center;justify-content:space-between;padding:16px;margin-bottom:12px;border:1px solid #1f2937;border-radius:16px;background:#111827;color:#e2e8f0;transition:border-color .2s ease,background .2s ease;-webkit-tap-highlight-color:transparent}.settings-item:active{border-color:#4f7cff;background:rgba(79,124,255,.08)}.settings-item__left{display:flex;align-items:center;gap:14px}.settings-item__icon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#1e293b;color:#4f7cff}.settings-item__content{display:flex;flex-direction:column;gap:2px;text-align:left}.settings-item__title{font-size:14px;font-weight:600;color:#f8fafc}.settings-item__value{font-size:12px;color:#94a3b8}.settings-screen__list::-webkit-scrollbar{width:6px}.settings-screen__list::-webkit-scrollbar-thumb{background:#334155;border-radius:999px}