.tool-panel { background: #faf8f2; border: 1px solid #deddd2; border-radius: 14px; padding: clamp(16px, 4vw, 30px); margin: 16px 0 24px; }
.tool-panel label { display: block; font-weight: bold; margin: 12px 0 5px; }
.tool-panel textarea { display: block; width: 100%; box-sizing: border-box; border: 1px solid #8b998d; border-radius: 8px; padding: 12px; font: inherit; line-height: 1.5; resize: vertical; }
.tool-panel input[type=number] { width: 90px; box-sizing: border-box; font: inherit; padding: 8px; border: 1px solid #8b998d; border-radius: 6px; }
.tool-panel .tool-check { display: flex; align-items: center; gap: 8px; font-weight: normal; }
.tool-panel .tool-check input { flex: 0 0 auto; }
.tool-options { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 8px 0 16px; }
.tool-panel button { display: inline-block; width: auto; max-width: 100%; margin: 14px 0 0; padding: 12px 24px; border: 0; border-radius: 8px; background: #005d17; color: #fff; font: bold 1rem Arial,sans-serif; cursor: pointer; }
.tool-panel button:disabled { opacity: .6; cursor: wait; }
.tool-panel button.secondary { background: #e3e9df; color: #173e25; }
.tool-panel [hidden] { display: none !important; }
.tool-panel :focus-visible { outline: 3px solid #b0802b; outline-offset: 3px; }
.tool-message { min-height: 1.6em; color: #465246; }
.tool-note { font-size: .9rem; color: #536355; }
.tool-result-list { padding-left: 2rem; overflow-wrap: anywhere; }
.tool-result-list li { padding: 5px 8px; border-bottom: 1px solid #dce3d7; }
.tool-result-list li::marker { font-weight: bold; color: #005d17; }
.tool-content { margin: 24px 0; }
.tool-content h2 { margin-top: 26px; }
.tool-content details { padding: 12px 0; border-bottom: 1px solid #dce3d7; }
.tool-content summary { cursor: pointer; font-weight: bold; }
.tool-related { max-width: 800px; margin: 20px auto; padding: 18px 20px; box-sizing: border-box; }
.tool-related ul { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; padding: 0; }
.tool-related a { color: #005d17; }
.tool-quicklinks { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; }
.tool-quicklinks a { display: block; padding: 7px 12px; border: 1px solid #b9c6b7; border-radius: 6px; color: #005d17; }
.custom-wheel-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 24px; align-items: start; }
.custom-wheel-stage { width: min(100%, 480px); margin: 0 auto; text-align: center; }
.custom-wheel-stage svg { display: block; width: 100%; height: auto; }
#customRotor { transform-origin: 240px 240px; will-change: transform; }
#customPointer { transform-origin: 240px 24px; }
#customWheelResult { min-height: 3em; font-size: 1.4rem; font-weight: bold; color: #005d17; overflow-wrap: anywhere; }
@media(max-width: 620px) { .custom-wheel-layout { grid-template-columns: minmax(0, 1fr); } }
@media(prefers-reduced-motion: reduce) { #customRotor { will-change: auto; } }