.hkpt-wrapper {
    display: flex; flex-wrap: wrap; gap: 2rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background: #fff; padding: 1.5rem; border-radius: 12px; border: 1px solid #e0e0e0;
}
.hkpt-controls { flex: 1; min-width: 280px; }
.hkpt-chart-area { flex: 2; min-width: 320px; display: flex; align-items: center; }
.control-group { margin-bottom: 1.5rem; }
.control-group p { margin: 0 0 0.5rem 0; font-weight: bold; color: #333; }
#toado-select {
    width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 5px;
    background-color: #fff; font-size: 1em;
}
.van-selector {
    list-style: none; padding: 0; margin: 0; display: grid;
    grid-template-columns: repeat(5, 1fr); gap: 10px;
}
.van-selector li {
    padding: 10px; border: 1px solid #ccc; border-radius: 50%; cursor: pointer;
    transition: all 0.2s ease-in-out; text-align: center; aspect-ratio: 1 / 1;
    display: flex; align-items: center; justify-content: center; font-weight: bold;
}
.van-selector li:hover { background-color: #f0f0f0; transform: scale(1.05); }
.van-selector li.active {
    background-color: #c0392b; color: white; border-color: #a93226; transform: scale(1.1);
}
.flying-star-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); width: 100%;
    max-width: 500px; margin: auto; border: 3px solid #34495e;
    aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden;
}
.palace {
    border: 1px solid #ddd; display: flex; flex-direction: column;
    justify-content: space-between; text-align: center; position: relative; padding: 5px;
}
.palace-header {
    display: flex; justify-content: space-between; padding: 0 5px;
    font-size: clamp(1.2em, 4vw, 1.8em); font-weight: bold;
}
.mountain-star { color: #c0392b; } /* Tọa Tinh (Sơn) */
.water-star { color: #2980b9; }   /* Hướng Tinh (Hạ) */
.palace-body {
    flex-grow: 1; display: flex; align-items: center; justify-content: center;
}
.base-star {
    font-size: clamp(2.5em, 8vw, 4em); font-weight: bold; color: #333;
}
.center-palace .base-star { color: #8e44ad; } /* Trung cung */
.palace-footer {
    font-weight: bold; color: #7f8c8d;
    font-size: clamp(0.9em, 3vw, 1.2em);
    position: absolute;
    bottom: 5px;
    left: 0;
    right: 0;
}