.xung-ho{--xh-bg:#0d080b;--xh-paper:#170d12;--xh-paper-soft:#21131a;--xh-ink:#f5e8c7;--xh-copy:#f5e8c7cc;--xh-muted:#f5e8c79e;--xh-line:#dcb96738;--xh-gold:#e8c56a;--xh-son:#e27b89;--xh-key:#2a1820;--xh-key-hover:#3a2029;--xh-focus:#f2d48a;min-height:70vh;color:var(--xh-ink);background:radial-gradient(120% 60% at 50% 0%, #96283738, transparent 70%), var(--xh-bg);padding:clamp(5.25rem,11vw,7rem) 1rem clamp(3rem,8vw,5rem)}html[data-theme=light] .xung-ho{--xh-bg:#f3e9d4;--xh-paper:#fbf4e4;--xh-paper-soft:#fffaf0;--xh-ink:#2a1c19;--xh-copy:#2a1c19cc;--xh-muted:#2a1c19a3;--xh-line:#2a1c1929;--xh-gold:#8a5a12;--xh-son:#9a2f3b;--xh-key:#f6ead2;--xh-key-hover:#efdcb8;--xh-focus:#8a5a12;background:radial-gradient(120% 60% at 50% 0%, #be5a4624, transparent 70%), var(--xh-bg)}.xung-ho__shell{max-width:1080px;margin:0 auto}.xung-ho__preview{border:1px dashed var(--xh-gold);max-width:720px;color:var(--xh-gold);text-align:center;border-radius:.75rem;margin:1rem auto 0;padding:.6rem 1rem}.xung-ho__head{text-align:center;max-width:720px;margin:1.5rem auto 0}.xung-ho__eyebrow{color:var(--xh-gold);letter-spacing:.18em;text-transform:uppercase;margin:0;font-size:.8rem;font-weight:700}.xung-ho__head h1{font:600 clamp(2.1rem, 7vw, 3.4rem) / 1.1 var(--font-serif,Lora, "Lora fallback", Georgia, serif);text-wrap:balance;margin:.5rem 0 0}.xung-ho__lead{max-width:62ch;color:var(--xh-copy);margin:1rem auto 0;font-size:1.05rem;line-height:1.65}.xung-ho__layout{gap:1.25rem;margin-top:2rem;display:grid}@media (width>=900px){.xung-ho__layout{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start}.xung-ho__builder{grid-area:1/1}.xung-ho__examples{grid-area:2/1}.xung-ho__result{grid-area:1/2/span 2;position:sticky;top:6rem}}.xung-ho__builder,.xung-ho__result,.xung-ho__how{border:1px solid var(--xh-line);background:var(--xh-paper);border-radius:1.25rem;min-width:0;padding:clamp(1rem,3vw,1.5rem)}.xung-ho__h2{font:600 1.35rem / 1.3 var(--font-serif,Lora, "Lora fallback", Georgia, serif);overflow-wrap:anywhere;margin:0 0 1rem}.xung-ho__options{gap:.75rem;display:grid}.xung-ho__segment{border:0;min-width:0;margin:0;padding:0}.xung-ho__segment legend{color:var(--xh-muted);margin-bottom:.4rem;font-size:.9rem}.xung-ho__segment-row{flex-wrap:wrap;gap:.5rem;display:flex}.xung-ho__chip-option{cursor:pointer;position:relative}.xung-ho__chip-option input{opacity:0;cursor:pointer;position:absolute;inset:0}.xung-ho__chip-option span{border:1px solid var(--xh-line);color:var(--xh-copy);background:var(--xh-paper-soft);border-radius:999px;padding:.45rem .95rem;line-height:1.3;display:inline-block}.xung-ho__chip-option input:checked+span{border-color:var(--xh-gold);color:var(--xh-ink);box-shadow:inset 0 0 0 1px var(--xh-gold);font-weight:600}.xung-ho__chip-option input:focus-visible+span{outline:2px solid var(--xh-focus);outline-offset:2px}.xung-ho__pad{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:1.25rem;display:grid}@media (width>=520px){.xung-ho__pad{grid-template-columns:repeat(5,minmax(0,1fr))}}.xung-ho__key,.xung-ho__ghost,.xung-ho__example{border:1px solid var(--xh-line);min-height:2.75rem;color:var(--xh-ink);font:inherit;background:var(--xh-key);cursor:pointer;border-radius:.8rem;padding:.5rem .75rem;line-height:1.25;transition:background-color .12s}.xung-ho__key{font-weight:600}.xung-ho__key:hover:not(:disabled),.xung-ho__ghost:hover:not(:disabled),.xung-ho__example:hover{background:var(--xh-key-hover)}.xung-ho__key:focus-visible,.xung-ho__ghost:focus-visible,.xung-ho__example:focus-visible,.xung-ho__age select:focus-visible{outline:2px solid var(--xh-focus);outline-offset:2px}.xung-ho__key:disabled,.xung-ho__ghost:disabled{opacity:.5;cursor:not-allowed}.xung-ho__chain{flex-wrap:wrap;align-items:center;gap:.4rem;margin:1.25rem 0 0;padding:0;list-style:none;display:flex}.xung-ho__link{border:1px solid var(--xh-line);background:var(--xh-paper-soft);border-radius:999px;flex-wrap:wrap;align-items:center;gap:.4rem;padding:.3rem .8rem;display:inline-flex}.xung-ho__link+.xung-ho__link:before{content:"›";color:var(--xh-gold);margin-right:.15rem}.xung-ho__link--me{color:var(--xh-muted)}.xung-ho__age select{border:1px solid var(--xh-line);max-width:100%;color:var(--xh-ink);font:inherit;background:var(--xh-paper);border-radius:.5rem;padding:.2rem .4rem;font-size:.9rem}.xung-ho__sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.xung-ho__actions,.xung-ho__example-row{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.xung-ho__ghost{background:0 0}.xung-ho__examples{border:1px solid var(--xh-line);background:var(--xh-paper);border-radius:1.25rem;min-width:0;padding:1rem clamp(1rem,3vw,1.5rem)}.xung-ho__example-row{margin-top:.5rem}.xung-ho__example{background:0 0;border-radius:999px;min-height:2.5rem;font-size:.95rem}.xung-ho__hint{color:var(--xh-muted);margin:.75rem 0 0;font-size:.92rem}.xung-ho__examples .xung-ho__hint{margin:0}.xung-ho__answers{gap:1rem;display:grid}.xung-ho__answer+.xung-ho__answer{border-top:1px solid var(--xh-line);padding-top:1rem}.xung-ho__label{color:var(--xh-muted);margin:0;font-size:.9rem}.xung-ho__term{color:var(--xh-gold);font:600 clamp(2rem, 6vw, 2.75rem) / 1.15 var(--font-serif,Lora, "Lora fallback", Georgia, serif);overflow-wrap:anywhere;margin:.15rem 0 .5rem}.xung-ho__copy{color:var(--xh-copy);margin:.5rem 0 0;line-height:1.6}.xung-ho__copy strong{color:var(--xh-ink)}.xung-ho__note{border-left:3px solid var(--xh-son);color:var(--xh-copy);margin:.75rem 0 0;padding-left:.75rem;line-height:1.55}.xung-ho__how{margin-top:1.25rem}.xung-ho__how ul{color:var(--xh-copy);gap:.6rem;margin:0;padding-left:1.2rem;line-height:1.65;display:grid}@media (prefers-reduced-motion:reduce){.xung-ho__key,.xung-ho__ghost,.xung-ho__example{transition:none}}
