* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
    background: #0f1115;
    color: #e5e7eb;
    font-size: 15px;
}
a { color: #60a5fa; text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 1060px; margin: 0 auto; padding: 24px 16px 60px; }
h1 { font-size: 22px; margin: 8px 0 16px; }
h2 { font-size: 17px; margin: 4px 0 12px; }
h3 { font-size: 15px; }
.muted { color: #9ca3af; }
.topnav {
    display: flex; gap: 16px; align-items: center; flex-wrap: wrap;
    background: #161a22; padding: 12px 20px; border-bottom: 1px solid #232936;
}
.topnav .brand { font-weight: 700; color: #fff; margin-right: 10px; }
.topnav a { color: #cbd5e1; }
.topnav .logout { margin-left: auto; color: #f87171; }
.card {
    background: #161a22; border: 1px solid #232936; border-radius: 10px;
    padding: 16px 18px; margin-bottom: 16px; display: block; color: inherit;
}
a.card:hover { border-color: #374151; text-decoration: none; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 800px) { .two-col { grid-template-columns: 1fr; } }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 20px; }
.stat { text-align: center; }
.stat strong { display: block; font-size: 24px; color: #fff; }
.stat span { color: #9ca3af; font-size: 13px; }
.form label { display: block; margin-bottom: 12px; color: #d1d5db; }
.form input[type=text], .form input[type=email], .form input[type=password],
.form input[type=url], .form input[type=number], .form select, .form textarea {
    display: block; width: 100%; margin-top: 4px; padding: 9px 10px;
    background: #0f1115; border: 1px solid #2d3546; border-radius: 8px; color: #e5e7eb;
}
.form textarea { resize: vertical; font-family: inherit; }
.form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.btn {
    display: inline-block; padding: 8px 16px; border-radius: 8px; border: 1px solid #374151;
    background: #1f2735; color: #e5e7eb; cursor: pointer; font-size: 14px;
}
.btn:hover { background: #28334a; }
.btn.primary { background: #2563eb; border-color: #2563eb; color: #fff; }
.btn.primary:hover { background: #1d4ed8; }
.btn.danger { background: transparent; border-color: #7f1d1d; color: #f87171; }
.btn.small { padding: 4px 10px; font-size: 13px; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.flash { padding: 12px 16px; border-radius: 8px; margin-bottom: 14px; background: #14351f; border: 1px solid #166534; color: #bbf7d0; }
.flash.error { background: #3b1518; border-color: #991b1b; color: #fecaca; }
.flash.warning { background: #3a2f12; border-color: #a16207; color: #fde68a; }
.flash a { color: inherit; text-decoration: underline; }
.badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 12px; background: #263041; color: #9ca3af; }
.badge.analyzed { background: #14351f; color: #4ade80; }
.badge.uploaded { background: #263041; color: #93c5fd; }
.badge.failed { background: #3b1518; color: #f87171; }
.badge.ok { background: #14351f; color: #4ade80; }
.score { display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 12px; font-weight: 700; }
.score.good { background: #14351f; color: #4ade80; }
.score.mid { background: #3a2f12; color: #fbbf24; }
.score.low { background: #3b1518; color: #f87171; }
.fav { color: #fbbf24; }
.item-list { list-style: none; margin: 0; padding: 0; }
.item-list li { padding: 10px 0; border-bottom: 1px solid #232936; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.item-list li:last-child { border-bottom: none; }
.hook-item { justify-content: space-between; }
.hook-item .actions, .actions { display: flex; gap: 8px; }
.actions form { display: inline; }
.page-head { display: flex; align-items: center; gap: 14px; justify-content: space-between; flex-wrap: wrap; }
.search-form { display: flex; gap: 8px; margin-bottom: 16px; }
.search-form input {
    flex: 1; padding: 8px 12px; background: #161a22; border: 1px solid #2d3546;
    border-radius: 8px; color: #e5e7eb;
}
.analysis-list dt { color: #9ca3af; font-size: 13px; margin-top: 10px; }
.analysis-list dd { margin: 2px 0 0; }
.scores-row { margin-bottom: 8px; }
.mini-scores { margin-top: 14px; font-size: 13px; }
.steps { margin: 8px 0; padding-left: 20px; }
.steps li { margin-bottom: 4px; }
.meta-line { margin-bottom: 16px; }
.pagination { display: flex; gap: 10px; margin-top: 16px; }
.auth-box, .install-box { max-width: 440px; margin: 40px auto; }
.install-box { max-width: 560px; }
.scene .scene-head { display: flex; gap: 10px; align-items: center; margin-bottom: 6px; }
