:root{font-family:Inter,system-ui,Arial,sans-serif;color:#f7f1e7;background:#120f18}*{box-sizing:border-box}body{margin:0}header{padding:20px 30px;border-bottom:1px solid #403344;display:flex;justify-content:space-between;align-items:center;gap:15px}header strong{font-size:19px;letter-spacing:.3px}header small{color:#c5b5c7}main{max-width:1350px;margin:25px auto;padding:0 22px}.intro h1{font-size:clamp(24px,3vw,38px);margin:0 0 7px}.intro p{color:#c5b5c7;margin:0 0 20px}.layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(285px,1fr);gap:20px}.viewer,.panel{background:#201a27;border:1px solid #413448;border-radius:18px;overflow:hidden}.stage{background:#100d13;position:relative;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center}canvas{width:100%;height:100%;object-fit:contain}video{display:none}.empty{position:absolute;text-align:center;padding:20px;color:#c7b9c9;pointer-events:none}.empty span{font-size:45px;display:block;margin-bottom:10px}.pill{position:absolute;top:15px;left:15px;padding:8px 12px;background:#15121acb;border:1px solid #55435b;border-radius:50px;font-size:12px}.controls{padding:16px;display:flex;flex-wrap:wrap;gap:9px;align-items:center}button,select{background:#362a40;color:#fff;border:1px solid #594560;border-radius:10px;padding:11px 13px;font:inherit;cursor:pointer}button:hover{background:#4b3655}button:disabled{opacity:.45;cursor:not-allowed}.primary{background:#d8ad64;color:#211525;font-weight:700;border-color:#d8ad64}.primary:hover{background:#efc77e}select{max-width:180px}.panel{padding:20px}.panel h2{margin:0 0 8px;font-size:21px}.panel p,.hint{color:#c5b5c7;font-size:13px;line-height:1.6}.tabs{display:flex;gap:7px;margin:18px 0}.tabs button{flex:1}.tabs button.active,.item.active{border-color:#e2b968;background:#46354b}.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.item{padding:10px;text-align:center;min-height:133px}.item img{display:block;width:100%;height:80px;object-fit:contain;margin-bottom:5px}.item span{font-size:12px}.adjust{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:18px}.adjust input{grid-column:1/-1;width:100%;accent-color:#d8ad64}.status{margin:12px 0 0;color:#eac58b;font-size:13px;min-height:36px}.foot{font-size:12px;color:#a99aab;margin-top:17px}a{color:#f2ca88}@media(max-width:850px){.layout{grid-template-columns:1fr}header{padding:14px}main{padding:0 12px}.stage{aspect-ratio:4/3}}