.c21-cube{--c21-ink:#24505a;--c21-line:#d2e8ea;--c21-teal:#347c92;width:100%;min-width:0;overflow:hidden;border:1px solid #c2dfe3;border-radius:12px;background:#eff9fa;color:var(--c21-ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;box-sizing:border-box}.c21-cube *{box-sizing:border-box}.c21-cube [hidden]{display:none!important}.c21-cube button{font-family:inherit;cursor:pointer;border:1px solid #c2dce0;border-radius:7px;min-height:38px;margin:0;padding:8px 12px;color:#285866;background:#f6fcfd;font-weight:600;line-height:1.35;box-shadow:none;transition:background .15s,filter .15s,transform .15s;touch-action:manipulation}.c21-cube button:hover{filter:brightness(1.05);background:#eaf8fa}.c21-cube button:active{transform:translateY(1px)}.c21-cube button:disabled{opacity:.42;cursor:default;filter:none;transform:none}.c21-cube button:focus-visible,.c21-cube-svg:focus-visible{outline:3px solid #f1aa35;outline-offset:3px}.c21-cube-heading{display:flex;justify-content:space-between;align-items:center;padding:13px 19px;gap:15px;background:#397e93;color:white}.c21-cube-heading h2{font-size:20px;letter-spacing:.03em;margin:0;line-height:1.35}.c21-cube-heading>span{font-size:12px;opacity:.8;white-space:nowrap}.c21-cube-main{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:13px;padding:13px}.c21-cube-stage{min-width:0;min-height:465px;position:relative;background:#fff;border:1px solid #d8ecec;border-radius:6px;overflow:hidden}.c21-cube-instruction{position:absolute;left:17px;top:12px;right:12px;margin:0;z-index:1;color:#38656f;font-size:13px;line-height:1.6;pointer-events:none}.c21-cube-svg{width:100%;height:100%;min-height:450px;max-height:590px;display:block;touch-action:none;user-select:none;cursor:grab;outline:none}.c21-cube-svg.is-dragging{cursor:grabbing}.c21-face,.c21-aux-plane,.c21-right-angle,.c21-angle-text{pointer-events:none}.c21-aux-plane{fill:#f6cd48;fill-opacity:.37;stroke:#e3bb39;stroke-opacity:.7;stroke-width:1.2}.c21-edge-stroke{stroke:#578085;stroke-width:2.1;fill:none;vector-effect:non-scaling-stroke;pointer-events:none}.c21-model-edge.is-back .c21-edge-stroke{stroke:#87a7aa}.c21-edge-hit{stroke:transparent;stroke-width:19;fill:none;vector-effect:non-scaling-stroke;pointer-events:stroke;cursor:pointer}.c21-model-edge:hover .c21-edge-stroke,.c21-model-edge:focus .c21-edge-stroke{stroke:#e5aa3f;stroke-width:3.5;opacity:1}.c21-model-edge:focus{outline:none}.c21-model-edge.is-selected .c21-edge-stroke{stroke:#e76b61;stroke-width:4;stroke-dasharray:none;opacity:1}.c21-model-edge.is-selected:hover .c21-edge-stroke{stroke:#cf4d47}.c21-vertex-hit{fill:transparent;stroke:none;pointer-events:all;cursor:pointer}.c21-vertex-dot{fill:#567b7f;pointer-events:none}.c21-model-vertex.is-anchor .c21-vertex-dot{fill:#eea82d;stroke:white;stroke-width:2}.c21-model-vertex:focus .c21-vertex-dot{fill:#eaa729}.c21-vertex-label{font:600 19px "Arial","Microsoft YaHei",sans-serif;fill:#344e53;filter:url(#c21-label-halo);pointer-events:none}.c21-right-angle{fill:none;stroke:#d18131;stroke-width:2;vector-effect:non-scaling-stroke}.c21-angle-text{font:bold 15px "Arial",sans-serif;fill:#b26722;filter:url(#c21-label-halo)}.c21-model-message{font-size:15px;fill:#ac7324}.c21-camera-tools{position:absolute;left:13px;bottom:13px;display:flex;gap:4px;align-items:center}.c21-camera-tools button{min-height:29px;min-width:29px;padding:3px 6px;font-size:15px;line-height:1;background:#fff;border-color:#d4e5e8;color:#6b878d}.c21-camera-tools .c21-stage-reset{padding:6px 13px;margin-left:6px;color:#fff;border:0;background:#dda343;font-size:12px;min-height:30px}.c21-camera-tools .c21-stage-reset:hover{background:#ce9136}.c21-gesture-hint{position:absolute;right:15px;bottom:17px;margin:0;font-size:11px;color:#89a0a5;pointer-events:none}.c21-cube-panel{position:relative;padding:17px 13px 13px;border:1px solid #d8e9ea;border-radius:6px;background:#fff;display:flex;flex-direction:column;min-width:0;align-self:stretch}.c21-cube-panel h3{margin:0 0 14px;text-align:center;font-size:16px;font-weight:700;color:#365f65;line-height:1.5}.c21-edge-slots{display:grid;grid-template-columns:1fr 22px 1fr;align-items:center;gap:3px}.c21-edge-slots>span{text-align:center;font-size:13px;color:#8b9ca0}.c21-edge-slots button{padding:9px 3px;font-size:14px;border:1.5px solid #dbd5ad;background:#fffbea;min-height:43px;color:#8e742c;font-weight:600}.c21-edge-slots button:last-child{border-color:#ddcedb;background:#fff8fb;color:#926980}.c21-edge-slots button.is-active{box-shadow:0 0 0 2px #e5b43e55}.c21-edge-slots button:last-child.is-active{box-shadow:0 0 0 2px #d4a0ba55}.c21-edge-chooser{display:none;padding:11px 0 9px;border-bottom:1px solid #e2edee}.c21-edge-chooser.is-open{display:block}.c21-edge-chooser p{font-size:12px;margin:0 0 7px;color:#66898e}.c21-edge-chooser>div{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.c21-edge-chooser button{min-height:32px;padding:5px 0;font-size:12px}.c21-edge-chooser button.is-selected{background:#ffefe5;color:#b2644e;border-color:#e8b28e}.c21-edge-chooser button.c21-close-chooser{font-size:11px;min-height:25px;padding:3px 10px;margin-top:7px;float:right}.c21-edge-chooser:after{content:"";display:block;clear:both}.c21-relation-question{font-size:12px;line-height:1.6;color:#637d83;text-align:center;margin:18px 0 14px;min-height:39px;display:flex;align-items:center;justify-content:center}.c21-relation-options{display:flex;flex-direction:column;gap:9px}.c21-relation-options button{border:0;color:white;background:#58a2bc;font-size:15px;min-height:44px;border-radius:7px;box-shadow:inset 0 -2px 0 #0000000a}.c21-relation-options button:nth-child(2){background:#e5ab53}.c21-relation-options button:nth-child(3){background:#9290c4;font-size:13px}.c21-relation-options button:hover{background:#4994ae}.c21-relation-options button:nth-child(2):hover{background:#d69c43}.c21-relation-options button:nth-child(3):hover{background:#827fb6}.c21-relation-options button.is-correct{box-shadow:0 0 0 3px #a6d9bb, inset 0 -2px 0 #0000000a}.c21-relation-options button.is-correct:after{content:"  ✓"}.c21-relation-options button.is-retry{box-shadow:0 0 0 2px #edd1ab}.c21-cube-explanation{padding:11px 10px;margin:17px 0 14px;border:1px solid #e0ebeb;border-radius:5px;background:#f7fbfa;color:#739095;font-size:12px;line-height:1.75;min-height:67px}.c21-cube-explanation.has-result{background:#f0faf4;border-color:#cce5d5;color:#48775c}.c21-cube-legend{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px;font-size:10px;color:#95a6a8}.c21-cube-legend span{display:flex;align-items:center;gap:5px}.c21-cube-legend i{width:15px;height:3px;background:#e76b61;display:inline-block;border-radius:2px}.c21-cube-legend span:nth-child(2) i{width:11px;height:11px;background:#f5d55777;border:1px solid #eacb66;border-radius:1px}.c21-cube-toolbar{border-top:1px solid #d9ebee;display:flex;justify-content:center;flex-wrap:wrap;align-items:center;padding:12px;gap:9px;background:#fbfefd}.c21-cube-toolbar button{font-size:13px;min-height:37px;padding:8px 15px}.c21-cube-toolbar [data-action="rotation"]{background:#397e93;color:white;border-color:#397e93}.c21-cube-toolbar [data-action="random"]{background:#6da99b;border-color:#6da99b;color:white}.c21-cube-toolbar [data-action="labels"]{background:#fff5cb;border-color:#f0dd93;color:#92782f}.c21-cube-toolbar [data-action="aux"]{background:#fff5cb;border-color:#f0dd93;color:#92782f}.c21-cube-toolbar [data-action="aux"].is-on{background:#fae694;box-shadow:inset 0 0 0 1px #e7c754}.c21-cube-toolbar [data-action="back"]{font-size:12px;color:#6b898e}.c21-cube-toolbar>span{font-size:11px;color:#8a9fa3;margin-left:7px}.c21-cube-toast{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%) translateY(6px);background:#2b5366ee;border-radius:11px;color:#fff;padding:15px 24px;min-width:215px;max-width:88%;text-align:center;line-height:1.65;font-size:16px;box-shadow:0 4px 14px #274a6025;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}.c21-cube-toast.is-visible{opacity:1;transform:translate(-50%,-50%)}.c21-cube-toast[data-kind="retry"]{background:#876435ed}@media(min-width:1500px){.c21-cube-main{grid-template-columns:minmax(0,1fr) 300px;gap:16px;padding:16px}.c21-cube-stage{min-height:550px}.c21-cube-panel{padding:22px 19px}.c21-cube-panel h3{font-size:17px}.c21-relation-options button{min-height:49px}.c21-cube-svg{max-height:none}.c21-cube-explanation{font-size:13px}}@media(max-width:850px){.c21-cube-main{grid-template-columns:minmax(0,1fr) 220px;gap:9px;padding:9px}.c21-cube-heading{padding:12px 15px}.c21-cube-heading h2{font-size:18px}.c21-cube-heading>span{display:none}.c21-cube-stage{min-height:390px}.c21-cube-svg{min-height:390px}.c21-cube-panel{padding:14px 10px 11px}.c21-cube-panel h3{font-size:14px}.c21-edge-slots button{font-size:12px}.c21-relation-options button{font-size:14px;min-height:40px}.c21-relation-options button:nth-child(3){font-size:12px}.c21-relation-question{margin:13px 0 10px}.c21-cube-explanation{font-size:11px;margin-top:13px}.c21-gesture-hint{display:none}.c21-cube-toolbar{gap:6px}.c21-cube-toolbar button{padding:7px 10px;font-size:12px}.c21-cube-toolbar>span{display:none}.c21-cube-instruction{font-size:11px;left:11px}}@media(max-width:580px){.c21-cube{border-radius:8px}.c21-cube-main{grid-template-columns:1fr;gap:8px}.c21-cube-heading h2{font-size:16px}.c21-cube-stage{min-height:305px}.c21-cube-svg{height:320px;min-height:320px;max-height:400px}.c21-cube-instruction{top:9px;font-size:10px}.c21-cube-panel{display:block;padding:13px}.c21-cube-panel h3{margin-bottom:11px}.c21-edge-slots{max-width:300px;margin:auto}.c21-relation-question{min-height:20px;margin:10px 0}.c21-relation-options{display:grid;grid-template-columns:1fr 1fr 1.65fr;gap:6px}.c21-relation-options button{padding:8px 5px;min-height:40px;font-size:12px}.c21-relation-options button:nth-child(3){font-size:11px}.c21-cube-explanation{min-height:0;margin:12px 0 7px;padding:7px 9px;font-size:11px}.c21-cube-legend{justify-content:center}.c21-camera-tools{left:10px;bottom:10px;gap:3px}.c21-camera-tools button{min-width:27px;min-height:27px}.c21-cube-toolbar{padding:10px 8px;gap:5px}.c21-cube-toolbar button{font-size:11px;padding:7px 8px;min-height:35px}.c21-cube-toolbar [data-action="back"]{font-size:10px}.c21-cube-toast{font-size:14px;padding:12px 16px;min-width:190px}.c21-edge-chooser>div{grid-template-columns:repeat(6,1fr)}}@media(prefers-reduced-motion:reduce){.c21-cube button,.c21-cube-toast{transition:none}}

.c21-cube-svg.is-compact-model .c21-vertex-label{font-size:26px}.c21-cube-svg.is-compact-model .c21-angle-text{font-size:23px}.c21-cube-svg.is-compact-model .c21-model-message{font-size:21px}

.c21-cube .c21-cube-toolbar [data-action="random"]:hover{background:#5d9487;color:#fff}