:root{--bg: #f6faf6;--card: #ffffff;--ink: #1e2a22;--ink-soft: #6a786f;--accent: #4d6a53;--accent-soft: #edf6ef;--teal: #6c8d71;--line: #dbe8dd;--radius: 22px;--shadow: 0 2px 12px rgba(30, 42, 34, .06)}*{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,PingFang SC,Noto Sans SC,Segoe UI,sans-serif;line-height:1.65;font-size:16px}#root{max-width:560px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}.page{flex:1;display:flex;flex-direction:column;padding:24px 20px calc(24px + env(safe-area-inset-bottom));animation:fadein .3s ease}.test-header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px 0}.fast-badge{position:fixed;top:8px;right:12px;background:#7fa586;color:#fff;font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px;z-index:200;box-shadow:0 2px 8px #00000026}.header-btn{background:transparent;border:none;color:var(--ink-soft);font-size:.88rem;padding:6px 10px;cursor:pointer;border-radius:10px}.header-btn:active{background:var(--accent-soft)}.header-btn.danger{color:#c4563d}.confirm-overlay{position:fixed;inset:0;background:#121e168c;display:flex;align-items:center;justify-content:center;padding:24px;z-index:90}.confirm-card{background:var(--card);border-radius:var(--radius);padding:24px 20px;width:100%;max-width:340px;box-shadow:0 12px 40px #0000004d;animation:fadein .2s ease}@keyframes fadein{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}h1{font-size:1.9rem;line-height:1.35;margin:0 0 12px;font-weight:800}h2{font-size:1.45rem;line-height:1.4;margin:0 0 10px;font-weight:700}p{margin:0 0 12px;color:var(--ink-soft)}.lead{font-size:1.05rem;color:var(--ink)}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 20px;margin-bottom:16px}.quote{border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:0 12px 12px 0;padding:10px 14px;margin:12px 0;font-size:.98rem;color:var(--ink)}.hint{font-size:.85rem;color:var(--ink-soft)}.btn{display:block;width:100%;padding:15px 20px;border:none;border-radius:14px;background:var(--accent);color:#fff;font-size:1.05rem;font-weight:700;cursor:pointer;transition:transform .1s ease,opacity .2s ease,background .15s ease;text-align:center}.btn:hover{background:#3f5a46}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.secondary{background:#fff;color:var(--ink);border:2px solid var(--line)}.btn.ghost{background:transparent;color:var(--ink-soft);font-weight:500}.spacer{flex:1}.stage-progress{display:flex;gap:6px;padding:6px 0 18px}.stage-progress .stage{flex:1;height:8px;border-radius:4px;background:var(--line);overflow:hidden}.stage-progress .stage .fill{height:100%;background:var(--accent);border-radius:4px;transition:width .4s ease}.stage-progress .stage.done .fill{background:var(--accent);opacity:.55}.stage-labels{display:flex;justify-content:space-between;font-size:.72rem;color:var(--ink-soft);margin-top:-10px;padding-bottom:12px}.persona-preview-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.persona-preview{background:var(--bg);border-radius:12px;padding:12px 10px;text-align:center}.pp-emoji{font-size:1.7rem}.pp-name{font-weight:700;font-size:.95rem;margin:4px 0 2px}.pp-line{font-size:.78rem;color:var(--ink-soft);line-height:1.4}.options{display:flex;flex-direction:column;gap:10px}.option{background:var(--card);border:2px solid var(--line);border-radius:14px;padding:13px 16px;font-size:.98rem;cursor:pointer;display:flex;align-items:center;gap:10px;transition:border-color .15s,background .15s;text-align:left;color:var(--ink)}.option:active{background:var(--accent-soft)}.option.selected{border-color:var(--accent);background:var(--accent-soft)}.option .label{flex-shrink:0;min-width:26px;height:26px;border-radius:50%;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;padding:0 6px;font-size:.82rem;font-weight:800;color:var(--accent)}.option.selected .label{background:var(--accent);color:#fff}.word-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:10px}.word-chip{background:var(--card);border:2px solid var(--line);border-radius:12px;padding:12px 6px;text-align:center;font-size:.95rem;cursor:pointer;transition:border-color .15s,background .15s}.word-chip.selected{border-color:var(--accent);background:var(--accent-soft)}.grid-9{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:320px;margin:16px auto}.grid-cell{aspect-ratio:1;background:var(--card);border:2px solid var(--line);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:2rem;cursor:pointer;transition:border-color .15s,background .15s}.grid-cell.selected{border-color:var(--accent);background:var(--accent-soft)}.grid-cell.empty-cell{cursor:pointer}.step-progress{display:flex;align-items:center;gap:10px;margin-bottom:6px}.step-bar{flex:1;height:6px;border-radius:3px;background:var(--line);overflow:hidden}.step-bar .fill{height:100%;background:var(--accent);border-radius:3px;transition:width .3s ease}.step-pct{font-size:.8rem;color:var(--ink-soft);font-weight:600;min-width:34px;text-align:right}.timer-wrap{text-align:center;padding:12px 0}.timer{display:inline-flex;align-items:center;gap:8px;background:var(--card);border-radius:999px;padding:8px 18px;font-weight:800;font-size:1.1rem;color:var(--accent);box-shadow:var(--shadow)}.timer .bar{width:90px;height:8px;background:var(--line);border-radius:4px;overflow:hidden}.timer .bar .fill{height:100%;background:var(--accent);transition:width 1s linear}textarea{width:100%;border:2px solid var(--line);border-radius:14px;padding:14px;font-size:1rem;font-family:inherit;resize:none;background:var(--card);color:var(--ink);min-height:110px}textarea:focus{outline:none;border-color:var(--accent)}.char-count{text-align:right;font-size:.8rem;color:var(--ink-soft)}.confidence-row{display:flex;gap:8px;margin-top:12px}.confidence-row button{flex:1;padding:10px 6px;border-radius:12px;border:2px solid var(--line);background:var(--card);font-size:.88rem;cursor:pointer;color:var(--ink)}.confidence-row button.selected{border-color:var(--accent);background:var(--accent-soft)}.result-hero{text-align:center;padding:34px 0 18px}.result-hero .big-emoji{font-size:4.2rem}.persona-avatar{width:min(240px,78vw);height:auto;border-radius:24px;object-fit:contain;border:2px solid var(--line);box-shadow:var(--shadow);display:block;margin:6px auto 0}.result-hero .name{font-size:2.3rem;font-weight:800;margin:8px 0}.result-hero .tagline{font-size:1.1rem;color:var(--ink);font-weight:600}.result-hero .tags{margin-top:14px;color:var(--ink-soft);font-size:.95rem}.dim-row{margin-bottom:14px}.dim-row .dim-head{display:flex;justify-content:space-between;font-size:.92rem;margin-bottom:4px}.dim-row .dim-bar{height:12px;border-radius:6px;background:var(--line);overflow:hidden}.dim-row .dim-bar .fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--accent),#ffa06b);transition:width .6s ease}.dim-explain{font-size:.85rem;color:var(--ink-soft);padding:8px 12px;background:var(--accent-soft);border-radius:10px;margin-top:6px;animation:fadein .2s ease}.section-title{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.1rem;margin:20px 0 10px}.result-nav{display:flex;gap:8px;justify-content:center;padding:12px 0}.result-nav .dot{width:8px;height:8px;border-radius:50%;background:var(--line);cursor:pointer}.result-nav .dot.active{background:var(--accent);width:22px;border-radius:4px}.disclaimer{font-size:.78rem;color:#a39a8c;padding:24px 8px 8px;line-height:1.6}.code-row{display:flex;gap:10px;align-items:center}.result-code{flex:1;background:var(--bg);border:2px dashed var(--accent);border-radius:12px;padding:10px 14px;font-weight:800;letter-spacing:3px;font-size:1.15rem;text-align:center;color:var(--accent)}.code-input{flex:1;border:2px solid var(--line);border-radius:12px;padding:10px 14px;font-size:1rem;letter-spacing:2px;text-transform:uppercase;background:var(--card);color:var(--ink)}.code-input:focus{outline:none;border-color:var(--accent)}.code-copy{border:none;background:var(--accent-soft);color:var(--accent);font-weight:700;border-radius:12px;padding:10px 16px;cursor:pointer;font-size:.9rem}.code-copy:disabled{opacity:.5}.compare-card{background:var(--card);border-radius:20px;padding:24px 20px;width:100%;max-width:400px;animation:fadein .25s ease}.compare-headline{text-align:center;font-weight:800;font-size:1.25rem;margin-bottom:16px}.compare-personas{display:flex;align-items:stretch;gap:8px;margin-bottom:16px}.cp-side{flex:1;background:var(--bg);border-radius:14px;padding:14px 8px;text-align:center}.cp-emoji{font-size:2.4rem}.cp-name{font-weight:700;margin:4px 0 2px}.cp-tags{font-size:.78rem;color:var(--ink-soft)}.cp-vs{align-self:center;font-weight:800;color:var(--accent);font-size:1.2rem}.cp-line{font-size:.92rem;color:var(--ink-soft);text-align:center;margin:0 0 8px}.share-overlay{position:fixed;inset:0;background:#121e16a6;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;padding:24px;z-index:100}.share-overlay img{width:100%;max-width:380px;border-radius:18px;box-shadow:0 12px 40px #00000059}.share-overlay .hint{color:#fff;text-align:center}.stage-intro{text-align:center;padding-top:48px}.stage-intro .big-emoji{font-size:3.6rem}.stage-intro h1{margin-top:16px}@media(min-width:600px){h1{font-size:2.2rem}.page{padding:36px 28px}}.rule-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.rule-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px 14px;box-shadow:var(--shadow)}.rule-emoji{font-size:1.6rem}.rule-title{font-weight:700;font-size:.98rem;margin:6px 0 4px}.rule-text{font-size:.82rem;color:var(--ink-soft);line-height:1.55}.rule-text strong{color:var(--ink)}.hidden-persona-card{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(135deg,#f2f7f3,#e7f2ea);border:2px solid #7fa586;border-radius:18px;padding:18px 16px;margin-bottom:12px;box-shadow:var(--shadow)}.hp-emoji{font-size:2.2rem;line-height:1}.hp-name{font-weight:800;font-size:1.05rem;margin-bottom:4px;background:linear-gradient(90deg,#3f5a46,#6c8d71);-webkit-background-clip:text;background-clip:text;color:transparent}.radar-chart{width:100%;max-width:320px;height:auto}.patch-note{display:flex;align-items:center;gap:8px;width:100%;max-width:300px;margin-top:8px}.patch-note-label{font-size:.78rem;color:var(--ink-soft);white-space:nowrap}.patch-note-bar{flex:1;height:8px;border-radius:4px;background:repeating-linear-gradient(45deg,#edf6ef,#edf6ef 6px,#dbe8dd 6px 8px);overflow:hidden}.patch-note-bar .fill{height:100%;background:#b3544a;border-radius:4px;transition:width .6s ease}.patch-note-value{font-size:.8rem;font-weight:700;color:#b3544a;min-width:24px;text-align:right}.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.gallery-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:12px;text-align:center;box-shadow:var(--shadow)}.gallery-img-wrap{border-radius:12px;overflow:hidden;aspect-ratio:1;background:var(--accent-soft);display:flex;align-items:center;justify-content:center}.gallery-img{width:100%;height:100%;object-fit:cover;display:block}.gallery-emoji{font-size:3.4rem}.gallery-name{font-weight:800;margin:8px 0 2px;font-size:.98rem}.gallery-line{font-size:.8rem;color:var(--ink-soft);line-height:1.45}.persona-emoji-fallback{font-size:4.2rem}