@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;900&display=swap";@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css";:root{--main-color: #f4d259;--lighterer: #acacac;--lighter: #353535;--light: #303030;--dark: #252525;--darker: #1d1d1d;--darkerer: #151515;--darkest: #101010}*:focus{outline:none}html{color:#fff;background-color:var(--darkest);font-family:pretendard,sans-serif;background-size:32px 32px;background-image:linear-gradient(to right,var(--darker) 1px,transparent 1px),linear-gradient(to bottom,var(--darker) 1px,transparent 1px)}h1,p{text-align:center;margin:32px}p>i{opacity:.5}a{color:var(--main-color);text-decoration:none}a:hover,a:active{text-decoration:underline}body{margin:0}*::-webkit-scrollbar-track{background-color:#0000}*::-webkit-scrollbar{width:16px;background-color:#0000}*::-webkit-scrollbar-thumb{border:6px solid transparent;border-radius:16px;background-color:var(--lighter);background-clip:content-box}div.input-wrapper{display:flex;align-items:flex-start;justify-content:center;padding:0 16px;box-sizing:border-box;width:100%}div.input-main{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:8px;background-color:var(--darkerer);border-radius:4px;box-shadow:0 0 16px #000;flex-grow:2;width:100%;max-width:420px;height:min-content;padding:8px}div.input-main>div.row{display:flex;align-items:flex-start;justify-content:stretch;gap:8px;width:100%;height:40px}.input-button{display:flex;align-items:center;justify-content:center;position:relative;background-color:var(--darker);border-radius:4px;width:90px;height:40px;min-width:90px;transition:background-color .2s ease-in-out;cursor:pointer;user-select:none;overflow:hidden}.input-button>img{position:absolute;left:100%;top:50%;transform:translate(-90%,-50%) scale(.8);opacity:.5;user-select:none}.input-button>a{position:absolute;left:0;top:0;width:100%;height:100%}.input-button:hover{background-color:#f4d2594b}div.input-main input[type=color]{background-color:var(--darker);border:none;border-radius:4px;margin:0;padding:0 2px;width:40px;height:40px;min-width:40px;box-sizing:border-box;z-index:10}div.input-main input[type=text],div.input-main input[type=number]{background-color:var(--darker);border:none;border-radius:4px;padding:4px 8px;box-sizing:border-box;flex-grow:2;width:90px;height:40px;color:#fff;font-family:Pretendard;font-size:16px}div.input-main select{background-color:var(--darker);color:#fff;border:none;border-radius:4px;font-family:Pretendard;font-size:16px;margin:0;width:90px;height:40px;min-width:90px;box-sizing:border-box;padding:8px}div.input-selector{display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:column;gap:8px;height:200px;background-color:var(--darkest);border-radius:4px;box-sizing:border-box;padding:16px;overflow-y:auto}div.input-selector>div.input-option{display:flex;justify-content:center;align-items:center;position:relative;width:100%;min-height:64px;height:64px;padding:8px;box-sizing:border-box;background-color:var(--darkerer);border-radius:4px;cursor:pointer;transition:background-color .2s ease-in-out}div.input-selector>div.input-option:hover{background-color:#f4d2594b}div.input-option>div{border-radius:4px;width:100%;height:100%;background-size:cover;background-position:center}.fullwidth{width:100%!important}.row-even{display:flex;flex-direction:row;gap:8px}.square{width:40px;min-width:40px}.input-button>span{display:flex;align-items:center;justify-content:center;gap:4px}.input-button.square{font-size:24px}div.column>span{text-wrap:nowrap;overflow-x:hidden}div.input-main textarea{background-color:var(--darker);color:#fff;font-family:Pretendard;font-size:16px;padding:10px 8px;margin:0;height:40px;min-height:40px;border:none;border-radius:4px;box-sizing:border-box;flex-grow:2;resize:vertical}div.input-main h4{margin:8px 0 0}div.row.takeheight{height:max-content!important}div.row.column{flex-direction:column;height:max-content}div.row>div.column{display:flex;flex-direction:column;gap:4px}div.input-button.text-button{font-size:16px}div.input-button.icon-button{font-size:24px}label>input{display:none}div.filler-square{width:40px;height:40px;min-width:40px;visibility:hidden;pointer-events:none}*>span.tooltip{display:block!important;font-size:14px;font-weight:400;padding:4px 8px;width:max-content;height:max-content;max-width:200px;line-height:1.5;text-align:center;background-color:#252525;border-radius:4px;position:absolute;left:50%;bottom:calc(100% + 8px);transform:translate(-50%);opacity:0;visibility:hidden;transition:opacity .2s ease-in-out,visibility .2s ease-in-out;z-index:999}*>span.tooltip:after{content:"■";position:absolute;text-align:center;left:50%;transform:translate(-50%) rotate(45deg);bottom:-10px;color:#252525;z-index:998}*:hover>span.tooltip{opacity:1;visibility:visible}div.pfp-preview{display:flex;align-items:center;justify-content:center;width:88px;height:88px;min-width:88px;min-height:88px;border-radius:50%;overflow:hidden;background-color:var(--darker)}div.pfp-preview>img{max-width:100%;max-height:100%}div.tutorial-layer{display:flex;align-items:flex-start;padding:32px;box-sizing:border-box;justify-content:center;position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000}div.tutorial-layer>div.dialogue-part{display:flex;align-items:flex-start;justify-content:stretch;gap:8px;width:100%;max-width:500px;z-index:1002}div.character-avatar{aspect-ratio:1;min-width:100px;width:100px;height:100px;border:var(--lighterer) 3px solid;border-radius:12px;overflow:hidden;background-color:var(--darkest)}div.character-avatar>img{max-width:100%;max-height:100%}div.character-dialogue{display:flex;align-items:flex-start;justify-content:flex-start;gap:8px;flex-direction:column;border:var(--lighterer) 3px solid;border-radius:12px;overflow:hidden;background-color:var(--darkest);flex-grow:2;height:max-content;padding:16px 16px 32px;box-sizing:border-box;position:relative;min-height:106px}div.character-dialogue>b{border-left:3px solid #c2cfa1;padding-left:8px}div.character-dialogue>span{padding:0 11px;font-weight:500;font-size:14px;color:#dcdcdc;line-height:1.45}span#tutorial-next{position:absolute;right:0;bottom:6px;font-size:10px;font-style:italic;font-weight:700;opacity:.5}div#dialogue-backdrop{position:fixed;width:100vw;height:100vh;top:0;left:0;--rect-x: 0px;--rect-y: 0px;--rect-width: 0px;--rect-height: 0px;clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0% 100%,0 0,var(--rect-x) var(--rect-y),calc(var(--rect-x) + var(--rect-width)) var(--rect-y),calc(var(--rect-x) + var(--rect-width)) calc(var(--rect-y) + var(--rect-height)),var(--rect-x) calc(var(--rect-y) + var(--rect-height)),var(--rect-x) var(--rect-y));background-color:#0000;backdrop-filter:brightness(.6);display:flex;justify-content:center}div#dialogue-spotlight-border{position:fixed;border:var(--main-color) 3px solid;background-color:#0000;z-index:1001;border-radius:4px}div.blurred-bg{top:0!important;padding:16px 0!important;background-color:#00000060!important;backdrop-filter:blur(3px)}@media screen and (max-width: 430px){div.character-avatar{min-width:64px;width:64px;height:64px}}div.button-tray{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-right:8px;gap:8px}div.layer-select-highlight{position:absolute;top:0;left:0;width:calc(100% - 32px);height:calc(100% - 32px);box-sizing:border-box;border:4px var(--main-color) solid;border-radius:4px;pointer-events:none}div.input-option.option-no-hover:hover{background-color:var(--darkerer)!important}
