html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:root{--sans-serif-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif}body{width:100%;height:100vh;background-color:#f9f9f9}.numberbonds-container{display:flex;flex-direction:column;max-width:800px;margin:0 auto}svg.numberbonds-page{order:2;background:white;border-radius:4px;margin:20px;box-shadow:0 0 10px #0000004d}@media print{svg.numberbonds-page{border-radius:0;margin:0;box-shadow:none}}:root{--config-border-radius: 6px}.numberbonds-config{order:1;width:100%;font-family:var(--sans-serif-font-family);margin-top:10px;border:thin solid rgba(.2,.2,.2,.1);border-radius:var(--config-border-radius)}.numberbonds-config ul{list-style:none;margin:0;padding-left:0;display:grid;grid-auto-flow:column;grid-auto-columns:max-content;grid-column-gap:16px}.numberbonds-config li{display:inline-block;float:left;position:relative;transition-duration:.4s;font-size:16px;line-height:1.5em;padding:4px 8px;border-color:#d3d3d3;border-radius:var(--config-border-radius)}.numberbonds-config li:hover{cursor:pointer}.numberbonds-config li:hover,.numberbonds-config li:focus-within{background:lightgray}.numberbonds-config .label{font-weight:lighter}.numberbonds-config .label:after{content:"\a0"}.numberbonds-config li>.submenu{visibility:hidden;opacity:0;display:none;cursor:default;background-color:#f9f9f9;min-width:15rem;position:absolute;transition:all .5s ease;left:0;border:2px solid;border-radius:6px;display:flex;flex-direction:column}.numberbonds-config li:hover>.submenu,.numberbonds-config li:focus-within>.submenu,.numberbonds-config li .submenu:hover,.numberbonds-config li .submenu:focus{visibility:visible;opacity:1;display:block}@media print{.numberbonds-config{display:none}}:root{--toggle-width: 60px}input[type=checkbox].toggle{height:0;width:0;visibility:hidden;margin:0}input[type=checkbox].toggle+label{cursor:pointer;width:var(--toggle-width);height:calc(var(--toggle-width) / 2);background:grey;display:block;border-radius:calc(var(--toggle-width) / 2);position:relative;margin:5px}input[type=checkbox].toggle+label:after{content:"";position:absolute;top:5px;left:5px;width:calc(var(--toggle-width) / 2 - 10px);height:calc(var(--toggle-width) / 2 - 10px);background:#fff;border-radius:calc(var(--toggle-width) / 2 - 10px);transition:.3s}input[type=checkbox].toggle:checked+label{background:#bada55}input[type=checkbox].toggle:checked+label:after{left:calc(100% - 5px);transform:translate(-100%)}input[type=checkbox].toggle+label:active:after{width:calc(var(--toggle-width) * .7)}.number-bond circle{stroke:#000;stroke-width:1.4;fill:#fff}.number-bond.unhappy circle{stroke:red}.number-bond line{stroke:#000;stroke-width:1}.number-bond text{font-family:var(--sans-serif-font-family);alignment-baseline:central;text-anchor:middle}.number-bond .hidden text{display:none}.orientation-toggle .knobs,.orientation-toggle .layer{position:absolute;top:0;right:0;bottom:0;left:0}.orientation-toggle{user-select:none;-webkit-tap-highlight-color:transparent;position:relative;top:50%;width:74px;height:36px;overflow:hidden;border-radius:100px}.orientation-toggle:focus{outline:none}.orientation-toggle input[type=checkbox]{position:relative;width:100%;height:100%;padding:0;margin:0;opacity:0;cursor:pointer;z-index:3}.orientation-toggle .knobs{z-index:2}.orientation-toggle .layer{width:100%;background-color:#ebf7fc;transition:.3s ease all;z-index:1}.orientation-toggle .knobs:before{content:"";background:url('data:image/svg+xml,<svg width="36px" height="36px" viewBox="0 0 36 36" version="1.1" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="white" stroke-width="2"><path d="M32,6H4A2,2,0,0,0,2,8V28a2,2,0,0,0,2,2H32a2,2,0,0,0,2-2V8A2,2,0,0,0,32,6Zm0,22H4V8H32Z"></path><path d="M9,22a.82.82,0,0,0,.55-.21.8.8,0,0,0,0-1.13L7.83,18.8H28.17l-1.72,1.86a.8.8,0,0,0,0,1.13A.82.82,0,0,0,27,22a.78.78,0,0,0,.58-.26L31.09,18l-3.47-3.74a.79.79,0,0,0-1.13,0,.8.8,0,0,0,0,1.13l1.72,1.86H7.83l1.72-1.86a.8.8,0,0,0,0-1.13.79.79,0,0,0-1.13,0L4.91,18l3.47,3.74A.78.78,0,0,0,9,22Z"></path></g></svg>');background-size:22px 22px;background-repeat:no-repeat;background-position:center center;position:absolute;top:4px;left:4px;width:20px;height:10px;color:#fff;font-size:24px;font-weight:700;text-align:center;line-height:9px;padding:9px 4px;background-color:#03a9f4;border-radius:100px;transition:.3s cubic-bezier(.18,.89,.35,1.15) all}.orientation-toggle input[type=checkbox]:checked+.knobs:before{content:"";background:url('data:image/svg+xml,<svg width="36px" height="36px" viewBox="0 0 36 36" version="1.1" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g transform="rotate(90, 16, 16)" stroke="white" stroke-width="2"><path d="M32,6H4A2,2,0,0,0,2,8V28a2,2,0,0,0,2,2H32a2,2,0,0,0,2-2V8A2,2,0,0,0,32,6Zm0,22H4V8H32Z"></path><path d="M9,22a.82.82,0,0,0,.55-.21.8.8,0,0,0,0-1.13L7.83,18.8H28.17l-1.72,1.86a.8.8,0,0,0,0,1.13A.82.82,0,0,0,27,22a.78.78,0,0,0,.58-.26L31.09,18l-3.47-3.74a.79.79,0,0,0-1.13,0,.8.8,0,0,0,0,1.13l1.72,1.86H7.83l1.72-1.86a.8.8,0,0,0,0-1.13.79.79,0,0,0-1.13,0L4.91,18l3.47,3.74A.78.78,0,0,0,9,22Z"></path></g></svg>');background-size:22px 22px;background-repeat:no-repeat;background-position:5px center;left:42px;background-color:#03a9f4}.orientation-toggle .knobs,.orientation-toggle .knobs:before,.orientation-toggle .layer{transition:.3s ease all}