@font-face{font-family:Packops;src:local('IRANYekan'),local('Vazirmatn'),local('Tahoma');font-display:swap}
:root{font-family:Packops,Tahoma,Arial,sans-serif;color:#25353a;background:#f6f7f7;font-size:14px;--yellow:#fac400;--ink:#19282e;--muted:#7b8588;--line:#e5e9e9;--green:#237960}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}button{border:0}button:focus-visible,a:focus-visible{outline:3px solid var(--yellow)}.yellow{color:var(--yellow)}.muted{color:var(--muted)}.sidebar{width:238px;position:fixed;right:0;top:0;bottom:0;background:#19262c;color:#eaf0f1;padding:34px 20px 22px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:10px;align-items:center;margin-bottom:44px;direction:ltr;justify-content:flex-end}.brand b{font-family:Arial,sans-serif;display:block;font-size:18px;letter-spacing:.2px}.brand small{display:block;font-size:10px;text-align:right;margin-top:8px;color:#9aa7ab}.brand-mark{color:var(--yellow);font-size:43px;line-height:1;order:2}.nav-caption{display:block;color:#94a2a7;font-size:11px;margin:0 15px 14px}.nav-item{width:100%;color:#b9c5c9;background:none;text-align:right;display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:8px;margin-bottom:7px;line-height:1.6}.nav-item>span{font-family:Arial;font-size:21px;width:20px;text-align:center}.nav-item small{margin-right:auto;border:1px solid #566065;border-radius:4px;padding:0 5px;font-size:10px}.nav-item.active{background:var(--yellow);color:#19262c;font-weight:700}.nav-item:hover:not(.active){background:#26373f;color:white}.sidebar-separator{height:1px;background:#334148;margin:22px 12px}.sidebar-bottom{margin-top:auto;font-size:12px}.sidebar-note{padding:18px 14px;border-radius:8px;border:1px solid #3c494e}.sidebar-note p{color:#9aabad;font-size:11px;margin-top:10px;line-height:1.9}.sidebar-bottom>a{display:block;margin-top:24px;color:#b9c5c9;padding-right:14px}.main-shell{margin-right:238px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:80px;background:white;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-bottom:1px solid var(--line);gap:12px}.crumb{font-size:12px;color:#7c8589}.crumb span{padding:0 12px;color:#c0c6c8}.crumb b{font-weight:400;color:#25353a}.top-actions{display:flex;align-items:center;gap:10px}.avatar{width:34px;height:34px;background:#fff5cd;display:grid;place-items:center;border-radius:50%;font-weight:bold}.top-actions select{border:0;background:white;color:#45545a;font-size:12px;max-width:150px}.live-indicator{font-size:10px;color:var(--green);margin-left:16px}.preview-strip{background:#fffae7;padding:10px 38px;display:flex;gap:14px;font-size:11px;line-height:1.9;border-bottom:1px solid #f2ead1}.preview-strip b{color:#8d6e00;white-space:nowrap}.preview-strip span{color:#716d5f}main{padding:32px 38px 40px;max-width:1530px;width:100%;margin:auto;flex:1}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-bottom:25px}.page-heading h1{font-size:24px;line-height:1.8;letter-spacing:-.8px}.page-heading p{font-size:12px;color:#7b8588;line-height:2;margin-top:5px}.eyebrow{font-size:10px;letter-spacing:1.5px;font-family:Arial;color:#7b8588;display:block;margin-bottom:6px}.btn{border:1px solid #dce2e3;background:white;border-radius:7px;color:#32454c;padding:10px 17px;display:inline-flex;justify-content:center;align-items:center;gap:9px;font-weight:500;font-size:12px;line-height:1.5;white-space:nowrap}.btn:hover{border-color:#9aa8ad}.btn.primary{background:var(--yellow);border-color:var(--yellow);color:#202e34;font-weight:bold}.btn.dark{background:var(--ink);border-color:var(--ink);color:white}.btn.danger{color:#b7493c;background:#fff8f7;border-color:#f0dcd8}.btn.small{font-size:11px;padding:7px 12px}.btn.ghost{background:none;border-color:transparent}.hero{display:grid;grid-template-columns:1fr 280px;background:#1c2d34;border-radius:14px;min-height:245px;position:relative;overflow:hidden;color:white;margin-bottom:25px}.hero-copy{padding:31px 32px;z-index:1}.hero .eyebrow{color:#f7d554;margin-bottom:12px}.hero h2{font-size:25px;line-height:1.9;max-width:600px;letter-spacing:-1px}.hero p{color:#b9c7cb;font-size:12px;line-height:2.2;margin:10px 0 22px;max-width:490px}.hero-art{position:relative;background:#fac400;overflow:hidden;border-radius:140px 0 0 0}.hero-art img{height:300px;position:absolute;bottom:-60px;right:0;width:100%;object-fit:cover;object-position:50% 0;mix-blend-mode:multiply}.hero-art::after{content:'BUILD. BREAK. LEARN.';font:10px Arial;letter-spacing:2px;color:#6f5f12;position:absolute;bottom:12px;left:20px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:32px}.stat{background:white;border:1px solid var(--line);border-radius:10px;padding:20px 20px 16px;min-height:115px}.stat-top{display:flex;align-items:center;justify-content:space-between;color:#7c898f;font-size:11px}.stat-top i{font-style:normal;font-size:19px;color:#a7b3b7}.stat-value{font-family:Arial,Tahoma;font-size:28px;font-weight:bold;margin-top:13px;display:inline-block;letter-spacing:-1px}.stat .unit{font-size:11px;color:#899398;margin-right:7px}.stat.free{border-top:3px solid var(--yellow);padding-top:18px}.stat .stat-foot{font-size:10px;color:#899398;margin-top:8px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px;gap:15px}.section-title h2{font-size:17px;letter-spacing:-.3px}.section-title>span{font-size:11px;color:#7d898f}.section-title a{font-size:11px;cursor:pointer}.exercise-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.exercise-card{background:white;border:1px solid var(--line);border-radius:11px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s}.exercise-card:hover{border-color:#b9c3c8}.exercise-visual{height:125px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#f2f5f5}.exercise-visual.mysql{background:#e9f0ee}.exercise-visual.git{background:#f9f3df}.exercise-visual.backup{background:#e8edf2}.exercise-code{font:600 43px Consolas,monospace;direction:ltr;letter-spacing:-2px;color:#35564f}.exercise-visual.git .exercise-code{color:#a68a37}.exercise-visual.backup .exercise-code{color:#53697c}.exercise-visual .number{position:absolute;top:13px;right:16px;font:11px Arial;color:#7a8b8a}.exercise-visual .visual-label{position:absolute;left:15px;bottom:14px;font:9px Arial;letter-spacing:2px;color:#7f8d8b}.exercise-body{padding:20px;flex:1;display:flex;flex-direction:column}.tags{display:flex;gap:7px;margin-bottom:13px}.tag{font-size:10px;color:#687d85;background:#f1f4f4;padding:4px 7px;border-radius:4px}.exercise-body h3{font-size:14px;line-height:1.9;min-height:52px}.exercise-body p{font-size:11px;color:#7b878c;line-height:2;margin:7px 0 18px;flex:1}.exercise-bottom{border-top:1px solid #eef1f2;padding-top:15px;display:flex;justify-content:space-between;align-items:center;gap:10px}.exercise-bottom>span{font-size:10px;color:#8a969a}.card{background:white;border:1px solid var(--line);border-radius:10px;padding:23px}.lower-row{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;margin-top:26px}.learning-road{display:flex;gap:16px;align-items:center}.round-icon{width:48px;height:48px;border-radius:50%;background:#fff4c5;color:#8e7317;display:grid;place-items:center;font-size:25px;flex:none}.learning-road h3{font-size:13px}.learning-road p{font-size:11px;color:#7a8b91;line-height:2;margin-top:5px}.status-lines{display:flex;flex-direction:column;gap:14px;margin-top:19px}.status-line{display:flex;align-items:center;justify-content:space-between;font-size:11px;gap:10px}.status-badge{font-size:10px;display:inline-flex;gap:6px;align-items:center;border-radius:5px;padding:4px 8px;background:#f1f3f3;color:#7b888d}.status-badge.ready{background:#eaf5f0;color:#287c61}.status-badge.provisioning,.status-badge.deleting{background:#fff5d2;color:#926f00}.status-badge.ended{background:#f1f3f3;color:#7b888d}.empty-state{display:flex;align-items:center;gap:30px;justify-content:center;background:white;border:1px dashed #d5dedf;border-radius:12px;padding:40px 30px;min-height:220px}.empty-state img{height:140px;width:115px;object-fit:cover;object-position:top;mix-blend-mode:multiply}.empty-state h2{font-size:18px;margin-bottom:13px}.empty-state p{color:#7e8c91;font-size:12px;line-height:2;max-width:430px;margin-bottom:18px}.machine-list{display:grid;gap:15px}.machine-row{display:flex;align-items:center;gap:20px;justify-content:space-between}.machine-row h3{font-size:13px;line-height:1.8}.machine-row p{font-size:11px;margin-top:7px;color:#849297}.machine-row .machine-actions{display:flex;gap:8px}.workspace-header{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-bottom:20px}.workspace-header h1{font-size:22px;line-height:1.8}.workspace-grid{display:grid;grid-template-columns:310px minmax(0,1fr);gap:20px;align-items:start}.guide .eyebrow{margin-bottom:14px}.guide h2{font-size:16px;margin-bottom:12px}.guide p{font-size:11px;color:#78878c;line-height:2.2}.guide ol{margin:20px 0;padding-right:20px}.guide li{font-size:12px;line-height:2.2;padding-bottom:15px}.guide .scenario-resource{padding:12px;background:#f6f8f8;font-size:11px;color:#63767c;border-radius:6px;line-height:2}.terminal-panel{background:#152128;border:1px solid #263941;border-radius:10px;overflow:hidden;color:#dee7e9}.terminal-bar{background:#202e36;padding:13px 17px;display:flex;align-items:center;justify-content:space-between;font:11px Consolas,monospace;direction:ltr;color:#adbec5}.window-dots{display:flex;gap:5px}.window-dots i{width:7px;height:7px;background:#748a94;border-radius:50%}.window-dots i:first-child{background:#da7963}.window-dots i:nth-child(2){background:#d9b850}.window-dots i:nth-child(3){background:#6ab38c}.terminal-note{color:#acbfc7;font:11px Tahoma;padding:11px 17px;border-bottom:1px solid #293b44;line-height:1.9}.terminal-output{height:270px;overflow:auto;padding:20px 20px 5px;white-space:pre-wrap;overflow-wrap:anywhere;direction:ltr;text-align:left;font:12px/1.9 Consolas,'Courier New',monospace;color:#c8d9de}.terminal-form{display:flex;direction:ltr;align-items:center;padding:8px 20px 20px;gap:8px;font:12px Consolas;min-width:0}.terminal-form label{color:#fac400;white-space:nowrap;font-size:11px}.terminal-form input{background:none;border:0;min-width:0;width:100%;color:#e6f1f4;font:13px Consolas;padding:9px 3px;outline-offset:1px}.terminal-form button{background:#33454e;color:#c3d2d8;font-size:11px;border-radius:4px;padding:6px}.workspace-tools{display:flex;gap:8px;justify-content:space-between;align-items:center;margin:15px 0;flex-wrap:wrap}.workspace-tools>div{display:flex;gap:8px}.workspace-bottom{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:15px}.workspace-bottom h3{font-size:13px;margin-bottom:13px}.hint-copy{font-size:12px;color:#697e85;line-height:2.1;margin-top:12px}.hint-label{font-size:10px;color:#8a979b}.grade-number{font-family:Arial;font-size:34px;color:#287b62;font-weight:bold;display:block;margin:12px 0}.check-list{display:grid;gap:10px}.check-item{display:flex;gap:7px;justify-content:space-between;font-size:11px;line-height:1.8}.check-item .pass{color:#258067}.check-item .fail{color:#b17c30}.credentials{font:13px/2.5 Consolas;direction:ltr;background:#f4f7f7;padding:15px;border-radius:7px;overflow-wrap:anywhere;margin:15px 0}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;text-align:right;font-size:12px;line-height:1.9}.table th{color:#87969b;font-size:11px;font-weight:400;padding:13px 12px;border-bottom:1px solid var(--line)}.table td{padding:15px 12px;border-bottom:1px solid #edf0f0;vertical-align:middle}.table tr:last-child td{border-bottom:0}.table .mono{font:10px Consolas;direction:ltr;display:inline-block}.usage-track{height:9px;border-radius:7px;background:#edf1f1;overflow:hidden;display:flex;direction:ltr;margin:22px 0 12px}.usage-track span{background:var(--yellow);min-width:0}.usage-track span.reserved{background:#9daeb6}.legend{display:flex;gap:22px;color:#71858d;font-size:11px;flex-wrap:wrap}.legend i{display:inline-block;width:8px;height:8px;background:var(--yellow);border-radius:50%;margin-left:5px}.legend i.reserve{background:#9daeb6}.policy{font-size:12px;line-height:2.3;color:#6d8189;margin-top:20px}.policy li{padding-bottom:8px}.architecture-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:25px}.architecture-node{border-right:3px solid var(--yellow);padding:17px 20px;background:white;border-radius:5px}.architecture-node h3{font-size:13px;margin:10px 0}.architecture-node span{font:11px Consolas;color:#8d9ba1}.architecture-node p{font-size:11px;line-height:2;color:#7b8e96}.architecture-note{background:#eaf1ef;color:#567568;padding:17px 20px;font-size:12px;line-height:2;border-radius:8px;margin-bottom:24px}.loading{padding:60px;color:#82939a;text-align:center}.footer{display:flex;justify-content:space-between;color:#9aa8ac;font-size:10px;padding:24px 38px;border-top:1px solid var(--line);gap:20px}.footer>span:first-child{font-family:Arial;letter-spacing:1px}.footer .muted{font:10px Tahoma;letter-spacing:0}dialog{border:1px solid #dce4e7;border-radius:13px;padding:28px;width:min(470px,calc(100vw - 30px));color:#283c45;box-shadow:0 20px 100px #12272f22}dialog::backdrop{background:#12252f70;backdrop-filter:blur(3px)}dialog h2{font-size:19px;margin-bottom:12px}dialog p{color:#7a8d95;font-size:12px;line-height:2.2}dialog .dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:25px}dialog label{font-size:12px;display:block;margin-top:23px;margin-bottom:10px}dialog select{width:100%;padding:12px;border:1px solid #dce4e7;border-radius:6px;background:white;color:#314b58}#toast{position:fixed;bottom:24px;left:24px;background:#203b47;color:white;max-width:min(450px,calc(100vw - 40px));padding:15px 22px;border-radius:9px;box-shadow:0 4px 30px #122a3333;font-size:12px;line-height:2;z-index:100}.mobile-menu{display:none;background:none;font-size:23px;color:#536a76}.results-score{font:bold 22px Arial;color:#237e64}.progress-ring{font-family:Arial;font-size:12px;background:#f1f6f3;border-radius:6px;padding:7px 10px;color:#48836c}.sync-note{font-size:11px;line-height:2;color:#89999f;margin-top:13px}.return-link{color:#82969d;font-size:12px;cursor:pointer}.intro-line{font-size:12px;line-height:2.2;color:#738790;margin-bottom:22px}.admin-tabs{display:flex;gap:8px;margin-bottom:22px;flex-wrap:wrap}.technical{direction:ltr;text-align:left;font-family:Consolas,monospace;overflow-wrap:anywhere}.smallprint{font-size:11px;color:#809399;line-height:2;margin-top:12px}[hidden]{display:none!important}
@media(min-width:1500px){.hero{grid-template-columns:1fr 340px}.hero-art img{height:340px;bottom:-85px}.exercise-visual{height:150px}}
@media(max-width:1200px){.sidebar{width:210px;padding-left:14px;padding-right:14px}.main-shell{margin-right:210px}.topbar{padding:0 25px}main{padding:25px}.preview-strip{padding:9px 25px}.hero{grid-template-columns:1fr 220px}.hero-copy{padding:25px}.hero h2{font-size:22px}.hero-art img{height:290px}.stat{padding:17px 14px}.workspace-grid{grid-template-columns:265px minmax(0,1fr)}.workspace-bottom{grid-template-columns:1fr}.exercise-bottom{flex-wrap:wrap}}
@media(max-width:940px){.sidebar{width:190px}.main-shell{margin-right:190px}.brand b{font-size:15px}.brand-mark{font-size:35px}.stats{grid-template-columns:repeat(2,1fr)}.exercise-grid{grid-template-columns:1fr 1fr}.exercise-card:last-child{grid-column:1/-1}.exercise-card:last-child .exercise-visual{height:100px}.hero{grid-template-columns:1fr 180px}.hero h2{font-size:21px}.hero-art img{height:280px;bottom:-15px;width:220px;right:-20px}.lower-row{grid-template-columns:1fr}.live-indicator{display:none}.workspace-grid{grid-template-columns:1fr}.guide ol{margin:12px 0;display:flex;gap:15px;flex-wrap:wrap}.guide li{max-width:220px}.workspace-bottom{grid-template-columns:1fr 1fr}.architecture-flow{grid-template-columns:1fr 1fr}.page-heading h1{font-size:21px}.topbar{padding:0 20px}}
@media(max-width:680px){.sidebar{transform:translateX(100%);width:235px;transition:transform .2s}.sidebar.open{transform:translateX(0);box-shadow:-30px 0 100px #10273255}.main-shell{margin-right:0}.mobile-menu{display:block}.topbar{height:65px;padding:0 16px}.crumb{display:none}.top-actions{margin-right:auto}.preview-strip{padding:9px 17px;gap:10px;font-size:10px}.preview-strip b{align-self:flex-start}main{padding:23px 17px}.page-heading{align-items:flex-start;margin-bottom:20px}.page-heading h1{font-size:21px}.page-heading p{font-size:11px}.hero{grid-template-columns:1fr 112px;min-height:230px}.hero-copy{padding:22px 19px}.hero h2{font-size:20px}.hero p{font-size:11px;margin-bottom:17px}.hero-art{border-radius:90px 0 0 0}.hero-art img{right:-40px;width:200px;height:280px;bottom:-18px}.hero-art::after{display:none}.hero .btn{padding:9px 11px;font-size:11px}.hero .eyebrow{font-size:8px;letter-spacing:1px}.stats{gap:11px;margin-bottom:25px}.stat{min-height:106px;padding:15px}.stat-value{font-size:26px}.stat-top{font-size:10px}.stat-top i{font-size:16px}.exercise-grid{grid-template-columns:1fr}.exercise-card:last-child{grid-column:auto}.exercise-card{display:grid;grid-template-columns:92px minmax(0,1fr)}.exercise-visual,.exercise-card:last-child .exercise-visual{height:100%}.exercise-code{font-size:24px;letter-spacing:-1px}.exercise-visual .number{right:10px;top:12px}.exercise-visual .visual-label{font-size:7px;left:8px;bottom:10px;letter-spacing:1px}.exercise-body{padding:17px}.exercise-body h3{min-height:0;font-size:13px}.exercise-body p{margin-bottom:12px;font-size:11px}.exercise-bottom .btn{font-size:10px;padding:7px 10px}.exercise-bottom{flex-wrap:nowrap}.card{padding:20px}.machine-row{flex-wrap:wrap;gap:16px}.machine-actions{width:100%;justify-content:flex-end}.workspace-header{align-items:flex-start}.workspace-header h1{font-size:19px}.workspace-header .btn{font-size:10px;padding:8px}.workspace-bottom{grid-template-columns:1fr}.terminal-output{height:260px;font-size:11px;padding:16px}.terminal-form{padding:8px 12px 15px;gap:5px}.terminal-form label{font-size:9px}.terminal-form input{font-size:16px}.architecture-flow{grid-template-columns:1fr}.footer{padding:20px 17px;font-size:9px}.empty-state{padding:28px 20px;gap:15px;align-items:flex-start}.empty-state img{height:100px;width:75px}.empty-state h2{font-size:16px}.empty-state p{font-size:11px}.section-title h2{font-size:16px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
