body{font-family:Ubuntu,system-ui,sans-serif;margin:0 10px}.container{margin:0 auto 100px;max-width:1100px}.header{height:70px;margin:0 20px;display:flex;justify-content:space-between;align-items:center}.header .right{display:flex;justify-content:flex-end;gap:30px}.header .right a,.mobile-menu a{font-size:16px;color:#000;text-decoration:none;font-weight:500;line-height:1}.header .right .lang{margin-left:24px;display:flex;align-items:center;gap:6px}.mobile-menu .lang{display:flex;align-items:center;margin-top:4px;gap:6px}.mobile-menu{display:none;position:absolute;right:0;background:#fff;z-index:100;border-top:1px solid #ddd;border-left:1px solid #ddd;border-bottom:1px solid #ddd;border-radius:0 0 0 8px}.mobile-menu.open{display:block}.mobile-menu .items{display:flex;flex-flow:column;padding:20px 30px 20px 20px;gap:16px}.mobile-menu .items a:hover{color:#000;text-decoration:none}.header .right .menu-button{display:none}.lang img{height:16px;width:22px;border-radius:4px;filter:brightness(1.5) saturate(.7)}.logo{height:30px;width:30px;display:flex;gap:8px;align-items:center;cursor:pointer;color:#000}.logo:hover{color:#000;text-decoration:none}.logo p{margin:0;font-weight:500;display:inline-block;height:20px;font-size:18px;line-height:1}.header .logo img{height:30px;width:30px}.hero{height:480px;border-radius:16px;color:#fff;font-family:Ubuntu,system-ui,sans-serif;overflow:hidden;position:relative;text-align:center}.hero .overlay{position:absolute;background:rgba(0,0,0,.5);top:0;left:0;width:100%;height:100%;z-index:10;display:flex;align-items:center;justify-content:center;flex-flow:column;gap:20px}.hero h1{font-size:var(--titleSize);margin:0 20px}.hero p{font-size:var(--subtitleSize);font-weight:500;margin:0}.content{margin:0 80px;display:flex;gap:40px}.content.full-width{margin-right:200px}.content .main{flex:600px 1 1;max-width:100%}.content .sidebar{flex:220px 1 1;margin-top:20px}p{font-size:18px}.article li p{margin:4px 0}h1{font-size:60px;font-weight:500;margin:0}.content .main p{font-family:Crimson Text,serif}.main{margin-top:10px}.main h2{margin-bottom:12px}.main p{margin:0;color:#222}.main a{color:#418dff}hr{height:1px;background-color:#e0e0e0;border:none}a{text-decoration:none}a:hover{text-decoration:underline;color:#418dff}picture{font-size:0}.hero img,.hero picture{height:100%!important;width:100%}.hero .picture .placeholder{filter:blur(20px)}.link-slice{color:#418dff;display:flex;flex-flow:column;gap:10px;margin:24px 0 24px 6px}.link-slice a{display:flex;gap:6px;align-items:center}.code{border-radius:8px;overflow:hidden;width:100%;max-width:630px}.linenumber{min-width:24px!important}.image-slice{margin:30px 0}.images{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.images img{width:100%;height:100%;object-fit:cover}.images .image{border-radius:10px;border:1px solid #eee;overflow:hidden}.images.width1 .image{flex:90% 0 0}.images.width2 .image{flex:45% 0 0}.images.width3 .image{flex:30% 0 0}.image-slice .caption{color:#999;font-size:14px;text-align:center;margin-top:20px}.picture{width:100%;height:100%;overflow:hidden;position:relative}.picture img{width:100%;height:100%;position:absolute;left:0;top:0;object-fit:cover}.picture .placeholder{filter:blur(10px);scale:1.1}.not-loaded{opacity:0!important;scale:1.1!important}.picture :not(.placeholder){transition:opacity .4s ease-in-out .2s,scale .3s ease-out .2s;opacity:1;scale:1}.article table{margin:30px auto}.inline-code{font-family:monospace;font-size:14px;color:#c47f62;border:1px solid rgba(0,0,0,.08);border-radius:4px;padding:1px 4px}table{border-collapse:collapse}tr{border-top:1px solid #d2d2d2;border-bottom:1px solid #d2d2d2}.article table td{padding:4px 20px}.article table td p{margin:0}@media (max-width: 900px){.content{flex-wrap:wrap-reverse}}@media (max-width: 500px){body{margin:0}.content{margin:0 30px;gap:10px;justify-content:center}.header .right a,.header .right .lang{display:none}.mobile-right a{display:block!important}.header .right .menu-button{display:flex;align-items:center;gap:4px;cursor:pointer}.menu-button.open svg{transform:rotate(180deg)}.content .sidebar{flex:300px 1 1}.main{margin-top:0}.hero{height:400px;border-radius:0}.content.full-width{margin-right:30px}.article table td{padding:4px 8px}}
