.tool-box{
  --bg: #f2f6fb; --panel: #ffffff; --panel-2: #e3ebf6; --line: #c9d7ec;
  --accent: #2955a8; --accent-soft: #d3e0f6; --accent-dim: #eef2fb;
  --text: #16233d; --muted: #4c5f85; --muted-2: #94a5c4; --bad: #b3402f;
  --warn: #b7791f; --warn-soft: #f6ecd6;
}

.tool-box .url-row{ display: flex; gap: 10px; }
.tool-box .url-row input{ flex: 1; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; font-family: 'JetBrains Mono', monospace; font-size: 14px; background: var(--panel-2); color: var(--text); }
.tool-box .url-row input:focus{ outline: none; border-color: var(--accent); }
.tool-box .app{ padding: 12px 22px; border: none; border-radius: 8px; cursor: pointer; font-weight: 600; font-size: 13.5px; font-family: 'Inter', sans-serif; color: #fff; background: var(--accent); white-space: nowrap; }
.tool-box .app:hover{ filter: brightness(1.08); }
.tool-box .app[disabled]{ opacity: .65; cursor: not-allowed; }

.tool-box .spinner{ display: inline-block; width: 14px; height: 14px; border: 2px solid var(--accent); border-right-color: transparent; border-radius: 50%; animation: da-spin .7s linear infinite; vertical-align: middle; }
.tool-box .app .spinner{ border-color: #fff; border-right-color: transparent; margin-right: 7px; }
@keyframes da-spin{ to{ transform: rotate(360deg); } }

.tool-box .age-card{ display: none; margin-top: 20px; text-align: center; background: var(--panel-2); border: 1px solid var(--line); border-radius: 12px; padding: 26px; }
.tool-box .age-card.show{ display: block; }
.tool-box .age-card .num{ font-size: 44px; font-weight: 800; color: var(--accent); font-family: 'JetBrains Mono', monospace; }
.tool-box .age-card .lbl{ font-size: 12.5px; color: var(--muted); margin-top: 4px; }

.tool-box .da-warning{ margin-top: 16px; display: flex; gap: 10px; align-items: flex-start; background: var(--warn-soft); border: 1px solid var(--warn); border-radius: 10px; padding: 14px 16px; font-size: 12.5px; line-height: 1.6; color: #5c4416; }
.tool-box .da-warning .icon{ flex-shrink: 0; font-size: 16px; line-height: 1; }

.tool-box .section-title{ font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--muted); margin: 20px 0 8px; }
.tool-box .info-grid{ border: 1px solid var(--line); border-radius: 10px; overflow: hidden; display: none; }
.tool-box .info-grid.show{ display: block; }
.tool-box .info-row{ display: grid; grid-template-columns: 170px 1fr; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--line); background: var(--panel); }
.tool-box .info-row:last-child{ border-bottom: none; }
.tool-box .info-row:nth-child(even){ background: var(--accent-dim); }
.tool-box .info-row .k{ font-size: 11.5px; font-weight: 700; color: var(--muted); }
.tool-box .info-row .v{ font-family: 'JetBrains Mono', monospace; font-size: 12.5px; word-break: break-word; }
.tool-box .info-grid.placeholder{ opacity: .5; }

.tool-box .error-box{ display: none; margin-top: 16px; padding: 14px; border-radius: 8px; background: rgba(179,64,47,0.08); border: 1px solid var(--bad); color: var(--bad); font-size: 13px; font-weight: 600; }
.tool-box .error-box.show{ display: block; }

.tool-box .note{ margin-top: 16px; font-size: 12px; color: var(--muted); line-height: 1.6; background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px; }
