@import"https://fonts.googleapis.com/css2?family=Poiret+One&family=Viaoda+Libre&display=swap";:root{font-family:Poiret One;line-height:1.5;font-size:large;color-scheme:light dark;color:#ffffffde;background-color:#242424;--background: hsl(270, 20%, 8%);--background-gradient: hsl(280, 25%, 12%);--border: hsl(40, 65%, 80%);--text: #f4e2be;--button-hover: hsl(280, 25%, 12%);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{margin:0;padding:0;box-sizing:border-box}strong{font-weight:700}ul{padding-left:1rem}li{margin-bottom:1rem}a{font-weight:500;text-decoration:underline;color:var(--text)}body{background-color:var(--background);min-height:100svh;background-size:cover;color:var(--text)}h1,h2{font-family:Viaoda Libre}.divider{height:1px;background-color:var(--border);position:relative;display:grid;grid-template-columns:1fr;margin:1rem 0}.divider:after{content:"";background-color:var(--border);width:5px;height:5px;border-radius:999px;position:absolute;top:calc(50% - 2.5px);left:calc(50% - 2.5px)}.divider:before{content:"";border:solid 1px var(--border);width:10px;height:10px;border-radius:999px;position:absolute;top:calc(50% - 5.5px);left:calc(50% - 5.5px)}.main{padding:1rem;max-width:40rem;margin:auto}.card{display:flex;flex-direction:column;background:var(--background);border:1px solid var(--border);position:relative;padding:1rem;margin-bottom:3rem}.card .corner{width:.5rem;height:.5rem;border:1px solid var(--border);position:absolute}.card .corner:after,.card .corner:before{content:"";position:absolute}.card .corner:after{width:2rem;height:calc(1rem - 1px)}.card .corner:before{width:calc(1rem - 1px);height:2rem}.card .corner.left{left:-.5rem}.card .corner.left:after{left:calc(-2px + 1rem);border-left:1px solid var(--border)}.card .corner.left:before{left:-1px;border-left:1px solid var(--border)}.card .corner.right{right:-.5rem}.card .corner.right:after{right:calc(-2px + 1rem);border-right:1px solid var(--border)}.card .corner.right:before{right:-1px;border-right:1px solid var(--border)}.card .corner.top{top:-.5rem}.card .corner.top:after{top:-1px;border-top:1px solid var(--border)}.card .corner.top:before{top:calc(-2px + 1rem);border-top:1px solid var(--border)}.card .corner.bottom{bottom:-.5rem}.card .corner.bottom:after{bottom:-1px;border-bottom:1px solid var(--border)}.card .corner.bottom:before{bottom:calc(-2px + 1rem);border-bottom:1px solid var(--border)}
