.cat-type-root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#21232a;--muted:#666b77;--paper:#fffdfa;--surface:#fff;--line:#e7e0d6;--coral:#ff6f61;--coral-deep:#d9483f;--teal:#129b95;--teal-soft:#d9f4ef;--yellow:#ffd166;--mint:#b7f0d4;--shadow:0 18px 44px #29251f1f;--radius:8px;background:linear-gradient(180deg, #ffd1663d, #fff0 28rem), var(--paper);min-height:100vh;color:var(--ink);margin:0;font-family:Inter,PingFang SC,Hiragino Sans GB,Microsoft YaHei,system-ui,sans-serif;overflow-x:hidden}.cat-type-root *{box-sizing:border-box}.cat-type-root [hidden]{display:none!important}.cat-type-root button{font:inherit;cursor:pointer;border:0}.cat-type-root button:disabled{cursor:not-allowed;opacity:.45}.cat-type-root img{max-width:100%;display:block}.app-shell{min-height:100vh;padding:24px}.quiz-stage{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,.9fr) minmax(280px,.8fr);align-items:stretch;gap:20px;width:min(1160px,100%);min-width:0;margin:0 auto;display:grid}.app-shell.is-quiz-mode .quiz-stage{width:min(720px,100%);padding-top:32px;display:block}.app-shell.is-quiz-mode .quiz-panel{width:100%;margin:0 auto}.app-shell.is-result-mode .quiz-stage{display:none}.app-shell.is-result-mode .result-section{margin-top:0}.intro-panel{align-self:end;min-width:0;padding:28px 0 8px}.kicker{background:var(--teal-soft);color:#0b6f6a;border:1px solid #129b9540;border-radius:999px;width:fit-content;margin:0 0 14px;padding:7px 10px;font-size:13px;font-weight:800}.cat-type-root :is(h1,h2,h3,p){margin-top:0}.cat-type-root h1{text-align:center;letter-spacing:0;overflow-wrap:break-word;max-width:620px;margin:8px auto 20px;font-size:clamp(34px,4.4vw,44px);font-weight:850;line-height:1.16}.intro-copy{max-width:560px;color:var(--muted);overflow-wrap:anywhere;margin-bottom:20px;font-size:18px;line-height:1.75}.visual-panel{min-width:0;min-height:620px;box-shadow:var(--shadow);background:#f9f1e4;border-radius:18px;grid-area:1/2/3;position:relative;overflow:hidden}.visual-panel img{object-fit:cover;object-position:86% center;width:100%;min-width:0;height:100%}.visual-title{color:#26313b;text-shadow:0 1px #fffaefd1;gap:7px;width:max-content;max-width:calc(100% - 64px);padding:0 0 9px 14px;display:grid;position:absolute;top:clamp(22px,4vw,40px);left:clamp(22px,4vw,42px);transform:rotate(-.8deg)}.visual-title:before{content:"";background:#f36f61;border-radius:999px;width:4px;height:22px;position:absolute;top:1px;left:0;box-shadow:0 28px #0b8f8a}.visual-title:after{content:"";background:#ffca4ab8;border-radius:999px;width:110px;height:5px;position:absolute;bottom:0;left:14px;transform:rotate(-.8deg)}.visual-title span{color:#0b6f6a;letter-spacing:.16em;font-size:12px;font-weight:950;line-height:1}.visual-title em{color:#2f3743;letter-spacing:.02em;white-space:nowrap;font-size:18px;font-style:normal;font-weight:950;line-height:1.05}.nowrap{white-space:nowrap}.start-panel,.quiz-panel{border:1px solid var(--line);width:min(650px,100%);min-width:0;min-height:412px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe6;border-radius:16px;align-self:start;padding:24px}.start-panel{gap:16px;min-height:auto;padding:26px;display:grid}.start-panel h2{letter-spacing:0;max-width:560px;margin:0;font-size:28px;line-height:1.22}.cat-form{gap:10px;display:grid}.cat-form label{color:#4c515c;font-size:14px;font-weight:900}.name-row{grid-template-columns:minmax(0,1fr) auto;gap:10px;display:grid}.name-row input{border:1px solid var(--line);border-radius:var(--radius);width:100%;min-height:48px;color:var(--ink);font:inherit;background:#fff;outline:none;padding:0 14px;font-weight:800}.name-row input::placeholder{color:#c4c7ce}.name-row input:focus{border-color:var(--teal);box-shadow:0 0 0 4px #129b951f}.quiz-topline{color:var(--muted);justify-content:space-between;gap:16px;margin-bottom:14px;font-size:14px;font-weight:800;display:flex}.progress-track{background:#ece9e2;border-radius:999px;height:10px;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg, var(--coral), var(--yellow), var(--teal));width:0%;height:100%;transition:width .24s;display:block}.question-block{gap:18px;padding:26px 0 22px;display:grid}.question-title{overflow-wrap:anywhere;min-height:70px;margin:0;font-size:24px;font-weight:900;line-height:1.45}.answer-list{gap:12px;display:grid}.answer-btn{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-height:88px;color:var(--ink);text-align:left;grid-template-columns:36px 1fr;gap:12px;padding:16px;transition:transform .18s,border-color .18s,background-color .18s;display:grid;box-shadow:0 10px 24px #29251f0f}.answer-btn:hover{border-color:#129b9566;transform:translateY(-1px)}.answer-btn.is-selected{border-color:var(--teal);background:linear-gradient(90deg,#d9f4efe6,#fffffff5)}.answer-key{background:var(--ink);color:#fff;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:900;display:grid}.answer-copy{gap:6px;display:grid}.answer-main{overflow-wrap:anywhere;font-size:17px;font-weight:850;line-height:1.45}.answer-meta{color:var(--muted);overflow-wrap:anywhere;font-size:13px;line-height:1.4}.quiz-actions{grid-template-columns:minmax(160px,280px);justify-content:center;gap:10px;display:grid}.quiz-actions .ghost-btn{width:100%}.result-actions{flex-wrap:wrap;gap:10px;display:flex}.primary-btn,.ghost-btn{border-radius:var(--radius);min-height:44px;padding:0 18px;font-weight:900}.primary-btn{background:var(--ink);color:#fff}.primary-btn:hover{background:#000}.ghost-btn{border:1px solid var(--line);color:var(--ink);background:#fff}.ghost-btn:hover{border-color:#ff6f618c}.result-section{width:min(760px,100%);margin:24px auto 0}.result-card{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:18px;grid-template-columns:1fr;display:grid;overflow:hidden}.result-content{padding:34px}.result-heading{gap:16px;margin-bottom:16px;display:grid}.result-code-card{background:linear-gradient(135deg,#fff6d6 0%,#fffaf0 48%,#e8f9f6 100%);border:2px solid #ffca4ad1;border-radius:16px;gap:8px;width:min(360px,100%);padding:17px 18px 16px;display:grid;position:relative;box-shadow:0 18px 42px #1f232e1f}.result-code-card:before{content:"";background:var(--coral);width:10px;height:10px;box-shadow:18px 0 0 var(--teal), 36px 0 0 var(--yellow);border-radius:999px;display:block}.result-code-label{color:#7a5a05;letter-spacing:.08em;font-size:12px;font-weight:950}.result-code{color:var(--ink);letter-spacing:.08em;font-size:clamp(42px,5.7vw,64px);font-weight:950;line-height:.96;display:block}.result-code-meaning{color:#59616f;font-size:13px;font-weight:850;line-height:1.45}.result-heading h2{letter-spacing:0;margin:0;font-size:34px;line-height:1.14}.result-summary{color:#3f444e;font-size:17px;line-height:1.72}.axis-bars{gap:18px;margin:22px 0;display:grid}.axis-row{grid-template-columns:minmax(78px,.8fr) minmax(120px,2fr) minmax(78px,.8fr);align-items:center;gap:14px;display:grid}.axis-side{color:#9a9489;gap:4px;font-weight:850;line-height:1.18;display:grid}.axis-side strong{color:inherit;font-size:22px;font-weight:950}.axis-side span{font-size:13px}.axis-side--right{text-align:right;justify-items:end}.axis-side.is-active{color:#7a5a05}.axis-meter{background:#eee8da;border-radius:999px;height:11px;position:relative;overflow:hidden}.axis-meter span{border-radius:inherit;background:#f0bf44;position:absolute;inset:0 auto 0 0}.axis-row--right .axis-meter span{left:auto;right:0}.tips-box{border-radius:var(--radius);background:#f7fbf8;border:1px solid #dcefe8;margin:22px 0;padding:18px}.tips-box h3{margin-bottom:10px;font-size:18px}.tips-box ul{color:#3f444e;gap:8px;margin:0;padding-left:20px;line-height:1.6;display:grid}@media (width<=900px){.app-shell{padding:14px}.quiz-stage{grid-template-columns:1fr;gap:14px}.intro-panel{order:1;padding-top:8px}.cat-type-root h1{font-size:32px}.intro-copy{font-size:16px}.visual-panel{border-radius:14px;order:2;grid-area:auto;min-height:230px;max-height:320px}.start-panel{order:3}.start-panel,.quiz-panel{border-radius:14px;min-height:0;padding:18px}.quiz-panel{order:3}.start-panel h2{font-size:24px}.question-title{min-height:auto;font-size:21px}.result-content{padding:20px}}@media (width<=520px){.cat-type-root{background:linear-gradient(180deg, #ffd1663d, #fff0 24rem), var(--paper)}.app-shell{padding:max(12px, env(safe-area-inset-top)) 12px max(24px, env(safe-area-inset-bottom))}.cat-type-root h1{margin:6px auto 18px;font-size:clamp(29px,8.2vw,34px);line-height:1.12}.quiz-stage{gap:12px;width:100%;max-width:100%}.intro-panel,.visual-panel,.quiz-panel,.start-panel,.intro-copy{max-width:100%}.intro-copy{word-break:break-all}.intro-panel{padding-top:2px}.quiz-topline{gap:6px;display:grid}.visual-panel{aspect-ratio:1.68;border-radius:16px;min-height:0;max-height:none}.visual-title{width:max-content;max-width:calc(100% - 52px);padding-left:12px;top:22px;left:22px}.visual-title:before{width:4px;height:19px;box-shadow:0 24px #0b8f8a}.visual-title em{font-size:16px}.start-panel,.quiz-panel{border-radius:18px;padding:20px}.cat-form{gap:12px}.name-row{grid-template-columns:1fr;gap:12px}.name-row input,.primary-btn,.ghost-btn{min-height:54px}.answer-btn{border-radius:12px;grid-template-columns:34px 1fr;gap:13px;min-height:104px;padding:16px 14px}.answer-key{width:32px;height:32px}.answer-main{font-size:16px}.answer-meta{font-size:12px;line-height:1.5}.question-block{gap:16px;padding:24px 0 20px}.question-title{font-size:clamp(22px,6.3vw,26px);line-height:1.36}.quiz-actions{grid-template-columns:minmax(176px,280px)}.result-section{width:100%}.result-card{border-radius:20px}.result-content{padding:22px}.result-code-card{border-radius:18px;width:100%;padding:18px}.result-heading h2{font-size:clamp(34px,9vw,42px)}.result-summary{font-size:17px;line-height:1.72}.result-actions{grid-template-columns:1fr 1fr;display:grid}.axis-row{grid-template-columns:62px minmax(96px,1fr) 62px;gap:10px}.axis-side strong{font-size:19px}.axis-side span{font-size:12px}}@media (width<=370px){.app-shell{padding-left:10px;padding-right:10px}.start-panel,.quiz-panel,.result-content{padding:18px}.visual-title{top:18px;left:18px}.answer-btn{grid-template-columns:30px 1fr;gap:11px;padding:14px 12px}.answer-key{width:30px;height:30px}.axis-row{grid-template-columns:54px minmax(82px,1fr) 54px;gap:8px}.axis-side strong{font-size:17px}.axis-side span{font-size:11px}}