.page-heading{margin-bottom:20px}
.page-heading h1{font-size:clamp(1.8rem,3vw,2.5rem);margin:0 0 8px;word-break:keep-all;text-wrap:balance}
.page-heading>p{font-size:.9rem}
.panel h2{font-size:1.05rem;margin:0 0 14px}
.now-panel{margin-bottom:20px}
.converter-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:14px;margin-top:14px}
.field+.field{margin-top:14px}
.field small{line-height:1.5;overflow-wrap:anywhere}
input[dir=ltr],select[dir=ltr],.result-row code{unicode-bidi:isolate}
.field input,.field select{min-height:44px}
.field input:focus-visible,.field select:focus-visible,.action-row .button:focus-visible,.result-row .button:focus-visible,.guide summary:focus-visible{outline:3px solid #e9aa23;outline-offset:2px}
.unit-note{margin:10px 0 0;font-size:.82rem;min-height:1.2em;overflow-wrap:anywhere}
.action-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.action-row .button{font-size:.85rem;min-height:44px}
.result-list{margin:14px 0 0;display:flex;flex-direction:column;gap:10px}
.result-row{border:1px solid var(--border);border-radius:8px;padding:10px 12px;background:#f9fbff;min-width:0}
.result-row dt{font-size:.78rem;font-weight:650;color:var(--muted);overflow-wrap:anywhere}
.result-row dd{margin:4px 0 0;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;min-width:0}
.result-row code{flex:1 1 200px;min-width:0;font:600 .95rem/1.5 ui-monospace,SFMono-Regular,Consolas,"Malgun Gothic",monospace;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;text-align:left}
.result-row small{flex:1 1 100%;font-size:.76rem;order:3}
.result-row .button{font-size:.82rem;padding:8px 14px;min-width:64px;order:2}
.now-panel .result-row code{font-size:1.05rem}
.privacy-note{color:var(--muted);font-size:.76rem;line-height:1.5;margin:12px 0 0;overflow-wrap:anywhere}
.dst-note{margin:14px 0 0;padding:10px 12px;border-left:4px solid #a2b9ed;background:#f0f5ff;border-radius:4px;font-size:.82rem;line-height:1.6;overflow-wrap:anywhere}
.notice-box{margin:12px 0 0;border:1px solid #e9cf8f;background:#fff9e8;border-radius:8px;padding:12px 14px;font-size:.88rem}
.notice-box p{margin:0;overflow-wrap:anywhere}
.error-box{margin:12px 0 0;border:1px solid #efd3d7;background:#fff7f8;border-radius:8px;padding:14px 16px;font-size:.88rem}
.error-box p{margin:0 0 6px;overflow-wrap:anywhere}
.error-box .error-title{color:var(--danger)}
.empty{margin:14px 0 0;font-size:.85rem}
.status{margin:14px 0 0;min-height:1.5em;overflow-wrap:anywhere}
.status.error{color:var(--danger)}
.guide{margin:32px 0 40px;padding-top:22px;border-top:1px solid var(--border);color:var(--muted);font-size:.86rem;line-height:1.8}
.guide h2{color:var(--text);font-size:1.1rem}
.guide h3{color:var(--text);margin:20px 0 6px}
.guide summary{cursor:pointer;color:var(--text);font-weight:650;padding:10px 0;min-height:44px}
.guide code{background:var(--surface);border:1px solid var(--border);padding:2px 6px;border-radius:5px;white-space:pre-wrap;overflow-wrap:anywhere}
.example{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
button,input,select,summary,a{touch-action:manipulation}
@media(max-width:860px){
  .converter-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
  .options-grid{grid-template-columns:1fr}
  .action-row .button{flex:1 1 100%;width:100%;text-align:center}
  .result-row .button{flex:1 1 100%}
}