:root{--accent: #ec5800;--accent-hover: #ff7a2e;--accent-active: #c94a00}input[type=range]{accent-color:var(--accent)}body{font-size:16pt;background-color:#333;color:#aaa;margin:0;padding:0}#c{position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1;pointer-events:none}.content{max-width:800px;margin:0 auto;padding:20px 20px 60px;position:relative;z-index:1}h1{font-size:32px;color:ivory;text-align:center;margin-top:20px;margin-bottom:30px}p{font-size:16.5px;color:ivory;max-width:65ch;text-align:left;line-height:1.6;margin:20px auto}h2{font-size:26px;color:ivory;text-align:left;margin-left:100px;margin-bottom:20px}.mesh-view-wrapper{margin:40px 0;display:flex;flex-direction:column;align-items:center}.mesh-view{width:100%;max-width:600px;height:400px;margin:0 auto;display:block;background:transparent;pointer-events:auto;border-radius:0;cursor:grab}.mesh-view:active{cursor:grabbing}.view-controls{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:15px;margin-top:15px;padding:12px 20px;background:#444;border-radius:8px;max-width:600px;width:100%;box-sizing:border-box}.view-play{background:var(--accent);color:#fff;border:none;padding:0;width:40px;height:34px;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s}.view-play svg{display:block;fill:currentColor}.view-play .icon-pause,.view-play.playing .icon-play{display:none}.view-play.playing .icon-pause{display:block}.view-play:hover{background:var(--accent-hover)}.view-play:active{background:var(--accent-active)}.view-timeline{width:200px;flex-shrink:1}.view-frame{font-family:monospace;font-size:12pt;color:#999;min-width:35px}.view-speed-control{display:flex;align-items:center;gap:8px}.view-speed-control label{font-size:11pt;color:#999}.view-fps{width:64px;background:#555;color:#ddd;border:1px solid #666;border-radius:4px;padding:4px 6px;font-size:11pt}.view-fps:hover{background:#505050}.view-fps:focus{outline:none;border-color:var(--accent)}.view-buttons{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;background:#fff;padding:8px 12px;border-radius:8px 8px 0 0;max-width:600px;width:100%;box-sizing:border-box;margin-bottom:-1px;position:relative;z-index:1}.volume-view-wrapper .view-buttons{background:#000}.view-btn{background:transparent;color:#ddd;border:none;padding:4px;font-size:10pt;border-radius:4px;cursor:pointer;width:34px;height:34px;display:flex;align-items:center;justify-content:center;transition:background .2s}.view-btn svg{display:block}.view-btn:hover{background:#00000026}.view-btn:active{background:#00000040}.dataset-nav{display:flex;align-items:center;justify-content:flex-start;gap:8px;max-width:600px;width:100%;box-sizing:border-box;padding:8px 12px;margin-bottom:6px;background:#2a2a2a;border:1px solid #3a3a3a;border-radius:8px}.dataset-nav[hidden]{display:none}.dataset-prev,.dataset-next{background:transparent;color:#ddd;border:1px solid #666;border-radius:4px;width:28px;height:28px;font-size:16pt;line-height:1;padding:0 0 3px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s}.dataset-prev:hover:not(:disabled),.dataset-next:hover:not(:disabled){background:#3a3a3a;color:#fff}.dataset-prev:active:not(:disabled),.dataset-next:active:not(:disabled){background:var(--accent);color:#fff}.dataset-prev:disabled,.dataset-next:disabled{color:#666;border-color:#3a3a3a;cursor:default}.dataset-label{font-size:12pt;font-weight:700;color:#ddd;margin-left:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-progress{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 16px;background:#2a2a2a;border-radius:5px;transition:opacity .3s ease-out}.view-progress.hidden{opacity:0;pointer-events:none}.progress-label{font-size:11pt;color:#777}.progress-bar-wrapper{width:120px;height:6px;background:#555;border-radius:3px;overflow:hidden}.progress-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--accent),var(--accent-hover));border-radius:3px;transition:width .1s ease-out}.progress-text{font-size:11pt;color:#777;min-width:45px}.controls-hint{font-size:10pt;color:#666;text-align:center;margin-top:40px}.volume-view-wrapper{margin:40px 0;display:flex;flex-direction:column;align-items:center}.volume-view{width:100%;max-width:600px;height:400px;margin:0 auto;display:block;background:transparent;pointer-events:auto;border-radius:0;cursor:grab}.view-bottom-cap{background:#fff;height:8px;border-radius:0 0 8px 8px;max-width:600px;width:100%;margin-top:-1px;position:relative;z-index:1}.volume-view-wrapper .view-bottom-cap{background:#000}.volume-view:active{cursor:grabbing}.volume-controls{display:flex;flex-direction:column;gap:10px;margin-top:15px;padding:12px 20px;background:#444;border-radius:8px;max-width:600px;width:100%;box-sizing:border-box}.volume-control-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.volume-control-row label{font-size:11pt;color:#999;min-width:70px}.volume-control-row input[type=range]{flex:1;min-width:100px}.volume-playback-row{justify-content:center;gap:15px}.volume-playback-row .view-timeline{flex:0 1 auto;width:200px}.volume-playback-row .view-speed-control label{min-width:0}.volume-contrast-value,.volume-gamma-value{font-size:12pt;color:#999;min-width:45px;text-align:right}.volume-contrast-value{min-width:70px}.range-slider{position:relative;flex:1;min-width:100px;height:20px}.range-slider-track,.range-slider-fill{position:absolute;top:50%;height:4px;transform:translateY(-50%);border-radius:2px;pointer-events:none}.range-slider-track{left:0;right:0;background:#666}.range-slider-fill{background:var(--accent)}.range-slider input[type=range]{position:absolute;left:0;top:0;width:100%;height:100%;margin:0;background:transparent;pointer-events:none;-webkit-appearance:none;appearance:none}.range-slider input[type=range]:focus{outline:none}.range-slider input[type=range]::-webkit-slider-runnable-track{background:transparent;height:100%}.range-slider input[type=range]::-moz-range-track{background:transparent;height:100%}.range-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;pointer-events:auto;width:14px;height:14px;margin-top:3px;border-radius:50%;background:#ddd;border:1px solid #444;cursor:pointer}.range-slider input[type=range]::-moz-range-thumb{pointer-events:auto;width:14px;height:14px;border-radius:50%;background:#ddd;border:1px solid #444;cursor:pointer}.range-slider input[type=range]:focus::-webkit-slider-thumb{border-color:var(--accent)}.range-slider input[type=range]:focus::-moz-range-thumb{border-color:var(--accent)}.range-slider .volume-contrast-max{z-index:2}.range-slider .volume-contrast-min,.range-slider.max-active .volume-contrast-max{z-index:3}.range-slider.max-active .volume-contrast-min{z-index:2}.volume-progress{margin-top:10px}@media(max-width:700px){.mesh-view,.volume-view{height:300px}.view-controls,.volume-controls{gap:10px;padding:10px 15px}.view-timeline{width:150px}.view-speed-control{width:100%;justify-content:center}.volume-control-row{justify-content:center}.volume-control-row label{min-width:60px}}