/* Dyeing Solution Tools — matches the Dyeing Solution theme tokens, with fallbacks. */
.dst,.dst-cards{--t-navy:var(--ds-navy,#16233f);--t-acc:var(--ds-accent,#1a6f93);--t-acc-soft:var(--ds-accent-soft,#e3eff5);--t-y:var(--ds-y,#e8b327);--t-line:var(--ds-line,#dde2eb);--t-mu:var(--ds-muted,#5a6477);--t-bg:var(--ds-bg,#f5f6f9);--t-mono:var(--ds-mono,ui-monospace,Menlo,Consolas,monospace);--t-head:var(--ds-display,system-ui,sans-serif);max-width:none!important}
.dst{background:#fff;border:1px solid var(--t-line);border-radius:16px;padding:22px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.dst *{box-sizing:border-box}
.dst-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:start}
.dst-form{display:flex;flex-direction:column;gap:12px;min-width:0}
.dst h4{margin:10px 0 0;font:700 1rem/1.3 var(--t-head);color:var(--t-navy)}
.dst h4 small{font:500 .78rem var(--t-mono);color:var(--t-mu);margin-left:6px}
.dst-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dst-f{display:flex;flex-direction:column;gap:5px;min-width:0}
.dst-f > span:first-child{font-size:.86rem;color:var(--t-mu);font-weight:500}
.dst-in{display:flex;align-items:center;border:1.5px solid var(--t-line);border-radius:10px;background:#fff;overflow:hidden;min-width:0}
.dst-in:focus-within{border-color:var(--t-acc);box-shadow:0 0 0 3px var(--t-acc-soft)}
.dst-in input,.dst-in select{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:10px 12px;font:600 1rem var(--t-mono);color:var(--t-navy)}
.dst-in select{font-family:inherit;font-weight:500;font-size:.95rem;cursor:pointer}
.dst-in em{font:500 .8rem var(--t-mono);font-style:normal;color:var(--t-mu);padding:0 12px 0 4px;white-space:nowrap}
.dst-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 84px 32px;gap:8px;align-items:center}
.dst-name{border:1.5px solid var(--t-line);border-radius:10px;padding:10px 12px;font-family:inherit;font-weight:500;font-size:.95rem;min-width:0;width:100%}
.dst-name:focus{outline:0;border-color:var(--t-acc)}
.dst-u{flex:0 0 auto!important;padding:10px 6px!important;border-left:1px solid var(--t-line)!important;font:500 .85rem var(--t-mono)!important}
.dst-g{font:600 .9rem var(--t-mono);color:var(--t-acc);text-align:right;white-space:nowrap}
.dst-x{border:0;background:var(--t-bg);border-radius:8px;width:32px;height:32px;font-size:1.1rem;color:var(--t-mu);cursor:pointer}
.dst-x:hover{background:#fbe7ea;color:#9b2437}
.dst-add,.dst-print{align-self:flex-start;border:1.5px dashed var(--t-line);background:transparent;border-radius:10px;padding:7px 14px;font-family:inherit;font-weight:600;font-size:.88rem;color:var(--t-acc);cursor:pointer}
.dst-add:hover{border-color:var(--t-acc);background:var(--t-acc-soft)}
.dst-note,.dst-hint{margin:0;font-size:.84rem;color:var(--t-mu);line-height:1.5}
.dst-det{border:1px solid var(--t-line);border-radius:12px;padding:10px 14px;display:flex;flex-direction:column;gap:10px}
.dst-det summary{cursor:pointer;font-family:inherit;font-weight:600;font-size:.95rem;color:var(--t-navy)}
.dst-det[open]{gap:10px}
.dst-det > *+*{margin-top:10px}
.dst-tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.dst-tbl th,.dst-tbl td{padding:6px 8px;border-bottom:1px solid var(--t-line);text-align:left}
.dst-tbl thead th{font:600 .74rem var(--t-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--t-mu)}
.dst-tbl input{width:80px;border:1.5px solid var(--t-line);border-radius:8px;padding:6px 8px;font:600 .9rem var(--t-mono)}
.dst-out{position:sticky;top:16px;background:var(--t-navy);color:#fff;border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:2px}
.dst-r{display:flex;align-items:baseline;gap:8px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.1);flex-wrap:wrap}
.dst-r span{flex:1 1 140px;font-size:.88rem;color:#c9d3e6}
.dst-r b{font:700 1.15rem var(--t-mono);color:#fff;font-variant-numeric:tabular-nums}
.dst-r em{font:500 .78rem var(--t-mono);font-style:normal;color:#9fb0cc}
.dst-big b{font-size:1.7rem;color:var(--t-y)}
.dst-out .dst-hint{color:#b7c1d4;margin-top:10px}
.dst-out .dst-print{color:#fff;border-color:rgba(255,255,255,.3);margin-top:12px}
.dst-tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.dst-tabs button{border:1.5px solid var(--t-line);background:#fff;border-radius:999px;padding:7px 16px;font-family:inherit;font-weight:600;font-size:.9rem;color:var(--t-mu);cursor:pointer}
.dst-tabs button[aria-selected="true"]{background:var(--t-navy);border-color:var(--t-navy);color:#fff}
.dst-pane{display:flex;flex-direction:column;gap:12px}
.dst-pane[hidden]{display:none}
.dst-ugrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.dst-ug{border:1px solid var(--t-line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}
.dst-ug h4{margin:0}
.dst-ug .dst-r{border:0;padding:0;flex-direction:column;gap:5px;justify-content:flex-end}
.dst-ug .dst-r span{flex:none;color:var(--t-mu);font-size:.86rem}
.dst-ug .dst-r b{color:var(--t-navy);font-size:1rem;padding:10px 0}
.dst-ug .dst-r em{display:none}
.dst-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.dst-card{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--t-line);border-radius:16px;padding:20px;text-decoration:none!important;color:inherit;transition:border-color .15s,transform .15s}
.dst-card:hover{border-color:var(--t-acc);transform:translateY(-2px)}
.dst-card b{font:800 1.15rem var(--t-head);color:var(--t-navy)}
.dst-card span{color:var(--t-mu);font-size:.95rem;line-height:1.5}
.dst-card i{font-style:normal;font-weight:600;color:var(--t-acc);margin-top:auto}
@media (max-width:820px){.dst-grid{grid-template-columns:1fr}.dst-out{position:static}}
@media (max-width:520px){.dst{padding:16px;border-radius:14px}.dst-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 32px}.dst-row .dst-g{grid-column:1/3;text-align:left;margin-top:-2px}.dst-row .dst-x{grid-row:1;grid-column:3}}
@media print{body *{visibility:hidden}.dst[data-tool="recipe"],.dst[data-tool="recipe"] *{visibility:visible}.dst[data-tool="recipe"]{position:absolute;left:0;top:0;width:100%;border:0}.dst-add,.dst-x,.dst-print,.dst-det{display:none!important}.dst-out{background:#fff;color:#000;border:1px solid #000}.dst-r b,.dst-r span,.dst-big b{color:#000}}