*{box-sizing:border-box}body{margin:0;font:15px system-ui,Arial;color:#172b40;background:#f3f6fa}header{background:#102b47;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:16px 26px;gap:12px}header nav{display:flex;align-items:center;gap:15px;flex-wrap:wrap}header a{color:white;text-decoration:none}main{max-width:1150px;margin:30px auto;padding:0 20px}h1{font-size:27px}p{color:#586979}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:15px}.card{display:flex;flex-direction:column;gap:12px;padding:20px;border-radius:12px;background:#fff;text-decoration:none;color:#102b47;box-shadow:0 1px 6px #d9e1ea}.card span{color:#0878ba}button{border:0;background:#0878ba;color:white;border-radius:7px;padding:11px 18px;cursor:pointer;font-weight:600}button:disabled{opacity:.5}.login{max-width:420px;background:white;border-radius:15px;padding:30px;margin:10vh auto;box-shadow:0 4px 20px #d9e1ea}.login label{display:block;font-weight:600;margin:16px 0}.login input{display:block;width:100%;margin-top:8px;padding:12px;border:1px solid #c6d2df;border-radius:7px}.login button{width:100%}.error{background:#ffe4e4;padding:12px}.editor{height:100vh;display:flex;flex-direction:column}.toolbar{padding:10px 20px;display:flex;gap:12px;align-items:center;background:#e8eff6;flex-wrap:wrap}.toolbar span:first-child{flex:1}#status{font-weight:bold;color:#096c56}iframe{border:0;width:100%;flex:1;background:white}