/* TRINITY FIT IQ V6.7 — Media Activation + Recipe Completion + Natural 3D Startup */
:root{--v67-green:#8ed86e;--v67-lime:#dff48b;--v67-bg:#030805;--v67-panel:#0d1813;--v67-line:#294238}

/* --- Professional startup: natural logo face, subtle 3D depth --- */
.v67Startup{position:fixed;inset:0;z-index:1000000;display:grid;place-items:center;overflow:hidden;background:
  radial-gradient(circle at 50% 44%,rgba(105,190,86,.18),transparent 22%),
  radial-gradient(circle at 50% 48%,#0b1a11 0,#061009 40%,#020503 100%);color:#eef7f0;transition:opacity .5s ease,visibility .5s ease}
.v67Startup.v67Out{opacity:0;visibility:hidden;pointer-events:none}
.v67Startup::before{content:"";position:absolute;inset:-25%;background:conic-gradient(from 180deg at 50% 50%,transparent,rgba(129,213,105,.04),transparent 22%,rgba(223,244,139,.035),transparent 55%);animation:v67BgTurn 10s linear infinite}
.v67GridGlow{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(circle at center,#000 0,transparent 66%);opacity:.35}
.v67StartupInner{position:relative;z-index:2;width:min(92vw,520px);display:flex;flex-direction:column;align-items:center;text-align:center;padding:max(24px,env(safe-area-inset-top)) 24px max(30px,env(safe-area-inset-bottom));perspective:1200px}
.v67LogoStage{position:relative;width:190px;height:190px;display:grid;place-items:center;transform-style:preserve-3d;animation:v67StageIn 1.1s cubic-bezier(.2,.9,.18,1) both}
.v67Halo{position:absolute;width:155%;height:155%;border-radius:50%;background:radial-gradient(circle,rgba(223,244,139,.19),rgba(104,200,92,.06) 42%,transparent 70%);filter:blur(16px);animation:v67Halo 2.2s ease-in-out infinite alternate}
.v67Ring{position:absolute;border:1px solid rgba(196,238,169,.14);border-radius:50%;pointer-events:none}
.v67Ring.r1{width:230px;height:230px;transform:rotateX(72deg);animation:v67Ring1 7s linear infinite}
.v67Ring.r2{width:260px;height:260px;transform:rotateY(70deg) rotateZ(24deg);border-color:rgba(107,200,92,.11);animation:v67Ring2 9s linear infinite reverse}
.v67LogoDepth{position:absolute;width:164px;height:164px;border-radius:50%;transform:translateZ(-18px) translateY(8px);background:linear-gradient(145deg,#2d5a32,#09110b);box-shadow:0 24px 55px rgba(0,0,0,.52),0 0 48px rgba(122,211,97,.16)}
.v67LogoDisc{position:relative;width:164px;height:164px;border-radius:50%;transform:translateZ(14px);background:#f3f3ef;overflow:hidden;box-shadow:0 0 0 1px rgba(223,244,139,.28),0 18px 46px rgba(0,0,0,.42),0 0 38px rgba(126,210,102,.15);animation:v67Float 3.3s 1.1s ease-in-out infinite}
.v67LogoDisc::after{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(130deg,rgba(255,255,255,.28),transparent 32%,transparent 66%,rgba(44,91,43,.08));pointer-events:none}
.v67LogoDisc img{width:100%;height:100%;object-fit:cover;display:block;clip-path:circle(49% at 50% 50%);filter:saturate(1.03) contrast(1.015);transform:none!important}
.v67Brand{margin-top:28px;animation:v67CopyIn .7s .42s both}
.v67Brand h1{margin:0;font-size:clamp(30px,8vw,42px);font-weight:950;letter-spacing:1.2px;line-height:1}.v67Brand h1 span{color:var(--v67-lime)}
.v67Brand b{display:block;margin-top:9px;font-size:10px;letter-spacing:4.8px;color:#9db4a5}.v67Brand p{margin:8px 0 0;font-size:11px;letter-spacing:2px;color:#e3ece6;font-weight:800}
.v67Progress{width:min(72vw,310px);height:3px;margin-top:26px;border-radius:999px;background:#15251c;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.v67Progress i{display:block;width:100%;height:100%;transform-origin:right;background:linear-gradient(90deg,#4a9f53,var(--v67-lime));box-shadow:0 0 13px rgba(223,244,139,.55);animation:v67Progress 2.15s .1s cubic-bezier(.25,.8,.2,1) both}
.v67Boot{margin-top:9px;font-size:9px;letter-spacing:2.4px;color:#6f8577;font-weight:900}
.v67Skip{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);border:1px solid rgba(255,255,255,.10);background:rgba(7,15,10,.52);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#9eb0a4;border-radius:999px;padding:8px 15px;font-size:11px;font-weight:800;opacity:0;animation:v67SkipIn .3s .9s forwards}
@keyframes v67StageIn{0%{opacity:0;transform:translateY(24px) rotateX(28deg) rotateY(-22deg) scale(.72)}60%{opacity:1;transform:translateY(-4px) rotateX(4deg) rotateY(5deg) scale(1.03)}100%{transform:none}}
@keyframes v67Float{0%,100%{transform:translateZ(14px) translateY(0)}50%{transform:translateZ(14px) translateY(-5px)}}
@keyframes v67CopyIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes v67Progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes v67Halo{from{opacity:.55;transform:scale(.94)}to{opacity:1;transform:scale(1.06)}}
@keyframes v67Ring1{to{transform:rotateX(72deg) rotateZ(360deg)}}
@keyframes v67Ring2{to{transform:rotateY(70deg) rotateZ(384deg)}}
@keyframes v67BgTurn{to{transform:rotate(360deg)}}
@keyframes v67SkipIn{to{opacity:1}}
@media(max-width:520px){.v67LogoStage{width:178px;height:178px}.v67LogoDisc,.v67LogoDepth{width:152px;height:152px}.v67Ring.r1{width:212px;height:212px}.v67Ring.r2{width:238px;height:238px}.v67Brand{margin-top:24px}}
@media(prefers-reduced-motion:reduce){.v67Startup::before,.v67Halo,.v67Ring,.v67LogoStage,.v67LogoDisc{animation:none!important}.v67Progress i{animation-duration:.25s}.v67Startup{transition-duration:.2s}}

/* --- Exercise media playback --- */
.v67MediaShell{border:1px solid #304b40;background:#08110d;border-radius:18px;overflow:hidden;position:relative}
.v67MediaShell img,.v67MediaShell video{display:block;width:100%;max-height:62vh;object-fit:contain;background:#050906}
.v67MediaShell iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#050906}
.v67MediaMeta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 12px;background:#0c1712;border-top:1px solid #243b31}.v67MediaMeta span{font-size:11px;color:#dce9df;font-weight:850}.v67MediaMeta small{font-size:10px;color:#81988a}.v67MediaMeta a,.v67MediaMeta button{font-size:10px;color:#dff48b;background:none;border:0;padding:0;font-weight:800;text-decoration:none}
.v67MediaError{padding:22px;text-align:center}.v67MediaError b{display:block;margin-bottom:7px}.v67MediaError p{color:#9caf9f;font-size:12px}.v67MediaError .actions{justify-content:center}
.v67ExternalFrame{width:100%;height:min(58vh,520px);border:0;background:#fff}.v67PendingPreview{border-color:#665b32}.v67PendingPreview .v67MediaMeta{background:#1d1a0f}.v67PendingTag{color:#ffe2a2!important}

/* --- Recipe completeness --- */
.v67ReadyBadge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;border:1px solid #3d5c4b;background:#11231a;color:#dff7df;font-size:10px;font-weight:850}
.v67RecipeMeta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}.v67RecipeMeta>div{padding:10px;border-radius:12px;background:#0c1712;border:1px solid #294238}.v67RecipeMeta b{display:block;color:#eef7f0}.v67RecipeMeta span{font-size:10px;color:#8fa398}
.v67Ingredient{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.06)}.v67Ingredient b{font-size:12px}.v67Ingredient span{font-weight:900;color:#e9f3ec}.v67Ingredient small{grid-column:1/-1;color:#83978c;font-size:10px}
.v67CookingGuide{margin-top:12px;padding:11px;border-radius:12px;background:#101d17;border:1px solid #345044;color:#b8c8bf;font-size:11px;line-height:1.7}.v67CookingGuide b{color:#eef6f0}
.v67Estimated{color:#ffe2a2!important;border-color:#665b32!important;background:#211d10!important}
@media(max-width:620px){.v67RecipeMeta{grid-template-columns:1fr 1fr}.v67RecipeMeta>div:last-child{grid-column:1/-1}}
