:root{--ink:oklch(19% .03 268);--ink-soft:oklch(39% .04 260);--paper:oklch(96% .02 87);--paper-deep:oklch(91% .04 83);--jade:oklch(56% .12 166);--cinnabar:oklch(58% .17 28);--blue:oklch(47% .1 230);--gold:oklch(71% .13 83);--line:color-mix(in oklch, var(--ink), transparent 82%);--surface:color-mix(in oklch, var(--paper), white 28%);--shadow:0 28px 80px color-mix(in oklch, var(--ink), transparent 84%);--body-font:"PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;--display-font:"Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", serif;font-family:var(--body-font);color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{min-width:320px;min-height:100%}body{letter-spacing:0;min-width:320px;min-height:100svh;margin:0}button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed}#root{min-height:100svh}::selection{color:var(--paper);background:var(--cinnabar)}.answer-book{min-height:100svh;color:var(--ink);background:radial-gradient(circle at 50% 12%, color-mix(in oklch, var(--gold), transparent 66%), transparent 32%), radial-gradient(circle at 12% 72%, color-mix(in oklch, var(--jade), transparent 74%), transparent 30%), linear-gradient(135deg, color-mix(in oklch, var(--cinnabar), transparent 88%) 0 12%, transparent 12% 100%), var(--paper);place-items:center;padding:18px;display:grid}.answer-book__panel{grid-template-rows:auto 1fr auto;align-items:center;gap:16px;width:min(100%,430px);min-height:calc(100svh - 36px);display:grid}.answer-book__brand{color:var(--ink);font-family:var(--display-font);justify-self:center;align-items:center;gap:10px;padding:10px 14px;font-size:21px;font-weight:800;display:inline-flex}.oracle-book{width:100%;min-height:510px;color:inherit;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:8px;outline:none;place-items:center;padding:0;display:grid;position:relative}.oracle-book:focus-visible{outline:4px solid color-mix(in oklch, var(--gold), transparent 30%);outline-offset:6px}.oracle-book:not(:disabled):active .oracle-book__cover,.oracle-book:not(:disabled):active .oracle-book__page{transform:translateY(3px) rotate(var(--book-rotate))}.oracle-book__cover,.oracle-book__page{border-radius:8px;grid-area:1/1;width:min(84vw,340px);min-height:430px;transition:transform .26s cubic-bezier(.16,1,.3,1)}.oracle-book__cover{--book-rotate:-4deg;background:linear-gradient(90deg, color-mix(in oklch, var(--ink), transparent 56%) 0 34px, transparent 34px), linear-gradient(135deg, color-mix(in oklch, var(--cinnabar), black 18%), var(--cinnabar));border:1px solid color-mix(in oklch, var(--ink), transparent 55%);box-shadow:0 34px 80px color-mix(in oklch, var(--ink), transparent 80%), inset 0 1px 0 oklch(100% 5.96046e-8 none/.3);transform:rotate(var(--book-rotate));display:block;position:relative}.oracle-book__spine{background:color-mix(in oklch, var(--gold), transparent 42%);width:1px;position:absolute;inset:22px auto 22px 48px}.oracle-book__sigil{width:132px;height:132px;color:color-mix(in oklch, var(--gold), white 12%);border:2px solid color-mix(in oklch, var(--gold), transparent 14%);border-radius:50%;place-items:center;margin:auto;font-family:Georgia,serif;font-size:72px;font-weight:700;display:grid;position:absolute;inset:0}.oracle-book__page{--book-rotate:2deg;background:linear-gradient(color-mix(in oklch, var(--gold), transparent 82%) 1px, transparent 1px), color-mix(in oklch, var(--surface), white 18%);border:1px solid color-mix(in oklch, var(--ink), transparent 76%);box-shadow:0 22px 48px color-mix(in oklch, var(--ink), transparent 86%);transform:translate(9px, 11px) rotate(var(--book-rotate));background-size:100% 31px,auto;align-items:stretch;padding:24px;display:grid;position:relative;overflow:hidden}.oracle-book--closed .oracle-book__page{opacity:.82}.oracle-book--turning .oracle-book__cover{animation:.98s cubic-bezier(.16,1,.3,1) both cover-turn}.oracle-book--turning .oracle-book__page{animation:.98s cubic-bezier(.16,1,.3,1) both page-lift}.answer-page{text-align:center;grid-template-rows:auto 1fr auto;gap:18px;min-width:0;display:grid}.answer-page__kicker,.answer-page__comment{color:var(--ink-soft);font-size:14px;line-height:1.55}.answer-page__answer{color:var(--ink);font-family:var(--display-font);overflow-wrap:anywhere;align-self:center;font-size:42px;font-weight:800;line-height:1.26}.answer-page--wild .answer-page__answer{color:var(--cinnabar)}.answer-page--positive .answer-page__answer{color:color-mix(in oklch, var(--jade), black 24%)}.answer-page--caution .answer-page__answer{color:color-mix(in oklch, var(--cinnabar), black 12%)}.answer-page--pause .answer-page__answer{color:color-mix(in oklch, var(--blue), black 14%)}.answer-page--turning .answer-page__answer{font-size:34px}@keyframes cover-turn{0%{transform:rotate(-4deg)}48%{transform:translate(-18px,-10px)rotate(-12deg)rotateY(-24deg)}to{transform:rotate(-4deg)}}@keyframes page-lift{0%{transform:translate(9px,11px)rotate(2deg)}48%{transform:translate(18px,-12px)rotate(7deg)rotateX(8deg)}to{transform:translate(9px,11px)rotate(2deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}@media (width<=430px){.answer-book{padding:14px}.answer-book__panel{gap:10px;min-height:calc(100svh - 28px)}.answer-book__brand{padding-top:4px;font-size:20px}.oracle-book{min-height:456px}.oracle-book__cover,.oracle-book__page{width:min(88vw,330px);min-height:374px}.oracle-book__page{padding:22px}.answer-page__answer{font-size:36px}.answer-page--turning .answer-page__answer{font-size:30px}}@media (width<=360px){.oracle-book{min-height:420px}.oracle-book__cover,.oracle-book__page{min-height:340px}.answer-page__answer{font-size:31px}}