/* 设计哲学：51视频采用赛璐璐电影拼贴主义，以胶片分镜、弹幕带、剪辑时间码、深蓝黑影棚底色、樱桃珊瑚与荧光青强调原创动漫影视传媒社区。
   本外部CSS文件服务于51视频PHP静态站，避免通用紫色渐变、过度居中和单调圆角，强化胶片分镜与动漫片场质感。 */
:root { --ink:#0b1726; --deep:#08111f; --card:#10243a; --paper:#f6efd8; --coral:#ff7468; --cyan:#22d7dd; --muted:#9fb4c7; --gold:#e8c66c; --line:rgba(246,239,216,.18); }
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:radial-gradient(circle at 20% 0%,rgba(34,215,221,.16),transparent 28%),linear-gradient(135deg,#08111f 0%,#0b1726 52%,#111a2b 100%);color:var(--paper);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;line-height:1.75} a{color:inherit;text-decoration:none} img,video{max-width:100%;height:auto;display:block} .site-header{position:sticky;top:0;z-index:20;background:rgba(8,17,31,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)} .brand-row{display:flex;align-items:center;gap:18px;padding:14px clamp(16px,4vw,56px)} .logo-link img{filter:drop-shadow(0 8px 20px rgba(0,0,0,.35))} .brand-kicker{font-size:14px;color:var(--muted);letter-spacing:.08em} .main-nav{display:flex;gap:4px;overflow:auto;padding:0 clamp(16px,4vw,56px) 12px} .main-nav a{padding:10px 15px;border:1px solid transparent;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);background:rgba(246,239,216,.06);white-space:nowrap} .main-nav a.active,.main-nav a:hover{border-color:var(--cyan);color:#fff;background:linear-gradient(90deg,rgba(255,116,104,.25),rgba(34,215,221,.16))} .fake-search{display:flex;align-items:center;gap:10px;padding:12px clamp(16px,4vw,56px);border-top:1px solid rgba(255,255,255,.06)} .fake-search label{font-weight:800;color:var(--coral)} .fake-search input{flex:1;min-width:120px;padding:12px 14px;border:1px solid var(--line);background:rgba(246,239,216,.08);color:var(--paper);outline:none} .fake-search button,.hero-actions a,.expert-grid a,.share-buttons button{border:0;background:var(--coral);color:#1b1010;font-weight:800;padding:12px 16px;box-shadow:0 10px 24px rgba(255,116,104,.22)} output{color:var(--cyan);font-size:13px} main{overflow:hidden} .hero{display:grid;grid-template-columns:minmax(0,.88fr) minmax(320px,1.12fr);gap:30px;align-items:center;padding:48px clamp(16px,5vw,72px) 36px;min-height:640px;position:relative} .storyboard:before,.section:before{content:"";position:absolute;inset:auto 0 0 0;height:12px;background:repeating-linear-gradient(90deg,var(--paper) 0 15px,transparent 15px 28px);opacity:.2} .hero-copy{position:relative;z-index:1} .crumb{color:var(--cyan);font-size:13px;letter-spacing:.12em;text-transform:uppercase} h1,h2,h3,h4,h5,h6{font-family:"STSong","Songti SC","SimSun",serif;line-height:1.18;margin:.2em 0 .55em} h1{font-size:clamp(38px,6vw,76px);letter-spacing:.02em} h2{font-size:clamp(28px,4vw,48px)} h3{font-size:24px} .lead{font-size:18px;color:#d9e7ef} .hero-actions,.hero-stats{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px} .hero-actions a:nth-child(2){background:var(--cyan);color:#06131f} .hero-stats span{border:1px solid var(--line);padding:10px 12px;background:rgba(246,239,216,.06);font-family:ui-monospace,Menlo,monospace} .hero-art{margin:0;position:relative} .hero-art img,.two-column figure img,.contact-zone figure img{border:1px solid var(--line);box-shadow:0 28px 80px rgba(0,0,0,.45);clip-path:polygon(0 3%,96% 0,100% 94%,4% 100%)} figcaption{color:var(--muted);font-size:13px;margin-top:8px} .ticker{display:flex;gap:18px;white-space:nowrap;overflow:hidden;padding:12px 0;border-block:1px solid var(--line);background:rgba(34,215,221,.08)} .ticker span{animation:marquee 18s linear infinite;padding-left:28px;color:var(--cyan)} @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-120px)}} .section{position:relative;padding:64px clamp(16px,5vw,72px)} .section-head{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:end;margin-bottom:28px} .section-head p{color:var(--coral);font-weight:900;letter-spacing:.12em} .module-grid,.expert-grid,.review-grid,.video-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px} .module-grid article,.expert-grid article,.review-grid article,.faq details,.json-box,.visible-json{background:linear-gradient(180deg,rgba(246,239,216,.09),rgba(246,239,216,.045));border:1px solid var(--line);padding:22px;box-shadow:0 16px 40px rgba(0,0,0,.2)} .module-grid article:nth-child(even),.review-grid article:nth-child(even){transform:translateY(22px)} .tags,.share-buttons{display:flex;gap:8px;flex-wrap:wrap} .tags span,.tag-line{display:inline-block;margin:5px 6px 0 0;padding:5px 9px;background:rgba(34,215,221,.13);border:1px solid rgba(34,215,221,.28);color:#bffcff;font-size:13px} .json-box{margin-top:28px;overflow:auto} pre{white-space:pre-wrap;color:#e8f7ff;font-family:ui-monospace,Menlo,monospace;font-size:13px} .video-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .video-card{position:relative;background:#0e2135;border:1px solid var(--line);padding:14px;overflow:hidden;box-shadow:0 18px 42px rgba(0,0,0,.26)} .video-card video{aspect-ratio:16/10;object-fit:cover;background:#08111f;border-bottom:3px solid var(--coral)} .video-card .play{position:absolute;left:50%;top:36%;transform:translate(-50%,-50%) scale(.72);opacity:0;border:2px solid rgba(255,255,255,.7);width:66px;height:66px;border-radius:50%;background:rgba(255,116,104,.92);color:#08111f;font-size:24px;transition:.25s ease} .video-card:hover .play,.video-card:focus-within .play{opacity:1;transform:translate(-50%,-50%) scale(1)} .video-card:hover{border-color:var(--cyan);box-shadow:0 20px 58px rgba(34,215,221,.22)} .desc,small{color:var(--muted)} .two-column,.contact-zone{display:grid;grid-template-columns:.92fr 1.08fr;gap:32px;align-items:center} .check-list{padding-left:20px} .check-list li::marker{color:var(--cyan)} .expert-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .expert-grid a{display:inline-block;margin:6px 6px 0 0;padding:8px 10px;font-size:13px} .logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:10px} .logo-wall span{border:1px dashed var(--line);padding:22px;text-align:center;background:rgba(246,239,216,.07);font-weight:900;color:var(--gold)} .howto{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:0;counter-reset:step;list-style:none;margin-top:24px} .howto li{padding:20px;background:rgba(255,116,104,.1);border-left:4px solid var(--coral)} .faq-list{display:grid;grid-template-columns:1fr 1fr;gap:14px} .faq summary{font-weight:900;cursor:pointer;color:#fff} .qr-pair{display:flex;gap:12px;flex-wrap:wrap} .qr-pair figure{margin:0} .site-footer{padding:44px clamp(16px,5vw,72px);background:#060c15;border-top:1px solid var(--line)} .footer-grid{display:grid;grid-template-columns:1.1fr 1fr .8fr;gap:24px;align-items:start} address{font-style:normal;color:#d7e3ec} .mcp-front{margin-top:22px;padding:14px;border:1px solid rgba(34,215,221,.26);color:var(--cyan);background:rgba(34,215,221,.06)} .sub-hero{padding:54px clamp(16px,5vw,72px);background:linear-gradient(120deg,rgba(255,116,104,.16),rgba(34,215,221,.08));border-bottom:1px solid var(--line)} .small video{aspect-ratio:4/3} @media (max-width:980px){.hero,.two-column,.contact-zone,.footer-grid{grid-template-columns:1fr}.module-grid,.expert-grid,.review-grid{grid-template-columns:1fr 1fr}.section-head{grid-template-columns:1fr}.video-grid,.logo-wall,.howto,.faq-list{grid-template-columns:1fr 1fr}} @media (max-width:640px){.brand-row,.fake-search{align-items:flex-start;flex-direction:column}.hero{padding-top:30px;min-height:auto}.module-grid,.expert-grid,.review-grid,.video-grid,.logo-wall,.howto,.faq-list{grid-template-columns:1fr}h1{font-size:36px}.module-grid article:nth-child(even),.review-grid article:nth-child(even){transform:none}}