:root{font-family:system-ui,sans-serif;color:#3b281c;background:#f4eee4}*{box-sizing:border-box}body{margin:0;display:flex;flex-direction:column;height:100dvh}header{display:flex;gap:1.5rem;align-items:center;padding:.75rem 1rem;background:#fffdf8;border-bottom:1px solid #e4d9c9}header span{margin-left:auto;font-size:.85rem}a{color:#8a4b26}a:focus-visible,button:focus-visible,iframe:focus-visible{outline:3px solid #9b621c;outline-offset:3px}#gate{margin:auto;padding:2rem;max-width:44rem}#gate a{display:block;margin-top:1rem}button{padding:.6rem 1rem;background:#3b281c;color:#fffdf8;border:0;border-radius:.5rem;cursor:pointer}#demo-note{margin:0;padding:.45rem 1rem;font-size:.8rem;background:#fffdf84d8;color:#5e481b}iframe{border:0;flex:1;width:100%;min-height:0} [hidden]{display:none!important}@media(max-width:650px){header{gap:.6rem;flex-wrap:wrap}header strong{font-size:.85rem}header span{margin-left:0}}

.pc-mark{display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:11px;background:#3b281c;color:#fffdf8;font-size:13px;font-weight:700}#gate{background:#fffdf8;border:1px solid #e4d9c9;border-radius:18px;box-shadow:0 16px 40px -30px #3b281c55}#gate h1{font-size:28px;line-height:1.3}header{min-height:68px}header a{font-size:13px}

:root[data-theme=dark]{color:#f5edd9;background:#201e19;color-scheme:dark}:root[data-theme=dark] :is(header,#gate){background:#28261f;border-color:#51493b}:root[data-theme=dark] a{color:#e4c27a}:root[data-theme=dark] button{background:#c7ad7b;color:#211d17}