{"id":158,"date":"2026-03-16T21:24:29","date_gmt":"2026-03-16T13:24:29","guid":{"rendered":"http:\/\/10.140.25.199:8998\/?page_id=158"},"modified":"2026-03-19T15:27:19","modified_gmt":"2026-03-19T07:27:19","slug":"scope","status":"publish","type":"page","link":"https:\/\/shijichuanmei.com\/index.php\/scope\/","title":{"rendered":"\u4e1a\u52a1\u8303\u56f4"},"content":{"rendered":"\n<link rel=\"preconnect\" href=\"https:\/\/images.unsplash.com\" crossorigin>\n\n<style>\n\/* =========================================\n   === \u7ec8\u6781\u66b4\u529b\u6e05\u96f6\uff1a\u77ac\u95f4\u9690\u8eab\uff0c\u62d2\u7edd\u95ea\u70c1 ===\n   ========================================= *\/\nhtml, body {\n    margin: 0 !important;\n    padding: 0 !important;\n    background-color: #050505 !important; \n    overflow: hidden !important; \n    width: 100vw !important;\n    height: 100vh !important; \n    \/* \u6838\u5fc3\u9b54\u6cd5 1\uff1a\u77ac\u95f4\u8ba9\u6240\u6709\u539f\u751f\u5143\u7d20\u89c6\u89c9\u9690\u8eab\uff0c\u4f46\u4e0d\u7834\u574f DOM \u6811\u5bfc\u81f4\u95ea\u70c1 *\/\n    visibility: hidden !important; \n}\n\n\/* \u6838\u5fc3\u9b54\u6cd5 2\uff1a\u7ed9\u6211\u4eec\u7684\u5bb9\u5668\u53ca\u5176\u5b50\u5143\u7d20\u53d1\u514d\u6b7b\u91d1\u724c\uff0c\u5f3a\u5236\u663e\u793a *\/\n#shiji-root, #shiji-root *,\n#wpadminbar, #wpadminbar * {\n    visibility: visible !important;\n}\n\n:root {\n    --primary-color: #ffffff;\n    --bezier-smooth: cubic-bezier(0.19, 1, 0.22, 1);\n}\n\n.cine-jailbreak-container {\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n    width: 100vw !important;\n    height: 100vh !important;\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: 999999; \n    display: flex;\n    background-color: #050505; \n}\n\n.cine-jailbreak-container * {\n    box-sizing: border-box;\n}\n\n\/* =========================================\n   === \u7535\u5f71\u7ea7\u4ea4\u9519\u6e10\u663e\u52a8\u753b\u5b9a\u4e49 ===\n   ========================================= *\/\n@keyframes cinematicReveal {\n    0% { \n        opacity: 0; \n        filter: brightness(0); \n    }\n    100% { \n        opacity: 1; \n        filter: brightness(1); \n    }\n}\n\n\/* =========================================\n   === \u5168\u5c4f\u4e92\u52a8\u624b\u98ce\u7434\u6838\u5fc3\u67b6\u6784 ===\n   ========================================= *\/\n.shiji-panel {\n    position: relative;\n    flex: 1; \n    height: 100%;\n    overflow: hidden;\n    cursor: pointer;\n    transition: flex 0.8s var(--bezier-smooth);\n    border-right: 1px solid rgba(255, 255, 255, 0.05);\n    text-decoration: none;\n    display: flex;\n    align-items: flex-end;\n    transform: translateZ(0); \n    will-change: flex-grow, opacity;\n\n    opacity: 0;\n    animation: cinematicReveal 1.2s var(--bezier-smooth) forwards;\n}\n\n.shiji-panel:nth-child(1) { animation-delay: 0.1s; }\n.shiji-panel:nth-child(2) { animation-delay: 0.25s; }\n.shiji-panel:nth-child(3) { animation-delay: 0.4s; }\n.shiji-panel:nth-child(4) { animation-delay: 0.55s; }\n\n.shiji-panel:last-child {\n    border-right: none;\n}\n\n.shiji-panel:hover {\n    flex: 4;\n}\n\n.panel-bg {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    transform: scale(1.02);\n    transition: transform 1.2s ease, filter 0.8s ease;\n    filter: grayscale(80%) brightness(0.25);\n    z-index: 1;\n    will-change: transform, filter;\n    pointer-events: none;\n}\n\n.shiji-panel:hover .panel-bg {\n    transform: scale(1.05);\n    filter: grayscale(0%) brightness(0.6);\n}\n\n.panel-overlay {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    height: 60%;\n    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);\n    z-index: 2;\n    opacity: 0.5;\n    transition: opacity 0.8s ease;\n    pointer-events: none;\n}\n\n.shiji-panel:hover .panel-overlay {\n    opacity: 1;\n}\n\n.panel-title-vertical {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    color: rgba(255, 255, 255, 0.7);\n    font-size: 48px;\n    font-weight: 900;\n    writing-mode: vertical-rl;\n    letter-spacing: 20px;\n    z-index: 3;\n    transition: all 0.5s ease;\n    text-shadow: 0 10px 30px rgba(0,0,0,1);\n    white-space: nowrap;\n    pointer-events: none;\n}\n\n.shiji-panel:hover .panel-title-vertical {\n    opacity: 0;\n    transform: translate(-50%, -60%);\n}\n\n.panel-content {\n    position: relative;\n    z-index: 4;\n    padding: 60px 50px;\n    width: 100%;\n    min-width: 400px;\n    opacity: 0;\n    transform: translateY(40px);\n    transition: all 0.6s var(--bezier-smooth);\n    transition-delay: 0.1s; \n    pointer-events: none;\n}\n\n.shiji-panel:hover .panel-content {\n    opacity: 1;\n    transform: translateY(0);\n    pointer-events: auto;\n}\n\n.panel-content h2 {\n    font-size: 42px;\n    font-weight: 800;\n    color: #fff;\n    margin: 0 0 15px 0;\n    letter-spacing: 2px;\n}\n\n.panel-content p {\n    font-size: 16px;\n    color: rgba(255, 255, 255, 0.8);\n    line-height: 1.8;\n    margin: 0 0 30px 0;\n    max-width: 500px;\n}\n\n.panel-btn {\n    display: inline-flex;\n    align-items: center;\n    padding: 12px 30px;\n    border: 1px solid #fff;\n    color: #fff;\n    font-size: 14px;\n    font-weight: 500;\n    letter-spacing: 2px;\n    transition: all 0.3s ease;\n    backdrop-filter: blur(5px);\n}\n\n.panel-btn span {\n    transition: transform 0.3s ease;\n    margin-left: 10px;\n}\n\n.shiji-panel:hover .panel-btn {\n    background: #fff;\n    color: #000;\n}\n\n.shiji-panel:hover .panel-btn span {\n    transform: translateX(5px);\n}\n\n\/* =========================================\n   === \u79fb\u52a8\u7aef\u9002\u914d (\u7ad6\u5411\u624b\u98ce\u7434) ===\n   ========================================= *\/\n@media (max-width: 768px) {\n    .cine-jailbreak-container { flex-direction: column; }\n    .shiji-panel { width: 100%; border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }\n    .panel-title-vertical { writing-mode: horizontal-tb; letter-spacing: 10px; font-size: 28px; }\n    .panel-content { padding: 30px 20px; min-width: 100%; }\n    .panel-content h2 { font-size: 28px; }\n    .panel-content p { font-size: 14px; margin-bottom: 20px; }\n}\n<\/style>\n\n<div class=\"cine-jailbreak-container\" id=\"shiji-root\">\n\n    <a href=\"\/index.php\/scope\/vision\/\" class=\"shiji-panel\">\n        <img decoding=\"async\" class=\"panel-bg\" src=\"https:\/\/images.unsplash.com\/photo-1485846234645-a62644f84728?q=80&#038;w=2059&#038;auto=format&#038;fit=crop\" alt=\"\u77ed\u5267\u5f71\u89c6\" fetchpriority=\"high\">\n        <div class=\"panel-overlay\"><\/div>\n        <div class=\"panel-title-vertical\">\u77ed\u5267 \/ \u5f71\u89c6<\/div>\n        <div class=\"panel-content\">\n            <h2>\u77ed\u5267 \/ \u5f71\u89c6<\/h2>\n            <p>\u6355\u6349\u65f6\u4ee3\u5fc3\u8df3\uff0c\u6253\u9020\u6781\u81f4\u89c6\u542c\u4f53\u9a8c\uff0c\u6210\u5c31\u6bcf\u4e00\u4e2a\u7206\u6b3e\u68a6\u60f3\u3002<\/p>\n            <div class=\"panel-btn\">\u67e5\u770b\u8be6\u60c5 <span>\u2192<\/span><\/div>\n        <\/div>\n    <\/a>\n\n    <a href=\"\/index.php\/scope\/tvc\/\" class=\"shiji-panel\">\n        <img decoding=\"async\" class=\"panel-bg\" src=\"https:\/\/images.unsplash.com\/photo-1601513445506-2ab0d4fb4229?q=80&#038;w=2070&#038;auto=format&#038;fit=crop\" alt=\"\u5e7f\u544aTVC\" fetchpriority=\"high\">\n        <div class=\"panel-overlay\"><\/div>\n        <div class=\"panel-title-vertical\">\u5e7f\u544a TVC<\/div>\n        <div class=\"panel-content\">\n            <h2>\u5e7f\u544aTVC \/ \u5ba3\u4f20\u7247<\/h2>\n            <p>\u521b\u610f\u4e3a\u738b\uff0c\u6280\u672f\u4e3a\u672c\uff0c\u4e3a\u54c1\u724c\u6ce8\u5165\u65e0\u4e0e\u4f26\u6bd4\u7684\u53d9\u4e8b\u5f20\u529b\u3002<\/p>\n            <div class=\"panel-btn\">\u67e5\u770b\u8be6\u60c5 <span>\u2192<\/span><\/div>\n        <\/div>\n    <\/a>\n\n    <a href=\"\/index.php\/scope\/music\/\" class=\"shiji-panel\">\n        <img decoding=\"async\" class=\"panel-bg\" src=\"https:\/\/images.unsplash.com\/photo-1598488035139-bdbb2231ce04?q=80&#038;w=2070&#038;auto=format&#038;fit=crop\" alt=\"\u97f3\u4e50\u5236\u4f5c\" fetchpriority=\"high\">\n        <div class=\"panel-overlay\"><\/div>\n        <div class=\"panel-title-vertical\">\u97f3\u4e50\u5236\u4f5c<\/div>\n        <div class=\"panel-content\">\n            <h2>\u97f3\u4e50\u5236\u4f5c<\/h2>\n            <p>\u4ece\u7075\u611f\u5230\u53d1\u884c\uff0c\u5168\u65b9\u4f4d\u7248\u6743\u8fd0\u8425\uff0c\u91ca\u653e\u65cb\u5f8b\u7684\u65e0\u9650\u53ef\u80fd\u3002<\/p>\n            <div class=\"panel-btn\">\u67e5\u770b\u8be6\u60c5 <span>\u2192<\/span><\/div>\n        <\/div>\n    <\/a>\n\n    <a href=\"\/index.php\/scope\/stream\/\" class=\"shiji-panel\">\n        <img decoding=\"async\" class=\"panel-bg\" src=\"https:\/\/images.unsplash.com\/photo-1492684223066-81342ee5ff30?q=80&#038;w=2070&#038;auto=format&#038;fit=crop\" alt=\"\u821e\u53f0\u76f4\u64ad\" fetchpriority=\"high\">\n        <div class=\"panel-overlay\"><\/div>\n        <div class=\"panel-title-vertical\">\u821e\u53f0\u76f4\u64ad<\/div>\n        <div class=\"panel-content\">\n            <h2>\u821e\u53f0\u76f4\u64ad \/ \u63a8\u6d41<\/h2>\n            <p>\u591a\u673a\u4f4d\u76f4\u64ad\uff0c\u6beb\u79d2\u7ea7\u4f20\u8f93\uff0c\u6c89\u6d78\u5f0f\u4e92\u52a8\uff0c\u8ba9\u6bcf\u4e00\u4e2a\u7cbe\u5f69\u77ac\u95f4\u5168\u7403\u96f6\u65f6\u5dee\u3002<\/p>\n            <div class=\"panel-btn\">\u67e5\u770b\u8be6\u60c5 <span>\u2192<\/span><\/div>\n        <\/div>\n    <\/a>\n\n<\/div>\n\n<script>\n\/\/ \u6781\u901f\u65e0\u7f1d\u8d8a\u72f1\u903b\u8f91\n(function() {\n    const root = document.getElementById('shiji-root');\n    if (!root) return;\n\n    \/\/ 1. \u540c\u6b65\u6267\u884c\uff1a\u4e0d\u7b49\u9875\u9762\u52a0\u8f7d\u5b8c\uff0c\u53ea\u8981\u89e3\u6790\u5230\u8fd9\u91cc\u7acb\u523b\u63d0\u53d6\u8282\u70b9\u5230 body \u4e0b\n    if (root.parentElement !== document.body) {\n        document.body.appendChild(root);\n    }\n\n    \/\/ 2. \u8282\u70b9\u5b89\u5168\u79fb\u51fa\u540e\uff0c\u518d\u52a8\u6001\u6ce8\u5165\u5f3a\u6740 CSS \u5e72\u6389 WordPress \u539f\u6765\u7684 DOM \u7a7a\u95f4\u3002\n    \/\/ \u653e\u5728\u6b64\u5904\u6ce8\u5165\uff0c\u4fdd\u8bc1\u9690\u85cf\u7236\u7ea7\u5bb9\u5668\u65f6\uff0c\u6211\u4eec\u7684\u8282\u70b9\u5df2\u7ecf\u8df3\u51fa\u53bb\u4e86\u3002\n    const killStyle = document.createElement('style');\n    killStyle.innerHTML = `\n        body > *:not(#shiji-root):not(#wpadminbar):not(script):not(style):not(link) {\n            display: none !important;\n        }\n    `;\n    document.head.appendChild(killStyle);\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>\u77ed\u5267 \/ \u5f71\u89c6 \u77ed\u5267 \/ \u5f71\u89c6 \u6355\u6349\u65f6\u4ee3\u5fc3\u8df3\uff0c\u6253\u9020 &hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_themeisle_gutenberg_block_has_review":false,"footnotes":""},"class_list":["post-158","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/pages\/158","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/comments?post=158"}],"version-history":[{"count":5,"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/pages\/158\/revisions"}],"predecessor-version":[{"id":364,"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/pages\/158\/revisions\/364"}],"wp:attachment":[{"href":"https:\/\/shijichuanmei.com\/index.php\/wp-json\/wp\/v2\/media?parent=158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}