/* Hallmark · shape: app screen · genre: modern-minimal · theme: Handy Orchard locked system · idea: purposeful tool groups with distinct operations · posture: saturated category accents · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 · weakest: R, shared controls keep independent operations comparable without thin parameter pages. */
:root{--category-media:#50d4ed;--category-documents:#ff9fb5;--category-print:#ffb86c;--category-numbers:#8ac5ff;--category-life:#ffe079;--category-travel:#69dfb9;--category-developer:#b9eb76;--category:var(--blue-text)}
[data-expand-category=media],[data-category=media]{--category:var(--category-media)}[data-expand-category=documents],[data-category=documents]{--category:var(--category-documents)}[data-expand-category=print],[data-category=print]{--category:var(--category-print)}[data-expand-category=numbers],[data-category=numbers]{--category:var(--category-numbers)}[data-expand-category=life],[data-category=life]{--category:var(--category-life)}[data-expand-category=travel],[data-category=travel]{--category:var(--category-travel)}[data-expand-category=developer],[data-category=developer]{--category:var(--category-developer)}
[data-expand-category] .graphic-main,[data-expand-category] .graphic-detail,.expand-heading>.icon,.expand-card-icon{color:var(--category)}[data-expand-category] .graphic-field::before{background:linear-gradient(125deg,color-mix(in srgb,var(--category) 20%,var(--raised)),var(--surface))}
.category-filters button[data-expand-category] .icon{color:var(--category)}.category-filters button[data-expand-category][aria-pressed=true]{background:var(--category);color:var(--bg);border-color:var(--category)}.category-filters button[data-expand-category][aria-pressed=true] .icon{color:var(--bg)}
.expand-art{display:grid;place-items:center;background:linear-gradient(135deg,var(--raised),color-mix(in srgb,var(--category) 12%,var(--surface)))}.expand-card-icon{position:relative;z-index:1}.expand-card-icon .icon{width:88px;height:88px;stroke-width:1.1;transition:transform var(--dur-micro) var(--ease-out)}.expand-heading{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:20px;align-items:center;margin-bottom:24px}.expand-heading>.icon{width:48px;height:48px;grid-row:1/3;stroke-width:1.3}.expand-heading h1{margin-bottom:8px;font-size:30px}.expand-heading p{grid-column:2;color:var(--muted);font-size:15px;margin:0}.expand-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.expand-tool .results{min-height:360px}.expand-tool .result-row dd{color:var(--category)}.expand-tool input[aria-invalid=true],.expand-tool textarea[aria-invalid=true],.expand-tool select[aria-invalid=true]{border-color:var(--danger)}.expand-tool textarea{min-height:164px;font-size:14px}.expand-tool input[type=checkbox]{width:20px;height:20px;min-height:20px;accent-color:var(--blue)}.field:has(input[type=checkbox]){display:grid;grid-template-columns:minmax(0,1fr) 28px;column-gap:12px;align-items:center}.field:has(input[type=checkbox]) label{margin:0}.field:has(input[type=checkbox]) .help{grid-column:1/-1}
.expand-table-scroll{overflow:auto;max-height:520px}.expand-tool table{table-layout:auto;min-width:280px}.expand-tool .results table th:first-child,.expand-tool .results table th:nth-child(2){width:auto}.expand-tool pre{max-height:480px;overflow:auto;white-space:pre-wrap}.expand-output-image{width:100%;max-height:420px;object-fit:contain;margin-top:20px;border:1px solid var(--rule)}.expand-explanation{border-top:1px solid var(--rule);padding-top:24px;margin-top:32px;max-width:80ch}.expand-explanation p{color:var(--muted);max-width:72ch}.expand-explanation h2{font-size:23px}.source-button{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0 8px 8px 0;padding:8px 12px;border:1px solid var(--rule);border-radius:var(--radius-input);background:var(--raised);color:var(--blue-text);font-size:13px;text-decoration:none;transition:transform var(--dur-micro) var(--ease-out),border-color var(--dur-micro) ease}.source-button:focus-visible{outline:2px solid var(--blue-text);outline-offset:4px}.source-button:active{transform:scale(.98)}.expand-palette{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-block:20px}.expand-palette>div{display:flex;flex-direction:column;gap:8px;padding:12px;background:var(--raised);border-radius:var(--radius-input);font-size:13px}.palette-color{display:block;height:64px;border:1px solid var(--input-rule);border-radius:4px}.expand-palette code{font-size:13px}.expand-tool #tool-result{transition:opacity var(--dur-micro) ease}.expand-tool #tool-result:not(.result-ready):not(:empty){opacity:.85}.expand-tool #tool-result.result-ready{opacity:1}
@media (hover:hover) and (pointer:fine){.tool-entry:hover .expand-card-icon .icon{transform:translateY(-2px)}.source-button:hover{border-color:var(--blue-text);transform:translateY(-1px);color:var(--ink)}}
@media(max-width:850px){.expand-workspace{grid-template-columns:minmax(0,1fr)}.expand-heading h1{font-size:28px}.expand-art .icon{width:76px;height:76px}}
@media(max-width:600px){.expand-heading{grid-template-columns:40px minmax(0,1fr);gap:12px}.expand-heading>.icon{width:36px;height:36px}.expand-heading h1{font-size:25px}.expand-heading p{font-size:14px}.expand-art .icon{width:60px;height:60px}.expand-tool .results table{display:table}.expand-tool .results thead{display:table-header-group}.expand-tool .results tbody{display:table-row-group}.expand-tool .results table tr{display:table-row;border:0;padding:0;background:transparent}.expand-tool .results table th,.expand-tool .results table td{display:table-cell;padding:12px 8px;border-bottom:1px solid var(--rule);text-align:left}.expand-palette{grid-template-columns:repeat(2,minmax(0,1fr))}.expand-explanation{margin-top:24px}.expand-explanation h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){.tool-entry:hover .expand-card-icon .icon,.source-button:hover,.source-button:active{transform:none}.expand-tool #tool-result{transition:none;opacity:1}}
.expand-tool .result-row dd,.expand-tool td,.expand-tool th{overflow-wrap:anywhere;min-width:0}.expand-tool .result-row dt,.expand-tool .result-row dd{max-width:65%}
:root{--paper:#fffdf8;--category-materials:#e4b4ff;--category-logistics:#94e5a2}
[data-expand-category=materials],[data-category=materials]{--category:var(--category-materials)}[data-expand-category=logistics],[data-category=logistics]{--category:var(--category-logistics)}
@media(max-width:850px){.directory-filtered .featured-tools{display:none}}
.expand-output-image.paper-preview{background:var(--paper)}.expand-tool audio{width:100%;margin-block:20px}
.expand-heading h1,.expand-explanation h2{text-wrap:balance}