@charset "UTF-8";

.toolbox-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; padding:60px 0 44px; border-bottom:1px solid var(--line); }
.toolbox-intro .eyebrow { margin-bottom:18px; }
.toolbox-intro h1 { margin:0; font-size:clamp(36px,3.7vw,50px); line-height:1.25; letter-spacing:-2.4px; font-weight:730; word-break:keep-all; }
.toolbox-lead { margin:20px 0 0; color:var(--muted); font-size:15px; line-height:1.9; letter-spacing:-.3px; word-break:keep-all; }
.toolbox-intro-note { min-width:190px; border-left:1px solid var(--line); padding-left:30px; }
.toolbox-device { display:inline-block; margin-bottom:10px; font-size:10px; font-weight:650; letter-spacing:.5px; color:var(--blue); }
.toolbox-intro-note p { margin:0; color:var(--muted); font-size:12px; line-height:1.9; }
.tool-library { padding:40px 0 64px; }
.tool-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; }
.tool-toolbar h2 { margin:0; font-size:22px; line-height:1.4; letter-spacing:-.7px; font-weight:650; word-break:keep-all; }
.tool-toolbar>div>p { color:var(--muted); margin:9px 0 0; font-size:12px; }
.tool-search { width:min(340px,100%); }
.tool-search label { display:block; margin-bottom:7px; font-size:11px; font-weight:600; }
.tool-search input { display:block; width:100%; min-width:0; min-height:48px; padding:12px 15px; background:#fff; border:1px solid #d5d8d2; border-radius:6px; font-size:12px; color:var(--ink); }
.tool-search input::placeholder { color:#85888c; }
.tool-search input:focus { border-color:var(--blue); }
.tool-filter-row { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:27px 0 24px; }
.tool-filters { display:flex; flex-wrap:wrap; gap:7px; }
.tool-filters button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 17px; border:1px solid transparent; border-radius:5px; background:transparent; font-size:12px; line-height:1.5; font-weight:550; }
.tool-filters button:hover { color:var(--blue); background:#eeeee8; }
.tool-filters button[aria-pressed=true] { background:var(--ink); color:white; border-color:var(--ink); }
.tool-results-status { flex-shrink:0; margin:0; font-size:11px; color:var(--muted); }
.tool-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.tool-card { display:flex; flex-direction:column; min-width:0; min-height:276px; padding:25px 25px 17px; border:1px solid #dedfd8; border-radius:9px; background:#fff; }
.tool-card[hidden],#tool-empty[hidden] { display:none!important; }
.tool-card-top { display:flex; align-items:center; gap:10px; margin-bottom:24px; }
.tool-symbol { display:grid; place-items:center; width:40px; height:40px; border-radius:8px; background:#efeffc; color:var(--blue); flex-shrink:0; }
.tool-symbol svg { width:23px; height:23px; }
.tool-card-background .tool-symbol,.tool-card-adjust .tool-symbol { background:#eaf1e7; color:#4d6c57; }
.tool-card-stitch .tool-symbol,.tool-card-mosaic .tool-symbol { background:#f5eee0; color:#8d6a36; }
.tool-card-label { color:var(--muted); font-size:9px; font-weight:600; letter-spacing:1px; }
.tool-card-number { margin-left:auto; font-size:10px; color:#94978f; }
.tool-card h3 { margin:0 0 11px; font-size:21px; line-height:1.4; letter-spacing:-.75px; font-weight:680; word-break:keep-all; }
.tool-card>p { margin:0 0 23px; font-size:12px; line-height:1.85; color:var(--muted); word-break:keep-all; }
.tool-card-footer { display:flex; flex-direction:column; align-items:flex-start; gap:7px; margin-top:auto; }
.tool-card-footer>span { font-size:10px; color:var(--muted); line-height:1.7; }
.tool-open { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:44px; border-top:1px solid #e7e8e1; padding-top:7px; font-size:12px; font-weight:650; line-height:1.7; }
.tool-open svg { width:17px; height:17px; }
.tool-open:hover { color:var(--blue); }
.tool-empty { padding:62px 24px; border:1px dashed #cfd2c9; border-radius:9px; text-align:center; background:#f1f1eb; }
.tool-empty-symbol { display:grid; place-items:center; color:#787e70; margin:0 auto 16px; }
.tool-empty-symbol svg { width:30px; height:30px; }
.tool-empty h3 { margin:0; font-size:21px; font-weight:650; letter-spacing:-.7px; }
.tool-empty p { margin:12px 0 23px; color:var(--muted); font-size:13px; line-height:1.8; }
.tool-empty .button { min-height:46px; font-size:12px; }
.toolbox-studio { display:flex; align-items:center; gap:24px; padding:32px; background:#ebecf8; border:1px solid #dee0f1; border-radius:10px; }
.toolbox-studio-icon { display:grid; place-items:center; width:54px; height:54px; color:var(--blue); background:#f8f8ff; border-radius:10px; flex-shrink:0; }
.toolbox-studio-icon svg { width:31px; height:31px; }
.toolbox-studio-copy { min-width:0; flex:1; }
.toolbox-studio .eyebrow { margin-bottom:9px; font-size:9px; color:#6c6d7f; }
.toolbox-studio h2 { font-size:23px; font-weight:650; letter-spacing:-.8px; line-height:1.5; margin:0; word-break:keep-all; }
.toolbox-studio-copy>p:not(.eyebrow) { margin:10px 0 0; color:#626676; font-size:12px; line-height:1.85; word-break:keep-all; }
.toolbox-studio-device { display:block; margin-top:12px; font-size:10px; color:#666a79; line-height:1.8; }
.toolbox-studio>.button { flex-shrink:0; min-height:49px; font-size:12px; gap:16px; }
.toolbox-guides { padding:56px 0 62px; display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; }
.toolbox-guides .eyebrow { color:var(--muted); font-size:9px; margin-bottom:12px; }
.toolbox-guides h2 { font-size:27px; letter-spacing:-1px; font-weight:650; line-height:1.5; margin:0; word-break:keep-all; }
.toolbox-guide-list { border-top:1px solid var(--line); }
.toolbox-guide-link { display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:66px; padding:15px 0; border-bottom:1px solid var(--line); font-size:13px; font-weight:550; line-height:1.7; word-break:keep-all; }
.toolbox-guide-link svg { width:18px; height:18px; }
.toolbox-guide-link:hover { color:var(--blue); }
html[lang=en] .toolbox-intro h1 { letter-spacing:-1.9px; }
html[lang=en] .toolbox-lead { letter-spacing:0; }
html[lang=en] .tool-card h3 { letter-spacing:-.5px; }

@media(max-width:1100px) {
  .tool-card { padding:23px 22px 16px; }
  .tool-card-top { gap:8px; }
  .tool-card-label { font-size:8px; letter-spacing:.6px; }
  .tool-card h3 { font-size:20px; }
  .toolbox-studio { gap:20px; padding:28px; }
  .toolbox-studio h2 { font-size:21px; }
  .toolbox-studio-copy>p>br { display:none; }
}
@media(max-width:950px) {
  .tool-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tool-card { min-height:268px; padding:25px 25px 17px; }
  .tool-card-label { font-size:9px; }
  .tool-card h3 { font-size:21px; }
  .toolbox-intro { padding-top:48px; }
  .toolbox-intro-note { min-width:160px; padding-left:24px; }
  .toolbox-studio-icon { display:none; }
  .toolbox-guides { grid-template-columns:.9fr 1.1fr; gap:30px; }
  .toolbox-guides h2 { font-size:24px; }
}
@media(max-width:700px) {
  .toolbox-intro { align-items:flex-start; padding:38px 0 30px; gap:22px; flex-direction:column; }
  .toolbox-intro h1 { font-size:37px; letter-spacing:-1.8px; }
  .toolbox-intro .eyebrow { font-size:9px; margin-bottom:16px; }
  .toolbox-lead { font-size:14px; margin-top:17px; }
  .toolbox-intro-note { display:flex; align-items:center; gap:15px; padding:0; border:0; min-width:0; }
  .toolbox-device { font-size:9px; border:1px solid #cdd2df; padding:3px 7px; border-radius:4px; margin:0; white-space:nowrap; }
  .toolbox-intro-note p { font-size:10px; line-height:1.7; }
  .toolbox-intro-note p br { display:none; }
  .tool-library { padding:30px 0 40px; }
  .tool-toolbar { flex-direction:column; align-items:stretch; gap:22px; }
  .tool-toolbar h2 { font-size:22px; }
  .tool-toolbar>div>p { font-size:12px; }
  .tool-search { width:100%; }
  .tool-search input { font-size:13px; min-height:48px; }
  .tool-filter-row { flex-wrap:wrap; gap:13px; margin:20px 0; }
  .tool-filters { width:100%; gap:3px; }
  .tool-filters button { padding:10px 12px; min-height:44px; font-size:11px; }
  .tool-results-status { font-size:10px; }
  .tool-grid { gap:16px; }
  .tool-card { padding:23px 20px 15px; min-height:275px; }
  .tool-card h3 { font-size:20px; }
  .tool-card-top { flex-wrap:wrap; gap:8px; margin-bottom:21px; }
  .tool-card-label { font-size:8px; }
  .tool-card-number { display:none; }
  .toolbox-studio { padding:25px 24px; gap:20px; }
  .toolbox-studio h2 { font-size:23px; }
  .toolbox-studio-copy>p:not(.eyebrow) { font-size:12px; }
  .toolbox-studio-device { font-size:10px; }
  .toolbox-guides { padding:40px 0; grid-template-columns:1fr; gap:23px; }
  .toolbox-guides h2 { font-size:26px; }
  .toolbox-guide-link { font-size:13px; }
}
@media(max-width:560px) {
  .tool-grid { grid-template-columns:minmax(0,1fr); }
  .tool-card { min-height:260px; padding:24px 24px 16px; }
  .tool-card-top { flex-wrap:nowrap; margin-bottom:22px; }
  .tool-card-label { font-size:9px; letter-spacing:1px; }
  .tool-card-number { display:block; }
  .tool-card h3 { font-size:23px; }
  .tool-card>p { font-size:13px; }
  .tool-card-footer>span { font-size:10px; }
  .tool-open { min-height:46px; font-size:12px; }
}
@media(max-width:360px) {
  .toolbox-intro h1 { font-size:32px; letter-spacing:-1.5px; }
  .toolbox-lead { font-size:13px; }
  .tool-filters button { padding-inline:10px; font-size:10px; }
  .tool-card { padding:22px 21px 15px; }
  .tool-card h3 { font-size:21px; }
  .tool-card-label { letter-spacing:.7px; }
  .toolbox-studio { padding:23px 21px; }
  .toolbox-studio h2 { font-size:21px; }
}