/* ROBERIN The New — 혈중알코올농도 계산기 20260902a
 * Warm-paper palette, 1180px shell, left input/right result, 8px internal rhythm.
 * 숫자 family/weight 는 roberin-the-new-numerals 전역 자산이 소유한다.
 */

.tn-bac-page{--bac-paper:#faf6ee;--bac-ink:#1a1208;--bac-muted:#5a4a30;--bac-line:#b8a888;--bac-soft:#ddd4be;--bac-surface:#fffaf0;--bac-wash:#f5efdf;--bac-accent:#c44a00;--bac-primary:#1a1208;--bac-primary-text:#faf6ee;--bac-secondary:#ede6d4;max-width:1180px;margin:0 auto;color:var(--bac-ink)}

.tn-bac-tool,.tn-bac-tool *{box-sizing:border-box}
.tn-bac-tool{display:grid;gap:8px;padding:18px;border:1px solid var(--bac-line);background:var(--bac-paper);color:var(--bac-ink);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.tn-bac-tool :is(p,dl,dd,dt,h3){margin:0}
.tn-bac-page .tn-bac-tool :is(ul,ol,li,dl,dd,dt){margin:0!important;padding:0!important;list-style:none!important;list-style-type:none!important}
.tn-bac-page .tn-bac-tool :is(ul,ol,li)::marker{content:none}
.tn-bac-tool :is(code,pre,kbd,samp){padding:0;border:0;border-radius:0;background:none;color:inherit;-webkit-text-fill-color:inherit;font:inherit}

.tn-bac-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:8px}
.tn-bac-pane{display:grid;align-content:start;gap:10px;min-width:0;padding:14px;border:1px solid var(--bac-soft);background:var(--bac-surface)}
.tn-bac-pane--input{grid-template-rows:auto auto auto 1fr auto auto}
.tn-bac-pane--result{grid-template-rows:auto auto auto auto auto 1fr}
.tn-bac-pane-label{font-size:12px;font-weight:800;line-height:1.25;letter-spacing:.08em;text-transform:uppercase;color:var(--bac-muted)}

.tn-bac-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tn-bac-chip{display:grid;place-items:center;width:100%;min-height:36px;padding:6px 8px;border:1px solid var(--bac-line);border-radius:0;background:var(--bac-secondary);color:var(--bac-ink);font:800 11px/1.25 inherit;text-align:center;outline:0;cursor:pointer}
.tn-bac-chip:hover{border-color:var(--bac-accent)}
.tn-bac-chip:focus-visible{outline:2px solid var(--bac-accent);outline-offset:2px}

.tn-bac-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:8px}
.tn-bac-field{display:grid;align-content:start;gap:5px;min-width:0;padding:0;border:0;background:none}
.tn-bac-field--wide{grid-column:1/-1}
.tn-bac-field>label{display:block;min-height:30px;padding:0;font-size:11px;font-weight:400;line-height:1.35;color:var(--bac-muted)}
.tn-bac-field>small{display:block;min-height:30px;font-size:10px;font-weight:400;line-height:1.45;color:var(--bac-muted)}
.tn-bac-page .tn-bac-tool .tn-bac-control{display:flex!important;align-items:center!important;min-width:0;min-height:36px;border:1px solid var(--bac-soft);background:var(--bac-wash)}
.tn-bac-control input{flex:1 1 auto;width:auto;min-width:0;height:34px;padding:0 10px;border:0;border-radius:0;background:none;color:var(--bac-ink);font-size:14px;line-height:34px;outline:0}
.tn-bac-control input::placeholder{color:var(--bac-muted);-webkit-text-fill-color:var(--bac-muted);opacity:.6}
.tn-bac-control input.is-invalid{background:color-mix(in srgb,var(--bac-accent) 10%,transparent)}
.tn-bac-control b{flex:0 0 auto;display:grid;place-items:center;align-self:stretch;padding:0 9px;border-left:1px solid var(--bac-soft);background:var(--bac-surface);font-size:11px;font-weight:800;line-height:1;color:var(--bac-muted);white-space:nowrap}
.tn-bac-control select{flex:0 0 auto;min-width:72px;height:34px;padding:0 25px 0 9px;border:0;border-left:1px solid var(--bac-soft);border-radius:0;background:linear-gradient(45deg,transparent 50%,var(--bac-muted) 50%) calc(100% - 11px) 15px/5px 5px no-repeat,linear-gradient(135deg,var(--bac-muted) 50%,transparent 50%) calc(100% - 7px) 15px/5px 5px no-repeat,var(--bac-surface);color:var(--bac-ink);font:800 11px/34px inherit;outline:0;cursor:pointer;appearance:none;-webkit-appearance:none}
.tn-bac-control--select select{flex:1 1 auto;width:100%;min-width:0;border-left:0;background-color:var(--bac-wash)}
.tn-bac-control:has(:focus-visible){outline:2px solid var(--bac-accent);outline-offset:-1px}
.tn-bac-control:hover{border-color:var(--bac-line)}

.tn-bac-hint{display:grid;align-content:center;padding:8px 10px;border:1px solid var(--bac-soft);background:var(--bac-wash);font-size:11px;font-weight:400;line-height:1.6;color:var(--bac-muted)}
.tn-bac-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tn-bac-btn{display:grid;place-items:center;width:100%;min-height:36px;padding:8px 10px;border:1px solid var(--bac-line);border-radius:0;background:var(--bac-secondary);color:var(--bac-ink);-webkit-text-fill-color:var(--bac-ink);font:800 12px/1 inherit;text-align:center;outline:0;cursor:pointer}
.tn-bac-btn--primary{border-color:var(--bac-primary);background:var(--bac-primary);color:var(--bac-primary-text);-webkit-text-fill-color:var(--bac-primary-text)}
.tn-bac-btn:hover{border-color:var(--bac-accent)}
.tn-bac-btn:focus-visible{outline:2px solid var(--bac-accent);outline-offset:2px}
.tn-bac-btn:disabled{opacity:.55;cursor:default;outline:0}

.tn-bac-main{display:grid;grid-template-columns:minmax(0,max-content) minmax(0,1fr);align-items:baseline;gap:12px;min-width:0}
.tn-bac-main>strong{display:block;min-width:0;font-size:clamp(30px,5.2vw,48px);font-weight:800;line-height:1.1;letter-spacing:normal;white-space:nowrap}
.tn-bac-main>strong[data-empty=true]{color:var(--bac-muted)}
.tn-bac-main>span{align-self:center;justify-self:start;padding:4px 9px;border:1px solid var(--bac-line);background:var(--bac-wash);font-size:11px;font-weight:800;line-height:1.2;color:var(--bac-muted)}
.tn-bac-status{display:grid;align-content:center;min-height:58px;padding:10px 12px;border:1px solid var(--bac-soft);background:var(--bac-wash);font-size:12px;font-weight:400;line-height:1.6;color:var(--bac-muted)}
.tn-bac-status[data-state=error],.tn-bac-status[data-state=elevated],.tn-bac-status[data-state=high],.tn-bac-status[data-state=very-high]{border-color:var(--bac-accent);color:var(--bac-accent)}

.tn-bac-scale{display:grid;gap:7px;padding:10px;border:1px solid var(--bac-soft);background:var(--bac-surface)}
.tn-bac-scale-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;min-width:0}
.tn-bac-scale-head>span{font-size:11px;font-weight:400;line-height:1.35;color:var(--bac-muted)}
.tn-bac-scale-head>b{font-size:13px;line-height:1.35;letter-spacing:normal;white-space:nowrap}
.tn-bac-scale-head>b[data-empty=true]{color:var(--bac-muted)}
.tn-bac-scale-track{position:relative;display:block;height:16px;border:1px solid var(--bac-line);background:linear-gradient(90deg,var(--bac-wash) 0 15%,var(--bac-secondary) 15% 40%,var(--bac-soft) 40% 75%,color-mix(in srgb,var(--bac-accent) 28%,var(--bac-wash)) 75% 100%)}
.tn-bac-scale-fill{position:absolute;inset:0 auto 0 0;display:block;width:0;background:color-mix(in srgb,var(--bac-accent) 38%,transparent);transition:width .18s linear}
.tn-bac-scale-marker{position:absolute;top:-4px;bottom:-4px;left:0;display:block;width:2px;background:var(--bac-ink);transform:translateX(-1px);transition:left .18s linear}
.tn-bac-scale-benchmark{position:absolute;top:-3px;bottom:-3px;display:block;width:1px;border-left:1px dashed var(--bac-accent)}
.tn-bac-scale-ticks{display:flex;justify-content:space-between;gap:4px;color:var(--bac-muted);font-size:9px;font-weight:400;line-height:1}

.tn-bac-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tn-bac-metrics>div{display:grid;align-content:start;gap:5px;min-width:0;padding:10px;border:1px solid var(--bac-soft);background:var(--bac-wash)}
.tn-bac-metrics dt{font-size:11px;font-weight:400;line-height:1.35;color:var(--bac-muted)}
.tn-bac-metrics dd{min-width:0;font-size:15px;font-weight:800;line-height:1.35;letter-spacing:normal;overflow-wrap:anywhere}
.tn-bac-metrics dd[data-empty=true]{color:var(--bac-muted)}

.tn-bac-benchmark{display:grid;align-content:start;gap:6px;min-width:0;padding:10px;border:1px solid var(--bac-line);background:var(--bac-wash)}
.tn-bac-benchmark>span{font-size:10px;font-weight:800;line-height:1.2;letter-spacing:.06em;text-transform:uppercase;color:var(--bac-muted)}
.tn-bac-benchmark>h3{font-size:13px;font-weight:800;line-height:1.35;color:var(--bac-ink)}
.tn-bac-benchmark>strong{font-size:14px;font-weight:800;line-height:1.45;color:var(--bac-accent)}
.tn-bac-benchmark>p{font-size:11px;font-weight:400;line-height:1.55;color:var(--bac-muted)}
.tn-bac-benchmark>a{justify-self:start;font-size:10px;font-weight:800;line-height:1.4;color:var(--bac-ink);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.tn-bac-notice{padding:8px 10px;border:0;background:none;font-size:11px;font-weight:400;line-height:1.6;color:var(--bac-muted)}

body:is([data-scheme=dark],[data-scheme=inverse],[data-scheme=auto][data-l=dark],[data-scheme=auto][data-d=dark]) .tn-bac-page{--bac-paper:#241d12;--bac-ink:#efe6d2;--bac-muted:#c3b492;--bac-line:#6f6047;--bac-soft:#574a37;--bac-surface:#322a1a;--bac-wash:#2c2517;--bac-accent:#e8823f;--bac-primary:#4a3116;--bac-primary-text:#f7ead1;--bac-secondary:#2f2115}
body:is([data-scheme=dark],[data-scheme=inverse],[data-scheme=auto][data-l=dark],[data-scheme=auto][data-d=dark]) .tn-bac-tool :is(button,input,select){color:var(--bac-ink)!important;-webkit-text-fill-color:var(--bac-ink)!important}
body:is([data-scheme=dark],[data-scheme=inverse],[data-scheme=auto][data-l=dark],[data-scheme=auto][data-d=dark]) .tn-bac-tool .tn-bac-btn--primary{color:var(--bac-primary-text)!important;-webkit-text-fill-color:var(--bac-primary-text)!important;border-color:var(--bac-accent)}

@media(prefers-color-scheme:dark){
body[data-scheme=auto]:not([data-l=light]) .tn-bac-page{--bac-paper:#241d12;--bac-ink:#efe6d2;--bac-muted:#c3b492;--bac-line:#6f6047;--bac-soft:#574a37;--bac-surface:#322a1a;--bac-wash:#2c2517;--bac-accent:#e8823f;--bac-primary:#4a3116;--bac-primary-text:#f7ead1;--bac-secondary:#2f2115}
body[data-scheme=auto]:not([data-l=light]) .tn-bac-tool :is(button,input,select){color:var(--bac-ink)!important;-webkit-text-fill-color:var(--bac-ink)!important}
body[data-scheme=auto]:not([data-l=light]) .tn-bac-tool .tn-bac-btn--primary{color:var(--bac-primary-text)!important;-webkit-text-fill-color:var(--bac-primary-text)!important;border-color:var(--bac-accent)}
}

@media(prefers-reduced-motion:reduce){.tn-bac-scale-fill,.tn-bac-scale-marker{transition:none}}

@media(max-width:720px){
.tn-bac-page{margin-inline:5px}
.tn-bac-tool{padding:13px}
.tn-bac-stage{grid-template-columns:minmax(0,1fr)}
.tn-bac-presets{grid-template-columns:repeat(2,minmax(0,1fr))}
.tn-bac-fields{grid-template-columns:minmax(0,1fr)}
.tn-bac-field--wide{grid-column:auto}
.tn-bac-field>label{min-height:0}
.tn-bac-field>small{min-height:0}
.tn-bac-main>strong{font-size:34px}
}