/* Local interactive tools, using the guide's cream / green / terracotta palette. */
.t-card[hidden], #t-empty[hidden], #pw-hints[hidden] {display:none!important}
.t-controls {padding:24px;border:1px solid #d6ddd2;background:#eef1e8;border-radius:14px;margin:24px 0}
.t-filter-fields {display:grid;grid-template-columns:minmax(0,1fr) minmax(130px,.45fr);gap:18px}
.t-filter-fields .form-field {min-width:0}
.t-filter-fields label,.pw-field label {display:block;font-size:15px;font-weight:650;line-height:1.5;margin:0 0 8px;color:#233b2e}
.t-filter-fields input,.t-filter-fields select,.pw-field input,.pw-field textarea,.pw-field select {width:100%;box-sizing:border-box;border:1px solid #b9c4b6;border-radius:7px;background:#fffef9;color:#25392b;font:inherit;font-size:16px;line-height:1.6;padding:11px 13px;min-height:48px}
.t-filter-fields input::placeholder,.pw-field input::placeholder,.pw-field textarea::placeholder {color:#647062;opacity:1}
.pw-field textarea {resize:vertical;min-height:100px}
.t-filter-fields input:focus-visible,.t-filter-fields select:focus-visible,.pw-field input:focus-visible,.pw-field textarea:focus-visible,.pw-field select:focus-visible,#pw-result:focus-visible {outline:3px solid #af5c39;outline-offset:3px}
.t-categories {display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.t-categories button {border:1px solid #c2cdbd;border-radius:100px;background:#f9f9f2;color:#304830;padding:8px 13px;min-height:42px;font:inherit;font-size:14px;line-height:1.3;cursor:pointer}
.t-categories button[aria-pressed="true"] {background:#274832;border-color:#274832;color:#fff}
.t-categories button:hover {border-color:#274832}
#t-count {font-size:14px;margin:18px 0 0;color:#41553c}
.t-empty {margin-top:20px;border-top:1px solid #c9d3c3;padding-top:10px}
.t-grid {display:grid;gap:18px}
.t-card {position:relative;border:1px solid #d6ddd2;border-radius:12px;background:#fffef9;padding:24px;scroll-margin-top:100px;min-width:0}
.t-card:target {border-color:#ad5c3b;box-shadow:0 0 0 2px #ad5c3b33}
.t-card .t-meta {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font-size:13px;line-height:1.4;color:#52634c;margin:0 0 12px}
.t-level {border:1px solid #d3ddcc;padding:4px 8px;border-radius:4px;background:#f1f5ed}
.t-card h3 {margin:0 0 9px;font-size:23px;line-height:1.25;letter-spacing:-.02em}
.t-card .t-use {font-size:16px;line-height:1.65;color:#52604d;margin:0 0 16px}
.t-details>summary {display:flex;justify-content:space-between;align-items:center;list-style:none;cursor:pointer;color:#2f5b39;font-size:15px;font-weight:650;min-height:36px}
.t-details>summary::-webkit-details-marker,.pw-advanced>summary::-webkit-details-marker {display:none}
.t-details>summary:after {content:'+';font-size:24px;font-weight:400;line-height:1}
.t-details[open]>summary:after {content:'−'}
.t-details[open]>summary {border-bottom:1px solid #dde3d7;padding-bottom:14px;margin-bottom:16px}
.t-prompt {white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;line-height:1.8;padding:18px;margin:0;background:#f0f3eb;color:#263b2a;border-radius:7px;max-height:540px;overflow:auto;tab-size:2}
.t-actions {display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:15px}
.t-actions>span {font-size:14px;color:#385832}
.t-actions .button {font-size:14px;padding:10px 16px;min-height:43px}
.t-card .t-caution {font-size:14px;line-height:1.65;margin:18px 0 0;padding-left:12px;border-left:3px solid #af6646;color:#5c5547}
.pw-app {margin:24px 0 0}
#pw-form {margin:0}
.pw-toolbar {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:16px;background:#eef1e8;border:1px solid #d6ddd2;border-radius:12px;padding:20px}
.pw-toolbar-actions {display:flex;align-items:center;flex-direction:column;gap:9px}
.pw-toolbar-actions .button {font-size:14px;min-height:44px;padding:10px 14px;white-space:normal;text-align:center}
.pw-link {border:0;background:none;font:inherit;font-size:14px;color:#73513d;text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:32px}
.pw-notice {font-size:14px;line-height:1.6;color:#566345;margin:16px 0}
.pw-notice:empty {display:none}
.pw-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:24px}
.pw-field {min-width:0}
.pw-wide {grid-column:1/-1}
.pw-field label span {color:#a75536}
.pw-check {display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.6;color:#344f36;cursor:pointer;margin:16px 0}
.pw-check input {width:19px;height:19px;flex:0 0 19px;margin-top:3px;accent-color:#365c39}
.pw-advanced {border:1px solid #cad4c3;border-radius:10px;margin:26px 0;background:#f8f9f2;overflow:hidden}
.pw-advanced>summary {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;list-style:none;font-weight:650;font-size:17px;color:#2e4932;cursor:pointer}
.pw-advanced>summary small {display:block;font-size:13px;line-height:1.5;font-weight:400;color:#596650;margin-top:3px}
.pw-advanced>summary>span:last-child {font-weight:400;font-size:25px;transition:transform .15s}
.pw-advanced[open]>summary>span:last-child {transform:rotate(45deg)}
.pw-advanced[open]>summary {border-bottom:1px solid #d7dfd1}
.pw-advanced-body {padding:0 20px 20px}
.pw-checks {padding:20px 0 0;margin:25px 0 0;border:0;border-top:1px solid #d7dfd1;min-width:0}
.pw-checks legend {font-size:16px;font-weight:650;padding:0 9px 0 0;color:#2e4932}
.pw-help {font-size:13px;line-height:1.7;color:#5a6653;margin:8px 0 0}
.pw-save {padding:0 2px 22px}
.pw-save .pw-check {margin-bottom:3px}
.pw-save .pw-help {margin-left:29px}
#pw-storage-status:empty {display:none}
.pw-result {background:#e8eedf;border:1px solid #cbd7c1;border-radius:12px;padding:24px;margin:12px 0 0}
.pw-result-heading {display:flex;align-items:start;justify-content:space-between;gap:15px;margin-bottom:16px}
.pw-result-heading label {display:block;font-size:20px;line-height:1.3;font-weight:650;color:#26442b}
.pw-result-heading p {font-size:13px;line-height:1.5;color:#56664c;margin:5px 0 0}
#pw-length-count {font-size:12px;line-height:1.5;color:#56664c;text-align:right;flex-shrink:0;padding-top:5px}
#pw-result {width:100%;box-sizing:border-box;resize:vertical;background:#fffef9;color:#263a2a;border:1px solid #c6d0be;border-radius:7px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;line-height:1.8;min-height:250px;padding:18px}
#pw-result::placeholder {color:#66735d;opacity:1}
.pw-output-actions {display:flex;flex-wrap:wrap;gap:12px;margin-top:17px}
.pw-output-actions .button {font-size:15px;padding:11px 18px;min-height:46px}
.pw-output-actions button:disabled {opacity:.55;cursor:not-allowed}
#pw-status {font-size:14px;line-height:1.6;color:#34532e;margin:12px 0 0}
#pw-status:empty {display:none}
.pw-hints {margin:16px 0 0;padding:16px 16px 16px 32px;border-top:1px solid #c8d3be;font-size:13px;line-height:1.7;color:#4d5a42}
.pw-hints li+li {margin-top:7px}
.pw-local {display:flex;gap:10px;font-size:13px;line-height:1.7;color:#57664d;margin-top:16px}
.pw-local span {color:#558044}
@media (max-width:600px) {
 .t-controls,.t-card,.pw-toolbar,.pw-result {padding:18px}
 .t-filter-fields,.pw-toolbar,.pw-grid {grid-template-columns:1fr}
 .pw-toolbar-actions {align-items:stretch;flex-direction:row;flex-wrap:wrap}
 .pw-toolbar-actions .button {flex:1}
 .pw-link {padding:8px}
 .pw-grid {gap:17px}
 .pw-advanced>summary {padding:17px}
 .pw-advanced-body {padding:0 17px 17px}
 .t-card h3 {font-size:21px}
 .t-prompt,#pw-result {font-size:14px;padding:14px}
 .pw-result-heading {flex-direction:column;gap:4px}
 #pw-length-count {text-align:left;padding:0}
 .pw-output-actions .button {flex:1;justify-content:center}
 .t-categories {gap:7px}
 .t-categories button {font-size:13px;padding:9px 12px}
}
@media (prefers-reduced-motion:reduce) {.pw-advanced>summary>span:last-child {transition:none}}
@media print {
 .t-controls,.t-actions,.pw-toolbar-actions,.pw-output-actions,.pw-save {display:none!important}
 .t-card {break-inside:avoid;border:1px solid #aaa}
 .t-details:not([open])>*:not(summary) {display:block}
 .t-details>summary {display:none}
 .t-prompt {max-height:none;overflow:visible}
 #pw-result {height:auto;overflow:visible}
}