:root{--ub-blue: #005bbb;--gray: #666666;--ink: #1a1a1a;--bg: #ffffff;--line: #e2e2e2;--line-strong: #cfcfcf;--grid-line: #b6b6b6;--letchworth: #e56a54;--font-head: "Sofia Pro", "Century Gothic", "Segoe UI", system-ui, sans-serif;--font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--measure: 460px;--gutter: 16px;--radius: 12px;--tap: 48px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;text-wrap:pretty}.display,.tendency-name,.stem,.stem-wrap .prompt{text-wrap:balance}.block,.block span,.tendency-second,.tie-line,.axis-desc,.lede,.option span{text-wrap:pretty}.app{min-height:100%;display:flex;flex-direction:column;align-items:center;padding:max(20px,env(safe-area-inset-top)) var(--gutter) max(16px,env(safe-area-inset-bottom))}.screen{width:100%;max-width:var(--measure);flex:1 0 auto;display:flex;flex-direction:column}.footer{width:100%;max-width:var(--measure);padding-top:24px;color:var(--gray);font-size:12px;text-align:center;flex-shrink:0}h1,h2,h3,.eyebrow{font-family:var(--font-head)}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);margin:0}.display{font-family:var(--font-head);font-weight:700;font-size:clamp(2.4rem,12vw,3.2rem);line-height:1.02;letter-spacing:-.02em;margin:0;color:var(--ink)}.lede{color:var(--gray);font-size:1.0625rem}.fields{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field-label{font-family:var(--font-head);font-weight:600;font-size:.9375rem;color:var(--ink)}.field-hint{font-family:var(--font-body);font-weight:400;font-size:.8125rem;color:var(--gray)}.field-note{font-family:var(--font-body);font-weight:400;font-size:.8125rem;line-height:1.4;color:var(--gray)}.field-error{font-family:var(--font-body);font-weight:500;font-size:.8125rem;color:#b00020}.field input,.field select{font:inherit;min-height:var(--tap);padding:10px 14px;color:var(--ink);background:#fff;border:1.5px solid var(--line-strong);border-radius:var(--radius)}.field select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23333' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center;padding-right:40px}.field input::placeholder{color:#9a9a9a}.field input:focus,.field select:focus{outline:3px solid var(--ub-blue);outline-offset:1px;border-color:var(--ub-blue)}.btn{font-family:var(--font-head);font-size:1.0625rem;font-weight:600;min-height:var(--tap);padding:12px 22px;border-radius:var(--radius);border:2px solid transparent;cursor:pointer;transition:transform .12s ease,background-color .12s ease,color .12s ease}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn-primary{background:var(--ub-blue);color:#fff;border-color:var(--ub-blue);width:100%}.btn-ghost{background:transparent;color:var(--ub-blue);border-color:transparent;padding:12px 8px;min-height:var(--tap);display:inline-flex;align-items:center;gap:6px}.btn-outline{background:transparent;color:var(--ub-blue);border:2px solid var(--ub-blue);width:100%}a.btn{display:block;text-align:center;text-decoration:none}.btn-stack{display:flex;flex-direction:column;gap:10px}:where(button,a,[tabindex]):focus-visible{outline:3px solid var(--ub-blue);outline-offset:2px;border-radius:var(--radius)}.progress-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}.progress-count{font-family:var(--font-head);font-weight:600;color:var(--gray);font-size:13px;letter-spacing:.08em}.track{height:6px;background:var(--line);border-radius:999px;overflow:hidden}.track>i{display:block;height:100%;background:var(--ub-blue);border-radius:999px;transition:width .22s ease}.stem{font-family:var(--font-head);font-weight:600;font-size:1.375rem;line-height:1.28;letter-spacing:-.01em;margin:22px 0 18px}.stem-wrap{margin:22px 0 18px}.stem-wrap .scene{display:block;font-family:var(--font-body);font-weight:400;font-style:italic;font-size:1.25rem;line-height:1.36;letter-spacing:-.01em;color:var(--ink);white-space:pre-line}.stem-wrap .prompt{display:block;margin-top:12px;font-family:var(--font-head);font-weight:700;font-size:1.0625rem;letter-spacing:.01em;color:var(--ub-blue)}.options{display:flex;flex-direction:column;gap:10px}.option{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:var(--tap);padding:14px 16px;text-align:left;font:inherit;color:var(--ink);background:#fff;border:1.5px solid var(--line-strong);border-radius:var(--radius);cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease}.option:hover{border-color:var(--gray)}.option[aria-pressed=true]{border-color:var(--ub-blue);border-width:2.5px;box-shadow:inset 0 0 0 1px var(--ub-blue);font-weight:600}.option .mark{flex:0 0 auto;width:22px;height:22px;border-radius:50%;border:2px solid var(--line-strong);display:grid;place-items:center;color:#fff}.option[aria-pressed=true] .mark{background:var(--ub-blue);border-color:var(--ub-blue)}.option .mark svg{opacity:0}.option[aria-pressed=true] .mark svg{opacity:1}.result-head{margin:8px 0 4px}.tendency-name{font-family:var(--font-head);font-weight:700;font-size:clamp(2rem,9vw,2.6rem);line-height:1.05;letter-spacing:-.02em;color:var(--ub-blue);margin:0}.tendency-second{color:var(--gray);font-size:1rem;margin:6px 0 0}.next-name{font-style:italic;font-weight:600;color:var(--ink)}.tie-line{margin:14px 0 0;padding:12px 14px;border:1.5px solid var(--line);border-left:3px solid var(--ub-blue);border-radius:8px;color:var(--ink);font-size:.95rem}.blocks{margin-top:22px;display:flex;flex-direction:column;gap:16px}.block-group+.block-group{border-top:1px solid var(--line);padding-top:18px}.block-group h3{font-size:1.25rem;color:var(--ink);margin:0 0 12px}.block{margin:0 0 10px}.block b{color:var(--ink);font-family:var(--font-head)}.block span{color:var(--gray)}.block span strong{color:var(--ink);font-weight:700}.block span em{font-style:italic;color:var(--ink)}.lead-word{font-style:italic;font-weight:600;color:var(--ink)}.axis-guide{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}.axis-name{font-family:var(--font-head);font-weight:700;font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ub-blue);margin:0 0 3px}.axis-desc{margin:0;color:var(--ink);font-size:1.0625rem;line-height:1.4}.axis-desc em{font-style:italic;color:var(--ink)}.grid-wrap{margin:22px 0 4px}.grid-axis-top,.grid-axis-bottom{text-align:center;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#333}.grid-axis-top{margin-bottom:6px}.grid-axis-bottom{margin-top:6px}.grid-row{display:flex;align-items:stretch;gap:8px}.grid-side{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#333;display:grid;place-items:center}.grid-side.right{transform:none;writing-mode:vertical-rl}.grid{position:relative;flex:1;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:6px;aspect-ratio:1 / .72}.cell{border:1.5px solid var(--grid-line);border-radius:10px;display:grid;place-content:center;text-align:center;padding:8px;color:#333;font-size:15px;font-family:var(--font-head);font-weight:900}.cell.secondary{border-color:var(--ub-blue);color:var(--ub-blue)}.cell.primary{background:#005bbb33;border-color:var(--ub-blue);color:var(--ub-blue)}.grid-dot{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--letchworth);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--letchworth),0 1px 4px #00000047;transform:translate(-50%,-50%);z-index:2}.stack-top{margin-top:auto;padding-top:28px}.row-between{display:flex;align-items:center;justify-content:space-between;gap:8px}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}