.ss14-law-table {
position: relative;
text-align: center;
background-color: #FFFFFF;
border: 1px solid #000;
border-collapse: collapse;
width: 100%;
}
.ss14-law-cell {
position: relative;
cursor: pointer;
transition: all 0.2s ease;
}
.ss14-law-cell:hover {
box-shadow: 0 0 10px rgba(255,255,255,0.5);
transform: scale(1.02);
}
.ss14-tooltip {
visibility: hidden;
opacity: 0;
position: absolute;
z-index: 1000;
bottom: 125%;
left: 50%;
margin-left: -150px;
width: 300px;
background-color: #1a1a1a;
color: white;
text-align: left;
border-radius: 6px;
padding: 10px;
border: 2px solid #444;
font-size: 12px;
line-height: 1.4;
transition: opacity 0.3s, visibility 0.3s;
}
.ss14-tooltip::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #444 transparent transparent transparent;
}
.ss14-law-cell:hover .ss14-tooltip {
visibility: visible;
opacity: 1;
}
.ss14-calculator {
margin-top: 20px;
padding: 20px;
background-color: #f5f5f5;
border: 1px solid #ccc;
border-radius: 8px;
display: none;
}
.ss14-calculator.active {
display: block;
}
.calculator-section {
margin-bottom: 15px;
}
.calculator-section h4 {
margin-bottom: 10px;
color: #333;
}
.law-checkbox {
margin: 5px 10px 5px 0;
}
.modifier-select {
margin: 5px;
padding: 5px;
border: 1px solid #ccc;
border-radius: 4px;
}
.calculation-result {
background-color: #e8f4f8;
padding: 15px;
border-left: 4px solid #2196F3;
margin-top: 15px;
font-weight: bold;
}
.punishment-type {
color: #d32f2f;
font-size: 16px;
}
.time-result {
color: #1976d2;
font-size: 18px;
}