{"id":2680,"date":"2023-12-11T09:38:32","date_gmt":"2023-12-11T01:38:32","guid":{"rendered":"https:\/\/bookmark.tw\/?p=2680"},"modified":"2026-05-20T09:13:28","modified_gmt":"2026-05-20T01:13:28","slug":"keep-secrets","status":"publish","type":"post","link":"https:\/\/xinliceyan.org\/zh\/keep-secrets","title":{"rendered":"\u5c0f\u6d4b\u9a8c\uff1a\u4f60\u4f1a\u4e25\u5b88\u79d8\u5bc6\u5417"},"content":{"rendered":"\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap\/5.3.3\/css\/bootstrap.min.css\">\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bootstrap-icons\/1.11.3\/font\/bootstrap-icons.min.css\">\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/Chart.js\/4.4.1\/chart.umd.min.js\"><\/script>\n\n<section id=\"quizapp9\" data-quiz-app=\"quiz9\">\n  <section id=\"quizintro9\" data-page=\"intro9\">\n    <div class=\"card border-0 shadow-sm\" data-quiz-card>\n      <div class=\"card-body\" data-intro-layout>\n        <div data-icon-cloud aria-hidden=\"true\">\n          <span data-float-icon=\"secret\"><i class=\"bi bi-incognito\"><\/i><\/span>\n          <span data-float-icon=\"lock\"><i class=\"bi bi-lock\"><\/i><\/span>\n          <span data-float-icon=\"boat\"><i class=\"bi bi-compass\"><\/i><\/span>\n        <\/div>\n\n        <header data-intro-header>\n          <p data-kicker>\u5fc3\u7406\u6295\u5c04\u5c0f\u6e2c\u9a57<\/p>\n          <h2 id=\"quizintrotitle9\" tabindex=\"-1\">\u4f60\u6703\u56b4\u5b88\u79d8\u5bc6\u55ce\uff1f<\/h2>\n          <p data-subtitle>\n            \u6709\u4e9b\u4eba\u5929\u751f\u597d\u5947\uff0c\u807d\u5230\u79d8\u5bc6\u5c31\u5fcd\u4e0d\u4f4f\u60f3\u77e5\u9053\u66f4\u591a\uff1b\u4e5f\u6709\u4eba\u4e00\u65e6\u7b54\u61c9\u4fdd\u5bc6\uff0c\u5c31\u80fd\u628a\u754c\u7dda\u5b88\u5f97\u5f88\u7a69\u3002\n            \u9019\u500b\u5e06\u8239\u96b1\u85cf\u6e2c\u9a57\uff0c\u5c07\u5e36\u4f60\u770b\u770b\u81ea\u5df1\u9762\u5c0d\u79d8\u5bc6\u6642\u7684\u53e3\u98a8\u8207\u514b\u5236\u529b\u3002\n          <\/p>\n        <\/header>\n\n        <div data-intro-points>\n          <article data-mini-card>\n            <i class=\"bi bi-pencil\" aria-hidden=\"true\"><\/i>\n            <h3>\u756b\u7dda\u96b1\u85cf\u5e06\u8239<\/h3>\n            <p>\u5728\u5716\u4e0a\u756b\u76f4\u7dda\uff0c\u770b\u770b\u4f60\u9700\u8981\u5e7e\u689d\u7dda\u624d\u80fd\u8b93\u4eba\u770b\u4e0d\u51fa\u5e06\u8239\u3002<\/p>\n          <\/article>\n          <article data-mini-card>\n            <i class=\"bi bi-shield-check\" aria-hidden=\"true\"><\/i>\n            <h3>\u89e3\u6790\u4fdd\u5bc6\u50be\u5411<\/h3>\n            <p>\u4f9d\u7167\u7dda\u689d\u6578\u91cf\uff0c\u5206\u6790\u4f60\u7684\u50b3\u64ad\u617e\u671b\u3001\u754c\u7dda\u611f\u8207\u5b88\u5bc6\u7a69\u5b9a\u5ea6\u3002<\/p>\n          <\/article>\n        <\/div>\n\n        <div data-center-actions>\n          <button type=\"button\" class=\"btn\" data-action=\"start-quiz\">\n            <span>\u958b\u59cb\u6e2c\u9a57<\/span>\n            <i class=\"bi bi-arrow-right-short\" aria-hidden=\"true\"><\/i>\n          <\/button>\n        <\/div>\n\n        <p data-intro-note>\n          \u672c\u6e2c\u9a57\u9069\u5408\u7528\u65bc\u81ea\u6211\u89ba\u5bdf\u8207\u8da3\u5473\u63a2\u7d22\uff0c\u4e0d\u4f5c\u70ba\u5fc3\u7406\u8a3a\u65b7\u4f9d\u64da\u3002\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"quizmain9\" data-page=\"quiz9\" hidden>\n    <div class=\"card border-0 shadow-sm\" data-quiz-card>\n      <div class=\"card-body\">\n        <header data-quiz-header>\n          <p data-kicker>\u5e06\u8239\u96b1\u85cf\u6311\u6230<\/p>\n          <h2 id=\"quizmaintitle9\" tabindex=\"-1\">\u4f60\u9700\u8981\u5e7e\u689d\u76f4\u7dda\uff0c\u624d\u80fd\u628a\u5e06\u8239\u85cf\u8d77\u4f86\uff1f<\/h2>\n          <p data-quiz-helper>\n            \u5728\u5716\u7247\u4e0a\u9ede\u4e00\u4e0b\u8a2d\u5b9a\u8d77\u9ede\uff0c\u518d\u9ede\u4e00\u4e0b\u8a2d\u5b9a\u7d42\u9ede\uff0c\u6bcf\u5169\u6b21\u9ede\u64ca\u6703\u5f62\u6210\u4e00\u689d\u76f4\u7dda\u3002\n            \u76f4\u7dda\u4e0d\u53ef\u8d85\u51fa\u908a\u6846\uff0c\u4e5f\u4e0d\u53ef\u4e2d\u9014\u5f4e\u66f2\u3002\n          <\/p>\n        <\/header>\n\n        <p data-live-status aria-live=\"polite\" tabindex=\"-1\">\n          \u5c1a\u672a\u756b\u7dda\u3002\u8acb\u5728\u5e06\u8239\u5716\u4e2d\u9ede\u4e00\u4e0b\u4f5c\u70ba\u7b2c\u4e00\u689d\u7dda\u7684\u8d77\u9ede\u3002\n        <\/p>\n\n        <figure data-drawing-card>\n          <div data-drawing-stage>\n            <img loading=\"lazy\" decoding=\"async\"\n              src=\"https:\/\/xinliceyan.org\/wp-content\/uploads\/2023\/12\/058boat.png\"\n              alt=\"\u7dda\u689d\u52fe\u756b\u7684\u5e06\u8239\u5716\uff0c\u6e2c\u9a57\u8005\u53ef\u5728\u5716\u4e0a\u756b\u76f4\u7dda\u96b1\u85cf\u5e06\u8239\"\n              width=\"366\"\n              height=\"568\"\n              data-boat-image\n            >\n            <canvas data-drawing-canvas aria-label=\"\u5e06\u8239\u756b\u7dda\u5340\"><\/canvas>\n          <\/div>\n          <figcaption>\n            \u8acb\u7528\u76f4\u7dda\u6253\u6563\u5e06\u8239\u7684\u8f2a\u5ed3\u3002\u82e5\u4e0d\u65b9\u4fbf\u5728\u5716\u4e0a\u9ede\u64ca\uff0c\u4e5f\u53ef\u4ee5\u7528\u4e0b\u65b9\u6309\u9215\u76f4\u63a5\u8abf\u6574\u7dda\u6578\u3002\n          <\/figcaption>\n        <\/figure>\n\n        <div data-counter-card>\n          <span data-counter-label>\u76ee\u524d\u7dda\u6578<\/span>\n          <strong><output data-line-count>0<\/output><span>\u689d<\/span><\/strong>\n        <\/div>\n\n        <div data-tool-grid>\n          <button type=\"button\" class=\"btn btn-outline-secondary\" data-action=\"minus-line\">\n            <i class=\"bi bi-dash-lg\" aria-hidden=\"true\"><\/i>\n            <span>\u6e1b\u5c11\u7dda\u6578<\/span>\n          <\/button>\n          <button type=\"button\" class=\"btn btn-outline-secondary\" data-action=\"add-line\">\n            <i class=\"bi bi-plus-lg\" aria-hidden=\"true\"><\/i>\n            <span>\u589e\u52a0\u7dda\u6578<\/span>\n          <\/button>\n          <button type=\"button\" class=\"btn btn-outline-secondary\" data-action=\"undo-line\">\n            <i class=\"bi bi-arrow-counterclockwise\" aria-hidden=\"true\"><\/i>\n            <span>\u64a4\u92b7\u4e00\u689d<\/span>\n          <\/button>\n          <button type=\"button\" class=\"btn btn-outline-secondary\" data-action=\"clear-lines\">\n            <i class=\"bi bi-eraser\" aria-hidden=\"true\"><\/i>\n            <span>\u6e05\u9664\u5168\u90e8<\/span>\n          <\/button>\n        <\/div>\n\n        <div data-center-actions>\n          <button type=\"button\" class=\"btn\" data-action=\"show-result\">\n            <span>\u5b8c\u6210\u6e2c\u9a57\uff0c\u770b\u89e3\u6790<\/span>\n            <i class=\"bi bi-arrow-right-short\" aria-hidden=\"true\"><\/i>\n          <\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"quizresult9\" data-page=\"result9\" hidden>\n    <div class=\"card border-0 shadow-sm\" data-quiz-card>\n      <div class=\"card-body\">\n        <header data-result-header>\n          <p data-kicker>\u4f60\u7684\u6e2c\u9a57\u7d50\u679c<\/p>\n          <h2 id=\"quizresulttitle9\" tabindex=\"-1\">\u4fdd\u5bc6\u50be\u5411\u5206\u6790<\/h2>\n          <p data-score-status aria-live=\"polite\">\n            \u4f60\u4f7f\u7528\u4e86 <output data-result-line-count>0<\/output> \u689d\u76f4\u7dda\u4f86\u96b1\u85cf\u5e06\u8239\u3002\n          <\/p>\n        <\/header>\n\n        <div data-score-hero>\n          <div>\n            <span data-score-label>\u5b88\u5bc6\u7a69\u5b9a\u5ea6<\/span>\n            <strong><output data-secret-score>0<\/output><span>%<\/span><\/strong>\n          <\/div>\n          <p data-score-detail>\n            \u7dda\u689d\u6578\u8d8a\u591a\uff0c\u4ee3\u8868\u4f60\u8d8a\u9858\u610f\u82b1\u5fc3\u529b\u906e\u63a9\u539f\u672c\u7684\u8f2a\u5ed3\uff0c\u4e5f\u8c61\u5fb5\u8f03\u5f37\u7684\u4fdd\u5bc6\u610f\u8b58\u8207\u754c\u7dda\u7dad\u8b77\u3002\n          <\/p>\n        <\/div>\n\n        <div data-result-panels>\n          <article data-result-panel=\"low\" hidden>\n            <h3><i class=\"bi bi-megaphone\" aria-hidden=\"true\"><\/i> 3 \u689d\u7dda\u4ee5\u4e0b\uff1a\u5bb9\u6613\u6d29\u5bc6\u578b<\/h3>\n            <p>\u4f60\u53ef\u80fd\u4e0d\u592a\u64c5\u9577\u4fdd\u5b88\u79d8\u5bc6\u3002\u5373\u4f7f\u7b54\u61c9\u5225\u4eba\u300c\u6211\u7d55\u4e0d\u6703\u8aaa\u51fa\u53bb\u300d\uff0c\u4e5f\u53ef\u80fd\u5728\u4e0d\u7d93\u610f\u7684\u9592\u804a\u4e2d\u8aaa\u6f0f\u5634\u3002<\/p>\n            <p>\u8d8a\u662f\u91cd\u5927\u7684\u79d8\u5bc6\uff0c\u8d8a\u53ef\u80fd\u5f15\u767c\u4f60\u7684\u5206\u4eab\u885d\u52d5\u3002\u5efa\u8b70\u5728\u807d\u5230\u654f\u611f\u5167\u5bb9\u6642\uff0c\u5148\u63d0\u9192\u81ea\u5df1\uff1a\u9019\u4e0d\u662f\u6211\u7684\u6545\u4e8b\uff0c\u4e5f\u4e0d\u8a72\u7531\u6211\u50b3\u51fa\u53bb\u3002<\/p>\n          <\/article>\n\n          <article data-result-panel=\"mid-low\" hidden>\n            <h3><i class=\"bi bi-chat-dots\" aria-hidden=\"true\"><\/i> 4\uff5e8 \u689d\u7dda\uff1a\u8a71\u984c\u5206\u4eab\u578b<\/h3>\n            <p>\u4f60\u5c0d\u6709\u8da3\u7684\u8a71\u984c\u5f88\u6709\u53cd\u61c9\uff0c\u9047\u5230\u80fd\u5f15\u8d77\u5927\u5bb6\u7b11\u8072\u6216\u597d\u5947\u7684\u5167\u5bb9\u6642\uff0c\u5bb9\u6613\u60f3\u62ff\u51fa\u4f86\u5206\u4eab\u3002<\/p>\n            <p>\u91cd\u5927\u79d8\u5bc6\u4f60\u901a\u5e38\u80fd\u5b88\u4f4f\uff0c\u4f46\u82e5\u5167\u5bb9\u5e36\u6709\u516b\u5366\u6027\u3001\u6232\u5287\u6027\u6216\u7b11\u9ede\uff0c\u5c31\u8981\u7279\u5225\u7559\u610f\u81ea\u5df1\u7684\u8868\u9054\u885d\u52d5\u3002<\/p>\n          <\/article>\n\n          <article data-result-panel=\"mid-high\" hidden>\n            <h3><i class=\"bi bi-shield\" aria-hidden=\"true\"><\/i> 9\uff5e13 \u689d\u7dda\uff1a\u57fa\u672c\u5b88\u5bc6\u578b<\/h3>\n            <p>\u4f60\u5927\u81f4\u5c6c\u65bc\u80fd\u4fdd\u5b88\u79d8\u5bc6\u7684\u4eba\uff0c\u4e5f\u6703\u8a8d\u70ba\u66ff\u5225\u4eba\u5b88\u4f4f\u96b1\u79c1\u662f\u4e00\u7a2e\u8cac\u4efb\u3002<\/p>\n            <p>\u4e0d\u904e\uff0c\u7576\u5225\u4eba\u7528\u8a98\u5c0e\u5f0f\u554f\u984c\u8ffd\u554f\u6642\uff0c\u4f60\u53ef\u80fd\u6703\u5728\u653e\u9b06\u6216\u4e0d\u8a2d\u9632\u7684\u72c0\u614b\u4e0b\u8aaa\u51fa\u592a\u591a\u3002\u5efa\u8b70\u9762\u5c0d\u8ffd\u554f\u6642\uff0c\u7528\u300c\u9019\u4ef6\u4e8b\u6211\u4e0d\u65b9\u4fbf\u8aaa\u300d\u4f5c\u70ba\u56fa\u5b9a\u56de\u61c9\u3002<\/p>\n          <\/article>\n\n          <article data-result-panel=\"high\" hidden>\n            <h3><i class=\"bi bi-lock-fill\" aria-hidden=\"true\"><\/i> 14 \u689d\u7dda\u4ee5\u4e0a\uff1a\u53e3\u98a8\u5f88\u7dca\u578b<\/h3>\n            <p>\u4f60\u7684\u4fdd\u5bc6\u610f\u8b58\u76f8\u7576\u5f37\u3002\u4e00\u65e6\u6c7a\u5b9a\u628a\u67d0\u4ef6\u4e8b\u7576\u4f5c\u79d8\u5bc6\uff0c\u4f60\u901a\u5e38\u80fd\u7a69\u7a69\u5b88\u4f4f\uff0c\u4e0d\u8f15\u6613\u900f\u9732\u98a8\u8072\u3002<\/p>\n            <p>\u4f60\u7684\u754c\u7dda\u611f\u662f\u512a\u52e2\uff0c\u4f46\u4e5f\u8981\u7559\u610f\uff1a\u82e5\u904e\u5ea6\u7dca\u7e43\u6216\u4ec0\u9ebc\u90fd\u4e0d\u8aaa\uff0c\u53ef\u80fd\u6703\u5f71\u97ff\u8207\u89aa\u8fd1\u7684\u4eba\u4e4b\u9593\u7684\u4fe1\u4efb\u611f\u3002\u4fdd\u5bc6\u8207\u771f\u8aa0\uff0c\u53ef\u4ee5\u540c\u6642\u5b58\u5728\u3002<\/p>\n          <\/article>\n        <\/div>\n\n        <div data-distribution-card>\n          <h3>\u4f60\u5728\u7dda\u6578\u5206\u5e03\u4e2d\u7684\u4f4d\u7f6e<\/h3>\n          <div data-score-scale aria-label=\"\u4fdd\u5bc6\u50be\u5411\u5206\u5e03\">\n            <span data-scale-segment=\"low\">0\u20133<\/span>\n            <span data-scale-segment=\"mid-low\">4\u20138<\/span>\n            <span data-scale-segment=\"mid-high\">9\u201313<\/span>\n            <span data-scale-segment=\"high\">14+<\/span>\n            <span data-score-marker aria-hidden=\"true\">\n              <span data-marker-dot><\/span>\n              <span data-marker-label>\u4f60\uff1a<output data-marker-line-count>0<\/output>\u689d<\/span>\n            <\/span>\n          <\/div>\n          <div data-scale-legend>\n            <span><i data-legend-dot=\"low\"><\/i>\u5bb9\u6613\u6d29\u5bc6 0\u20133<\/span>\n            <span><i data-legend-dot=\"mid-low\"><\/i>\u8a71\u984c\u5206\u4eab 4\u20138<\/span>\n            <span><i data-legend-dot=\"mid-high\"><\/i>\u57fa\u672c\u5b88\u5bc6 9\u201313<\/span>\n            <span><i data-legend-dot=\"high\"><\/i>\u53e3\u98a8\u5f88\u7dca 14+<\/span>\n          <\/div>\n        <\/div>\n\n        <div data-chart-section>\n          <h3>\u591a\u7dad\u5ea6\u4fdd\u5bc6\u8f2a\u5ed3<\/h3>\n          <p data-chart-intro>\n            \u4e0b\u65b9\u5716\u8868\u4f9d\u4f60\u7684\u7dda\u689d\u6578\u4f30\u7b97\u5b88\u5bc6\u7a69\u5b9a\u5ea6\u3001\u754c\u7dda\u611f\u3001\u8868\u9054\u514b\u5236\u8207\u4fe1\u4efb\u4fdd\u8b77\u50be\u5411\u3002\n          <\/p>\n          <p data-chart-status aria-live=\"polite\" hidden>\u5716\u8868\u6574\u7406\u4e2d\u2026<\/p>\n          <div data-chart-wrap>\n            <canvas data-chart-canvas role=\"img\" aria-label=\"\u4fdd\u5bc6\u50be\u5411\u591a\u7dad\u5ea6\u5206\u6578\u5716\u8868\"><\/canvas>\n          <\/div>\n        <\/div>\n\n        <div data-dimension-grid>\n          <article data-dimension-card>\n            <h3>\u5b88\u5bc6\u7a69\u5b9a\u5ea6 <output data-dimension-value=\"stability\">0%<\/output><\/h3>\n            <p data-dimension-text=\"stability\">\u4f60\u5728\u9762\u5c0d\u79d8\u5bc6\u6642\uff0c\u80fd\u5426\u7a69\u5b9a\u7dad\u6301\u539f\u672c\u7684\u627f\u8afe\u3002<\/p>\n          <\/article>\n          <article data-dimension-card>\n            <h3>\u754c\u7dda\u611f <output data-dimension-value=\"boundary\">0%<\/output><\/h3>\n            <p data-dimension-text=\"boundary\">\u4f60\u662f\u5426\u80fd\u5206\u6e05\u695a\u54ea\u4e9b\u5167\u5bb9\u4e0d\u8a72\u88ab\u81ea\u5df1\u8f49\u8ff0\u6216\u5e72\u9810\u3002<\/p>\n          <\/article>\n          <article data-dimension-card>\n            <h3>\u8868\u9054\u514b\u5236 <output data-dimension-value=\"restraint\">0%<\/output><\/h3>\n            <p data-dimension-text=\"restraint\">\u4f60\u5728\u8208\u596e\u3001\u597d\u5947\u6216\u60f3\u88fd\u9020\u8a71\u984c\u6642\uff0c\u80fd\u5426\u5148\u505c\u4e00\u4e0b\u3002<\/p>\n          <\/article>\n          <article data-dimension-card>\n            <h3>\u4fe1\u4efb\u4fdd\u8b77 <output data-dimension-value=\"trust\">0%<\/output><\/h3>\n            <p data-dimension-text=\"trust\">\u4f60\u662f\u5426\u6703\u628a\u5225\u4eba\u4ea4\u4ed8\u7684\u96b1\u79c1\uff0c\u8996\u70ba\u4e00\u6bb5\u9700\u8981\u88ab\u4fdd\u8b77\u7684\u95dc\u4fc2\u3002<\/p>\n          <\/article>\n        <\/div>\n\n        <div data-center-actions>\n          <button type=\"button\" class=\"btn\" data-action=\"restart-quiz\">\n            <i class=\"bi bi-arrow-counterclockwise\" aria-hidden=\"true\"><\/i>\n            <span>\u91cd\u65b0\u6e2c\u9a57<\/span>\n          <\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n<\/section>\n\n<style>\n  #quizapp9,\n  #quizapp9 * {\n    box-sizing: border-box;\n  }\n\n  #quizapp9 {\n    --quiz-ink: #2f2a25;\n    --quiz-muted: #665e55;\n    --quiz-soft: #faf7f1;\n    --quiz-card: #fffdf8;\n    --quiz-sage: #8fa184;\n    --quiz-sage-dark: #53664e;\n    --quiz-clay: #d5ad8d;\n    --quiz-cream: #f4e8cf;\n    --quiz-taupe: #8f765d;\n    --quiz-brown: #4f3d30;\n    --quiz-line: rgba(91, 70, 54, 0.16);\n    --quiz-shadow: 0 18px 45px rgba(79, 61, 48, 0.12);\n    --quiz-radius: 24px;\n    --quiz-score-position: 0%;\n    width: min(100%, 750px);\n    max-width: 750px;\n    margin: 0 auto;\n    color: var(--quiz-ink);\n    font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Noto Sans TC\", \"Microsoft JhengHei\", Arial, sans-serif;\n    font-size: 16px;\n    line-height: 1.65;\n  }\n\n  #quizapp9 [hidden] {\n    display: none !important;\n  }\n\n  #quizapp9 [data-quiz-card] {\n    overflow: hidden;\n    border-radius: var(--quiz-radius);\n    background:\n      radial-gradient(circle at 12% 0%, rgba(213, 173, 141, 0.22), transparent 32%),\n      radial-gradient(circle at 95% 8%, rgba(143, 161, 132, 0.2), transparent 30%),\n      var(--quiz-card);\n    box-shadow: var(--quiz-shadow);\n    contain: layout paint;\n  }\n\n  #quizapp9 .card-body {\n    padding: 24px;\n  }\n\n  #quizapp9 [data-intro-layout],\n  #quizapp9 [data-result-header],\n  #quizapp9 [data-quiz-header] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n\n  #quizapp9 [data-intro-layout] {\n    position: relative;\n    justify-content: center;\n    min-height: 520px;\n    gap: 20px;\n  }\n\n  #quizapp9 [data-icon-cloud] {\n    position: relative;\n    width: 184px;\n    height: 112px;\n    margin-bottom: 4px;\n  }\n\n  #quizapp9 [data-float-icon] {\n    position: absolute;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 999px;\n    background: rgba(255, 253, 248, 0.9);\n    color: var(--quiz-sage-dark);\n    box-shadow: 0 10px 28px rgba(79, 61, 48, 0.14);\n    border: 1px solid rgba(91, 70, 54, 0.08);\n  }\n\n  #quizapp9 [data-float-icon=\"secret\"] {\n    width: 72px;\n    height: 72px;\n    left: 56px;\n    top: 10px;\n    font-size: 34px;\n    background: linear-gradient(135deg, #f7efe2, #e3edd9);\n  }\n\n  #quizapp9 [data-float-icon=\"lock\"] {\n    width: 48px;\n    height: 48px;\n    left: 12px;\n    top: 44px;\n    font-size: 22px;\n  }\n\n  #quizapp9 [data-float-icon=\"boat\"] {\n    width: 56px;\n    height: 56px;\n    right: 12px;\n    top: 38px;\n    font-size: 26px;\n  }\n\n  #quizapp9 [data-kicker] {\n    margin: 0 0 8px;\n    color: var(--quiz-sage-dark);\n    font-size: 14px;\n    font-weight: 700;\n    letter-spacing: 0.08em;\n  }\n\n  #quizapp9 h2 {\n    margin: 0;\n    color: var(--quiz-brown);\n    font-size: clamp(28px, 7vw, 40px);\n    line-height: 1.18;\n    font-weight: 800;\n    letter-spacing: -0.02em;\n  }\n\n  #quizapp9 h3 {\n    margin: 0;\n    color: var(--quiz-brown);\n    font-size: 20px;\n    line-height: 1.35;\n    font-weight: 750;\n  }\n\n  #quizapp9 [data-subtitle],\n  #quizapp9 [data-quiz-helper],\n  #quizapp9 [data-chart-intro],\n  #quizapp9 [data-score-detail],\n  #quizapp9 [data-intro-note],\n  #quizapp9 [data-live-status],\n  #quizapp9 [data-result-panels] p,\n  #quizapp9 [data-dimension-card] p,\n  #quizapp9 figcaption {\n    color: var(--quiz-muted);\n  }\n\n  #quizapp9 [data-subtitle] {\n    max-width: 610px;\n    margin: 16px auto 0;\n    font-size: 17px;\n  }\n\n  #quizapp9 [data-intro-points] {\n    display: grid;\n    grid-template-columns: 1fr;\n    gap: 12px;\n    width: 100%;\n    margin-top: 4px;\n  }\n\n  #quizapp9 [data-mini-card] {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n    align-items: center;\n    padding: 16px;\n    border: 1px solid var(--quiz-line);\n    border-radius: 20px;\n    background: rgba(255, 253, 248, 0.74);\n  }\n\n  #quizapp9 [data-mini-card] i {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 44px;\n    height: 44px;\n    border-radius: 999px;\n    color: var(--quiz-sage-dark);\n    background: #edf3e7;\n    font-size: 22px;\n  }\n\n  #quizapp9 [data-mini-card] h3 {\n    font-size: 18px;\n  }\n\n  #quizapp9 [data-mini-card] p {\n    margin: 0;\n    color: var(--quiz-muted);\n    text-align: center;\n  }\n\n  #quizapp9 [data-center-actions] {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-top: 18px;\n  }\n\n  #quizapp9 [data-action] {\n    min-width: 44px;\n    min-height: 44px;\n    border-radius: 999px;\n    font-weight: 750;\n    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;\n  }\n\n  #quizapp9 [data-action=\"start-quiz\"],\n  #quizapp9 [data-action=\"show-result\"],\n  #quizapp9 [data-action=\"restart-quiz\"] {\n    display: inline-flex;\n    gap: 8px;\n    align-items: center;\n    justify-content: center;\n    padding: 13px 28px;\n    border: 0;\n    color: #fffdf8;\n    background: linear-gradient(135deg, #7d936f, #b99473);\n    box-shadow: 0 12px 26px rgba(83, 102, 78, 0.25);\n  }\n\n  #quizapp9 [data-intro-note] {\n    max-width: 560px;\n    margin: 0;\n    font-size: 14px;\n  }\n\n  #quizapp9 [data-quiz-header] {\n    gap: 8px;\n    margin-bottom: 18px;\n  }\n\n  #quizapp9 [data-quiz-helper] {\n    max-width: 620px;\n    margin: 0;\n  }\n\n  #quizapp9 [data-live-status] {\n    margin: 0 0 14px;\n    padding: 12px 14px;\n    border-radius: 16px;\n    background: rgba(237, 243, 231, 0.8);\n    text-align: center;\n    font-weight: 650;\n  }\n\n  #quizapp9 [data-drawing-card] {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n    margin: 0;\n    align-items: center;\n  }\n\n  #quizapp9 [data-drawing-stage] {\n    position: relative;\n    width: min(100%, 366px);\n    overflow: hidden;\n    border-radius: 18px;\n    border: 1px solid rgba(79, 61, 48, 0.22);\n    background: #fff;\n    box-shadow: 0 12px 28px rgba(79, 61, 48, 0.11);\n  }\n\n  #quizapp9 [data-boat-image] {\n    display: block;\n    width: 100%;\n    height: auto;\n    user-select: none;\n    -webkit-user-drag: none;\n  }\n\n  #quizapp9 [data-drawing-canvas] {\n    position: absolute;\n    inset: 0;\n    display: block;\n    width: 100%;\n    height: 100%;\n    cursor: crosshair;\n    touch-action: manipulation;\n  }\n\n  #quizapp9 figcaption {\n    max-width: 560px;\n    font-size: 14px;\n    text-align: center;\n  }\n\n  #quizapp9 [data-counter-card] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 4px;\n    margin: 18px auto 0;\n    padding: 16px;\n    max-width: 280px;\n    border-radius: 22px;\n    background: linear-gradient(135deg, rgba(237, 243, 231, 0.96), rgba(250, 240, 224, 0.96));\n    text-align: center;\n  }\n\n  #quizapp9 [data-counter-label] {\n    color: var(--quiz-sage-dark);\n    font-weight: 750;\n  }\n\n  #quizapp9 [data-counter-card] strong {\n    display: inline-flex;\n    align-items: baseline;\n    gap: 4px;\n    color: var(--quiz-brown);\n    font-size: 38px;\n    line-height: 1;\n  }\n\n  #quizapp9 [data-counter-card] strong span {\n    font-size: 17px;\n  }\n\n  #quizapp9 [data-tool-grid] {\n    display: grid;\n    grid-template-columns: 1fr;\n    gap: 10px;\n    margin-top: 16px;\n  }\n\n  #quizapp9 [data-tool-grid] button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    color: var(--quiz-brown);\n    border-color: rgba(79, 61, 48, 0.24);\n    background: rgba(255, 253, 248, 0.78);\n  }\n\n  #quizapp9 [data-result-header] {\n    gap: 8px;\n  }\n\n  #quizapp9 [data-score-status] {\n    margin: 0;\n    color: var(--quiz-muted);\n  }\n\n  #quizapp9 [data-score-hero] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 12px;\n    margin: 22px 0;\n    padding: 20px;\n    border-radius: 22px;\n    background: linear-gradient(135deg, rgba(237, 243, 231, 0.96), rgba(250, 240, 224, 0.96));\n    text-align: center;\n  }\n\n  #quizapp9 [data-score-label] {\n    display: block;\n    color: var(--quiz-sage-dark);\n    font-weight: 750;\n    margin-bottom: 4px;\n  }\n\n  #quizapp9 [data-score-hero] strong {\n    display: inline-flex;\n    align-items: baseline;\n    justify-content: center;\n    gap: 3px;\n    color: var(--quiz-brown);\n    font-size: 40px;\n    line-height: 1;\n  }\n\n  #quizapp9 [data-score-hero] strong span {\n    font-size: 18px;\n  }\n\n  #quizapp9 [data-score-detail] {\n    max-width: 600px;\n    margin: 0;\n  }\n\n  #quizapp9 [data-result-panels] {\n    display: grid;\n    gap: 12px;\n  }\n\n  #quizapp9 [data-result-panel],\n  #quizapp9 [data-distribution-card],\n  #quizapp9 [data-chart-section],\n  #quizapp9 [data-dimension-card] {\n    padding: 18px;\n    border: 1px solid var(--quiz-line);\n    border-radius: 20px;\n    background: rgba(255, 253, 248, 0.78);\n  }\n\n  #quizapp9 [data-distribution-card],\n  #quizapp9 [data-chart-section],\n  #quizapp9 [data-dimension-card] {\n    margin-top: 16px;\n  }\n\n  #quizapp9 [data-result-panel] h3 {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-bottom: 8px;\n  }\n\n  #quizapp9 [data-result-panel] p {\n    margin: 8px 0 0;\n  }\n\n  #quizapp9 [data-distribution-card] h3,\n  #quizapp9 [data-chart-section] h3 {\n    text-align: center;\n    margin-bottom: 8px;\n  }\n\n  #quizapp9 [data-score-scale] {\n    position: relative;\n    display: flex;\n    min-height: 48px;\n    margin-top: 14px;\n    overflow: visible;\n    border-radius: 999px;\n    background: #eee4d4;\n  }\n\n  #quizapp9 [data-scale-segment] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 48px;\n    color: var(--quiz-brown);\n    font-size: 12px;\n    font-weight: 750;\n  }\n\n  #quizapp9 [data-scale-segment=\"low\"] {\n    flex: 3;\n    border-radius: 999px 0 0 999px;\n    background: #ead8bd;\n  }\n\n  #quizapp9 [data-scale-segment=\"mid-low\"] {\n    flex: 5;\n    background: #e7c99e;\n  }\n\n  #quizapp9 [data-scale-segment=\"mid-high\"] {\n    flex: 5;\n    background: #cbd7bd;\n  }\n\n  #quizapp9 [data-scale-segment=\"high\"] {\n    flex: 7;\n    border-radius: 0 999px 999px 0;\n    background: #9caf88;\n  }\n\n  #quizapp9 [data-score-marker] {\n    position: absolute;\n    left: var(--quiz-score-position);\n    top: 50%;\n    display: inline-flex;\n    flex-direction: column;\n    align-items: center;\n    transform: translate(-50%, -50%);\n    pointer-events: none;\n  }\n\n  #quizapp9 [data-marker-dot] {\n    width: 18px;\n    height: 18px;\n    border-radius: 999px;\n    background: var(--quiz-brown);\n    border: 3px solid #fffdf8;\n    box-shadow: 0 6px 14px rgba(79, 61, 48, 0.24);\n  }\n\n  #quizapp9 [data-marker-label] {\n    position: absolute;\n    top: 24px;\n    min-width: 64px;\n    color: var(--quiz-brown);\n    font-size: 12px;\n    font-weight: 750;\n    text-align: center;\n  }\n\n  #quizapp9 [data-scale-legend] {\n    display: grid;\n    grid-template-columns: 1fr;\n    gap: 8px;\n    margin-top: 30px;\n    color: var(--quiz-muted);\n    font-size: 14px;\n  }\n\n  #quizapp9 [data-scale-legend] span {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  #quizapp9 [data-legend-dot] {\n    width: 12px;\n    height: 12px;\n    border-radius: 999px;\n    display: inline-block;\n  }\n\n  #quizapp9 [data-legend-dot=\"low\"] {\n    background: #ead8bd;\n  }\n\n  #quizapp9 [data-legend-dot=\"mid-low\"] {\n    background: #e7c99e;\n  }\n\n  #quizapp9 [data-legend-dot=\"mid-high\"] {\n    background: #cbd7bd;\n  }\n\n  #quizapp9 [data-legend-dot=\"high\"] {\n    background: #9caf88;\n  }\n\n  #quizapp9 [data-chart-intro],\n  #quizapp9 [data-chart-status] {\n    margin: 0 auto 12px;\n    max-width: 580px;\n    text-align: center;\n    color: var(--quiz-muted);\n  }\n\n  #quizapp9 [data-chart-wrap] {\n    position: relative;\n    width: 100%;\n    min-height: 300px;\n  }\n\n  #quizapp9 [data-chart-canvas] {\n    display: block;\n    width: 100%;\n    max-width: 680px;\n    height: 300px;\n    margin: 0 auto;\n  }\n\n  #quizapp9 [data-dimension-grid] {\n    display: grid;\n    grid-template-columns: 1fr;\n    gap: 12px;\n    margin-top: 16px;\n  }\n\n  #quizapp9 [data-dimension-card] {\n    margin-top: 0;\n  }\n\n  #quizapp9 [data-dimension-card] h3 {\n    display: flex;\n    justify-content: space-between;\n    gap: 12px;\n    align-items: baseline;\n    margin-bottom: 8px;\n    font-size: 18px;\n  }\n\n  #quizapp9 [data-dimension-card] output {\n    color: var(--quiz-sage-dark);\n    font-weight: 800;\n  }\n\n  #quizapp9 [data-dimension-card] p {\n    margin: 0;\n  }\n\n  #quizapp9 button:focus-visible,\n  #quizapp9 [tabindex=\"-1\"]:focus-visible {\n    outline: 3px solid rgba(83, 102, 78, 0.72);\n    outline-offset: 3px;\n  }\n\n  @media (hover: hover) {\n    #quizapp9 [data-action]:not(:disabled):hover {\n      transform: translateY(-2px);\n    }\n\n    #quizapp9 [data-action=\"start-quiz\"]:hover,\n    #quizapp9 [data-action=\"show-result\"]:hover,\n    #quizapp9 [data-action=\"restart-quiz\"]:hover {\n      box-shadow: 0 16px 30px rgba(83, 102, 78, 0.28);\n    }\n\n    #quizapp9 [data-tool-grid] button:hover {\n      border-color: rgba(83, 102, 78, 0.46);\n      background: rgba(237, 243, 231, 0.78);\n    }\n  }\n\n  @media (min-width: 576px) {\n    #quizapp9 {\n      font-size: 17px;\n    }\n\n    #quizapp9 .card-body {\n      padding: 32px;\n    }\n\n    #quizapp9 [data-intro-points],\n    #quizapp9 [data-tool-grid],\n    #quizapp9 [data-scale-legend],\n    #quizapp9 [data-dimension-grid] {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    #quizapp9 [data-chart-wrap] {\n      min-height: 330px;\n    }\n\n    #quizapp9 [data-chart-canvas] {\n      height: 330px;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    #quizapp9 *,\n    #quizapp9 *::before,\n    #quizapp9 *::after {\n      scroll-behavior: auto !important;\n      transition-duration: 0.01ms !important;\n    }\n  }\n<\/style>\n\n<script>\n(function () {\n  const initQuiz9 = () => {\n    const root = document.querySelector('#quizapp9[data-quiz-app=\"quiz9\"]');\n    if (!root) return;\n    if (root.dataset.quizReady === \"true\") return;\n    root.dataset.quizReady = \"true\";\n\n    const quizintro9 = root.querySelector('#quizintro9[data-page=\"intro9\"]');\n    const quizmain9 = root.querySelector('#quizmain9[data-page=\"quiz9\"]');\n    const quizresult9 = root.querySelector('#quizresult9[data-page=\"result9\"]');\n\n    if (!quizintro9 || !quizmain9 || !quizresult9) return;\n\n    const nodes = {\n      introTitle: root.querySelector('#quizintrotitle9'),\n      mainTitle: root.querySelector('#quizmaintitle9'),\n      resultTitle: root.querySelector('#quizresulttitle9'),\n      status: root.querySelector('[data-live-status]'),\n      stage: root.querySelector('[data-drawing-stage]'),\n      canvas: root.querySelector('[data-drawing-canvas]'),\n      lineCount: root.querySelector('[data-line-count]'),\n      resultLineCount: root.querySelector('[data-result-line-count]'),\n      markerLineCount: root.querySelector('[data-marker-line-count]'),\n      secretScore: root.querySelector('[data-secret-score]'),\n      chartStatus: root.querySelector('[data-chart-status]'),\n      chartCanvas: root.querySelector('[data-chart-canvas]')\n    };\n\n    const state = {\n      lines: [],\n      pendingPoint: null,\n      manualAdjust: 0,\n      chart: null\n    };\n\n    const dimensionLabels = {\n      stability: \"\u5b88\u5bc6\u7a69\u5b9a\u5ea6\",\n      boundary: \"\u754c\u7dda\u611f\",\n      restraint: \"\u8868\u9054\u514b\u5236\",\n      trust: \"\u4fe1\u4efb\u4fdd\u8b77\"\n    };\n\n    const dimensionOrder = [\"stability\", \"boundary\", \"restraint\", \"trust\"];\n    const chartColors = [\"#9CAF88\", \"#D9B99B\", \"#C6A15B\", \"#8F765D\"];\n\n    const prefersReducedMotion = () => {\n      return window.matchMedia && window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;\n    };\n\n    const getLineCount = () => {\n      return Math.max(0, state.lines.length + state.manualAdjust);\n    };\n\n    const getCanvasContext = () => {\n      if (!nodes.canvas || !nodes.stage) return null;\n\n      const rect = nodes.stage.getBoundingClientRect();\n      if (!rect.width || !rect.height) return null;\n\n      const dpr = Math.max(1, window.devicePixelRatio || 1);\n      const nextWidth = Math.round(rect.width * dpr);\n      const nextHeight = Math.round(rect.height * dpr);\n\n      if (nodes.canvas.width !== nextWidth || nodes.canvas.height !== nextHeight) {\n        nodes.canvas.width = nextWidth;\n        nodes.canvas.height = nextHeight;\n      }\n\n      const ctx = nodes.canvas.getContext(\"2d\");\n      ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\n      return { ctx, width: rect.width, height: rect.height };\n    };\n\n    const drawCanvas = () => {\n      const canvasData = getCanvasContext();\n      if (!canvasData) return;\n\n      const { ctx, width, height } = canvasData;\n      ctx.clearRect(0, 0, width, height);\n\n      ctx.lineCap = \"round\";\n      ctx.lineJoin = \"round\";\n      ctx.lineWidth = 2.4;\n      ctx.strokeStyle = \"rgba(79, 61, 48, 0.88)\";\n\n      state.lines.forEach((line) => {\n        ctx.beginPath();\n        ctx.moveTo(line.start.x * width, line.start.y * height);\n        ctx.lineTo(line.end.x * width, line.end.y * height);\n        ctx.stroke();\n      });\n\n      if (state.pendingPoint) {\n        ctx.beginPath();\n        ctx.arc(state.pendingPoint.x * width, state.pendingPoint.y * height, 5, 0, Math.PI * 2);\n        ctx.fillStyle = \"#53664e\";\n        ctx.fill();\n      }\n    };\n\n    const destroyChart = () => {\n      if (state.chart) {\n        state.chart.destroy();\n        state.chart = null;\n      }\n    };\n\n    const scrollToHeading = (heading) => {\n      if (!heading) return;\n      requestAnimationFrame(() => {\n        heading.scrollIntoView({\n          behavior: prefersReducedMotion() ? \"auto\" : \"smooth\",\n          block: \"start\"\n        });\n        heading.focus({ preventScroll: true });\n      });\n    };\n\n    const updateCounter = () => {\n      const count = getLineCount();\n\n      if (nodes.lineCount) nodes.lineCount.textContent = String(count);\n      if (nodes.resultLineCount) nodes.resultLineCount.textContent = String(count);\n      if (nodes.markerLineCount) nodes.markerLineCount.textContent = String(count);\n\n      return count;\n    };\n\n    const updateStatus = (message) => {\n      if (!nodes.status) return;\n      nodes.status.textContent = message;\n    };\n\n    const resetDrawing = () => {\n      state.lines = [];\n      state.pendingPoint = null;\n      state.manualAdjust = 0;\n      updateCounter();\n      updateStatus(\"\u5c1a\u672a\u756b\u7dda\u3002\u8acb\u5728\u5e06\u8239\u5716\u4e2d\u9ede\u4e00\u4e0b\u4f5c\u70ba\u7b2c\u4e00\u689d\u7dda\u7684\u8d77\u9ede\u3002\");\n      drawCanvas();\n    };\n\n    const getPointFromClick = (event) => {\n      const rect = nodes.canvas.getBoundingClientRect();\n      const x = Math.min(1, Math.max(0, (event.clientX - rect.left) \/ rect.width));\n      const y = Math.min(1, Math.max(0, (event.clientY - rect.top) \/ rect.height));\n      return { x, y };\n    };\n\n    const handleCanvasClick = (event) => {\n      if (!nodes.canvas || event.target !== nodes.canvas) return;\n\n      const point = getPointFromClick(event);\n\n      if (!state.pendingPoint) {\n        state.pendingPoint = point;\n        updateStatus(\"\u5df2\u8a2d\u5b9a\u8d77\u9ede\u3002\u8acb\u518d\u9ede\u4e00\u4e0b\uff0c\u5b8c\u6210\u9019\u689d\u76f4\u7dda\u3002\");\n        drawCanvas();\n        return;\n      }\n\n      state.lines.push({\n        start: state.pendingPoint,\n        end: point\n      });\n\n      state.pendingPoint = null;\n      const count = updateCounter();\n      updateStatus(`\u5df2\u756b ${count} \u689d\u7dda\u3002\u53ef\u7e7c\u7e8c\u9ede\u5169\u500b\u7aef\u9ede\u756b\u4e0b\u4e00\u689d\uff0c\u6216\u5b8c\u6210\u6e2c\u9a57\u770b\u89e3\u6790\u3002`);\n      drawCanvas();\n    };\n\n    const getResultKey = (lineCount) => {\n      if (lineCount <= 3) return \"low\";\n      if (lineCount <= 8) return \"mid-low\";\n      if (lineCount <= 13) return \"mid-high\";\n      return \"high\";\n    };\n\n    const getSecretScore = (lineCount) => {\n      if (lineCount <= 0) return 10;\n      if (lineCount <= 3) return Math.round(12 + lineCount * 6);\n      if (lineCount <= 8) return Math.round(34 + (lineCount - 4) * 5);\n      if (lineCount <= 13) return Math.round(62 + (lineCount - 9) * 5);\n      return Math.min(100, Math.round(88 + Math.min(lineCount - 14, 6) * 2));\n    };\n\n    const getDimensionScores = (lineCount) => {\n      const score = getSecretScore(lineCount);\n\n      if (lineCount <= 3) {\n        return {\n          stability: Math.max(10, score - 4),\n          boundary: Math.max(12, score),\n          restraint: Math.max(8, score - 8),\n          trust: Math.max(12, score - 2)\n        };\n      }\n\n      if (lineCount <= 8) {\n        return {\n          stability: score,\n          boundary: Math.min(100, score + 5),\n          restraint: Math.max(20, score - 6),\n          trust: Math.min(100, score + 2)\n        };\n      }\n\n      if (lineCount <= 13) {\n        return {\n          stability: score,\n          boundary: Math.min(100, score + 4),\n          restraint: Math.max(40, score - 5),\n          trust: Math.min(100, score + 3)\n        };\n      }\n\n      return {\n        stability: score,\n        boundary: Math.min(100, score + 3),\n        restraint: Math.max(60, score - 4),\n        trust: Math.min(100, score + 2)\n      };\n    };\n\n    const updateResultPanel = (resultKey) => {\n      const panels = Array.from(root.querySelectorAll('[data-result-panel]'));\n      panels.forEach((panel) => {\n        panel.hidden = panel.dataset.resultPanel !== resultKey;\n      });\n    };\n\n    const updateDimensionOutputs = (scores) => {\n      dimensionOrder.forEach((key) => {\n        const output = root.querySelector(`[data-dimension-value=\"${key}\"]`);\n        if (output) output.textContent = `${scores[key]}%`;\n      });\n    };\n\n    const updateDistribution = (lineCount) => {\n      const markerPercent = Math.max(0, Math.min(100, (Math.min(lineCount, 20) \/ 20) * 100));\n      root.style.setProperty(\"--quiz-score-position\", `${markerPercent}%`);\n    };\n\n    const renderChart = (scores) => {\n      destroyChart();\n\n      if (!nodes.chartCanvas) return;\n\n      if (!window.Chart) {\n        if (nodes.chartStatus) {\n          nodes.chartStatus.hidden = false;\n          nodes.chartStatus.textContent = \"\u5716\u8868\u5957\u4ef6\u5c1a\u672a\u8f09\u5165\uff0c\u4ecd\u53ef\u67e5\u770b\u5206\u6578\u8207\u6587\u5b57\u89e3\u6790\u3002\";\n        }\n        return;\n      }\n\n      if (nodes.chartStatus) {\n        nodes.chartStatus.hidden = false;\n        nodes.chartStatus.textContent = \"\u5716\u8868\u6574\u7406\u4e2d\u2026\";\n      }\n\n      const labelFontSize = root.offsetWidth < 520 ? 12 : 16;\n      const valueFontSize = root.offsetWidth < 520 ? 11 : 13;\n      const ctx = nodes.chartCanvas.getContext(\"2d\");\n\n      state.chart = new window.Chart(ctx, {\n        type: \"bar\",\n        data: {\n          labels: dimensionOrder.map((key) => dimensionLabels[key]),\n          datasets: [{\n            label: \"\u4fdd\u5bc6\u50be\u5411\u5206\u6578\",\n            data: dimensionOrder.map((key) => scores[key]),\n            backgroundColor: chartColors,\n            borderColor: chartColors,\n            borderWidth: 1,\n            borderRadius: 12,\n            barThickness: root.offsetWidth < 520 ? 26 : 34\n          }]\n        },\n        options: {\n          responsive: true,\n          maintainAspectRatio: false,\n          indexAxis: \"y\",\n          animation: {\n            duration: prefersReducedMotion() ? 0 : 450\n          },\n          plugins: {\n            legend: {\n              display: false\n            },\n            tooltip: {\n              callbacks: {\n                label: (context) => `${context.parsed.x}%`\n              }\n            }\n          },\n          scales: {\n            x: {\n              beginAtZero: true,\n              max: 100,\n              ticks: {\n                color: \"#665e55\",\n                font: {\n                  size: valueFontSize\n                },\n                callback: (value) => `${value}%`\n              },\n              grid: {\n                color: \"rgba(91, 70, 54, 0.10)\"\n              }\n            },\n            y: {\n              ticks: {\n                color: \"#4f3d30\",\n                font: {\n                  size: labelFontSize,\n                  weight: \"600\"\n                }\n              },\n              grid: {\n                display: false\n              }\n            }\n          }\n        }\n      });\n\n      if (nodes.chartStatus) {\n        nodes.chartStatus.hidden = true;\n        nodes.chartStatus.textContent = \"\";\n      }\n    };\n\n    const showResult = () => {\n      const count = updateCounter();\n      const resultKey = getResultKey(count);\n      const score = getSecretScore(count);\n      const scores = getDimensionScores(count);\n\n      if (nodes.secretScore) nodes.secretScore.textContent = String(score);\n\n      updateResultPanel(resultKey);\n      updateDimensionOutputs(scores);\n      updateDistribution(count);\n\n      quizintro9.hidden = true;\n      quizmain9.hidden = true;\n      quizresult9.hidden = false;\n\n      renderChart(scores);\n      scrollToHeading(nodes.resultTitle);\n    };\n\n    const startQuiz = () => {\n      resetDrawing();\n      destroyChart();\n\n      quizintro9.hidden = true;\n      quizmain9.hidden = false;\n      quizresult9.hidden = true;\n\n      window.setTimeout(() => {\n        drawCanvas();\n        scrollToHeading(nodes.mainTitle);\n      }, prefersReducedMotion() ? 0 : 80);\n    };\n\n    const restartQuiz = () => {\n      resetDrawing();\n      destroyChart();\n\n      quizintro9.hidden = false;\n      quizmain9.hidden = true;\n      quizresult9.hidden = true;\n\n      scrollToHeading(nodes.introTitle);\n    };\n\n    const addManualLine = () => {\n      state.manualAdjust += 1;\n      const count = updateCounter();\n      updateStatus(`\u76ee\u524d\u8a18\u9304\u70ba ${count} \u689d\u7dda\u3002\u53ef\u7e7c\u7e8c\u756b\u7dda\u6216\u5b8c\u6210\u6e2c\u9a57\u3002`);\n    };\n\n    const minusManualLine = () => {\n      const currentCount = getLineCount();\n      if (currentCount <= 0) {\n        updateStatus(\"\u76ee\u524d\u7dda\u6578\u5df2\u662f 0\uff0c\u7121\u6cd5\u518d\u6e1b\u5c11\u3002\");\n        return;\n      }\n\n      state.manualAdjust -= 1;\n\n      if (getLineCount() < 0) {\n        state.manualAdjust += 1;\n      }\n\n      const count = updateCounter();\n      updateStatus(`\u76ee\u524d\u8a18\u9304\u70ba ${count} \u689d\u7dda\u3002`);\n    };\n\n    const undoLine = () => {\n      state.pendingPoint = null;\n\n      if (state.lines.length > 0) {\n        state.lines.pop();\n      } else if (getLineCount() > 0) {\n        state.manualAdjust -= 1;\n      }\n\n      const count = updateCounter();\n      updateStatus(count > 0 ? `\u5df2\u64a4\u92b7\u4e00\u689d\uff0c\u76ee\u524d\u70ba ${count} \u689d\u7dda\u3002` : \"\u5df2\u56de\u5230 0 \u689d\u7dda\u3002\");\n      drawCanvas();\n    };\n\n    const clearLines = () => {\n      resetDrawing();\n      updateStatus(\"\u5df2\u6e05\u9664\u5168\u90e8\u7dda\u689d\u3002\u8acb\u91cd\u65b0\u958b\u59cb\u756b\u7dda\uff0c\u6216\u7528\u6309\u9215\u8abf\u6574\u7dda\u6578\u3002\");\n    };\n\n    root.addEventListener(\"click\", (event) => {\n      if (quizmain9.contains(event.target) && event.target === nodes.canvas) {\n        handleCanvasClick(event);\n        return;\n      }\n\n      const actionButton = event.target.closest('[data-action]');\n      if (!actionButton || !root.contains(actionButton)) return;\n\n      const action = actionButton.dataset.action;\n\n      if (action === \"start-quiz\") {\n        startQuiz();\n        return;\n      }\n\n      if (action === \"show-result\") {\n        showResult();\n        return;\n      }\n\n      if (action === \"restart-quiz\") {\n        restartQuiz();\n        return;\n      }\n\n      if (action === \"add-line\") {\n        addManualLine();\n        return;\n      }\n\n      if (action === \"minus-line\") {\n        minusManualLine();\n        return;\n      }\n\n      if (action === \"undo-line\") {\n        undoLine();\n        return;\n      }\n\n      if (action === \"clear-lines\") {\n        clearLines();\n      }\n    });\n\n    updateCounter();\n    drawCanvas();\n  };\n\n  if (document.readyState === \"loading\") {\n    document.addEventListener(\"DOMContentLoaded\", initQuiz9, { once: true });\n  } else {\n    initQuiz9();\n  }\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>\u5bf9\u4efb\u4f55\u4e8b\u60c5\u90fd\u5145\u6ee1\u5077\u7aa5\u7684\u70ed\u60c5\u3002\u53ea\u8981\u662f\u79d8\u5bc6\uff0c\u4ed6\u4eec\u5c31\u60f3\u77e5\u9053\uff0c\u5e76\u4e14\u8ba9\u66f4\u591a\u7684\u4eba\u77e5\u9053\u3002\u4ed6\u4eec\u6700\u559c\u6b22\u6253\u542c\u3001\u4f20\u64ad\u548c\u5e72\u9884\u522b\u4eba\u7684\u9690\u79c1\u548c\u79d8\u5bc6\uff0c\u603b\u662f\u4ee5\u63a2\u542c\u522b\u4eba\u7684\u9690\u79c1\u800c\u6d0b\u6d0b\u81ea\u5f97\uff0c\u4ee5\u4f20\u64ad\u522b\u4eba\u7684\u79d8\u5bc6\u800c\u6cbe\u6cbe\u81ea\u559c\u3002<\/p>","protected":false},"author":19,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"narrow-width-container","site-content-style":"unboxed","site-sidebar-style":"default","ast-global-header-display":"disabled","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[167,175,160],"tags":[],"class_list":["post-2680","post","type-post","status-publish","format-standard","hentry","category-personality","category-relationships","category-attitude-scales"],"_links":{"self":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2680","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/users\/19"}],"replies":[{"embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/comments?post=2680"}],"version-history":[{"count":2,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2680\/revisions"}],"predecessor-version":[{"id":10832,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2680\/revisions\/10832"}],"wp:attachment":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/media?parent=2680"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/categories?post=2680"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/tags?post=2680"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}