.like-btn {display: inline-flex;align-items: center;gap: .45rem;padding: .45rem .9rem;border: 1.5px solid var(--border);border-radius: var(--r-full);background: var(--white);color: var(--muted);font-size: var(--text-sm);font-weight: 600;cursor: pointer;transition: border-color .18s, color .18s, background .18s, transform .12s;user-select: none;}.like-btn:hover {border-color: var(--red-700);color: var(--red-700);}.like-btn.liked {background: var(--red-700, #c8102e);border-color: var(--red-700, #c8102e);color: #fff;}.like-btn.liked:hover {background: var(--red-800, #a50d25);border-color: var(--red-800, #a50d25);}.like-btn:active {transform: scale(.94);}.like-btn .like-icon {width: 1rem;height: 1rem;}.like-btn .like-count {min-width: 1ch;}.comments-section {margin-top: var(--sp-8);border-top: 1px solid var(--border);padding-top: var(--sp-6);}.comments-section h2 {font-size: var(--text-xl);font-weight: 800;margin-bottom: var(--sp-5);color: var(--ink);}.comments-section h2 span {color: var(--red-700);}.comment-form {background: var(--white);border: 1px solid var(--border);border-radius: var(--r-md);padding: var(--sp-4);margin-bottom: var(--sp-6);}.comment-form textarea {width: 100%;min-height: 90px;resize: vertical;border: 1px solid var(--border);border-radius: var(--r-sm);padding: var(--sp-3);font-family: inherit;font-size: var(--text-sm);color: var(--ink);background: var(--surface);transition: border-color .15s;box-sizing: border-box;}.comment-form textarea:focus {outline: none;border-color: var(--red-700);}.comment-form .comment-form-footer {display: flex;justify-content: flex-end;margin-top: var(--sp-2);}.comment-guest-prompt {text-align: center;padding: var(--sp-5);background: var(--surface);border: 1px dashed var(--border);border-radius: var(--r-md);margin-bottom: var(--sp-6);color: var(--muted);font-size: var(--text-sm);}.comment-guest-prompt a {color: var(--red-700);font-weight: 600;}.comment-list {display: flex;flex-direction: column;gap: var(--sp-4);}.comment-item {display: grid;grid-template-columns: 36px 1fr;gap: var(--sp-3);}.comment-avatar {width: 36px;height: 36px;border-radius: 50%;background: var(--red-700);color: #fff;font-weight: 700;font-size: var(--text-sm);display: flex;align-items: center;justify-content: center;flex-shrink: 0;}.comment-bubble {background: var(--white);border: 1px solid var(--border);border-radius: var(--r-md);padding: var(--sp-3) var(--sp-4);}.comment-meta {display: flex;align-items: baseline;gap: var(--sp-2);margin-bottom: var(--sp-1);}.comment-author {font-weight: 700;font-size: var(--text-sm);color: var(--ink);}.comment-date {font-size: var(--text-xs);color: var(--muted);}.comment-body {font-size: var(--text-sm);color: var(--ink);white-space: pre-line;line-height: 1.6;}.comment-empty {text-align: center;color: var(--muted);font-size: var(--text-sm);padding: var(--sp-6) 0;}.auth-page {min-height: 60vh;display: flex;align-items: center;justify-content: center;padding: var(--sp-8) var(--sp-4);}.auth-card {background: var(--white);border: 1px solid var(--border);border-radius: var(--r-lg, 16px);padding: var(--sp-8) var(--sp-8);width: 100%;max-width: 420px;box-shadow: 0 4px 24px rgba(0,0,0,.07);}.auth-card .auth-logo {text-align: center;margin-bottom: var(--sp-5);}.auth-card .auth-logo img {width: 52px;height: 52px;}.auth-card h1 {text-align: center;font-size: var(--text-xl);font-weight: 900;color: var(--ink);margin-bottom: var(--sp-6);}.auth-card h1 span {color: var(--red-700);}.auth-field {margin-bottom: var(--sp-4);}.auth-field label {display: block;font-size: var(--text-sm);font-weight: 600;color: var(--ink);margin-bottom: var(--sp-1);}.auth-field input {width: 100%;border: 1.5px solid var(--border);border-radius: var(--r-sm);padding: .55rem .8rem;font-size: var(--text-sm);font-family: inherit;color: var(--ink);background: var(--surface);transition: border-color .15s;box-sizing: border-box;}.auth-field input:focus {outline: none;border-color: var(--red-700);}.auth-error {background: #fef2f2;border: 1px solid #fca5a5;border-radius: var(--r-sm);padding: var(--sp-3) var(--sp-4);color: #b91c1c;font-size: var(--text-sm);margin-bottom: var(--sp-4);}.auth-submit {width: 100%;margin-top: var(--sp-2);}.auth-footer {text-align: center;margin-top: var(--sp-5);font-size: var(--text-sm);color: var(--muted);}.auth-footer a {color: var(--red-700);font-weight: 600;}.user-nav-menu {position: relative;display: inline-flex;align-items: center;}.user-nav-btn {display: inline-flex;align-items: center;gap: .4rem;padding: .3rem .7rem;border: 1.5px solid var(--border);border-radius: var(--r-full);background: var(--white);font-size: var(--text-sm);font-weight: 600;color: var(--ink);cursor: pointer;transition: border-color .15s, background .15s;}.user-nav-btn:hover {border-color: var(--red-700);}.user-nav-avatar {width: 24px;height: 24px;border-radius: 50%;background: var(--red-700);color: #fff;font-size: 11px;font-weight: 700;display: flex;align-items: center;justify-content: center;}.user-nav-dropdown {position: absolute;top: calc(100% + 6px);left: 0;background: var(--white);border: 1px solid var(--border);border-radius: var(--r-md);box-shadow: 0 8px 24px rgba(0,0,0,.12);min-width: 160px;z-index: 500;overflow: hidden;display: none;}.user-nav-menu:hover .user-nav-dropdown, .user-nav-menu:focus-within .user-nav-dropdown {display: block;}.user-nav-dropdown a, .user-nav-dropdown button {display: block;width: 100%;text-align: right;padding: var(--sp-2) var(--sp-4);font-size: var(--text-sm);color: var(--ink);background: none;border: none;cursor: pointer;text-decoration: none;transition: background .12s;}.user-nav-dropdown a:hover, .user-nav-dropdown button:hover {background: var(--surface);color: var(--red-700);}.vcard-meta .meta-likes {color: var(--red-700);font-weight: 600;}@media (max-width: 640px) {.auth-card {padding: var(--sp-6) var(--sp-5);}.comment-item {grid-template-columns: 30px 1fr;}.comment-avatar {width: 30px;height: 30px;font-size: 11px;}}