/*
设计哲学：霓虹新浪潮影像实验主义；深墨蓝暗场、胶片金价值、电光青AI互动、非对称导演监看台布局、胶片齿孔/弹幕胶囊/取景框角标。
本CSS通过深色影院背景、金色价值线、电青互动状态、非对称模块和视频卡悬停播放层强化“jm漫画网页版入门百度贴吧”的视频SEO属性。
*/
:root{
  --ink:#050c1c;
  --ink-2:#08172e;
  --ink-3:#0e2445;
  --gold:#eab252;
  --gold-soft:#ffe1a3;
  --cyan:#15c6d8;
  --cyan-soft:#8ff7ff;
  --text:#f6eedc;
  --muted:#a7bad1;
  --card:rgba(10,26,51,.78);
  --line:rgba(143,247,255,.22);
  --shadow:0 30px 90px rgba(0,0,0,.42);
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;font-family:"Microsoft YaHei","PingFang SC","Hiragino Sans GB","Noto Sans CJK SC",Arial,sans-serif;background:radial-gradient(circle at 82% 0%,rgba(21,198,216,.20),transparent 28%),radial-gradient(circle at 16% 12%,rgba(234,178,82,.14),transparent 26%),linear-gradient(135deg,#040917 0%,#07162d 46%,#050c1c 100%);color:var(--text);line-height:1.78;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 78%);z-index:-1}
a{color:inherit;text-decoration:none}img,video{max-width:100%;display:block}button,input{font:inherit}.site-header{position:sticky;top:0;z-index:30;background:rgba(5,12,28,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(143,247,255,.18)}.site-header.compact{position:relative}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;max-width:1440px;margin:auto;padding:16px 32px}.brand-lockup{display:flex;align-items:center;gap:12px;min-width:280px}.nav-icon{border-radius:12px;box-shadow:0 0 24px rgba(21,198,216,.36)}.site-logo{width:260px;height:auto;object-fit:contain}.main-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.main-nav a{font-size:14px;color:#d6e5f4;padding:9px 12px;border:1px solid transparent;border-radius:999px;transition:.22s ease}.main-nav a:hover,.main-nav .active{color:var(--ink);background:linear-gradient(135deg,var(--gold),var(--cyan));box-shadow:0 10px 28px rgba(21,198,216,.18)}.search-strip{border-top:1px solid rgba(234,178,82,.16);background:linear-gradient(90deg,rgba(234,178,82,.08),rgba(21,198,216,.06));padding:14px 32px}.search-form{max-width:1080px;margin:auto;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}.search-form label{font-weight:800;color:var(--gold-soft);letter-spacing:.02em}.search-form input{width:100%;border:1px solid rgba(143,247,255,.28);background:rgba(4,10,23,.76);color:var(--text);border-radius:999px;padding:13px 18px;outline:none}.search-form input:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(21,198,216,.13)}.search-form button,.btn,.share-buttons button,[data-mcp-demo]{border:0;border-radius:999px;padding:13px 20px;background:linear-gradient(135deg,var(--gold),#ffcc73);color:#081326;font-weight:900;box-shadow:0 12px 30px rgba(234,178,82,.22);transition:.22s ease}.search-form button:hover,.btn:hover,.share-buttons button:hover,[data-mcp-demo]:hover{transform:translateY(-2px);filter:saturate(1.12)}.search-tip{max-width:1080px;margin:8px auto 0;color:var(--muted);font-size:13px}.hero-section{max-width:1440px;margin:0 auto;padding:88px 32px 72px;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);gap:44px;align-items:center}.breadcrumb,.eyebrow{color:var(--cyan-soft);font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.breadcrumb{color:#b9cbe0;text-transform:none}.hero-copy h1,.inner-hero h1{font-size:clamp(38px,5.5vw,74px);line-height:1.05;margin:14px 0 18px;letter-spacing:-.07em;text-shadow:0 0 38px rgba(21,198,216,.18)}.hero-copy h2,.inner-hero h2{font-size:clamp(22px,2.5vw,34px);line-height:1.25;color:var(--gold-soft);margin:0 0 18px}.hero-copy h3,.section-heading h3,.inner-hero h3{color:#e4eefb}.hero-lead,.section-heading p,.ai-copy p,.inner-hero p{color:#c7d5e6;font-size:17px}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}.btn.primary{background:linear-gradient(135deg,var(--cyan),var(--gold));color:#061123}.btn.ghost{background:transparent;color:var(--text);border:1px solid rgba(143,247,255,.35);box-shadow:none}.hero-stats{display:flex;gap:16px;flex-wrap:wrap}.hero-stats span,.metrics{border:1px solid rgba(143,247,255,.18);background:rgba(8,23,46,.72);border-radius:18px;padding:11px 14px;color:#cde1f1}.hero-stats strong{display:block;color:var(--gold-soft);font-size:23px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.video-card{position:relative;overflow:hidden;border:1px solid rgba(143,247,255,.22);border-radius:var(--radius);background:linear-gradient(180deg,rgba(17,38,72,.8),rgba(5,12,28,.92));box-shadow:var(--shadow);isolation:isolate}.video-card:before{content:"";position:absolute;inset:14px;border:1px solid rgba(234,178,82,.42);border-radius:calc(var(--radius) - 10px);pointer-events:none;z-index:2}.video-card img,.video-card video{width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(1.08) contrast(1.04);transition:transform .45s ease,filter .45s ease}.card-grid .video-card img,.card-grid .video-card video{aspect-ratio:4/3}.video-card:hover img,.video-card:hover video{transform:scale(1.045);filter:saturate(1.18) contrast(1.08) brightness(.88)}.play-layer,.floating-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:.24s ease;z-index:4;background:radial-gradient(circle,rgba(21,198,216,.25),rgba(5,12,28,.62))}.play-layer span,.floating-play{width:auto;height:auto;border-radius:999px;background:linear-gradient(135deg,var(--cyan),var(--gold));color:#061123;font-weight:900;padding:16px 22px;box-shadow:0 0 40px rgba(21,198,216,.38)}.video-card:hover .play-layer,.video-card:hover .floating-play,.video-card.is-hovered .play-layer,.video-card.is-hovered .floating-play{opacity:1}.floating-play{inset:auto;left:50%;top:42%;transform:translate(-50%,-50%);border:0;font-size:24px}.video-meta{position:absolute;left:24px;right:24px;bottom:24px;z-index:5;padding:14px 16px;border-radius:18px;background:rgba(5,12,28,.74);border:1px solid rgba(143,247,255,.20);backdrop-filter:blur(12px)}.video-meta strong,.video-meta small{display:block}.video-meta small{color:var(--muted)}.section{max-width:1440px;margin:0 auto;padding:74px 32px}.section-heading{max-width:980px;margin:0 0 34px}.section-heading.narrow{max-width:840px;margin:auto;text-align:left}.section-heading h2{font-size:clamp(30px,4vw,52px);line-height:1.08;margin:0 0 16px;letter-spacing:-.055em}.section-heading h3{font-size:clamp(20px,2vw,28px);line-height:1.32;margin:0 0 12px}.split-section{display:grid;grid-template-columns:.78fr 1.22fr;gap:42px;align-items:start}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.video-card h4,.rail-cards h4,.expert-grid h5,.tool-timeline h4{font-size:21px;line-height:1.28;margin:18px 20px 8px;color:var(--gold-soft)}.video-card p,.rail-cards p,.expert-grid p,.tool-timeline p{margin:0 20px 16px;color:#c5d5e8}.tags{display:flex;gap:8px;flex-wrap:wrap;margin:0 20px 14px}.tags span{font-size:12px;color:#061123;background:var(--cyan-soft);border-radius:999px;padding:4px 9px;font-weight:800}.metrics{margin:0 20px 20px;font-size:13px}.dark-panel{max-width:none;padding-left:max(32px,calc((100vw - 1440px)/2 + 32px));padding-right:max(32px,calc((100vw - 1440px)/2 + 32px));background:linear-gradient(135deg,rgba(234,178,82,.10),rgba(21,198,216,.08));border-top:1px solid rgba(234,178,82,.16);border-bottom:1px solid rgba(143,247,255,.14)}.rail-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:30px}.rail-cards article,.expert-grid article,.tool-timeline article{position:relative;border:1px solid rgba(143,247,255,.20);background:rgba(8,23,46,.72);border-radius:24px;padding:8px 0 4px;box-shadow:0 18px 55px rgba(0,0,0,.22)}.rail-cards article:after,.expert-grid article:after,.tool-timeline article:after{content:"";position:absolute;right:18px;top:18px;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 18px var(--cyan)}.ai-section{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}.json-block{white-space:pre-wrap;overflow:auto;background:#020814;border:1px solid rgba(143,247,255,.22);border-left:4px solid var(--gold);border-radius:18px;color:#dbf9ff;padding:18px;box-shadow:inset 0 0 30px rgba(21,198,216,.05);font-size:14px;line-height:1.65}.community-layout,.contact-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:28px;align-items:center}.community-layout img,.contact-grid img{border-radius:24px;border:1px solid rgba(143,247,255,.22);box-shadow:var(--shadow)}.expert-grid,.review-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.expert-grid a{display:inline-flex;margin:0 0 18px 18px;color:#07162d;background:var(--gold-soft);padding:7px 11px;border-radius:999px;font-weight:800}.partners .logo-wall{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.logo-wall span{padding:20px 12px;text-align:center;border-radius:18px;background:linear-gradient(135deg,rgba(21,198,216,.13),rgba(234,178,82,.13));border:1px solid rgba(143,247,255,.20);font-weight:900;color:#f8ead1}.howto-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:0;counter-reset:item;list-style:none}.howto-list li{border-radius:20px;background:rgba(8,23,46,.72);border:1px solid rgba(143,247,255,.18);padding:18px;color:#cfdef0}.faq-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.faq-list details{border:1px solid rgba(143,247,255,.18);border-radius:20px;background:rgba(8,23,46,.70);padding:18px}.faq-list summary{cursor:pointer;font-weight:900;color:var(--gold-soft)}.review-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.review-grid article{border-radius:22px;background:linear-gradient(180deg,rgba(8,23,46,.82),rgba(5,12,28,.82));border:1px solid rgba(143,247,255,.18);padding:20px}.review-grid p{color:#d6e6f6}.review-grid strong{color:var(--cyan-soft)}.share-buttons{display:flex;gap:14px;flex-wrap:wrap}.feature-list{color:#d6e5f4}.inner-hero{max-width:1440px;margin:0 auto;padding:74px 32px 54px;display:grid;grid-template-columns:1fr .82fr;gap:40px;align-items:center}.tool-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.site-footer{margin-top:50px;border-top:1px solid rgba(143,247,255,.20);background:#030816;padding:36px 32px;display:flex;justify-content:space-between;gap:24px;align-items:center}.compact-footer{margin-top:0}.footer-brand p{color:#c8d8ea;margin:8px 0}.qr-row{display:flex;gap:18px}.qr-row figure{margin:0;text-align:center;color:#cddcec}.qr-row img{border-radius:18px;background:#fff;padding:8px}.is-visible{animation:rise .55s ease both}@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@media (max-width:1080px){.header-inner{align-items:flex-start;flex-direction:column}.main-nav{justify-content:flex-start}.hero-section,.split-section,.ai-section,.community-layout,.contact-grid,.inner-hero{grid-template-columns:1fr}.card-grid,.expert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rail-cards,.partners .logo-wall,.howto-list{grid-template-columns:repeat(2,minmax(0,1fr))}.review-grid{grid-template-columns:1fr 1fr}}@media (max-width:680px){.header-inner,.search-strip,.hero-section,.section,.inner-hero,.site-footer{padding-left:18px;padding-right:18px}.site-logo{width:220px}.search-form{grid-template-columns:1fr}.main-nav a{font-size:13px}.hero-section{padding-top:48px}.card-grid,.expert-grid,.rail-cards,.partners .logo-wall,.howto-list,.faq-list,.review-grid,.tool-timeline{grid-template-columns:1fr}.site-footer{display:block}.qr-row{margin-top:20px}.hero-copy h1,.inner-hero h1{letter-spacing:-.045em}.video-card:before{inset:9px}.section{padding-top:50px;padding-bottom:50px}}
