.lenticular-player{width:100%;color:#eef1ea;font:14px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--lp-accent:#b7f36b}
.lp-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:8px}.lp-heading strong{display:block;font-size:17px;letter-spacing:-.3px;font-weight:550}.lp-eyebrow{display:block;font-size:9px;font-weight:650;letter-spacing:2.2px;color:var(--lp-accent);margin-bottom:6px}.lp-counter{font:11px ui-monospace,monospace;white-space:nowrap;color:#bbc3b5}
.lp-stage{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:160px;perspective:1100px;padding:35px 7% 40px;box-sizing:border-box;cursor:grab;touch-action:pan-y;user-select:none;isolation:isolate;background:radial-gradient(ellipse at 50% 45%,#263127 0%,#151b17 45%,#101413 78%);border-radius:12px;outline:none;overflow:hidden}
.lp-stage:focus-visible{outline:2px solid var(--lp-accent);outline-offset:3px}.lp-stage.lp-dragging{cursor:grabbing}
.lp-plane{width:100%;position:relative;transform-style:preserve-3d;backface-visibility:hidden;box-shadow:0 24px 25px -14px #000,0 0 0 2px #a4b7a05e,0 0 0 4px #080b0a;will-change:transform;background:#141814;border-radius:3px}
.lp-plane canvas{display:block;width:100%;height:auto;border-radius:3px}
.lp-plane::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff38;border-radius:3px}
.lp-ridges,.lp-sheen{position:absolute;inset:0;border-radius:3px;pointer-events:none}.lp-ridges{opacity:var(--lp-ridge-opacity,.12);background:repeating-linear-gradient(90deg,#fff9 0px,#fff1 1px,#000b 2px,#0000 3px);mix-blend-mode:soft-light}.lp-sheen{opacity:var(--lp-shimmer-opacity,.3);background:linear-gradient(112deg,transparent calc(var(--lp-sheen-x,50%) - 32%),#ffffff0d calc(var(--lp-sheen-x,50%) - 12%),#ffffff52 var(--lp-sheen-x,50%),#ffffff0d calc(var(--lp-sheen-x,50%) + 12%),transparent calc(var(--lp-sheen-x,50%) + 32%));mix-blend-mode:screen}
.lp-loading{position:absolute;inset:0;display:grid;place-content:center;padding:24px;text-align:center;background:#121815e8;color:#cfdbc7;z-index:2}.lp-loading[hidden]{display:none}
.lp-instructions{display:flex;justify-content:space-between;gap:8px;color:#a8b6a6;font-size:11px;margin:13px 0 8px}.lp-instructions span:first-child{color:var(--lp-accent)}
.lp-scrub{display:flex;align-items:center;gap:12px;color:#8d9b89;font-size:10px}.lp-scrub input{flex:1;min-width:0}
.lenticular-player input[type=range]{accent-color:var(--lp-accent);width:100%;height:20px;cursor:pointer;margin:5px 0}.lenticular-player input:focus-visible{outline:2px solid var(--lp-accent);outline-offset:3px}
.lp-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 18px;padding:18px 0 6px;margin-top:7px;border-top:1px solid #2c342b}.lp-controls label{display:block;color:#bdc7b8;font-size:11px}.lp-controls output{float:right;color:#eef7e9;font-size:11px;margin-left:4px}.lp-effects-hint{color:#8d9b89;font-size:10px;margin:3px 0 14px;line-height:1.5}.lp-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}.lp-status{font-size:10px;color:#8d9b89}.lp-center{background:#222c21;border:1px solid #394834;color:#dcebd5;padding:7px 11px;border-radius:6px;font:11px system-ui;cursor:pointer;white-space:nowrap}.lp-center:hover{background:#33432c}
#lenticularHost[hidden]{display:none}#viewer:has(#lenticularHost:not([hidden])){align-items:stretch;padding:22px}.viewer-toolbar .tabs{flex-wrap:wrap}.viewer-toolbar{gap:10px}.viewer-footer:has(#downloadLenticular:not([hidden])){flex-wrap:wrap}#downloadLenticular{border:1px solid #688a45;background:#b7f36b;color:#14210d;border-radius:6px;padding:8px 12px;cursor:pointer;font-weight:600;font-size:12px}#downloadLenticular:disabled{opacity:.45;cursor:wait}
.lp-export-body{margin:0;background:#101413;min-height:100vh;display:grid;place-items:center;padding:28px;box-sizing:border-box}.lp-export-main{width:min(1100px,100%)}.lp-export-title{font:12px system-ui;color:#93a38c;margin:0 0 24px}.lp-export-note{font:11px/1.6 system-ui;color:#80907a;margin:22px 0 0}
@media(max-width:900px){.lp-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px}}
@media(max-width:540px){#viewer:has(#lenticularHost:not([hidden])){padding:14px}.lp-heading{align-items:flex-start;flex-wrap:wrap;gap:8px}.lp-heading strong{font-size:15px}.lp-counter{font-size:10px}.lp-stage{padding:27px 6% 30px}.lp-instructions{font-size:10px}.lp-instructions span:last-child{display:none}.lp-controls{gap:9px 16px}.lp-bottom{align-items:flex-start}.lp-export-body{padding:16px}.lp-export-title{margin-bottom:16px}}
