.tn-progress{margin:22px 0 6px}.tn-bar{background:#e8efe9;border-radius:99px;height:10px;overflow:hidden;box-shadow:inset 0 2px 4px #0a3d332e}.tn-bar i{background:linear-gradient(90deg,#0e7c66,#c9a227);border-radius:99px;width:0;height:100%;transition:width .3s;display:block;position:relative;overflow:hidden;box-shadow:0 2px 8px #0e7c6673}.tn-bar i:after{content:"";background:linear-gradient(100deg,#0000 20%,#ffffff8c 50%,#0000 80%);animation:2.6s infinite tnShine;position:absolute;inset:0;transform:translate(-100%)}@keyframes tnShine{to{transform:translate(100%)}}.tn-count{color:var(--nhat);margin-top:8px;font-size:13.5px}.tn-rail{perspective:900px;flex-wrap:wrap;gap:10px;margin:14px 0 22px;display:flex}.tn-node{border:1px solid var(--vien);cursor:pointer;text-align:left;min-width:120px;color:var(--chu);transform-style:preserve-3d;background:#fff;border-radius:10px;flex:1;padding:10px 12px;font-family:inherit;font-size:14px;font-weight:700;transition:transform .35s,box-shadow .35s,border-color .25s,background .25s;animation:.5s backwards tnNodeIn}.tn-node:nth-child(2){animation-delay:60ms}.tn-node:nth-child(3){animation-delay:.12s}.tn-node:nth-child(4){animation-delay:.18s}.tn-node:nth-child(5){animation-delay:.24s}.tn-node:nth-child(6){animation-delay:.3s}@keyframes tnNodeIn{0%{opacity:0;transform:translateY(18px)rotateX(-60deg)}}.tn-node small{color:var(--nhat);margin-top:2px;font-size:12.5px;font-weight:400;display:block}.tn-node:hover{transform:translateY(-4px)rotateX(6deg);box-shadow:0 10px 22px #0a3d332e}.tn-node.on{border-color:var(--xanh);background:var(--xanh-nhat);color:var(--xanh-dam);transform:translateZ(26px);box-shadow:0 14px 28px #0a3d3338}.tn-node.on:hover{transform:translateZ(26px)rotateX(-4deg)}.tn-node.done{border-color:var(--xanh)}.tn-node:focus-visible{outline-offset:2px;outline:3px solid #0e7c6673}.tn-pane{border:1px solid var(--vien);box-shadow:var(--bong);transform-style:preserve-3d;background:#fff;border-radius:16px;padding:24px 26px}.tn-pane.tn-flip{animation:.45s both tnPaneIn}@keyframes tnPaneIn{0%{opacity:0;transform:perspective(900px)rotateY(-14deg)translate(26px)}to{opacity:1;transform:perspective(900px)rotateY(0)translate(0)}}.tn-pane[data-pane="6"]{background:linear-gradient(#fffdf4,#fff);border:2px solid #c9a227}.tn-pane .btn{transition:transform .2s,box-shadow .2s}.tn-pane .btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px #0a3d3333}.tn-pane .btn:active{transform:translateY(1px)scale(.98)}.tn-pane h2{color:var(--xanh-dam);margin:0 0 10px}.tn-do{margin:0 0 8px}.tn-why{background:var(--xanh-nhat);border-radius:10px;margin:0 0 16px;padding:12px 14px}.tn-checks{perspective:800px;flex-direction:column;gap:10px;margin-bottom:18px;display:flex}.tn-check{border:1px solid var(--vien);cursor:pointer;transform-style:preserve-3d;border-radius:12px;align-items:flex-start;gap:12px;padding:14px;font-size:15px;line-height:1.5;transition:transform .25s,border-color .25s,background .25s,box-shadow .25s;display:flex}.tn-check input{width:22px;height:22px;accent-color:var(--xanh);flex:none;margin-top:1px}.tn-check:hover{transform:translateZ(8px);box-shadow:0 8px 18px #0a3d331f}.tn-check:has(input:checked){border-color:var(--xanh);background:var(--xanh-nhat);transform:translateZ(12px)scale(1.01);box-shadow:0 10px 20px #0e7c662e}.tn-nav{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.tn-back{color:var(--xanh-dam);cursor:pointer;background:0 0;border:none;padding:10px 4px;font-family:inherit;font-weight:700}.tn-ex{border:1px solid var(--vien);background:#fff;border-radius:12px;margin:14px 0 0;padding:14px 16px}.tn-node:first-child{border-top:3px solid #0e7c66}.tn-node:nth-child(2){border-top:3px solid #2e86ab}.tn-node:nth-child(3){border-top:3px solid #d6336c}.tn-node:nth-child(4){border-top:3px solid #d97706}.tn-node:nth-child(5){border-top:3px solid #7c5cbf}.tn-node:nth-child(6){border-top:3px solid #0a3d33}.tn-node:first-child.on{background:#e6f4f0}.tn-node:nth-child(2).on{background:#e8f2f8}.tn-node:nth-child(3).on{background:#fdeef4}.tn-node:nth-child(4).on{background:#fdf1e3}.tn-node:nth-child(5).on{background:#f1ebfb}.tn-node:nth-child(6).on{background:#e6f4f0}.tn-pane[data-pane="0"] h2{border-bottom:3px solid #0e7c66;padding-bottom:8px}.tn-pane[data-pane="1"] h2{border-bottom:3px solid #2e86ab;padding-bottom:8px}.tn-pane[data-pane="2"] h2{border-bottom:3px solid #d6336c;padding-bottom:8px}.tn-pane[data-pane="3"] h2{border-bottom:3px solid #d97706;padding-bottom:8px}.tn-pane[data-pane="4"] h2{border-bottom:3px solid #7c5cbf;padding-bottom:8px}.tn-pane[data-pane="5"] h2{border-bottom:3px solid #0a3d33;padding-bottom:8px}@media (width<=760px){.tn-pane{padding:20px 18px}.tn-node{min-width:calc(50% - 4px)}}@media (prefers-reduced-motion:reduce){.tn-bar i,.tn-node,.tn-pane.tn-flip,.tn-check,.tn-pane .btn{transition:none;animation:none}.tn-bar i:after{display:none}}.m3d{border:1px solid var(--vien);box-shadow:var(--bong);background:linear-gradient(#dcefe6,#f4faf6);border-radius:16px;margin:16px 0 4px;position:relative;overflow:hidden}.m3d canvas{touch-action:none;cursor:grab;width:100%;height:400px;display:block}.m3d-card{z-index:30;border:1px solid var(--vien);border-top:3px solid var(--card-acc,#0e7c66);pointer-events:none;text-align:left;background:#fff;border-radius:12px;width:230px;max-width:78%;padding:10px 12px;font-size:12.5px;line-height:1.45;position:absolute;box-shadow:0 14px 30px #0a3d3338}.m3d-card.hidden{display:none}.m3d-card h4{color:var(--card-acc,#0e7c66);margin:0;font-size:14.5px}.m3d-card .sub{color:var(--nhat);margin:2px 0 4px;font-size:12px}.m3d-card .ln{gap:6px;margin:6px 0;animation:.35s cubic-bezier(.22,1,.36,1) both cardLineIn;display:flex}.m3d-card .ln .mk{text-align:center;flex:none;width:18px}.m3d-card .ln.done .mk{color:#0e7c66;font-weight:700}@keyframes cardLineIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.m3d-card .ln{animation:none}}.m3d canvas:active{cursor:grabbing}.m3d-cap{color:var(--xanh-dam);border-top:1px solid var(--vien);background:#fff;margin:0;padding:10px 16px;font-size:14px;font-weight:600}.m3d-fallback{color:var(--nhat);border-top:1px solid var(--vien);background:#fff;margin:0;padding:16px;font-size:14.5px}@media (width<=760px){.m3d canvas{height:300px}}
