/* 第 17 章 · 包装的第二次生命（专属场景） */
.c17-stage{position:relative;height:300px;border-radius:18px;border:1px solid rgba(245,158,11,.22);background:radial-gradient(ellipse at 50% 62%,rgba(245,158,11,.1),transparent 62%),linear-gradient(180deg,#141008,#0A0906);overflow:hidden;display:flex;align-items:center;justify-content:center}
.c17-box{position:relative;width:190px;height:130px;z-index:2;transition:.3s}
.c17-box-body{position:absolute;inset:18px 0 0;border-radius:6px;background:linear-gradient(160deg,#D9A15B,#A96F32);border:2px solid #F5C451;box-shadow:0 18px 30px rgba(0,0,0,.45)}
.c17-box-body:before{content:"";position:absolute;left:14%;top:0;bottom:0;width:2px;background:rgba(80,45,10,.4)}
.c17-tape{position:absolute;left:50%;top:12px;transform:translateX(-50%);width:34px;height:112px;background:rgba(255,227,166,.55);border:1px solid rgba(255,255,255,.25);border-radius:2px;z-index:4}
.c17-label{position:absolute;right:12px;bottom:24px;width:44px;height:28px;border-radius:2px;background:#FDE68A;border:1px solid #B45309;z-index:5;font-size:7px;color:#7C2D12;display:flex;align-items:center;justify-content:center}
.c17-cushion{position:absolute;inset:24px 12px 8px;border-radius:5px;background:repeating-linear-gradient(45deg,rgba(253,230,138,.25) 0 6px,rgba(253,230,138,.08) 6px 12px);z-index:3;transition:.3s}
.c17-item{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-size:34px;z-index:6;filter:drop-shadow(0 6px 8px rgba(0,0,0,.4));transition:.4s}
.c17-label-tag{position:absolute;left:14px;top:12px;font-size:8px;letter-spacing:.16em;color:rgba(245,196,81,.75)}
.c17-tip{position:absolute;right:14px;top:12px;font-size:8px;color:var(--faint);border:1px solid var(--line);border-radius:6px;padding:4px 7px;background:rgba(10,8,4,.6)}
.c17-context-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:8px}
.c17-context{padding:8px 10px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.025);color:var(--dim);text-align:left;font-size:9.5px;line-height:1.5}
.c17-context b{display:block;color:var(--ink);font-size:10px;margin-bottom:2px}
.c17-context:hover,.c17-context.on{border-color:rgba(245,158,11,.55);background:rgba(245,158,11,.08)}
.c17-layers{display:flex;flex-direction:column;gap:5px}
.c17-layer-btn{display:flex;align-items:center;justify-content:space-between;padding:7px 9px;border-radius:7px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--dim);font-size:9px}
.c17-layer-btn b{color:var(--ink);font-size:9.5px}.c17-layer-btn em{font-style:normal;color:var(--faint);font-size:8px}
.c17-layer-btn:hover,.c17-layer-btn.off{border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.07)}.c17-layer-btn.off b{text-decoration:line-through;color:var(--faint)}
.c17-meters{display:flex;flex-direction:column;gap:5px;margin-top:6px}
.c17-meter{display:flex;align-items:center;gap:6px;font-size:8.5px;color:var(--faint)}
.c17-meter .bar{flex:1;height:6px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.c17-meter .bar i{display:block;height:100%;width:50%;background:linear-gradient(90deg,#F59E0B,#4FE0D0);transition:.5s}
.c17-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.c17-act{padding:4px 8px;border-radius:6px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--dim);font-size:8.5px}
.c17-act:hover,.c17-act.on{border-color:rgba(245,158,11,.55);background:rgba(245,158,11,.08);color:#FCD34D}
.c17-test{position:relative;height:290px;border-radius:15px;border:1px solid rgba(245,158,11,.2);background:linear-gradient(180deg,#141008,#0A0906);overflow:hidden}
.c17-test .c17-box{position:absolute;left:50%;top:30px;transform:translateX(-50%)}
.c17-test.fall .c17-box{animation:c17fall 1.4s cubic-bezier(.2,.7,.3,1) forwards}
.c17-test.crash .c17-box{animation:c17crash 1.4s cubic-bezier(.2,.7,.3,1) forwards}
.c17-test.pass .c17-box{animation:c17pass 1.4s cubic-bezier(.2,.7,.3,1) forwards}
.c17-ground{position:absolute;left:5%;right:5%;bottom:58px;height:10px;border-radius:99px;background:linear-gradient(90deg,rgba(245,158,11,.08),rgba(245,158,11,.45),rgba(245,158,11,.08))}
.c17-crack{position:absolute;left:50%;bottom:66px;transform:translateX(-50%);font-size:26px;opacity:0;transition:.3s;z-index:8}
.c17-test.crash .c17-crack{opacity:1}
.c17-fixes{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:5px}
.c17-fix{padding:6px 8px;border-radius:7px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--dim);font-size:8.5px;text-align:left}
.c17-fix:hover,.c17-fix.on{border-color:rgba(79,224,208,.55);background:rgba(79,224,208,.08);color:var(--teal)}
.c17-bp-icon{width:150px;height:100px;margin:0 auto}
.c17-bp-icon svg{width:100%;height:100%}
@keyframes c17fall{0%{top:20px;transform:translateX(-50%) rotate(0)}100%{top:190px;transform:translateX(-50%) rotate(8deg)}}
@keyframes c17crash{0%{top:20px;transform:translateX(-50%) rotate(0)}70%{top:188px;transform:translateX(-50%) rotate(18deg)}100%{top:196px;transform:translateX(-50%) rotate(34deg)}}
@keyframes c17pass{0%{top:20px;transform:translateX(-50%) rotate(0)}100%{top:186px;transform:translateX(-50%) rotate(2deg)}}
@media(max-width:900px){.c17-stage,.c17-test{height:250px}.c17-context-grid{grid-template-columns:1fr}.c17-box{width:150px;height:110px}}
@media(max-height:800px){.c17-stage{height:286px}}