.ticketbox-media{min-width:0;overflow:hidden!important;background:radial-gradient(ellipse at 50% 80%,#25332940,transparent 65%);border-radius:18px}.ticketbox-cylinder{position:relative;height:340px;width:100%;container-type:inline-size;perspective:1000px;--tb-radius:min(27cqw,185px);--tb-phone:min(19cqw,112px)}.ticketbox-orbit{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(-8deg) rotateY(0deg);animation:ticketboxOrbit 20s linear infinite;animation-play-state:paused}.ticketbox-cylinder.is-active.is-visible .ticketbox-orbit{animation-play-state:running}.ticketbox-phone{position:absolute;left:50%;top:50%;width:var(--tb-phone);transform:translate(-50%,-50%) rotateY(var(--angle)) translateZ(var(--tb-radius));transform-style:preserve-3d;backface-visibility:hidden;cursor:zoom-in;outline:none}.ticketbox-frame{position:relative;padding:3px;border:1px solid #c3c6ca;border-radius:19px;background:linear-gradient(110deg,#eeece5,#77756e 30%,#ece9e1 65%,#626059);box-shadow:1px 0 #77756e,2px 0 #5b5a55,3px 0 #41423e,0 12px 25px #0007;isolation:isolate}.ticketbox-screen{position:relative;width:100%;aspect-ratio:400/874;border-radius:15px;background:#111814;overflow:hidden}.ticketbox-screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.ticketbox-screen img[hidden]{display:none}.ticketbox-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:radial-gradient(ellipse at top,#334b3a,#111814 70%);color:#b6d6ba;font:9px system-ui;letter-spacing:1px}.ticketbox-placeholder strong{font-size:36px;font-weight:400;color:#f4fff5}.ticketbox-island{position:absolute;top:7px;left:50%;transform:translateX(-50%);width:28%;height:7px;border-radius:20px;background:#030605;box-shadow:0 0 0 1px #ffffff0b;pointer-events:none}.ticketbox-island::after{content:'';position:absolute;right:3px;top:2px;width:3px;height:3px;border-radius:50%;background:#1c2940}.ticketbox-phone:focus-visible .ticketbox-frame{outline:2px solid white;outline-offset:4px}.ticketbox-viewer{border:0;border-radius:18px;padding:20px;background:#131714;color:white;max-width:calc(100vw - 40px)}.ticketbox-viewer::backdrop{background:#000b;backdrop-filter:blur(12px)}.ticketbox-viewer button{display:block;margin:0 0 12px auto;border:1px solid #ffffff40;border-radius:50%;width:36px;height:36px;background:transparent;color:white;font-size:20px;cursor:pointer}.ticketbox-viewer .ticketbox-screen{width:min(320px,calc((100dvh - 130px)*400/874));border:3px solid #a5a9af;border-radius:22px}.ticketbox-viewer .ticketbox-placeholder{font-size:14px}.project-hero .ticketbox-cylinder{height:370px}.phone-editor[data-project="2"] .phone-slot-preview{aspect-ratio:400/874}.phone-editor[data-project="2"] .phone-slot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:700px){.ticketbox-cylinder{height:285px;--tb-radius:26cqw;--tb-phone:21cqw}.ticketbox-frame{padding:2px;border-radius:14px}.ticketbox-screen{border-radius:11px}.ticketbox-island{top:6px;height:6px}.phone-editor[data-project="2"] .phone-slot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@keyframes ticketboxOrbit{from{transform:rotateX(-8deg) rotateY(0deg)}to{transform:rotateX(-8deg) rotateY(-360deg)}}@media(prefers-reduced-motion:reduce){.ticketbox-orbit{animation:none}}
/* Eight solid, upright devices; no light behind the carousel. */
.ticketbox-media{background:transparent;overflow:visible!important}.ticketbox-cylinder{--tb-radius:min(32cqw,220px);--tb-phone:min(17cqw,105px);touch-action:pan-y;cursor:grab}.ticketbox-cylinder.is-dragging{cursor:grabbing}.ticketbox-orbit{animation:none;transform:rotateY(0deg)}.ticketbox-phone{backface-visibility:visible}.ticketbox-device{position:relative;transform-style:preserve-3d;transition:transform .25s}.ticketbox-phone:hover .ticketbox-device,.ticketbox-phone:focus-visible .ticketbox-device{transform:translateZ(10px)}.ticketbox-frame{backface-visibility:hidden;transform:translateZ(.1px);box-shadow:none;isolation:auto;background:#94999f;overflow:hidden}.ticketbox-back{position:absolute;inset:0;border-radius:19px;background:linear-gradient(105deg,#93989e,#c1c5ca 50%,#6d737b);transform:translateZ(-10px) rotateY(180deg);backface-visibility:hidden;border:1px solid #626970;box-sizing:border-box}.ticketbox-back::after{content:'';position:absolute;left:8%;right:8%;top:27%;bottom:6%;border-radius:13px;background:#a5a9af}.ticketbox-back-mark{position:absolute;left:45%;top:48%;color:#747a82;font:20px system-ui;z-index:1}.ticketbox-camera-plate{position:absolute;left:5%;right:5%;top:4%;height:20%;border-radius:10px;background:#8c9299;box-shadow:0 0 0 1px #6f757d;transform:translateZ(2px)}.ticketbox-camera-plate i{position:absolute;width:22%;aspect-ratio:1;border-radius:50%;border:2px solid #41473f;background:radial-gradient(circle,#223e45 0 15%,#050907 20% 50%,#282f29 65%,#050706);box-shadow:0 0 0 1px #c4c7bf}.ticketbox-camera-plate i:nth-child(1){left:7%;top:7%}.ticketbox-camera-plate i:nth-child(2){left:7%;bottom:7%}.ticketbox-camera-plate i:nth-child(3){left:35%;top:32%}.ticketbox-camera-plate b{position:absolute;right:13%;top:22%;width:8%;aspect-ratio:1;background:#edece0;border-radius:50%}.ticketbox-edge{position:absolute;background:linear-gradient(90deg,#717880,#c4c8cd,#798088);backface-visibility:hidden}.edge-left,.edge-right{top:12px;bottom:12px;width:10px;transform:translateZ(-5px) rotateY(90deg)}.edge-left{left:-5px}.edge-right{right:-5px}.edge-top,.edge-bottom{left:12px;right:12px;height:10px;transform:translateZ(-5px) rotateX(90deg)}.edge-top{top:-5px}.edge-bottom{bottom:-5px}.edge-left i,.edge-right i{position:absolute;left:2px;width:6px;height:25px;border-radius:3px;background:#666e77;border:1px solid #b8bec5}.edge-left i:first-child{top:27%}.edge-left i:last-child{top:42%}.edge-right i{top:34%;height:34px}@media(max-width:700px){.ticketbox-back{border-radius:14px}.ticketbox-camera-plate{border-radius:7px}.ticketbox-cylinder{--tb-radius:31cqw;--tb-phone:19cqw}.ticketbox-back::after{border-radius:9px}}
.ticketbox-shell-layer{position:absolute;inset:0;border-radius:19px;background:#d9783f;backface-visibility:visible;pointer-events:none}.edge-left{transform:translateZ(-5px) rotateY(-90deg)}.edge-bottom{transform:translateZ(-5px) rotateX(-90deg)}@media(max-width:700px){.ticketbox-shell-layer{border-radius:14px}}
.ticketbox-screen:has(img:not([hidden])) .ticketbox-placeholder{visibility:hidden}

/* Shared full-screen screenshot viewer, with Ticketbox screen proportions. */
.ticketbox-viewer.winnix-viewer{border-radius:0;background:#0b0c0fed;padding:24px;max-width:none}.ticketbox-viewer.winnix-viewer button{margin:0;width:42px;height:42px;font:20px system-ui}.ticketbox-viewer .zoom-phone{aspect-ratio:400/874;width:min(300px,calc((100dvh - 180px)*400/874),calc(100vw - 160px));border-color:#a5a9af;position:relative}.ticketbox-viewer .zoom-phone>img{aspect-ratio:400/874;height:100%}.ticketbox-viewer .ticketbox-placeholder{font-size:12px}@media(max-width:600px){.ticketbox-viewer.winnix-viewer{padding:16px}.ticketbox-viewer.winnix-viewer button{width:36px;height:36px}.ticketbox-viewer .zoom-phone{width:min(300px,calc((100dvh - 170px)*400/874),calc(100vw - 135px))}}

.ticketbox-model-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.has-real-model .ticketbox-device{opacity:0}.has-real-model .ticketbox-phone:focus-visible{outline:2px solid #b8bec5;outline-offset:4px;border-radius:18px}

.ticketbox-viewer.winnix-viewer button{display:grid;place-items:center;flex:none;border:1px solid #ffffff24;border-radius:50%;background:#ffffff0a;color:#fff;cursor:pointer;transition:background .2s}.ticketbox-viewer.winnix-viewer button:hover{background:#ffffff20}

.ticketbox-screen img,.ticketbox-viewer .zoom-phone>img{object-fit:cover}

/* Native screenshot pixels and rounded clipping, independently of model lighting. */
.ticketbox-cylinder,.project-hero .ticketbox-cylinder{height:390px;--tb-phone:min(20cqw,123px)}
.ticketbox-native-layer{position:absolute;inset:0;pointer-events:none;perspective:1000px;perspective-origin:50% 50%}
.ticketbox-native-screen{position:absolute;left:50%;top:50%;width:400px;height:874px;overflow:hidden;border-radius:50px;background:#080808;transform-origin:50% 50%;backface-visibility:hidden;isolation:isolate;clip-path:inset(0 round 50px)}
.ticketbox-native-screen>img{display:block;width:400px;height:874px;object-fit:cover;user-select:none}
.ticketbox-native-island{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:132px;height:36px;background:#030405;border-radius:24px;pointer-events:none}
.ticketbox-cylinder,.ticketbox-cylinder *{cursor:grab!important;user-select:none;-webkit-user-drag:none}
.ticketbox-cylinder.is-dragging,.ticketbox-cylinder.is-dragging *{cursor:grabbing!important}
.has-real-model .ticketbox-orbit{z-index:10000}
.has-real-model .ticketbox-device{opacity:0}
@media(max-width:700px){.ticketbox-cylinder,.project-hero .ticketbox-cylinder{height:330px;--tb-phone:22cqw}}

.ticketbox-phone.is-centered:hover .ticketbox-device,.ticketbox-phone.is-centered:focus-visible .ticketbox-device{transform:translateZ(20px) scale(1.10)}

.ticketbox-intro{position:absolute;inset:0;z-index:20000;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,visibility .3s}
.ticketbox-intro-animation{height:100%;aspect-ratio:400/874;max-width:100%;overflow:hidden;border-radius:20px}
.ticketbox-intro-animation svg{display:block;width:100%;height:100%}
.is-intro .ticketbox-intro{opacity:1;visibility:visible;pointer-events:auto}
.is-intro .ticketbox-native-layer,.is-intro .ticketbox-orbit{pointer-events:none}
.ticketbox-native-layer{transition:opacity .35s ease}
@media(prefers-reduced-motion:reduce){.ticketbox-intro,.ticketbox-native-layer{transition:none}}

.ticketbox-screen{border-radius:17px}.ticketbox-viewer .zoom-phone{border-radius:20px}@media(max-width:700px){.ticketbox-screen{border-radius:13px}}

/* Card-wide opening with a fixed-size initial bouncing mark. */
.ticketbox-intro{overflow:hidden;border-radius:inherit}
.ticketbox-intro-animation{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);aspect-ratio:auto;max-width:none;border-radius:0;overflow:hidden}
.has-ticketbox-intro>.ticketbox-intro{opacity:1;visibility:visible;pointer-events:auto}
.has-ticketbox-intro>.acc-body,.has-ticketbox-intro>.project-hero-copy,.has-ticketbox-intro>.ticketbox-media{pointer-events:none}
.project-hero.has-ticketbox-intro{position:relative}

.has-ticketbox-intro>:not(.ticketbox-intro){pointer-events:none}

.ticketbox-intro{background:#fff;transition:none}.ticketbox-intro-animation{background:transparent}

.ticketbox-cylinder:not(.has-real-model) .ticketbox-native-layer{visibility:hidden}
