.shell > main.tools-main { max-width:none; margin:0; padding:0; background:transparent; border:0; box-shadow:none; }
.tools-hero { padding:58px 0 38px; max-width:780px; }
.tools-hero h1 { font-size:clamp(36px,5vw,58px) !important; letter-spacing:-2.3px !important; margin:14px 0 20px !important; }
.tools-hero .lead { max-width:650px; }
.local-badge { display:inline-flex; align-items:center; gap:8px; color:#27745f; background:#eaf5ef; border:1px solid #d5e9dd; border-radius:999px; padding:5px 12px; font-size:12px; font-weight:750; }
.tools-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-bottom:45px; }
.tool-card { position:relative; display:flex; flex-direction:column; border:1px solid var(--line); background:#fff; border-radius:18px; padding:26px; color:var(--ink); text-decoration:none; transition:transform .2s,border-color .2s; }
.tool-card:hover { color:var(--ink); border-color:#a9c2eb; transform:translateY(-3px); }
.tool-card .tool-icon { display:grid; place-items:center; background:#edf3ff; color:var(--blue); width:44px; height:44px; border-radius:13px; font-size:23px; margin-bottom:24px; }
.tool-card:nth-child(2n) .tool-icon { color:#34765e; background:#edf5ed; }
.tool-card .card-kicker { font-size:10px; }
.tool-card h2 { margin:0 0 12px !important; font-size:22px !important; }
.tool-card p { font-size:13px !important; margin-bottom:24px; }
.tool-card .card-link { border-top:1px solid var(--line); padding-top:16px; width:100%; }
.tools-note { margin:28px 0 48px; padding:25px; border:1px solid var(--line); background:#f0f4fa; border-radius:14px; }
.tools-note h2 { margin-top:0 !important; }
.tools-note p { margin-bottom:0; }
.tool-workspace { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(230px,1fr); gap:28px; align-items:start; margin-bottom:45px; }
.tool-panel { background:#fff; border:1px solid var(--line); border-radius:20px; padding:28px; min-width:0; }
.tool-panel fieldset { border:0; padding:0; margin:0; min-width:0; }
.tool-panel legend { font-size:20px; font-weight:800; padding:0; margin-bottom:18px; }
.file-picker { background:#f7faff; border:1px dashed #afc4e6; border-radius:12px; padding:20px; }
.file-picker label { font-size:14px; }
.file-picker input { height:auto; padding:8px 0; font-size:13px; width:100%; }
.file-picker input::file-selector-button { border:0; background:#e4edff; color:#164daf; padding:10px 14px; border-radius:7px; font:inherit; font-weight:700; margin-right:10px; cursor:pointer; }
.file-picker p,.tool-panel .field-help { font-size:12px !important; line-height:1.7 !important; margin:8px 0 0; }
.file-list { padding:0; list-style:none; margin:18px 0; }
.file-list li { display:flex; gap:12px; align-items:center; border-bottom:1px solid var(--line); padding:12px 0; margin:0 !important; }
.file-list li > img { width:56px; height:56px; object-fit:contain; border:1px solid var(--line); border-radius:8px; background:#f4f5f7; }
.file-list li > span { flex:1; min-width:0; }
.file-list strong { display:block; overflow-wrap:anywhere; color:var(--ink); font-size:12px; }
.file-list small { display:block; font-size:11px; }
.file-actions { display:flex; gap:5px; flex-wrap:wrap; justify-content:flex-end; }
.file-actions button { width:auto; min-height:32px; padding:4px 9px; border:1px solid var(--line); background:#f6f8fc; color:#435e80; font-size:11px; }
.file-actions button:disabled { cursor:default; opacity:.4; }
.tool-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:22px 0; }
.tool-fields .full-field { grid-column:1/-1; }
.tool-fields label { font-size:12px; }
.tool-fields select,.tool-fields input { height:46px; width:100%; padding:8px 12px; background:#fafbfd; border:1px solid #dbe2ec; border-radius:8px; font-size:14px; }
.tool-fields input[type=color] { padding:6px; }
.tool-status { padding:12px 0; font-size:13px !important; margin:0; }
.tool-status[data-state=error] { color:#a13e3e; }
.tool-clear { width:auto; background:transparent; color:#55677e; padding:6px 0; min-height:35px; margin:3px 0 0; }
.tool-clear:hover { background:transparent; color:#174fc2; box-shadow:none; }
.tool-result { padding:22px; margin:18px 0 0; border:1px solid #cce9dd; border-radius:12px; background:#f3fbf7; }
.tool-result h2 { font-size:21px !important; margin:0 0 10px !important; }
.tool-result p { font-size:12px !important; }
.result-preview { display:block; max-width:100%; max-height:300px; object-fit:contain; margin:0 auto 20px; border-radius:6px; background:repeating-conic-gradient(#e6e8ec 0% 25%,#fff 0% 50%) 50% / 16px 16px; }
.tool-aside { padding:22px 0; }
.tool-aside h2 { margin:0 0 16px !important; font-size:20px !important; }
.tool-aside ol { padding-left:23px; }
.tool-aside li { padding-left:6px; font-size:13px !important; }
.tool-aside .local-note { border-top:1px solid var(--line); padding-top:20px; margin-top:22px; font-size:12px !important; }
.tool-guide { border-top:1px solid var(--line); padding:10px 0 28px; max-width:820px; }
.tool-guide h2 { font-size:25px !important; }
.tool-guide p { font-size:14px !important; }
.tool-guide details p { font-size:13px !important; }
.related-tools { padding:12px 0 45px; }
.related-tools .contents a { background:#fff; }
.home-tools { border-top:1px solid var(--line); padding:42px 0; }
@media(max-width:850px) { .tools-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .tool-workspace { grid-template-columns:1fr; } .tool-aside { padding:0 6px; } }
@media(max-width:540px) { .tools-hero { padding:32px 0 22px; } .tools-grid { grid-template-columns:1fr; gap:14px; } .tool-panel { padding:20px; } .tool-fields { grid-template-columns:1fr; } .file-list li { flex-wrap:wrap; } .file-actions { margin-left:auto; } .tool-card { padding:23px; } }