:root{--primary: #d4a843;--primary-hover: #c49835;--primary-border: #b8922e;--nav-bg: #2a2621;--nav-border: #3d3730;--secondary: #6e7a86;--secondary-hover: #5a6570;--secondary-border: #4a545e;--danger: #c44040;--danger-hover: #b03535;--danger-border: #982a2a;--warning: #c89a20;--white: #e8dcc6;--dark: #2a2621;--text: #3d3730;--github: #3d3730;--github-hover: #4a443c;--github-border: #3d3730;--gray-100: #f0ece4;--gray-300: #d4cfc5;--light: #f5f2ec;--unit: 1rem;--radius: 5px;--font: "Raleway", sans-serif;--transition: .15s ease;--divider: 1px solid var(--gray-300);--shadow: 0 1px 3px rgba(42, 38, 33, .08)}html,body{height:100%;margin:0;font-family:var(--font);color:var(--text);background-color:var(--light)}body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr}nav{grid-column-start:1;grid-column-end:span 2;grid-row-start:1;grid-row-end:span 1;background-color:var(--nav-bg);padding:calc(var(--unit) * .6) var(--unit);border-bottom:2px solid var(--primary-border);display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 8px #2a262126;z-index:10}nav #brand{text-decoration:none;display:flex;align-items:center}nav #brand span{color:var(--white);margin-left:var(--unit);font-size:20px;font-weight:600;letter-spacing:.02em}nav #brand img{border-radius:50%}nav #links{display:none}@media screen and (min-width: 768px){nav #links{display:flex;align-items:center;gap:calc(var(--unit) / 2)}}nav #links a{text-decoration:none;display:inline-flex;align-items:center;color:var(--white);border:1px solid var(--nav-border);padding:calc(var(--unit) * .35) calc(var(--unit) * .7);border-radius:var(--radius);font-size:14px;font-weight:500;transition:background-color var(--transition),border-color var(--transition)}nav #links a i{display:inline-block;margin-right:calc(var(--unit) / 4)}nav #links a#sponsor:hover{background-color:var(--nav-border);border-color:var(--primary-border)}nav #links a#sponsor i{color:var(--primary)}nav #links a#github:hover{background-color:var(--github-hover);border-color:var(--primary-border)}nav #links a#github{background-color:var(--github);border:1px solid var(--github-border)}nav #links a#docs:hover{background-color:var(--secondary-hover);border-color:var(--primary-border)}nav #links a#docs{background-color:var(--secondary);border:1px solid var(--secondary-border)}nav #mobile-github:hover{color:var(--primary)}nav #mobile-github:visited{color:var(--white)}nav #mobile-github{font-size:30px;color:var(--white)}@media screen and (min-width: 768px){nav #mobile-github{display:none}}main{grid-column-start:1;grid-column-end:span 2;grid-row-start:2;grid-row-end:span 2;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr) auto}@media screen and (min-width: 768px){main{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}}#editor{display:flex;grid-column-start:1;grid-column-end:span 1;grid-row-start:1;grid-row-end:span 1;border-right:var(--divider)}@media screen and (min-width: 768px){#editor{grid-column-start:1;grid-column-end:span 1;grid-row-start:1;grid-row-end:span 1}}#result,#loading{display:flex;grid-column-start:1;grid-column-end:span 1;grid-row-start:2;grid-row-end:span 1}#result{flex-direction:column}#result ul{margin:0;padding:0;border-bottom:2px solid var(--primary)}#result ul li{display:inline-block;padding:calc(var(--unit) * .6) var(--unit);cursor:pointer;background-color:var(--gray-100);color:var(--secondary);font-size:14px;font-weight:600;transition:color var(--transition),background-color var(--transition)}#result ul li:hover{background-color:var(--gray-300);color:var(--dark)}#result ul li.active{background-color:var(--dark);color:var(--white);cursor:default}#result ul li:last-child{border-right:var(--divider)}@media screen and (min-width: 768px){#result,#loading{grid-column-start:2;grid-column-end:span 2;grid-row-start:1;grid-row-end:span 1}}#loading{display:flex;align-items:center;justify-content:center}#loading>div{display:inline-block;width:80px;height:80px}#loading>div:after{content:" ";display:block;width:64px;height:64px;margin:8px;border-radius:50%;border:4px solid var(--gray-300);border-top-color:var(--primary);animation:lds-dual-ring .8s linear infinite}@keyframes lds-dual-ring{0%{transform:rotate(0)}to{transform:rotate(360deg)}}footer{grid-column-start:1;grid-column-end:span 1;grid-row-start:3;grid-row-end:span 3;display:flex;flex-direction:column-reverse;border-top:var(--divider);background-color:var(--gray-100)}footer #info,footer #error-panel{max-height:150px;overflow-y:auto;box-sizing:border-box}footer #info{flex-grow:1;background-color:var(--gray-100);border:none;padding:calc(var(--unit) * 1.5);font-size:15px;line-height:1.6;color:var(--text)}footer #error-panel{padding:var(--unit);background-color:var(--gray-100);border:none;border-top:var(--divider)}footer #error-panel div strong{font-weight:bolder;margin-right:calc(var(--unit) / 4)}footer #error-panel div .badge{display:inline-block;border-radius:var(--radius);font-weight:700;background-color:var(--dark);color:var(--white);margin:0 calc(var(--unit) / 4);padding:4px 8px;font-size:12px;letter-spacing:.03em;text-transform:uppercase}footer #error-panel div .badge.error{background-color:var(--danger)}footer #error-panel div .badge.warning{background-color:var(--warning)}footer #error-panel div p{margin-top:0;font-size:15px}footer button:hover{background-color:var(--primary-hover)}footer button{margin:0;background-color:var(--primary);color:var(--dark);padding:calc(var(--unit) * .5) calc(var(--unit) * 1.2);border:1px solid var(--primary-border);font-size:15px;font-weight:600;cursor:pointer;font-family:var(--font);border-radius:var(--radius);transition:background-color var(--transition),box-shadow var(--transition);white-space:nowrap;box-shadow:var(--shadow)}footer #report:hover{background-color:var(--danger-hover)}footer #report{background-color:var(--danger);border:1px solid var(--danger-border);color:var(--white);width:auto}footer a{display:block;margin:0}@media screen and (min-width: 768px){footer{grid-column-start:1;grid-column-end:span 2;grid-row-start:2;grid-row-end:span 2;display:flex;flex-direction:row;align-items:center}footer #info{padding:var(--unit)}footer>button,footer a{margin:auto calc(var(--unit) / 2)}footer a{margin-right:0}}