@import url('data:text/css,');
:root{--ink:#23352f;--muted:#81908a;--green:#28624b;--border:#e3e9e3;--paper:#f7f9f5}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;font-size:14px}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}header{max-width:1240px;margin:auto;min-height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);padding:0 28px}.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:750;white-space:nowrap}.logo{background:var(--green);color:white;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:21px}.brand-sub{font-size:13px;font-weight:400;color:#7c8881}nav{display:flex;gap:32px;align-items:center;font-size:13px}.admin-link{border:1px solid #cfd9d0;border-radius:7px;padding:10px 16px}main{max-width:1184px;margin:auto;padding:0 28px}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:45px;padding:76px 0 66px;align-items:center}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#64816e;display:flex;gap:8px;align-items:center}.eyebrow>span{width:6px;height:6px;background:#5b8f65;border-radius:100%}h1{font-size:49px;line-height:1.38;letter-spacing:-2px;margin:22px 0 18px;font-weight:700}h1>span{color:#438262}.hero-copy>p{color:#78877d;font-size:14px;line-height:1.9;margin-bottom:29px}.search{display:flex;align-items:center;border:1px solid #d9e2d8;box-shadow:0 5px 15px #203d2910;background:#fff;border-radius:9px;padding:6px;gap:10px}.search>span{font-size:28px;margin-left:10px;color:#839588}.search input{min-width:0;flex:1;border:0;background:none;outline:none;font-size:12px;padding:10px 0}.search button,.primary{background:var(--green);border:0;border-radius:6px;color:white;padding:12px 20px;white-space:nowrap}.search button span{margin-left:14px}.hot{display:flex;align-items:center;gap:12px;font-size:10px;color:#95a097;margin-top:16px}.hot button{font-size:10px;border:0;background:none;color:#75867b;padding:0}.hero-art{height:310px;position:relative;display:grid;place-items:center;isolation:isolate}.orbit{position:absolute;border:1px solid #dfe8d9;border-radius:50%;width:300px;height:300px;z-index:-1}.orbit-two{width:385px;height:225px;transform:rotate(-32deg)}.art-note{position:absolute;top:0;right:20px;color:#a3b19c;font-size:9px;letter-spacing:2px;line-height:2}.art-note strong{font-size:12px;color:#839778;letter-spacing:1px}.video-tile{width:335px;height:210px;background:#e3ebd8;border:7px solid #fff;border-radius:16px;transform:rotate(-7deg);box-shadow:0 25px 40px #34552c13;display:flex;flex-direction:column;justify-content:space-between;padding:16px 17px;background-image:radial-gradient(circle at 75% 65%,#c7d6b6 0,transparent 55%)}.tile-top,.tile-bottom{display:flex;justify-content:space-between;font-size:8px;color:#65805b;letter-spacing:1px}.tile-bottom{font-size:10px}.play{align-self:center;display:grid;place-items:center;width:63px;height:63px;border-radius:50%;background:#fff9;color:#47714f;font-size:22px;box-shadow:0 0 0 12px #fff3;padding-left:4px}.floating-tag{position:absolute;bottom:12px;right:10px;background:#fff;border-radius:9px;padding:15px 22px;transform:rotate(5deg);font-size:12px;box-shadow:0 9px 30px #203d2910}.section-label{font-size:10px;letter-spacing:1.6px;color:#7e8d80;margin:0 0 20px;display:flex;gap:18px;align-items:center}.section-label span{font-size:11px;letter-spacing:0;color:#9aa59a;border-left:1px solid #d9e0d6;padding-left:18px}.categories{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.category-card{text-align:left;border:1px solid var(--border);background:#fff;border-radius:10px;padding:22px;transition:transform .2s,border-color .2s}.category-card:hover,.category-card.selected{transform:translateY(-3px);border-color:#7d9e81}.category-icon{display:grid;place-items:center;width:36px;height:36px;background:var(--tone);color:var(--tone-ink);border-radius:9px;font-size:24px;margin-bottom:16px}.category-card strong{font-size:16px}.category-card p{font-size:11px;color:#8b958c;margin:9px 0 22px}.category-card small{display:flex;justify-content:space-between;font-size:10px;color:#819181}.category-card small span{font-size:17px}.tone-0{--tone:#e8efdf;--tone-ink:#648059}.tone-1{--tone:#e7edf2;--tone-ink:#6b8ca1}.tone-2{--tone:#f0e8dc;--tone-ink:#aa8a60}.tone-3{--tone:#eae5f1;--tone-ink:#9785ad}.catalog{padding-top:57px}.section-heading{display:flex;justify-content:space-between;align-items:center}h2{font-size:25px;letter-spacing:-.5px;margin:12px 0 22px}#count{display:inline-block;font-size:12px;background:#e9eee6;border-radius:5px;padding:3px 7px;margin-left:12px;vertical-align:middle;color:#7a8e75}select{border:1px solid #dce3d9;border-radius:6px;background:transparent;padding:9px 12px;color:#7b887b;font-size:11px}.filters{display:flex;gap:8px;margin:0 0 27px;flex-wrap:wrap}.filters button{background:none;border:0;padding:9px 17px;font-size:12px;border-radius:6px;color:#849080}.filters button.active{color:white;background:var(--green)}#result-note:not(:empty){margin-bottom:20px;color:#7a8a7a}.tutorial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.tutorial-card{padding:0;text-align:left;background:white;border:1px solid var(--border);border-radius:11px;overflow:hidden;transition:transform .2s,box-shadow .2s}.tutorial-card:hover{transform:translateY(-4px);box-shadow:0 15px 25px #33452a0c}.thumbnail{height:166px;background:var(--tone);color:var(--tone-ink);position:relative;overflow:hidden}.thumbnail:after{content:'';position:absolute;width:180px;height:180px;border:1px solid currentColor;opacity:.12;right:22px;top:42px;border-radius:50%;box-shadow:0 0 0 25px #ffffff36,0 0 0 50px #ffffff26}.thumb-index{position:absolute;top:17px;left:20px;font-size:8px;letter-spacing:1.8px}.thumb-art{position:absolute;left:40px;top:37px;font-size:85px;line-height:1;font-weight:300;transform:rotate(-10deg)}.thumb-play{position:absolute;right:35px;top:60px;border:1px solid #fff9;background:#ffffff65;width:43px;height:43px;border-radius:50%;display:grid;place-items:center;padding-left:3px;z-index:1}.video-badge{position:absolute;bottom:13px;right:14px;font-size:9px;background:#ffffff94;border-radius:4px;padding:4px 7px}.card-content{padding:19px 20px}.card-meta{font-size:10px;color:#899887;display:flex;justify-content:space-between}.card-meta span{color:#ad9468}.card-content h3{font-size:15px;line-height:1.65;margin:10px 0 8px}.card-content p{font-size:11px;line-height:1.8;color:#8d978c;min-height:40px;margin:0}.card-bottom{border-top:1px solid #f0f3ed;margin-top:16px;padding-top:13px;display:flex;justify-content:space-between;font-size:10px;color:#94a08f}.card-bottom span:last-child{color:#587550}.bottom-banner{margin:49px 0;background:#eaf0e4;border:1px solid #e1e8da;border-radius:10px;display:flex;align-items:center;padding:26px 30px;gap:23px}.banner-icon{font-size:37px;color:#7e9571}.bottom-banner h3{font-size:15px;margin:0 0 7px}.bottom-banner p{font-size:11px;color:#8b9882;margin:0}.bottom-banner a{margin-left:auto;font-size:12px;color:#56744b;white-space:nowrap}footer{max-width:1184px;margin:auto;padding:25px 28px 35px;border-top:1px solid var(--border);display:flex;align-items:center;gap:25px}footer .brand{font-size:17px}footer>span,footer small{font-size:10px;color:#97a08f}footer small{margin-left:auto}dialog{width:min(820px,94vw);max-height:90vh;border:1px solid var(--border);border-radius:14px;padding:38px;color:var(--ink)}dialog::backdrop{background:#14291fcc;backdrop-filter:blur(5px)}.close{position:absolute;right:15px;top:10px;border:0;background:none;font-size:29px}.article-body{white-space:pre-wrap;line-height:2;font-size:15px;margin-top:25px;overflow-wrap:anywhere}video{width:100%;max-height:430px;background:#17251e;border-radius:8px}.video-placeholder,.empty{padding:40px;background:#f1f5ee;border-radius:8px;color:#89947f;text-align:center}.empty{grid-column:1/-1}.empty button{border:1px solid #c9d5c5;padding:10px;background:white;border-radius:6px}#detail-content>p{color:#84907e;line-height:1.7}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #5e936a;outline-offset:4px}
.admin-shell{max-width:1184px;margin:35px auto;padding:0 28px}.panel{background:#fff;padding:26px;border:1px solid var(--border);border-radius:12px;margin-bottom:20px}.login{max-width:420px;margin:80px auto}.panel label{display:block;font-size:12px;margin:16px 0 6px;color:#758570}.panel input:not([type=checkbox]),.panel textarea,.panel select{width:100%;border:1px solid #d9e2d5;border-radius:6px;padding:11px;background:#fbfcf9;color:var(--ink)}.panel textarea{min-height:145px;resize:vertical}.admin-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:22px}.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:20px}.secondary{border:1px solid #d1ddcb;background:white;padding:9px 14px;border-radius:6px}.admin-item{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--border)}.admin-item>div{flex:1;min-width:0}.admin-item strong{font-size:13px;overflow-wrap:anywhere}.admin-item small{display:block;color:#87957f;margin-top:7px}.admin-item button{border:0;background:#f0f4ed;padding:7px 10px;border-radius:5px;font-size:11px}.danger{color:#ac5d51}.form-actions{display:flex;align-items:center;gap:14px;margin-top:20px}.status{color:#52794b;font-size:12px;line-height:1.8}.status.error{color:#b35142}.checks{display:flex;gap:18px}.checks label{display:flex;gap:6px;align-items:center}progress{width:100%;margin-top:12px;accent-color:var(--green)}[hidden]{display:none!important}
@media(min-width:1400px){.hero{padding-top:90px;padding-bottom:80px}}@media(max-width:900px){.hero{gap:15px}h1{font-size:39px}.hero-art{transform:scale(.82)}.categories{grid-template-columns:repeat(2,1fr)}.tutorial-grid{grid-template-columns:repeat(2,1fr)}footer>span{display:none}.admin-grid{grid-template-columns:1fr}}@media(max-width:600px){header{padding:0 20px;min-height:78px}.brand{font-size:19px;gap:8px}.brand-sub{font-size:11px}nav{gap:12px}nav>a:not(.admin-link){display:none}.admin-link{font-size:11px;padding:8px}main{padding:0 20px}.hero{grid-template-columns:1fr;padding:42px 0}.hero-art{display:none}h1{font-size:41px}.search button{padding:12px}.search input{font-size:11px}.hot{gap:10px}.categories{gap:10px}.category-card{padding:17px 13px}.category-card p{font-size:10px;line-height:1.8;min-height:36px;margin-bottom:10px}.section-label{font-size:8px;gap:10px}.section-label span{font-size:10px;padding-left:10px}.catalog{padding-top:38px}.tutorial-grid{grid-template-columns:1fr;gap:18px}.thumbnail{height:185px}.bottom-banner{padding:20px;gap:12px}.bottom-banner h3{font-size:13px;line-height:1.7}.bottom-banner a{display:none}.banner-icon{font-size:26px}footer{padding:20px;gap:10px}footer small{font-size:8px}dialog{padding:30px 20px}.admin-shell{padding:0 16px}.panel{padding:20px}.admin-item{gap:6px}}

.categories{grid-template-columns:repeat(3,1fr)}.cover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}.video-badge{z-index:3}.article-images{display:grid;gap:16px;margin-top:24px}.article-images img{max-width:100%;height:auto;border-radius:8px}.image-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.image-preview img{width:100%;height:90px;object-fit:cover;border-radius:6px}.image-preview button{width:100%;padding:6px;border:0;background:#edf2e8;border-radius:4px;font-size:11px}@media(max-width:600px){.categories{grid-template-columns:1fr}.category-card{display:grid;grid-template-columns:45px 1fr;gap:7px 10px}.category-icon{grid-row:1/4;margin:0}.category-card p{min-height:0;margin:0}.category-card small{margin-top:4px}}

.purchase-banner{margin-top:28px;background:#244f3d;color:#fff;border:1px solid #35674f;border-radius:12px;padding:27px 30px;display:flex;align-items:center;justify-content:space-between;gap:24px;box-shadow:0 12px 30px #244f3d12}.purchase-label{font-size:10px;font-weight:700;letter-spacing:2px;color:#a8cba3}.purchase-banner h2{font-size:23px;margin:10px 0}.purchase-banner p{font-size:12px;line-height:1.8;color:#c3d6c8;margin:0}.purchase-button{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;border-radius:8px;padding:15px 25px;background:#e3efb4;color:#294531;font-size:14px;font-weight:700;box-shadow:0 5px 12px #15291d15;transition:background .2s,transform .2s}.purchase-button:hover{background:#edf7ce;transform:translateY(-2px)}#purchase-dialog{width:min(480px,92vw);text-align:center;padding:40px 30px 28px;background:#f7f9f5}#purchase-dialog .purchase-label{color:#719367}.purchase-symbol{display:grid;place-items:center;width:68px;height:68px;margin:25px auto 20px;background:#e5eedb;border-radius:20px;font-size:38px;color:#42724b}#purchase-dialog h2{font-size:24px;margin:0 0 15px}#purchase-dialog p{font-size:13px;line-height:1.9;color:#7c8d79;margin-bottom:25px}#purchase-dialog .purchase-button{display:flex;background:#28624b;color:white}.purchase-skip{display:block;margin:15px auto 20px;padding:9px 15px;background:none;border:0;color:#6b8066;font-size:12px}#purchase-dialog small{font-size:10px;color:#98a292}@media(max-width:600px){.purchase-banner{padding:22px;align-items:stretch;flex-direction:column;gap:18px}.purchase-banner h2{font-size:20px}.purchase-banner .purchase-button{width:100%}#purchase-dialog{padding:36px 22px 25px}#purchase-dialog h2{font-size:21px}}

.hero{display:block;padding:32px 0 36px}.hero-copy{max-width:100%}

/* 科技购买入口：柔和呼吸灯 + 环绕流光 + 跑马灯 */
@property --tech-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.purchase-banner,#purchase-dialog{position:relative;isolation:isolate;border:1px solid transparent;background:linear-gradient(125deg,#0e252a,#153d39 65%,#102d35) padding-box,conic-gradient(from var(--tech-angle),#2d6264 0%,#4aeecb 12%,#83dfff 18%,#2d6264 26%,#244849 55%,#5edec7 65%,#2d6264 76%) border-box;animation:tech-border 6s linear infinite;box-shadow:0 0 22px #42d8c51a,inset 0 0 26px #52d4be08}
.purchase-banner{flex-wrap:wrap;padding-bottom:54px;overflow:hidden}
.purchase-banner:before,#purchase-dialog:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background-image:linear-gradient(#78e9dd08 1px,transparent 1px),linear-gradient(90deg,#78e9dd08 1px,transparent 1px);background-size:24px 24px}
.purchase-banner .purchase-label,#purchase-dialog .purchase-label{color:#84e5d1;display:inline-flex;align-items:center;gap:8px}
.tech-dot{display:inline-block;width:6px;height:6px;background:#86ffe0;border-radius:50%;box-shadow:0 0 10px #75ffdb;animation:tech-pulse 2.6s ease-in-out infinite}
.purchase-banner .purchase-button,#purchase-dialog .purchase-button{position:relative;overflow:hidden;background:linear-gradient(110deg,#a9f4d5,#7edbdc);color:#123c36;border:1px solid #b5ffe6;box-shadow:0 0 20px #79ebd32b}
.purchase-button:after{content:'';position:absolute;inset:-80% -100%;pointer-events:none;background:linear-gradient(110deg,transparent 42%,#ffffff55 50%,transparent 58%);transform:translateX(-60%);animation:tech-shine 5s ease-in-out infinite}
.tech-marquee{position:absolute;left:0;right:100px;bottom:0;height:32px;overflow:hidden;border-top:1px solid #79decd22;background:#061a2340;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.tech-track{display:flex;width:max-content;animation:tech-scroll 28s linear infinite}
.tech-track span{flex-shrink:0;white-space:nowrap;font-size:10px;letter-spacing:2px;color:#8abbb6;line-height:32px}
.motion-toggle{position:absolute;right:14px;bottom:7px;background:#193f42;color:#abdcd0;border:1px solid #4a7772;border-radius:4px;padding:3px 8px;font-size:10px;cursor:pointer}
#purchase-dialog{color:#edfef6;padding-bottom:58px}#purchase-dialog .close{color:#b7e5d6}#purchase-dialog p{color:#b4cdc5}#purchase-dialog small{color:#88b6ab}#purchase-dialog .purchase-skip{color:#b7e5d6}#purchase-dialog .purchase-symbol{background:#71e5d116;color:#8cf2da;border:1px solid #69d2be50;box-shadow:0 0 25px #6cf2d518}#purchase-dialog .motion-toggle{bottom:17px;right:50%;transform:translateX(50%)}
@keyframes tech-border{to{--tech-angle:360deg}}
@keyframes tech-pulse{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes tech-shine{0%,45%{transform:translateX(-60%)}85%,100%{transform:translateX(60%)}}
@keyframes tech-scroll{to{transform:translateX(-50%)}}
.motion-paused .purchase-banner,.motion-paused #purchase-dialog,.motion-paused .tech-dot,.motion-paused .tech-track,.motion-paused .purchase-button:after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.purchase-banner,#purchase-dialog,.tech-dot,.tech-track,.purchase-button:after{animation:none}.purchase-button:after{display:none}.motion-toggle{display:none}}
@media(max-width:600px){.purchase-banner{padding-bottom:52px}.tech-track span{font-size:9px}}

/* 明确可见的双光带，不依赖自定义属性插值 */
.purchase-banner,#purchase-dialog{border-color:#398b88;box-shadow:0 0 24px #32e9d52b,inset 0 0 22px #36dfdb12}
.purchase-flow{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:3;border-radius:inherit}
.purchase-flow rect{width:calc(100% - 6px);height:calc(100% - 6px);fill:none;stroke-width:3;vector-effect:non-scaling-stroke}
.flow-base{stroke:#45b9b24d}
.purchase-flow .flow-cyan{stroke:#99fff4;stroke-dasharray:18 82;stroke-linecap:round;filter:drop-shadow(0 0 4px #00ffe1) drop-shadow(0 0 8px #00e4ff);animation:purchase-lap 3.8s linear infinite}
.purchase-flow .flow-purple{stroke:#d6b2ff;stroke-dasharray:14 86;stroke-linecap:round;filter:drop-shadow(0 0 4px #c582ff) drop-shadow(0 0 8px #9e58ff);stroke-dashoffset:-50;animation:purchase-lap-purple 3.8s linear infinite}
@keyframes purchase-lap{from{stroke-dashoffset:0}to{stroke-dashoffset:-100}}
@keyframes purchase-lap-purple{from{stroke-dashoffset:-50}to{stroke-dashoffset:-150}}
.motion-paused .purchase-flow rect{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.purchase-flow .flow-cyan,.purchase-flow .flow-purple{animation:none}}

/* 动效控制始终可见，包括系统减少动态效果模式 */
.purchase-banner .motion-toggle{display:block;z-index:5;right:14px;bottom:6px;padding:5px 10px;font-size:11px;color:#e6fff7;border-color:#7bdac8;background:#20534f}
#purchase-dialog .motion-toggle{display:block;z-index:5;color:#e6fff7;border-color:#7bdac8}
body.motion-enabled .purchase-flow .flow-cyan{animation:purchase-lap 3.8s linear infinite}
body.motion-enabled .purchase-flow .flow-purple{animation:purchase-lap-purple 3.8s linear infinite}
body.motion-enabled .tech-track{animation:tech-scroll 28s linear infinite}
body.motion-enabled .tech-dot{animation:tech-pulse 2.6s ease-in-out infinite}
body.motion-enabled .purchase-button:after{display:block;animation:tech-shine 5s ease-in-out infinite}

/* 购买入口默认持续流光，无手动开关 */
.tech-marquee{right:0}.motion-toggle{display:none!important}

.purchase-banner .cbot-title{color:#b8fff1;font-weight:800;letter-spacing:1px;background:linear-gradient(100deg,#f0fffc 0%,#81f4df 45%,#9fcaff 80%,#d1bcff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 22px #65e8d42b}

/* 教程列表文案在上，图片封面在下 */
.tutorial-card{display:flex;flex-direction:column}.tutorial-card .card-content{order:0;width:100%}.tutorial-card .thumbnail{order:1;width:100%;flex-shrink:0;margin-top:auto}

/* 明亮、高对比度视觉升级 */
:root{--ink:#172b46;--muted:#526580;--green:#2563eb;--border:#dce5f1;--paper:#f5f8fd}
body{color:var(--ink);font-size:15px;background:radial-gradient(ellipse at 85% 0%,#e5efff 0,transparent 45%),#f5f8fd;font-family:"Microsoft YaHei","PingFang SC","Segoe UI",sans-serif}
header{min-height:86px;border-color:#dce5f1}.logo{background:#2563eb;box-shadow:0 5px 12px #2563eb25}.brand{color:#172b46}.brand-sub{color:#5e708a;font-size:14px}nav{font-size:14px;font-weight:600}.admin-link{background:#fff;border-color:#cad8ec;color:#315276}
.hero{padding:28px 0 36px}.search{padding:8px;border-color:#c8d8ef;border-radius:12px;box-shadow:0 6px 22px #2d62b00a}.search input{font-size:15px;color:#172b46;padding:13px 0}.search input::placeholder{color:#697c97}.search>span{color:#4b6e9f}.search button,.primary{background:#2563eb;font-weight:600;font-size:14px}.hot{font-size:12px;color:#657994;gap:16px}.hot button{font-size:12px;color:#365f97}
.section-label{color:#4b6993;font-size:11px;font-weight:600}.section-label span{color:#536a88;font-size:13px}.eyebrow{color:#526e96;font-size:11px}h2{font-size:28px;color:#192f4d}.section-heading select{color:#385575;background:white;border-color:#cbd9ec;font-size:13px}
.categories{gap:20px}.category-card{padding:25px;border-radius:14px;border-color:#d7e3f2;box-shadow:0 4px 16px #315c9606}.category-card:hover,.category-card.selected{border-color:#6598eb;box-shadow:0 10px 25px #2563eb12}.category-card strong{font-size:19px;color:#1e3758}.category-card p{font-size:13px;color:#526982;line-height:1.8}.category-card small{font-size:12px;color:#41658d}.category-icon{height:43px;width:43px;margin-bottom:19px}.tone-0{--tone:#e4efff;--tone-ink:#3a73c7}.tone-1{--tone:#e2f5f5;--tone-ink:#228891}.tone-2{--tone:#eee8ff;--tone-ink:#8261c6}.tone-3{--tone:#fff0df;--tone-ink:#a77032}
.catalog{padding-top:42px}.filters button{font-size:14px;color:#49617e;padding:10px 19px}.filters button.active{background:#2563eb;box-shadow:0 4px 10px #2563eb21}#count{background:#e5edfb;color:#3969ad;font-size:13px}#result-note{color:#486483}
.tutorial-card{border-color:#dce5f1;border-radius:14px;box-shadow:0 3px 12px #274e8306}.card-content{padding:23px 24px}.card-meta{font-size:12px;color:#3e6b9d}.card-meta span{color:#9b681e;background:#fff4d9;padding:2px 6px;border-radius:4px}.card-content h3{font-size:18px;font-weight:700;color:#172e4c;line-height:1.7;margin:12px 0 9px}.card-content p{font-size:14px;color:#526680;line-height:1.85;min-height:52px}.card-bottom{border-color:#e7edf6;font-size:12px;color:#657b96;padding-top:15px}.card-bottom span:last-child{color:#2563eb;font-weight:600}.video-badge{font-size:11px;color:#30547e;background:#ffffffeb}.thumb-index{font-size:10px}.thumbnail{height:175px}.tutorial-card:hover{box-shadow:0 12px 30px #2563eb14;border-color:#a4c0eb}
.bottom-banner{background:#eaf2ff;border-color:#d6e4f9}.bottom-banner h3{font-size:17px;color:#254e80}.bottom-banner p{font-size:13px;color:#567398}.bottom-banner a{font-size:14px;color:#2563eb}.banner-icon{color:#5488ce}footer>span,footer small{color:#647892;font-size:12px}footer .brand-sub{font-size:12px}
dialog{background:#fff;color:#172b46;border-color:#cdddf2}#detail-content>p{font-size:15px;color:#526680}.article-body{font-size:16px;line-height:2;color:#263d59}.video-placeholder,.empty{background:#f0f5fc;color:#58708f}.panel{border-color:#d6e2f2;box-shadow:0 5px 18px #1b497607}.panel label{font-size:14px;color:#365475}.panel input:not([type=checkbox]),.panel textarea,.panel select{background:#fbfdff;border-color:#c8d7eb;color:#213b5c;font-size:14px}.status{color:#3b648e;font-size:13px}.admin-item strong{font-size:15px}.admin-item small{font-size:12px;color:#5b7190}.admin-item button{font-size:12px;background:#edf3fc}.secondary{color:#31557e;border-color:#c9d9ee}.danger{color:#b34436}
/* 通透的浅蓝科技购买区，流光继续沿边框运行 */
.purchase-banner,#purchase-dialog{background:linear-gradient(115deg,#edf6ff 0%,#e8f5ff 48%,#efedff 100%);border-color:#9bc1ed;box-shadow:0 8px 28px #3978ca12,inset 0 0 22px #ffffff80;color:#153c72}
.purchase-banner:before,#purchase-dialog:before{background-image:linear-gradient(#5c92d20a 1px,transparent 1px),linear-gradient(90deg,#5c92d20a 1px,transparent 1px)}
.purchase-banner .purchase-label,#purchase-dialog .purchase-label{color:#376fae;font-size:11px}.purchase-banner .cbot-title{font-size:30px;font-weight:800;letter-spacing:.5px;color:#1b53ac;background:none;-webkit-text-fill-color:currentColor;text-shadow:none}.purchase-banner p{font-size:14px;line-height:1.9;color:#44668f}.purchase-banner .purchase-button,#purchase-dialog .purchase-button{background:linear-gradient(110deg,#2464eb,#4b65e7);color:#fff;border-color:#6792ff;box-shadow:0 6px 18px #2563eb29;font-size:15px;padding:16px 27px}.purchase-banner .purchase-button:hover,#purchase-dialog .purchase-button:hover{background:#245ada}.tech-dot{background:#2688ff;box-shadow:0 0 8px #56a5ff}.tech-marquee{background:#d9e9fd80;border-color:#bed4ef}.tech-track span{font-size:11px;color:#4c71a1}.flow-base{stroke:#7caae970}.purchase-flow .flow-cyan{stroke:#208eff;filter:drop-shadow(0 0 3px #40b8ff) drop-shadow(0 0 6px #69bfff)}.purchase-flow .flow-purple{stroke:#9060ed;filter:drop-shadow(0 0 3px #b087ff) drop-shadow(0 0 6px #c8aaff)}
#purchase-dialog h2{color:#204d8a}#purchase-dialog p{color:#4d698f;font-size:14px}#purchase-dialog small{color:#617d9f;font-size:11px}#purchase-dialog .close,#purchase-dialog .purchase-skip{color:#385e8c}#purchase-dialog .purchase-symbol{background:#dfeeff;color:#3879cc;border-color:#adcef3;box-shadow:none}
@media(max-width:600px){.brand-sub{font-size:11px}.purchase-banner .cbot-title{font-size:26px}.purchase-banner p{font-size:13px}.search input{font-size:13px}.search button{font-size:13px}.hot,.hot button{font-size:11px}.categories{gap:13px}.category-card{padding:20px}.category-card strong{font-size:18px}.category-card p{font-size:13px}.category-card small{font-size:12px}.category-icon{margin:0}.card-content h3{font-size:18px}.card-content p{font-size:14px}.section-label{font-size:9px}.section-label span{font-size:12px}footer small{font-size:10px}.bottom-banner h3{font-size:15px}}

.title-settings{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel input[type=color]{height:44px;padding:5px;cursor:pointer}.title-preview{padding:18px;background:#f3f7fc;border:1px dashed #bdd0eb;border-radius:8px;font-weight:700;overflow-wrap:anywhere}.card-content h3,#detail-content h2{overflow-wrap:anywhere}

.text-preview{padding:16px;background:#f3f7fc;border:1px dashed #bdd0eb;border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:300px;overflow:auto;line-height:1.8}.card-content p,#detail-content>p{overflow-wrap:anywhere}

.article-image-button{position:relative;display:block;width:100%;padding:0;border:0;background:#edf3fb;border-radius:8px;cursor:zoom-in;overflow:hidden}.article-image-button img{display:block;max-width:100%;height:auto;margin:auto}.article-image-button span{position:absolute;bottom:12px;right:12px;padding:7px 12px;background:#153655de;color:white;font-size:12px;border-radius:6px}
#image-viewer{width:96vw;height:94vh;max-width:none;max-height:94vh;padding:0;border-radius:12px;background:#eaf0f8;overflow:hidden}#image-viewer::backdrop{background:#06101ee8}.image-toolbar{height:64px;display:flex;align-items:center;gap:12px;padding:12px 18px;background:white;border-bottom:1px solid #d3deec}.image-toolbar>span{font-weight:700;margin-right:auto}.image-toolbar button,.image-toolbar a{border:1px solid #c9d9ee;border-radius:6px;background:#f4f8ff;padding:8px 12px;white-space:nowrap;color:#244f83;font-size:13px}.image-toolbar output{font-size:12px;min-width:38px;text-align:center}.image-stage{height:calc(100% - 64px);overflow:auto;padding:16px;overscroll-behavior:contain}.image-stage img{display:block;margin:0 auto;max-width:none;height:auto;cursor:zoom-in}@media(max-width:600px){.image-toolbar{gap:5px;padding:8px;height:60px}.image-toolbar>span{display:none}.image-toolbar button,.image-toolbar a{font-size:11px;padding:8px}.image-stage{height:calc(100% - 60px)}}

.hero{padding-bottom:10px}.catalog{padding-top:20px}

.catalog .section-heading{justify-content:flex-end;margin-bottom:12px}

.filters{gap:14px}.filters button{font-size:20px;font-weight:700;padding:14px 26px;border:1px solid #d4e1f3;background:#fff;color:#294f80;border-radius:10px}.filters button.active{color:white;border-color:#2563eb;background:#2563eb}@media(max-width:600px){.filters{gap:8px}.filters button{font-size:17px;padding:12px 15px}}

.tutorial-card{cursor:pointer}.tutorial-link{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0;padding:10px;background:#edf4ff;border:1px solid #d4e3f8;border-radius:7px}.tutorial-link a{flex:1;min-width:0;overflow-wrap:anywhere;color:#2563eb;font-size:14px;text-decoration:underline}.tutorial-link button{border:0;border-radius:5px;padding:7px 12px;background:#2563eb;color:white;font-size:13px}.copy-status{font-size:12px;color:#386480}.copy-status:empty{display:none}

.link-number{font-size:12px;color:#6281a8}.link-summary{justify-content:space-between;background:#e4eefe}.link-summary strong{font-size:13px;color:#325c8c}.tutorial-links{max-height:360px;overflow:auto;margin:12px 0}.tutorial-links .tutorial-link{margin:6px 0}

.card-content p{min-height:0}.article-images:empty{display:none}.tutorial-card .thumbnail:after{display:none}.tutorial-card .thumbnail .cover-image{position:static;height:auto;object-fit:contain;display:block}.tutorial-card .thumbnail{height:auto;background:transparent}.card-content h3:last-child{margin-bottom:0}

.catalog{padding-bottom:40px}

.link-label{font-size:14px;color:#24466f;overflow-wrap:anywhere;max-width:100%}

.free-content{display:block}.free-content-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.9;color:#27486d}.free-content-actions{display:flex;gap:10px;align-items:center;margin-top:12px}.free-content-text a{font-size:inherit}

.named-links{padding:0;background:transparent;border:0}.named-link{margin:8px 0}.named-link .link-label{flex-basis:100%;white-space:pre-wrap}.invite-value{flex:1;font-size:16px;color:#244f83}.named-links>.free-content-text{padding:8px 0}

.qa-card{background:white;border:1px solid #d6e3f4;border-radius:14px;padding:24px;grid-column:1/-1}.qa-question,.qa-answer{display:flex;gap:14px;align-items:flex-start}.qa-question h3{margin:0;font-size:18px;line-height:1.7;overflow-wrap:anywhere;min-width:0}.qa-badge{display:grid;place-items:center;flex-shrink:0;width:30px;height:30px;border-radius:8px;background:#e7efff;color:#2563eb;font-weight:700}.qa-answer{margin-top:18px;padding-top:18px;border-top:1px solid #edf1f7}.qa-answer .qa-badge{background:#e4f4ed;color:#27825d}.qa-answer>div{white-space:pre-wrap;overflow-wrap:anywhere;min-width:0;line-height:1.9;font-size:16px;color:#263d59}

.qa-collection{grid-column:1/-1;display:grid;gap:14px}.qa-collection-title{margin:0 0 4px}.qa-edit-row{padding:16px;border:1px solid #d5e1f1;border-radius:10px;margin-bottom:14px;background:#f8fbff}.panel .qa-edit-row textarea{min-height:75px}.qa-edit-row button{margin-top:10px}