:root{--bg: #fff8ed;--black: #000000;--white: #ffffff;--muted: #5a5a5a;--placeholder: #888888;--font-sans: "Noto Sans SC", "PingFang SC", "Helvetica Neue", sans-serif;--font-serif: "Noto Serif SC", "Songti SC", serif;--font-display: "Cormorant Garamond", "Noto Serif SC", serif;--page-width: 402px;--page-height: 812px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:var(--font-sans);background:#e8e8e6;color:var(--black);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}button,input,textarea{font:inherit;color:inherit;border:none;background:none;outline:none}button{cursor:pointer}img{display:block;max-width:100%}.app-shell{min-height:100%;min-height:100dvh;display:flex;justify-content:center;align-items:center;background:#e8e8e6}.page{position:relative;width:100%;max-width:var(--page-width);height:var(--page-height);max-height:100dvh;background:var(--bg);overflow:hidden;display:flex;flex-direction:column;flex-shrink:0}.page--scroll{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 24px;border-radius:44px;font-size:16px;font-weight:500;line-height:1;white-space:nowrap;transition:opacity .2s ease,transform .15s ease}.btn:active{transform:scale(.98);opacity:.9}.btn--primary{background:var(--black);color:var(--white);border:1px solid var(--black)}.btn--ghost{background:transparent;color:var(--black);border:1px solid var(--black)}.btn--block{width:100%}.btn--half{flex:1 1 0;min-width:0;padding:0 10px;font-size:15px}.btn-row{display:flex;gap:16px;width:100%}.page-footer{position:sticky;bottom:0;margin-top:auto;padding:16px 16px calc(16px + var(--safe-bottom));background:linear-gradient(180deg,transparent 0%,var(--bg) 28%);z-index:10}.page-footer--center{display:flex;justify-content:center}.link-muted{color:var(--muted);font-size:16px;font-weight:500;text-align:center;padding:8px}.back-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:20px;flex-shrink:0;padding:0}.back-btn img{width:20px;height:22px;transform:rotate(-90deg)}.back-btn--float{position:absolute;left:16px;top:calc(28px + var(--safe-top));z-index:5}.welcome{padding:calc(48px + var(--safe-top)) 16px 0}.welcome__eyebrow{margin:180px 0 0 17px;font-size:20px;font-weight:400;animation:welcomeRise .7s cubic-bezier(.22,1,.36,1) both}.welcome__brand{margin:13px 0 0 17px;font-family:var(--font-serif);font-size:36px;font-weight:600;letter-spacing:.02em;animation:welcomeRise .7s cubic-bezier(.22,1,.36,1) .14s both}.welcome .page-footer{position:absolute;left:0;right:0;bottom:0;animation:welcomeRise .7s cubic-bezier(.22,1,.36,1) .28s both}@keyframes welcomeRise{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}.hub{padding:calc(30px + var(--safe-top)) 16px 0}.hub__eyebrow{margin-top:36px;font-size:20px}.hub__brand{margin-top:13px;font-family:var(--font-serif);font-size:36px;font-weight:600}.hub__ask{margin-top:67px;font-family:var(--font-serif);font-size:36px;font-weight:600}.hub__cards{display:flex;gap:10px;margin-top:23px}.hub-card{flex:1;display:flex;flex-direction:column;align-items:center;gap:16px}.hub-card__frame{width:100%;height:273px;border:1px solid var(--black);padding:10px}.hub-card__inner{width:100%;height:100%;border:1px solid var(--black);overflow:hidden;position:relative;background:var(--black)}.hub-card__inner img{width:100%;height:100%;object-fit:cover}.hub-card__label{font-size:20px;text-align:center}.quiz{padding:calc(30px + var(--safe-top)) 16px 0;min-height:100dvh}.quiz__head{display:flex;align-items:flex-end;gap:3px;margin-top:48px;padding-left:3px}.quiz__num{font-family:var(--font-serif);font-size:36px;line-height:1;flex-shrink:0}.quiz__text{font-size:20px;line-height:1.4;padding-bottom:4px}.quiz__options{margin-top:80px;display:flex;flex-direction:column;gap:12px;padding-bottom:100px}.quiz-option{width:100%;text-align:left;padding:10px;font-size:16px;line-height:1.4;color:var(--black);transition:background .15s ease,color .15s ease}.quiz-option--active{background:var(--black);color:var(--white)}.quiz-nav{position:absolute;left:16px;right:16px;bottom:calc(16px + var(--safe-bottom));display:flex;align-items:center;justify-content:space-between}.quiz-nav__progress{font-size:16px;letter-spacing:-.24px;font-weight:600}.nav-circle{width:40px;height:40px;border-radius:41px;display:flex;align-items:center;justify-content:center;background:#ffffff80}.nav-circle--bordered{border:1px solid var(--black)}.nav-circle img{width:12px;height:24px}.nav-circle--next img{transform:rotate(180deg)}.quiz-nav--submit{justify-content:flex-end;gap:10px}.quiz-nav--submit .btn{flex:1;max-width:320px}.result{padding:calc(56px + var(--safe-top)) 16px 0;text-align:left}.result__title{font-family:var(--font-serif);font-size:24px;margin:0 6px}.result__frame{margin:16px auto 0;width:320px;max-width:100%;border:1px solid var(--black);padding:10px;aspect-ratio:339 / 411}.result__frame img{width:100%;height:100%;object-fit:cover}.result__name{margin-top:12px;margin-bottom:4px;text-align:center;font-family:var(--font-serif);font-size:36px;font-weight:600}.result__tag{margin-top:4px;margin-bottom:20px;text-align:center;font-size:14px;color:var(--muted)}.result .page-footer{display:flex;flex-direction:column;gap:16px;align-items:stretch;margin-top:auto;padding-top:8px}.board{padding:calc(30px + var(--safe-top)) 0 0;height:100%}.board__header{display:flex;align-items:center;gap:10px;padding:0 16px}.board__title{font-size:20px}.board__en{font-family:var(--font-display);font-size:20px;letter-spacing:.04em}.board__body{display:flex;gap:15px;margin-top:40px;padding:0 16px 120px}.board__rail{position:relative;width:20px;flex-shrink:0;align-self:stretch;min-height:288px;margin-top:60px}.board__rail-line{position:absolute;left:50%;top:0;bottom:0;width:0;border-left:2px dashed var(--black);transform:translate(-50%)}.board__rail-dot{position:absolute;left:50%;top:0;width:20px;height:20px;margin-left:-10px;border-radius:50%;background:var(--black);will-change:transform;transition:transform .08s linear}.board__list{flex:1;display:flex;flex-direction:column;gap:16px;min-width:0}.bounty-card{position:relative;height:148px;border:1px solid var(--black);overflow:hidden;text-align:left;width:100%;padding:18px 22px;background:var(--white)}.bounty-card__bg{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.5;pointer-events:none}.bounty-card__bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.2)}.bounty-card__title{position:relative;font-family:var(--font-serif);font-size:20px;line-height:1.35;max-width:200px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.bounty-card__line{position:absolute;left:22px;right:16px;top:107px;border-top:1px dashed var(--black)}.bounty-card__meta{position:absolute;left:22px;right:16px;bottom:16px;display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:500}.bounty-card__reward{white-space:nowrap}.detail{padding:calc(27px + var(--safe-top)) 16px 0}.detail__nav{display:flex;align-items:center;gap:10px}.detail__nav-title{font-size:20px}.detail__card{margin-top:28px;height:393px;border:1px solid var(--black);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:24px}.detail__card-bg{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.5}.detail__card-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.35)}.detail__card-title{position:relative;font-family:var(--font-serif);font-size:36px;line-height:1.35;text-align:left;max-width:286px}.detail__divider{margin-top:18px;border-top:1px dashed var(--black)}.detail__meta{margin-top:12px;display:flex;flex-direction:column;gap:16px}.detail__author{font-size:16px;font-weight:500}.detail__reward{font-size:20px;font-weight:500}.reward{padding:calc(31px + var(--safe-top)) 10px 0}.reward__header{display:flex;align-items:center;gap:10px;font-size:20px;padding:0 12px}.reward__header-en{font-family:var(--font-display);letter-spacing:.02em;width:176px}.reward__cards{margin-top:64px;display:flex;justify-content:space-between;gap:5px}.reward-card{width:188px;height:493px;position:relative;text-align:left;padding:47px 16px 0;border:1px solid var(--black);background:var(--white);color:var(--black);transition:background .2s ease,color .2s ease}.reward-card--selected{background:var(--black);color:var(--white)}.reward-card__en{font-family:var(--font-display);font-size:11px;letter-spacing:.06em}.reward-card__title{margin-top:16px;font-family:var(--font-serif);font-size:26px}.reward-card__desc{margin-top:16px;font-family:var(--font-serif);font-size:12px}.reward-card__rule{margin-top:20px;width:20px;border-top:1px solid currentColor}.reward-card__action{position:absolute;left:0;right:0;bottom:40px;text-align:center;font-family:var(--font-serif);font-size:16px;text-decoration:underline;text-underline-offset:6px}.reward-panel{margin-top:16px;padding:0 6px 100px}.reward-panel label{display:block;font-size:14px;margin-bottom:8px;color:var(--muted)}.reward-panel select,.reward-panel input{width:100%;height:44px;border:1px solid var(--black);padding:0 12px;background:var(--white);font-size:16px}.post{padding:calc(32px + var(--safe-top)) 0 0}.post__header{display:flex;align-items:center;gap:10px;font-size:20px;padding-left:16px}.post__header-en{font-family:var(--font-display);width:176px;letter-spacing:.02em}.post__sheet{margin:24px 13px 0;height:500px;background:var(--white);border:1px dashed #888;box-shadow:0 4px 20px #3333;padding:134px 53px 24px;display:flex;flex-direction:column;gap:28px}.post__hint{font-size:20px;font-weight:500}.post__input{width:100%;min-height:160px;resize:none;font-size:20px;font-weight:500;line-height:1.5;caret-color:#e23;background:transparent}.post__input::placeholder{color:var(--placeholder)}.toast{position:fixed;left:50%;bottom:100px;transform:translate(-50%);background:#000000d9;color:#fff;padding:10px 18px;border-radius:8px;font-size:14px;z-index:100;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(max-width:420px){.app-shell{background:var(--bg);align-items:stretch}.page{max-width:none;height:100dvh;max-height:none}.result__frame{width:100%}.reward-card{width:calc(50% - 2.5px);height:min(493px,62vh)}}