body { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
.model-card:hover { border-color: #007bff; box-shadow: 0 4px 12px rgba(0,0,0,0.15); transform: translateY(-2px); }
.model-card { position: relative; overflow: visible; }
.model-card::after, .model-card::before { content: none !important; display: none !important; }
.model-card .description { display: none; }
.model-card .launch-btn { display: none; }
form:hover { z-index: 1000; position: relative; }
.touch-device .model-grid { justify-content: center; }
.touch-device .model-grid form { display: flex; flex-direction: column; align-items: center; position: relative; }
.touch-device .model-grid form.mobile-tooltip-open { z-index: 2000; }
.touch-device .model-card .launch-btn {
    margin-top: 0.5rem; padding: 0.5rem 1rem;
    background: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer;
}
.touch-device .model-card.mobile-selected { border-color: #007bff; box-shadow: 0 4px 12px rgba(0,123,255,0.25); }
.touch-device .model-card.mobile-selected .launch-btn { display: block; }
.touch-device .mobile-description-panel {
    position: absolute; top: calc(100% + 0.35rem); left: 50%; transform: translateX(-50%);
    width: min(82vw, 320px); box-sizing: border-box; margin: 0;
    background: #333; color: white; padding: 0.75rem 1rem; border-radius: 6px;
    font-size: 0.95rem; line-height: 1.45; text-align: center;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25); z-index: 2001;
}
@media (max-width: 900px) {
    header, main > div:first-child { flex-direction: column; text-align: center; }
    header h1, main h1 { font-size: 2rem !important; margin-left: 0 !important; }
}


.homepage-error-banner { background: #dc3545; color: white; padding: 1rem; margin-bottom: 1rem; border-radius: 8px; text-align: center; }
.model-icon { font-size: 3.25rem; margin-bottom: 0.55rem; line-height: 1; }
.model-card-title { min-height: 3.2rem; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; line-height: 1.1; margin: 0.25rem 0; }
.model-restricted-label { color: #dc3545; }
.model-card { border: 2px solid #ccc; padding: 1.5rem; margin: 0.5rem; border-radius: 12px;
    width: 220px; text-align: center; cursor: pointer; transition: all 0.2s;
    height: 220px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0.15rem; }
.homepage-main { padding: 2rem; max-width: 1100px; margin: 0 auto; text-align: left; }
.homepage-header { display: flex; align-items: center; margin-bottom: 1rem; }
.homepage-logo { height: 160px; }
.homepage-title { margin-left: 1rem; font-size: 4rem !important; }
.homepage-select-prompt { margin-left: 0.5rem; font-size: 1.5rem; }
.model-grid { display: flex; flex-wrap: wrap; justify-content: flex-start; }
.homepage-footer { text-align: center; padding: 0.5rem; margin-top: 1rem; border-top: 1px solid #ddd; color: #666; }


.auth-backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 9999; }
.auth-dialog { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: white; padding: 2rem; border-radius: 8px; z-index: 10000; min-width: 300px; }
.auth-email-input { width: 100%; padding: 0.5rem; margin-bottom: 1rem; }
.auth-turnstile { margin-bottom: 1rem; }
.auth-captcha-help { display: block; color: #666; margin-bottom: 1rem; }
.auth-error { color: red; margin-bottom: 1rem; display: none; }
.auth-actions { display: flex; gap: 1rem; }
.auth-actions button { flex: 1; }
.auth-submit { background: #007bff; color: white; border: none; padding: 0.5rem; border-radius: 4px; cursor: pointer; }


.custom-tooltip { position: absolute; bottom: -70px; left: 50%; transform: translateX(-50%);
    background: #333; color: white; padding: 0.5rem 1rem; border-radius: 6px; font-size: 0.95rem;
    white-space: normal; width: 90vw; max-width: 300px; text-align: center; opacity: 0;
    transition: opacity 0.2s; z-index: 9999; pointer-events: none; }
.custom-tooltip.is-visible { opacity: 1; }
.auth-error.is-visible { display: block; }


.model-color-default { color: #007bff; }
.model-color-16a085 { color: #16a085; }
.model-color-27ae60 { color: #27ae60; }
.model-color-2980b9 { color: #2980b9; }
.model-color-3498db { color: #3498db; }
.model-color-9b59b6 { color: #9b59b6; }
.model-color-c0392b { color: #c0392b; }
.model-color-e67e22 { color: #e67e22; }
.model-color-e74c3c { color: #e74c3c; }


/* Desktop visual-density tuning: recover the pre-refactor card density while
   keeping touch layouts free to expand/wrap. */
@media (min-width: 901px) {
    .homepage-main { padding: 1.5rem 2rem; }
    .model-grid { gap: 0; }
    .model-card { padding: 1.15rem; }
    .model-card-title { font-size: 1.05rem; }
}