:root{--mint: #A8D8B9;--mint-deep: #7FBF9A;--beige: #F5E6CC;--beige-deep: #F5E6CC;--fog: #7EB8C9;--ink: #2C3E3A;--ink-soft: #5C6B66;--ink-muted: #8A968F;--bg: #FBF8F2;--card: #FFFFFF;--shadow: 0 4px 20px rgba(44, 62, 58, .08);--border: rgba(44, 62, 58, .1);--border-strong: rgba(44, 62, 58, .18);--mint-wash: rgba(168, 216, 185, .14);--mint-tint: rgba(168, 216, 185, .18);--mint-tint-strong: rgba(168, 216, 185, .2);--mint-fill: rgba(168, 216, 185, .45);--fog-track: rgba(126, 184, 201, .18);--fog-axis: rgba(126, 184, 201, .4);--fog-grid: rgba(126, 184, 201, .18);--dept-gradient: linear-gradient(135deg, rgba(168, 216, 185, .18), rgba(245, 230, 204, .4));--toggle-bg: rgba(44, 62, 58, .06);--toggle-active: var(--mint);--toggle-icon: var(--ink-soft);--meta-theme-color: #A8D8B9;--white: #FFFFFF;--radius: 16px;--radius-sm: 10px;--maxw: 480px;--theme-transition: background-color .2s ease, color .2s ease, border-color .2s ease}:root[data-theme=dark]{--mint: #7BC099;--mint-deep: #5BA882;--beige: #2D342F;--beige-deep: #232B27;--fog: #6BAFCC;--ink: #E8EDE9;--ink-soft: #9BAAA3;--ink-muted: #828F89;--bg: #1A1F1D;--card: #252B28;--shadow: 0 4px 20px rgba(0, 0, 0, .3);--border: rgba(255, 255, 255, .1);--border-strong: rgba(255, 255, 255, .18);--mint-wash: rgba(123, 192, 153, .12);--mint-tint: rgba(123, 192, 153, .16);--mint-tint-strong: rgba(123, 192, 153, .2);--mint-fill: rgba(123, 192, 153, .35);--fog-track: rgba(107, 175, 204, .15);--fog-axis: rgba(107, 175, 204, .35);--fog-grid: rgba(107, 175, 204, .15);--dept-gradient: linear-gradient(135deg, rgba(123, 192, 153, .16), rgba(245, 230, 204, .06));--toggle-bg: rgba(255, 255, 255, .08);--toggle-active: var(--mint);--toggle-icon: var(--ink-soft);--meta-theme-color: #1A1F1D;--white: #252B28}html[data-theme] body,html[data-theme] .app-shell,html[data-theme] .card,html[data-theme] .btn{transition:var(--theme-transition)}@media (prefers-color-scheme: dark){:root:not([data-theme]){color-scheme:dark}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}#root{min-height:100vh}a{color:var(--fog)}.app-shell{max-width:var(--maxw);margin:0 auto;min-height:100vh;padding:24px 20px 48px;display:flex;flex-direction:column}.brand-title{font-size:22px;font-weight:700;letter-spacing:.5px;color:var(--ink);margin:0}.brand-sub{font-size:13px;color:var(--ink-soft);margin:4px 0 0}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px 20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px 20px;border:none;border-radius:999px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .12s ease,opacity .12s ease;text-decoration:none;word-break:break-word;overflow-wrap:break-word}.btn:active{transform:scale(.98)}.btn-primary{background:var(--mint);color:var(--ink)}.btn-secondary{background:var(--beige);color:var(--ink)}.btn-ghost{background:transparent;color:var(--ink-soft);border:1px solid var(--mint)}.btn:disabled{opacity:.5;cursor:not-allowed}.disclaimer{font-size:12px;line-height:1.7;color:var(--ink-soft);background:var(--mint-wash);border-radius:var(--radius-sm);padding:12px 14px}.muted{color:var(--ink-soft);font-size:13px}.center{text-align:center}.stack>*+*{margin-top:16px}.stack-sm>*+*{margin-top:8px}.progress-track{height:6px;background:var(--fog-track);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:var(--mint);border-radius:999px;transition:width .3s ease}.countdown{font-variant-numeric:tabular-nums;font-weight:700;color:var(--fog)}.likert-options{display:flex;flex-direction:column;gap:10px}.likert-opt{display:flex;align-items:center;gap:12px;padding:14px 16px;border:2px solid transparent;border-radius:var(--radius-sm);background:var(--bg);cursor:pointer;transition:border-color .12s ease,background .12s ease}.likert-opt.selected{border-color:var(--mint);background:var(--mint-tint)}.likert-dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--fog);flex-shrink:0}.likert-opt.selected .likert-dot{background:var(--mint);border-color:var(--mint)}.binary-grid{display:grid;grid-template-columns:1fr;gap:12px}.binary-opt{padding:22px 18px;border-radius:var(--radius);border:2px solid var(--beige);background:var(--card);cursor:pointer;text-align:left;font-size:16px;font-weight:500;transition:border-color .12s ease,transform .12s ease,background .12s ease}.binary-opt:active{transform:scale(.98)}.binary-opt.selected{border-color:var(--mint);background:var(--mint-tint-strong)}.result-hero{text-align:center;padding:8px 0 4px}.archetype-name{font-size:30px;font-weight:800;color:var(--mint-deep);margin:8px 0 2px}.archetype-slogan{font-size:15px;color:var(--ink-soft);letter-spacing:1px}.dim-bar-row{display:flex;align-items:center;gap:10px;font-size:14px}.dim-bar-label{width:84px;flex-shrink:0;color:var(--ink-soft)}.dim-bar-track{flex:1;height:8px;background:var(--fog-track);border-radius:999px;overflow:hidden}.dim-bar-fill{height:100%;background:var(--mint);border-radius:999px}.dim-bar-val{width:34px;text-align:right;font-variant-numeric:tabular-nums;color:var(--ink);font-weight:600}.dept-card{background:var(--dept-gradient);border-radius:var(--radius);padding:16px 18px}.dept-name{font-size:18px;font-weight:700;color:var(--ink)}.qr-wrap{text-align:center}.qr-wrap img{max-width:200px;width:100%;border-radius:var(--radius-sm)}.canvas-host{width:100%;display:flex;justify-content:center}.canvas-host canvas{max-width:100%;height:auto;border-radius:var(--radius-sm)}.fade-in{animation:fadeIn .4s ease both}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:8px 4px;background:var(--bg)}.topbar-actions{display:inline-flex;align-items:center;gap:8px}.lang-toggle{display:inline-flex;align-items:center;gap:2px;padding:6px 14px;border:1px solid var(--mint);border-radius:999px;background:transparent;color:var(--ink-soft);font-size:13px;font-weight:600;cursor:pointer;transition:background .12s ease,color .12s ease;-webkit-tap-highlight-color:transparent;word-break:break-word;overflow-wrap:break-word}.lang-toggle:active{transform:scale(.96)}.theme-toggle{display:inline-flex;align-items:center;padding:2px;border-radius:999px;background:var(--toggle-bg)}
