.basic-online{--blue:#2057a6;--green:#21894a;--dark:#18263a;--line:#dce4ef;max-width:1180px;margin:0 auto 64px;color:var(--dark)}
.basic-online__lead{max-width:850px;margin:0 0 22px;color:#53657d;font-size:17px;line-height:1.6}
.basic-online__toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.basic-online button,.basic-online__upload{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border:1px solid #b8c9de;border-radius:9px;background:#fff;color:var(--blue);font-weight:700;cursor:pointer;text-decoration:none!important}.basic-online button:hover,.basic-online__upload:hover{background:#f0f6ff}.basic-online button:disabled{opacity:.45;cursor:not-allowed}
.basic-online__primary{border-color:var(--blue)!important;background:var(--blue)!important;color:#fff!important}.basic-online__run{border-color:#18733c!important;background:var(--green)!important;color:#fff!important}.basic-online__upload input{position:absolute;width:1px;height:1px;opacity:0}.basic-online__stats{margin-left:auto;color:#64758b;font-size:14px}
.basic-online__workspace{display:grid;grid-template-columns:minmax(0,1fr) 330px;min-height:540px;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 6px 24px rgba(32,61,98,.07)}
.basic-online__editor{display:grid;grid-template-columns:54px minmax(0,1fr);min-width:0;background:#17202d}.basic-online__lines{height:540px;margin:0;padding:18px 10px;overflow:hidden;border-right:1px solid #344255;background:#111923;color:#718198;text-align:right;font:14px/1.55 Consolas,"Courier New",monospace;user-select:none}.basic-online__source{width:100%;height:540px;padding:18px;border:0;outline:0;resize:none;background:#17202d;color:#e7edf6;caret-color:#69a7ff;tab-size:4;font:14px/1.55 Consolas,"Courier New",monospace;white-space:pre;overflow:auto}
.basic-online__side{display:flex;min-width:0;flex-direction:column;border-left:1px solid var(--line);background:#f8fafc}.basic-online__side h3{margin:0;padding:18px 18px 10px;font-size:17px}.basic-online__help{margin:0;padding:0 24px 16px;color:#5d6c80;line-height:1.55}.basic-online__name{display:flex;gap:8px;align-items:center;margin:0 16px 16px;font-weight:600}.basic-online__name input{min-width:0;flex:1;padding:9px 10px;border:1px solid #b9c7d8;border-radius:8px;text-transform:uppercase}.basic-online__name span{color:#748398}
.basic-online__status{margin:0 16px 14px;padding:12px 13px;border-radius:9px;background:#edf4ff;color:#174a91;line-height:1.45}.basic-online__status.is-error{background:#fff0f0;color:#a72b2b}.basic-online__status.is-success{background:#eaf8ef;color:#16703a}.basic-online__errors{display:flex;max-height:220px;padding:0 16px 16px;overflow:auto;flex-direction:column;gap:7px}.basic-online__errors button{display:block;min-height:0;padding:9px 10px;border-color:#efc4c4;background:#fff7f7;color:#a12d2d;text-align:left;font-weight:500}.basic-online__privacy{margin-top:auto;padding:14px 18px;border-top:1px solid var(--line);color:#7c899a;font-size:12px;line-height:1.5}
.basic-online__emulator{margin-top:20px;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#111923}.basic-online__emuhead{display:flex;gap:10px;align-items:center;padding:13px 16px;background:#f7f9fc}.basic-online__emuhead strong{margin-right:auto}.basic-online__emuhead span{color:#64758b;font-size:13px}.basic-online__frame{display:block;width:100%;aspect-ratio:4/3;border:0;background:#000}
@media(max-width:900px){.basic-online__workspace{grid-template-columns:1fr}.basic-online__side{border-top:1px solid var(--line);border-left:0}.basic-online__privacy{margin-top:10px}.basic-online__stats{width:100%;margin-left:0}.basic-online__source,.basic-online__lines{height:470px}}
@media(max-width:520px){.basic-online__toolbar>*{width:100%}.basic-online__editor{grid-template-columns:42px 1fr}.basic-online__lines{padding-right:7px}.basic-online__source{padding:14px 10px;font-size:13px}.basic-online__emuhead{align-items:flex-start;flex-direction:column}}