/* Shared, compact workspaces for the independent phonetics tools. */
@font-face{font-family:'Doulos SIL';src:url("./fonts-DoulosSIL-R.6f8995f48e01.ttf") format('truetype');font-style:normal;font-weight:400;font-display:swap}
.pt-workspace{margin-block:20px 38px;scroll-margin-top:24px;color:var(--ink);font-size:14px;line-height:1.65;overflow-wrap:anywhere}
.pt-workspace:focus{outline:none}.pt-workspace [hidden]{display:none!important}.pt-workspace :is(button,a,input,textarea,select,summary):focus-visible{outline:2px solid var(--accent-readable);outline-offset:3px}
.pt-workspace :is(input,textarea,select){max-width:100%;min-width:0}.pt-workspace :is(input,textarea):focus-visible{outline-offset:0}.pt-workspace textarea{resize:vertical}.pt-workspace :is(h2,h3,h4){line-height:1.35;color:var(--ink)}
.pt-workspace h2{font-size:22px;margin:0 0 15px;letter-spacing:-.3px}.pt-workspace h3{font-size:16px;margin:0 0 12px}.pt-workspace h4{font-size:14px;margin:0 0 9px}.pt-workspace p{margin:0 0 14px}.pt-workspace p:last-child{margin-bottom:0}
.pt-panel{min-width:0;padding:26px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.pt-panel+.pt-panel{margin-top:20px}.pt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}.pt-grid>.pt-panel{margin:0}
.pt-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-block:16px}.pt-field{display:flex;flex-direction:column;gap:7px;min-width:0;margin-bottom:16px;font-size:13px;font-weight:600}.pt-field label{font-size:13px;font-weight:600}.pt-field small{font-size:11px;font-weight:400;color:var(--muted)}
.pt-input,.pt-field :is(input:not([type=checkbox]):not([type=radio]),select,textarea){display:block;width:100%;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:11px;background:var(--canvas);color:var(--ink);padding:12px 14px;min-height:44px;font:14px/1.6 var(--font-body)}
.pt-workspace input::placeholder,.pt-workspace textarea::placeholder{color:var(--muted);opacity:.85}.pt-workspace input:is([type=checkbox],[type=radio]){accent-color:var(--accent-readable);width:16px;height:16px;flex:none}.pt-workspace input[type=checkbox]+span{min-width:0}
.pt-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:600 13px/1.35 var(--font-body);cursor:pointer;transition:background .16s,border-color .16s,box-shadow .16s;text-align:center;text-decoration:none}
.pt-button:hover{background:var(--accent-soft);border-color:var(--accent)}.pt-button.primary,.pt-button.pt-primary{background:var(--accent);border-color:transparent;color:var(--accent-ink)}.pt-button.primary:hover,.pt-button.pt-primary:hover{background:var(--accent-hover)}.pt-button:disabled{opacity:.48;cursor:not-allowed}.pt-button .icon{width:17px;height:17px;flex:none}
.pt-button.is-copied{color:#17683a;background:#eaf7ee;border-color:#93c9a5}.pt-status{min-height:22px;font-size:12px;line-height:1.65;color:var(--muted);margin-top:12px}.pt-empty{padding:36px 24px;border:1px dashed var(--line);border-radius:15px;background:var(--canvas);text-align:center;color:var(--muted);font-size:13px}.pt-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;background:var(--accent-soft);color:var(--accent-readable);font-size:11px;line-height:1.5;font-weight:600}
.pt-result{padding:18px;border-radius:13px;border:1px solid var(--line);background:var(--canvas);margin-block:16px}.pt-note{padding:14px 17px;border-radius:11px;background:var(--accent-soft);color:var(--muted);font-size:12px;line-height:1.8}.pt-note a{color:var(--accent-readable);text-decoration:underline}.pt-ipa{font:25px/1.6 'Doulos SIL',serif;direction:ltr;unicode-bidi:isolate}.pt-table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}.pt-table th,.pt-table td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}.pt-table th{font-size:11px;color:var(--muted);font-weight:650;background:var(--accent-soft)}.pt-table tr:last-child td{border-bottom:0}
.pt-copy-helper{position:fixed;top:0;left:-9999px;opacity:0}.pt-eyebrow{display:block;color:var(--accent-readable);font-size:10px;font-weight:650;letter-spacing:1.4px;text-transform:uppercase}
.pt-faq{max-width:820px;margin-block:54px 64px}.pt-faq h2{font-size:26px;letter-spacing:-.4px;margin:9px 0 22px}.pt-faq details{border-bottom:1px solid var(--line)}.pt-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 0;min-height:54px;list-style:none;font-size:13px;font-weight:600;line-height:1.6;cursor:pointer}.pt-faq summary::-webkit-details-marker{display:none}.pt-faq summary .icon{width:16px;height:16px;flex:none;color:var(--accent-readable)}.pt-faq details[open] summary .icon{transform:rotate(45deg)}.pt-faq details p{font-size:13px;line-height:1.85;color:var(--muted);padding:0 26px 20px 0;margin:0}
:root[data-appearance=dark] .pt-button.is-copied{background:#153c29;color:#a5e8bd;border-color:#4d9368}
@media(max-width:760px){.pt-grid{grid-template-columns:1fr;gap:16px}.pt-panel{padding:21px}.pt-workspace{margin-top:16px}.pt-workspace h2{font-size:20px}}
@media(max-width:420px){.pt-panel{padding:17px;border-radius:16px}.pt-workspace{font-size:13px}.pt-button{padding:10px 12px;font-size:12px}.pt-table th,.pt-table td{padding:10px 8px}.pt-toolbar{gap:8px}.pt-faq h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.pt-workspace *{transition:none!important}}

/* Match the site's pink accent while keeping controls distinct from panels. */
.pt-workspace{--control-border:color-mix(in srgb,var(--accent) 48%,var(--line));--control-border-hover:var(--accent)}
@supports(appearance:base-select){#tool-workspace .pt-field select,#tool-workspace select.pt-input{display:flex;align-items:center;justify-content:space-between;gap:10px}}
.pt-workspace select option:checked{color:var(--accent-readable)}.pt-workspace select option:not(:disabled):is(:hover,:focus-visible){color:var(--accent-ink);background:var(--accent)}