/* 四虎 extended external style layer */
.btn-ink { color:var(--cream); background:var(--ink); }
.btn-outline-ink { color:var(--ink); background:transparent; border-color:var(--ink); }
.btn-ink:hover { color:var(--ink); background:var(--cream); }
.btn-outline-ink:hover { color:var(--cream); background:var(--ink); }
.video-library { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.video-library-item { position:relative; min-height:250px; padding:20px; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; border-radius:16px; color:var(--cream); background:#14262b; }
.video-library-item::before { content:""; position:absolute; inset:0; opacity:.5; background:radial-gradient(circle at 100% 0,var(--blue),transparent 32%),linear-gradient(145deg,transparent 30%,rgba(0,0,0,.7)); }
.video-library-item > * { position:relative; }
.video-library-item h3 { margin:0; font-size:18px; line-height:1.25; }
.video-library-item p { margin:8px 0 0; color:#c0d0d1; font-size:12px; }
.video-library-item a { margin-top:15px; color:var(--acid); font-size:11px; font-weight:800; }
.video-library-item a::after { content:" ↗"; }
.video-library-item:hover { transform:translateY(-4px); transition:transform .2s var(--ease); }
.video-attribute { display:flex; flex-wrap:wrap; gap:7px; margin:11px 0 0; }
.video-attribute span { padding:3px 7px; border:1px solid rgba(255,255,255,.22); border-radius:99px; color:#c5d4d4; font-size:10px; }
.author-line { display:flex; align-items:center; gap:10px; margin-top:18px; color:#8da2a3; font-size:11px; }
.author-line::before { content:"四虎"; width:20px; height:20px; display:grid; place-items:center; border-radius:50%; color:var(--ink); background:var(--acid); font-family:Impact,"Arial Narrow"; font-size:12px; }
.video-legal { padding:12px 14px; margin-top:19px; border:1px solid #c6d4d4; border-radius:8px; color:#5b7074; background:#f6f7f1; font-size:11px; }
.video-legal strong { color:#263f44; }
.content-date { display:inline-flex; align-items:center; gap:7px; padding:5px 8px; border-radius:4px; color:#526a6e; background:#e5eceb; font-size:10px; }
.content-date::before { content:"●"; color:var(--orange); font-size:8px; }
.safe-note { position:relative; padding:21px 22px 21px 49px; border-radius:12px; color:#dae5e5; background:#14262b; font-size:13px; }
.safe-note::before { content:"!"; position:absolute; top:20px; left:18px; width:20px; height:20px; display:grid; place-items:center; border:1px solid var(--acid); border-radius:50%; color:var(--acid); font-size:12px; font-weight:900; }
.safe-note a { color:var(--acid); text-decoration:underline; text-underline-offset:3px; }
.tag-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; }
.tag-grid a { padding:10px 8px; text-align:center; border:1px solid #c9d6d6; border-radius:7px; color:#4a6267; background:#fafaf6; font-size:11px; transition:.18s var(--ease); }
.tag-grid a:hover { color:var(--ink); border-color:var(--acid); background:var(--acid); }
.mini-quote { padding:18px; border-radius:9px; color:#b8c9c9; background:#172a30; font-size:13px; }
.mini-quote cite { display:block; margin-top:11px; color:var(--acid); font-size:10px; font-style:normal; }
.score-row { display:flex; align-items:center; gap:11px; padding:10px 0; border-bottom:1px solid rgba(207,224,224,.15); }
.score-row:last-child { border-bottom:0; }
.score-row b { width:78px; color:#d9e6e6; font-size:12px; }
.score-row span { flex:1; height:6px; overflow:hidden; border-radius:99px; background:#294047; }
.score-row span::before { content:""; display:block; width:var(--value,80%); height:100%; border-radius:99px; background:var(--acid); }
.score-row em { color:#96a9aa; font-size:10px; font-style:normal; }
.floating-video-icon { position:absolute; top:16px; left:16px; width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.32); border-radius:50%; color:var(--acid); background:rgba(7,16,21,.36); backdrop-filter:blur(8px); font-size:12px; }
.floating-video-icon::after { content:""; width:0; height:0; margin-left:2px; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:8px solid currentColor; }
.archive-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:21px; }
.archive-head h2 { margin:0; font-family:Impact,"Arial Narrow"; font-size:43px; font-weight:400; line-height:1; }
.archive-head p { max-width:480px; margin:0; color:#62757a; font-size:13px; }
.frame-line { width:100%; height:1px; background:linear-gradient(90deg,var(--orange) 0 22%,#cbd6d6 22% 100%); }
.pin-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.pin { padding:14px; border-radius:8px; background:#e4eceb; }
.pin b { display:block; color:#284247; font-size:13px; }
.pin span { color:#63777b; font-size:11px; }
.sticky-cta { position:fixed; right:22px; bottom:21px; z-index:10; display:inline-flex; align-items:center; gap:8px; padding:10px 13px; border:1px solid rgba(231,255,102,.7); border-radius:99px; color:var(--acid); background:rgba(7,16,21,.9); box-shadow:0 12px 30px rgba(0,0,0,.22); font-size:11px; font-weight:800; }
.sticky-cta::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--acid); }
.table-scroll { overflow-x:auto; border:1px solid #cbd6d6; }
.spec-table { width:100%; min-width:600px; border-collapse:collapse; color:#425b60; font-size:12px; }
.spec-table th { padding:12px; text-align:left; color:var(--ink); background:#e7efee; font-size:11px; }
.spec-table td { padding:12px; border-top:1px solid #d5dfde; }
.spec-table tr:hover td { background:#f6f7f2; }
.tiny-label { color:#778c8f; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.glow-line { width:44px; height:2px; margin:15px 0; background:linear-gradient(90deg,var(--acid),var(--blue)); box-shadow:0 0 12px rgba(89,215,255,.54); }
.perspective-panel { transform:perspective(900px) rotateY(-2deg); transform-origin:left; }
.card-edge { box-shadow:inset 0 0 0 1px rgba(231,255,102,.12),0 20px 50px rgba(0,0,0,.18); }
.human-check { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:22px; }
.human-check div { padding:13px; border-radius:8px; background:#ecf1ef; }
.human-check b { display:block; color:#ff5c35; font-size:11px; }
.human-check span { display:block; margin-top:4px; color:#596f73; font-size:11px; }
.video-index-tab { display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid #c4d1d1; border-radius:99px; color:#50676c; background:#f7f8f3; font-size:11px; }
.video-index-tab:hover { color:var(--ink); border-color:var(--orange); background:#ff5c35; }
.video-index-tab::before { content:"▶"; color:var(--orange); font-size:8px; }
.video-index-tab:hover::before { color:var(--ink); }
.focus-outline:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.loading-sheen { overflow:hidden; position:relative; }
.loading-sheen::after { content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent); transition:transform .5s var(--ease); }
.loading-sheen:hover::after { transform:translateX(100%); }
@media (max-width:900px) { .video-library { grid-template-columns:repeat(2,minmax(0,1fr)); } .tag-grid { grid-template-columns:repeat(3,1fr); } .human-check { grid-template-columns:1fr; } }
@media (max-width:580px) { .video-library { grid-template-columns:1fr; } .tag-grid { grid-template-columns:repeat(2,1fr); } .archive-head { align-items:flex-start; flex-direction:column; } .sticky-cta { right:12px; bottom:12px; } .perspective-panel { transform:none; } }

.video-row-spaced { margin-top:18px; }
