.article-detail[data-v-09cb3515]{padding:24px;background:#fff;min-height:calc(100vh - 64px);position:relative;border:5px solid #000;border-radius:10px;padding:4px;margin:4px}.article-detail .article-container[data-v-09cb3515]{max-width:90%;margin:0 auto}.article-detail .article-container .article-header[data-v-09cb3515]{text-align:center;margin-bottom:32px;position:relative;padding:24px 0}.article-detail .article-container .article-header.featured-article[data-v-09cb3515]{background:linear-gradient(135deg,#fff7ed,#fff3e0);border-radius:8px;padding:32px 24px;-webkit-box-shadow:0 4px 12px rgba(255,122,0,.1);box-shadow:0 4px 12px rgba(255,122,0,.1);border:1px solid rgba(255,122,0,.2)}.article-detail .article-container .article-header .featured-badge[data-v-09cb3515]{position:absolute;top:0;right:0;background-color:#f50;color:#fff;padding:6px 12px;border-radius:0 0 0 8px;font-weight:700;font-size:14px;-webkit-box-shadow:0 2px 6px rgba(255,85,0,.3);box-shadow:0 2px 6px rgba(255,85,0,.3);-webkit-transform:translateY(-1px);transform:translateY(-1px)}.article-detail .article-container .article-header .featured-badge .anticon[data-v-09cb3515]{margin-right:4px;-webkit-animation:star-shine-09cb3515 2s infinite alternate;animation:star-shine-09cb3515 2s infinite alternate}.article-detail .article-container .article-header .title[data-v-09cb3515]{font-size:32px;color:#333;margin-bottom:16px;line-height:1.4;word-break:break-word}.featured-article .article-detail .article-container .article-header .title[data-v-09cb3515]{color:#d94a00}.article-detail .article-container .article-header .meta[data-v-09cb3515]{color:#999;font-size:14px}.article-detail .article-container .article-header .meta .meta-item[data-v-09cb3515]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:4px}.article-detail .article-container .article-header .meta .ant-divider[data-v-09cb3515]{margin:0 12px}.article-detail .article-container .article-content[data-v-09cb3515]{font-size:16px;line-height:1.8;color:#333;margin-bottom:48px}.article-detail .article-container .article-content[data-v-09cb3515] img{max-width:100%;height:auto;margin:16px 0;border-radius:4px}.article-detail .article-container .article-content[data-v-09cb3515] p{margin:16px 0}.article-detail .article-container .article-content[data-v-09cb3515] h1,.article-detail .article-container .article-content[data-v-09cb3515] h2,.article-detail .article-container .article-content[data-v-09cb3515] h3,.article-detail .article-container .article-content[data-v-09cb3515] h4,.article-detail .article-container .article-content[data-v-09cb3515] h5,.article-detail .article-container .article-content[data-v-09cb3515] h6{margin:24px 0 16px;line-height:1.4}.article-detail .article-container .article-content[data-v-09cb3515] pre{background:#f6f8fa;padding:16px;border-radius:4px;overflow-x:auto}.article-detail .article-container .article-content[data-v-09cb3515] blockquote{margin:16px 0;padding:0 16px;color:#666;border-left:4px solid #ddd}.article-detail .article-container .practice-section[data-v-09cb3515]{margin:40px 0;text-align:center}.article-detail .article-container .practice-section .ant-divider[data-v-09cb3515]{color:#1890ff;font-weight:700;font-size:18px}.article-detail .article-container .practice-section .ant-divider .anticon[data-v-09cb3515]{margin-right:4px;color:#1890ff}.article-detail .article-container .practice-section .practice-info[data-v-09cb3515]{max-width:600px;margin:0 auto;padding:24px;background:#f6f8fa;border-radius:8px;border:1px dashed #d9d9d9}.article-detail .article-container .practice-section .practice-info .practice-description[data-v-09cb3515]{color:#666;margin-bottom:20px}.article-detail .article-container .practice-section .practice-info .practice-button[data-v-09cb3515]{background:#1890ff;border-color:#1890ff;font-size:16px;height:48px;min-width:180px;border-radius:24px;-webkit-box-shadow:0 4px 12px rgba(24,144,255,.3);box-shadow:0 4px 12px rgba(24,144,255,.3);-webkit-transition:all .3s;transition:all .3s}.article-detail .article-container .practice-section .practice-info .practice-button[data-v-09cb3515]:focus,.article-detail .article-container .practice-section .practice-info .practice-button[data-v-09cb3515]:hover{background:#40a9ff;border-color:#40a9ff;-webkit-transform:translateY(-2px);transform:translateY(-2px);-webkit-box-shadow:0 6px 16px rgba(24,144,255,.4);box-shadow:0 6px 16px rgba(24,144,255,.4)}.article-detail .article-container .comment-section[data-v-09cb3515]{border-top:1px solid #e8e8e8;padding-top:32px}.article-detail .article-container .comment-section .section-title[data-v-09cb3515]{font-size:24px;color:#333;margin-bottom:24px}.article-detail .article-container .comment-section .comment-list[data-v-09cb3515]{margin-bottom:48px}.article-detail .article-container .comment-section .comment-list .comment-author[data-v-09cb3515]{font-size:16px;font-weight:500;color:#333}.article-detail .article-container .comment-section .comment-list .comment-content[data-v-09cb3515]{font-size:14px;color:#333;line-height:1.6;margin:8px 0}.article-detail .article-container .comment-section .comment-list .comment-time[data-v-09cb3515]{font-size:12px;color:#999}.article-detail .article-container .comment-section .comment-list .empty-comments[data-v-09cb3515]{text-align:center;color:#999;padding:32px 0}.article-detail .article-container .comment-section .comment-form .form-title[data-v-09cb3515]{font-size:18px;color:#333;margin-bottom:16px}.article-detail .article-container .comment-section .comment-form .login-prompt[data-v-09cb3515]{text-align:center;padding:32px 0;color:#666;font-size:16px}.article-detail .article-container .comment-section .comment-form .login-prompt .anticon[data-v-09cb3515]{margin-right:8px;color:#1890ff;font-size:18px}.article-detail .article-container .comment-section .comment-form .login-prompt .login-link[data-v-09cb3515]{color:#1890ff;text-decoration:none;font-weight:500}.article-detail .article-container .comment-section .comment-form .login-prompt .login-link[data-v-09cb3515]:hover{color:#40a9ff;text-decoration:underline}.article-detail .article-container .comment-section .comment-form .ant-form-item[data-v-09cb3515]{margin-bottom:16px}.article-detail .article-container .comment-section .comment-form .ant-btn[data-v-09cb3515]{min-width:120px}.article-detail .demo-button[data-v-09cb3515]{position:fixed;right:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:40px;height:160px;background-color:#1890ff;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;border-radius:8px 0 0 8px;-webkit-box-shadow:-2px 0 8px rgba(0,0,0,.15);box-shadow:-2px 0 8px rgba(0,0,0,.15);z-index:999;-webkit-transition:all .3s ease;transition:all .3s ease}.article-detail .demo-button[data-v-09cb3515]:hover{background-color:#40a9ff;width:44px}.article-detail .demo-button.active[data-v-09cb3515]{right:800px;background-color:#ff4d4f}.article-detail .demo-button.active[data-v-09cb3515]:hover{background-color:#ff7875}.article-detail .demo-button .demo-button-text[data-v-09cb3515]{font-size:16px;font-weight:700;line-height:1.5;text-align:center}.article-detail .demo-drawer[data-v-09cb3515]{position:fixed;top:0;right:-800px;width:800px;height:100vh;background-color:#fff;-webkit-box-shadow:-4px 0 16px rgba(0,0,0,.15);box-shadow:-4px 0 16px rgba(0,0,0,.15);-webkit-transition:right .3s ease;transition:right .3s ease;z-index:998}.article-detail .demo-drawer.visible[data-v-09cb3515]{right:0}.article-detail .demo-drawer .demo-drawer-content[data-v-09cb3515]{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.article-detail .demo-drawer .demo-drawer-header[data-v-09cb3515]{padding:16px;border-bottom:1px solid #e8e8e8;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.article-detail .demo-drawer .demo-drawer-header .demo-drawer-title[data-v-09cb3515]{font-size:18px;font-weight:700}.article-detail .demo-drawer .demo-drawer-header .demo-drawer-title .anticon[data-v-09cb3515]{margin-right:8px;color:#1890ff}.article-detail .demo-drawer .demo-drawer-header .close-button[data-v-09cb3515]{font-size:16px;color:#999}.article-detail .demo-drawer .demo-drawer-header .close-button[data-v-09cb3515]:hover{color:#666}.article-detail .demo-drawer .demo-container[data-v-09cb3515]{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:16px;overflow:hidden}.article-detail .demo-drawer .demo-container .scratch-player-wrapper[data-v-09cb3515]{height:100%;width:100%;border-radius:8px;overflow:hidden;background:#f5f5f5}.article-detail .demo-drawer .demo-container .scratch-player-wrapper .scratch-player[data-v-09cb3515]{position:relative;height:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.article-detail .demo-drawer .demo-container .scratch-player-wrapper .scratch-player iframe[data-v-09cb3515]{height:100%;width:100%;border:none;background:#fff}.article-detail .demo-drawer .demo-container .loading-animation[data-v-09cb3515]{position:absolute;top:0;left:0;right:0;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:hsla(0,0%,100%,.9);z-index:10}.article-detail .demo-drawer .demo-container .loading-animation .loading-text[data-v-09cb3515]{font-size:18px;margin-bottom:16px;color:#1890ff}.article-detail .demo-drawer .demo-container .loading-animation .progress-container[data-v-09cb3515]{width:80%;max-width:320px}.article-detail .demo-drawer .demo-container .loading-animation .progress-container .progress-bar[data-v-09cb3515]{height:10px;background:#e8e8e8;border-radius:5px;overflow:hidden}.article-detail .demo-drawer .demo-container .loading-animation .progress-container .progress-bar .progress-inner[data-v-09cb3515]{height:100%;background:#1890ff;-webkit-transition:width .3s ease;transition:width .3s ease}.article-detail .demo-drawer .demo-container .loading-animation .progress-container .progress-text[data-v-09cb3515]{display:block;text-align:center;margin-top:8px;font-size:14px;color:#666}@-webkit-keyframes star-shine-09cb3515{0%{opacity:.7;-webkit-transform:scale(1);transform:scale(1)}to{opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes star-shine-09cb3515{0%{opacity:.7;-webkit-transform:scale(1);transform:scale(1)}to{opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2)}}@media screen and (max-width:768px){.article-detail[data-v-09cb3515]{padding:16px}.article-detail .article-container .article-header[data-v-09cb3515]{margin-bottom:24px}.article-detail .article-container .article-header .title[data-v-09cb3515]{font-size:24px;margin-bottom:12px}.article-detail .article-container .article-header .meta[data-v-09cb3515]{font-size:12px}.article-detail .article-container .article-header.featured-article[data-v-09cb3515]{padding:24px 16px}.article-detail .article-container .article-header .featured-badge[data-v-09cb3515]{padding:4px 8px;font-size:12px}.article-detail .article-container .article-content[data-v-09cb3515]{font-size:14px;margin-bottom:32px}.article-detail .article-container .article-content[data-v-09cb3515] h1{font-size:20px}.article-detail .article-container .article-content[data-v-09cb3515] h2{font-size:18px}.article-detail .article-container .article-content[data-v-09cb3515] h3{font-size:16px}.article-detail .article-container .article-content[data-v-09cb3515] h4,.article-detail .article-container .article-content[data-v-09cb3515] h5,.article-detail .article-container .article-content[data-v-09cb3515] h6{font-size:14px}.article-detail .article-container .practice-section[data-v-09cb3515]{margin:30px 0}.article-detail .article-container .practice-section .ant-divider[data-v-09cb3515]{font-size:16px}.article-detail .article-container .practice-section .practice-info[data-v-09cb3515]{padding:16px}.article-detail .article-container .practice-section .practice-info .practice-description[data-v-09cb3515]{font-size:14px;margin-bottom:16px}.article-detail .article-container .practice-section .practice-info .practice-button[data-v-09cb3515]{font-size:14px;height:40px;min-width:160px}.article-detail .article-container .comment-section[data-v-09cb3515]{padding-top:24px}.article-detail .article-container .comment-section .section-title[data-v-09cb3515]{font-size:20px;margin-bottom:16px}.article-detail .article-container .comment-section .comment-list[data-v-09cb3515]{margin-bottom:32px}.article-detail .article-container .comment-section .comment-list .comment-author[data-v-09cb3515]{font-size:14px}.article-detail .article-container .comment-section .comment-list .comment-content[data-v-09cb3515]{font-size:13px}.article-detail .article-container .comment-section .comment-form .form-title[data-v-09cb3515]{font-size:16px}.article-detail .demo-button[data-v-09cb3515]{width:36px;height:140px}.article-detail .demo-button .demo-button-text[data-v-09cb3515]{font-size:14px}.article-detail .demo-button.active[data-v-09cb3515]{right:85vw}.article-detail .demo-drawer[data-v-09cb3515]{width:85vw}.article-detail .demo-drawer .demo-drawer-header[data-v-09cb3515]{padding:12px}.article-detail .demo-drawer .demo-drawer-header .demo-drawer-title[data-v-09cb3515]{font-size:16px}.article-detail .demo-drawer .demo-container[data-v-09cb3515]{padding:12px}}@media screen and (max-width:576px){.article-detail[data-v-09cb3515]{padding:12px}.article-detail .article-container .article-header[data-v-09cb3515]{margin-bottom:20px}.article-detail .article-container .article-header .title[data-v-09cb3515]{font-size:20px;margin-bottom:8px}.article-detail .article-container .practice-section[data-v-09cb3515]{margin:20px 0}.article-detail .article-container .practice-section .practice-info[data-v-09cb3515]{padding:12px}.article-detail .article-container .comment-section[data-v-09cb3515]{padding-top:20px}.article-detail .article-container .comment-section .section-title[data-v-09cb3515]{font-size:18px}.article-detail .article-container .comment-section .comment-form .form-title[data-v-09cb3515]{font-size:14px}.article-detail .demo-button[data-v-09cb3515]{width:30px;height:120px}.article-detail .demo-button .demo-button-text[data-v-09cb3515]{font-size:12px}}.back-button[data-v-09cb3515]{background:#e9b124;border-bottom:1px solid red;width:90px;border-radius:20px;border-color:#9d0707;font-size:20px;height:35px}.back-button[data-v-09cb3515]:focus,.back-button[data-v-09cb3515]:hover{background:#ffdb33;border-color:#ffdb33}