.tools-page { max-width: 900px; margin: 0 auto; padding: 24px 16px; font-family: system-ui, -apple-system, sans-serif; color: #e2e8f0; }
.tools-page h1 { font-size: 1.75rem; margin-bottom: 8px; color: #f1f5f9; }
.tools-page .lead { color: #94a3b8; margin-bottom: 24px; font-size: 1.05rem; }
.tools-card { background: #1e293b; border-radius: 12px; box-shadow: 0 2px 12px rgba(0,0,0,.3); padding: 24px; margin-bottom: 20px; border: 1px solid #334155; }
.tools-btn { display: inline-block; padding: 10px 20px; background: #2563eb; color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 0.95rem; transition: background .2s; }
.tools-btn:hover { background: #3b82f6; }
.tools-input, .tools-textarea { width: 100%; max-width: 100%; padding: 12px 14px; border: 2px solid #334155; border-radius: 8px; font-size: 0.95rem; box-sizing: border-box; font-family: inherit; background: #0f172a; color: #e2e8f0; }
.tools-input:focus, .tools-textarea:focus { outline: none; border-color: #2563eb; }
.tools-textarea { min-height: 120px; resize: vertical; }
.tools-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.tools-list a { text-decoration: none; color: inherit; }
.tools-list .item { background: #1e293b; border-radius: 12px; padding: 20px; border: 1px solid #334155; transition: box-shadow .2s, border-color .2s; }
.tools-list .item:hover { box-shadow: 0 6px 20px rgba(0,0,0,.3); border-color: #475569; }
.tools-list .item h3 { margin: 0 0 6px; font-size: 1.05rem; color: #f1f5f9; }
.tools-list .item p { margin: 0; color: #94a3b8; font-size: 0.88rem; }
.tools-memo table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.tools-memo th, .tools-memo td { border: 1px solid #334155; padding: 10px 12px; text-align: left; }
.tools-memo th { background: #0f172a; font-weight: 600; color: #e2e8f0; }
.tools-memo td { color: #cbd5e1; }
.tools-memo code { background: #0f172a; padding: 2px 6px; border-radius: 4px; font-size: 0.88em; color: #7dd3fc; }
.tools-output { background: #0f172a; color: #e2e8f0; padding: 16px; border-radius: 8px; font-family: ui-monospace, monospace; font-size: 0.9rem; overflow-x: auto; white-space: pre-wrap; word-break: break-all; border: 1px solid #1e293b; }