@font-face{font-family:Yizhan;src:url('assets/fonts/yizhan-brush.ttf') format('truetype');font-display:swap}:root{color-scheme:light;--bg:#f4f6f8;--card:#fff;--ink:#203440;--muted:#6a7881;--line:#dbe2e6;--gold:#927b50;--tech:#427d85;--tint:#eaf0f2}:root[data-theme=night]{color-scheme:dark;--bg:#10191f;--card:#192730;--ink:#e5ecf0;--muted:#a2b0b8;--line:#35454f;--gold:#ceb485;--tech:#91c8ce;--tint:#223640}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'PingFang TC','Microsoft JhengHei',sans-serif;line-height:1.75}main{max-width:960px;margin:auto;padding:24px 20px 40px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:0 0 22px;gap:12px}a{color:var(--tech)}header a{text-decoration:none;color:var(--ink)}.brand{font-family:Yizhan,serif;font-size:38px}.theme{display:flex;background:var(--tint);padding:3px;border-radius:10px}.theme button{padding:8px;min-height:40px;border:0;background:none}.theme button[aria-pressed=true]{background:var(--card)}button,input,select{font:inherit;color:inherit;min-width:0}button{border:1px solid var(--line);border-radius:9px;background:var(--card);padding:10px 16px;min-height:44px;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--tech);outline-offset:3px}input,select{display:block;width:100%;min-height:48px;border:1px solid var(--line);border-radius:8px;background:var(--bg);padding:10px;margin:7px 0 16px}label{display:block}.intro{padding:28px 0 20px}.eyebrow{font-size:13px;color:var(--gold);letter-spacing:.13em}h1{font-size:clamp(26px,4vw,36px);font-weight:550;margin:8px 0}h2{font-size:23px;margin:0 0 14px}h3{font-size:19px;margin:0 0 10px}p{margin:10px 0}.intro p,.hint,footer{color:var(--muted)}.hint{font-size:14px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;margin:0 0 20px}.form-grid,.name-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px}.primary{background:var(--ink);color:var(--card);width:100%;margin-top:18px;border:0}.settings{border-top:1px solid var(--line);padding-top:12px}summary{cursor:pointer;color:var(--gold);padding:5px 0}details p{font-size:14px}.settings label{margin-top:14px}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0}.pillar{text-align:center;background:var(--tint);padding:10px 4px;border-radius:8px}.pillar strong{display:block;font-size:26px;color:var(--gold);letter-spacing:.08em}.pillar span{font-size:13px;color:var(--muted)}.chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.chip{display:inline-block;background:var(--tint);padding:4px 12px;border-radius:6px;font-size:14px}.word{display:inline-block;margin:3px 10px 3px 0}.word strong{font-size:23px;color:var(--gold)}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.name-card{border:1px solid var(--line);border-radius:12px;padding:18px;background:linear-gradient(135deg,var(--card),var(--tint))}.name-card h3{font-family:'Songti TC',serif;font-size:30px;letter-spacing:.12em;margin:6px 0}.name-card p{font-size:15px}.rank{font-size:12px;color:var(--muted)}.copy{font-size:13px;padding:5px 10px;min-height:36px}.reason{border-left:3px solid var(--gold);padding-left:14px}.char-row{padding:16px 0;border-top:1px solid var(--line)}.char-row strong{color:var(--gold);font-size:24px}#error{color:#b54b48}#results{scroll-margin-top:15px}footer{font-size:13px;padding:12px 0}.method{margin-top:24px}button:hover{border-color:var(--tech)}[hidden]{display:none!important}@media(max-width:540px){main{padding:18px 16px 30px}.card{padding:18px}.name-grid{grid-template-columns:1fr}.form-grid{gap:0 12px}.form-grid>div{min-width:0}.brand{font-size:32px}.theme button{font-size:14px;padding:7px}.section-head h2{font-size:21px}.section-head button{white-space:nowrap}h1{font-size:27px}}@media(prefers-reduced-motion:no-preference){.name-card{animation:reveal .25s ease-out}@keyframes reveal{from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:none}}}
.private-entry{display:block;width:100%;min-height:48px;border:1px solid var(--line);border-radius:8px;background:var(--bg);padding:10px;margin:7px 0 16px;font:inherit;font-size:16px;white-space:pre-wrap;overflow-wrap:anywhere}.private-entry:empty:before{content:attr(data-placeholder);color:var(--muted);pointer-events:none}.private-entry:focus{outline:2px solid var(--tech);outline-offset:2px}.privacy{font-size:12px;line-height:1.65}#names.name-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}button.name-choice{padding:11px 6px;min-height:48px;font-size:21px;letter-spacing:.08em;background:var(--tint);border-color:transparent;overflow-wrap:anywhere}button.name-choice:hover,button.name-choice:focus-visible{border-color:var(--gold)}#suggestions{padding:18px}#batchStatus{font-size:12px;color:var(--muted);margin:0 0 12px}.name-dialog-open{overflow:hidden;overscroll-behavior:none}#nameDialog{width:min(520px,calc(100% - 32px));max-height:85svh;overflow:auto;overscroll-behavior:contain;padding:0 24px 24px;border:1px solid var(--line);border-radius:18px;color:var(--ink);background:var(--card)}#nameDialog::backdrop{background:#07141bc9;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--card);padding:14px 0 10px;z-index:2}.dialog-head button{width:44px;height:44px;padding:0;font-size:20px}#dialogTitle{font-size:34px;font-family:'Songti TC',serif;letter-spacing:.13em;margin:4px 0 18px}#dialogContent h3{font-size:17px;margin:22px 0 6px}#dialogContent p{font-size:16px}#dialogContent .hint{font-size:13px}#dialogContent details p{font-size:14px}
.stroke-row{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}.stroke-row span{display:flex;flex-direction:column;align-items:center;min-width:64px;background:var(--tint);padding:10px;border-radius:9px;font-size:14px}.stroke-row strong{font-size:30px;color:var(--gold)}.five-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.five-grid article{border:1px solid var(--line);border-radius:10px;padding:14px}.five-grid article:last-child{grid-column:1/-1}.five-grid article>div{display:flex;justify-content:space-between;align-items:center;gap:5px}.five-grid strong{font-size:20px}.five-grid p{font-size:15px}.five-grid .formula{font-size:14px;color:var(--gold);overflow-wrap:anywhere}.five-grid small{font-size:12px;color:var(--muted)}#nameDialog .five-grid{grid-template-columns:1fr}.five-reading>h3{margin-top:20px}@media(max-width:420px){.five-grid{grid-template-columns:1fr}.five-grid article:last-child{grid-column:auto}}
.five-diagram-wrap{width:100%;max-width:520px;margin:12px auto 0}.five-diagram{display:block;width:100%;height:auto;overflow:visible}.five-diagram text{font-family:-apple-system,BlinkMacSystemFont,'PingFang TC','Microsoft JhengHei',sans-serif;fill:var(--ink)}.five-diagram .five-letter{font-size:42px;font-weight:600}.five-diagram .five-count{font-size:26px;fill:var(--tech);font-weight:550}.five-diagram .five-virtual{font-size:24px;fill:var(--muted)}.five-diagram .five-grid-label{font-size:25px;fill:var(--gold);font-weight:600}.five-diagram .five-caption{font-size:17px;fill:var(--muted)}.five-diagram .five-connector{stroke:var(--muted);stroke-width:1.2;fill:none;vector-effect:non-scaling-stroke}.five-diagram-note{text-align:center;font-size:12px!important;margin:4px 0 22px}#nameDialog .five-diagram-wrap{margin-top:8px}

.five-diagram .five-grade{font-size:17px;font-weight:600;fill:var(--ink)}

#timeConversion{padding:12px;border-left:3px solid var(--gold);background:var(--tint);font-size:13px;overflow-wrap:anywhere;margin:12px 0}#solarRules{font-size:13px;color:var(--muted);margin:12px 0}#customLocation input{font-size:16px}
/* Equal field geometry, including Safari's native date/time controls. */
#nameForm .form-grid{align-items:start}
#nameForm .form-grid>*{min-width:0;max-width:100%}
#nameForm input,#nameForm select,#nameForm .private-entry{box-sizing:border-box;width:100%;min-width:0;max-width:100%;min-height:50px;padding:11px 10px;line-height:1.5;font-size:16px;margin:7px 0 16px}
#nameForm input,#nameForm select{height:50px}
#nameForm input[type=date],#nameForm input[type=time]{-webkit-appearance:none;appearance:none;display:block;overflow:hidden}
#nameForm input::-webkit-date-and-time-value{min-width:0;text-align:left;line-height:26px;margin:0;padding:0}
#nameForm input::-webkit-datetime-edit{min-width:0;padding:0}
#nameForm #clockTimeField .hint{display:block;margin:0 0 12px}
.sound-review{margin:22px 0;padding:18px;border:1px solid var(--line);border-radius:12px}.sound-characters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0}.sound-characters label{font-size:25px;text-align:center;min-width:0}.sound-characters select{display:block;width:100%;min-width:0;font-size:16px;margin-top:8px;padding:8px 4px}.sound-full{font-size:19px;color:var(--accent);word-break:break-word}.sound-matches p{overflow-wrap:anywhere}.sound-review button{min-height:44px}@media(max-width:500px){.sound-characters{grid-template-columns:repeat(2,minmax(0,1fr))}.sound-review{padding:14px}}
