* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "PingFang TC", "Microsoft JhengHei", sans-serif; background: #121212; color: #eee; }
header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; background: #1e1e1e; border-bottom: 1px solid #333; flex-wrap: wrap; }
.brand { font-size: 20px; font-weight: 700; }
.trial { font-size: 12px; background: #333; border: 1px solid #555; border-radius: 10px; padding: 2px 8px; color: #ffb74d; }
nav { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.nav-user { font-size: 13px; color: #bbb; }
main { max-width: 760px; margin: 0 auto; padding: 16px; }
.view { margin-top: 8px; }
h1 { font-size: 24px; }
h2 { font-size: 20px; margin: 8px 0; }
h3 { font-size: 16px; margin: 0 0 8px; }
.muted { color: #aaa; }
.small { font-size: 12px; }
.msg { min-height: 20px; }
.btn-primary { background: #7c4dff; color: #fff; border: none; border-radius: 8px; padding: 10px 18px; font-size: 16px; cursor: pointer; }
.btn-primary:hover { background: #935dff; }
.btn-ghost { background: transparent; color: #bbb; border: 1px solid #555; border-radius: 8px; padding: 8px 14px; font-size: 14px; cursor: pointer; }
.nav-btn { background: #2a2a2a; color: #eee; border: 1px solid #444; border-radius: 8px; padding: 7px 12px; font-size: 14px; cursor: pointer; }
.link-btn { display: inline-block; text-decoration: none; }
.search-row { display: flex; gap: 8px; }
.search-row input { flex: 1; background: #1e1e1e; color: #eee; border: 1px solid #444; border-radius: 8px; padding: 10px 12px; font-size: 16px; }
.card { background: #1e1e1e; border: 1px solid #333; border-radius: 10px; padding: 12px; margin: 10px 0; }
.result-item { display: block; width: 100%; text-align: left; background: #262626; color: #eee; border: 1px solid #3a3a3a; border-radius: 8px; padding: 9px 12px; margin: 6px 0; font-size: 15px; cursor: pointer; }
.result-item:hover { background: #333; }
.note { background: #1e1e1e; border: 1px solid #444; border-left: 4px solid #ffb74d; border-radius: 8px; padding: 10px 12px; margin: 12px 0; }
.note p { margin: 6px 0; }
.player-box { margin: 12px 0; }
.player-box video { width: 100%; border-radius: 10px; background: #000; max-height: 70vh; }
.badge { font-size: 12px; background: #2e7d32; color: #fff; border-radius: 10px; padding: 2px 8px; margin-left: 6px; }
