.root{height:100vh;width:100vw}html,body{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden}.page{height:100vh;width:100vw;display:grid;grid-template-columns:repeat(3,1fr)}.question-box{margin:5px;background-color:#333;color:#fff;display:grid;justify-content:center;align-items:center;font-size:2rem;font-weight:600;font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#005cc5}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-comment,.hljs-code,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}button{width:100px;height:50px}p{width:20vw}.grid-buttons-container{display:grid;grid-template-columns:1fr 5vw 1fr;gap:5px}.grid-button{background-color:#333;color:#fff;border-radius:8px;height:5vh;width:5vw;display:flex;justify-content:center;align-items:center}.left{display:flex;justify-self:flex-end;align-self:center}.right{display:flex;justify-self:flex-start;align-self:center}.center{display:flex;flex-direction:column;justify-self:center;height:100%}.grid-button:hover{background-color:#676767}.justify-button-container{display:flex;justify-content:center}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#fff;padding:20px;border-radius:8px;width:90%;max-width:600px;position:relative;box-shadow:0 4px 10px #0000004d}.modal-close{position:absolute;top:10px;right:10px;background:none;border:none;font-size:1.5rem;cursor:pointer}.sync-container{gap:5px}.sync-numbers,.async-numbers{display:flex;justify-content:space-evenly;gap:5px}.cell-number{background-color:#b9b9b9;width:40px;height:40px;margin-top:10px;display:flex;justify-content:center;align-items:center;font-family:Verdana,Geneva,Tahoma,sans-serif;font-size:30px}.conditional-container{grid-column:2 / 5;width:100%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:7vh 1fr}.conditional-header{grid-column:1 / -1;display:flex;justify-content:space-evenly;border:1px solid #333;background-color:#333}.header-item{display:flex;justify-content:center;align-items:center;gap:5px;border:1px solid #333;width:25%;color:#fff}.header-item:hover{background-color:#b9b9b9}.content{grid-column:1 / -1;display:grid;width:100%;grid-template-columns:repeat(4,1fr);grid-template-rows:7vh 1fr;justify-content:center}.content-header{grid-column:1 / -1}.count-box{display:flex;width:40px;height:40px;justify-content:center;align-items:center;background-color:#333;color:#fff;font-size:28px;font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif}.effect-demo{display:flex;flex-direction:column;gap:5px}.form-display{display:flex;justify-content:center;align-items:center;margin-bottom:10PX;width:250px;height:30px;border:1px solid #333;background-color:#ebebeb}.example-header{display:flex;justify-content:center}.example-button{border:1px solid #333;width:150px;display:flex;justify-content:center;padding:5px}.example-button:hover{background-color:#eaeaea}.example-button.active{background-color:#333;color:#fff;font-weight:700}.bubble-container{display:flex}.div-1{display:flex;justify-content:center;align-items:flex-end;width:300px;height:500px;border:1px solid #333}.div-2{display:flex;justify-content:center;align-items:flex-end;width:250px;height:400px;border:1px solid #333}.div-3{display:flex;justify-content:center;align-items:flex-end;width:200px;height:300px;border:1px solid #333}.div-4{display:flex;justify-content:center;align-items:flex-end;width:150px;height:200px;border:1px solid #333}.div-5{display:flex;justify-content:center;align-items:flex-end;width:100px;height:100px;border:1px solid #333}.header{grid-column:1 / -1;width:100%;height:8vh;display:flex;justify-content:space-evenly}.active{background-color:#333;color:#fff}.choice-item{width:100%;display:flex;justify-content:center;border:1px solid #333}.hollow-text{color:transparent;-webkit-text-stroke:1px black;font-size:18px}.active-hook{font-weight:700;font-size:18px}.spread-rest-demo{max-width:800px;margin:0 auto;padding:20px;font-family:Arial,sans-serif}.demo-section{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:10px;margin-bottom:20px;box-shadow:0 2px 4px #0000001a}.demo-section h2{font-size:1.25rem;font-weight:700;margin-bottom:1rem;color:#333}.input-group{display:flex;gap:10px;margin-bottom:15px}.input-group input{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.input-group button{background-color:#333;color:#fff;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}.input-group button:hover{background-color:#2563eb}.code-display{background-color:#f3f4f6;padding:12px;border-radius:4px;font-family:monospace}.code-block{background-color:#1f2937;color:#fff;padding:16px;border-radius:4px;overflow-x:auto;font-family:monospace;line-height:1.5}.note{margin-top:8px;font-size:14px;color:#666}