/* cropdetective — game cartridge styles. Carved from public/index.html (Stage 1 monolith split).
   Loads after platform.css; selectors are game-prefixed. */
        /* ── Crop Detective ── */
        #cd-upload-screen,#cd-gallery-screen,#cd-reveal-screen,#cd-result-screen {
            display:none; position:absolute; inset:0; z-index:55; background:radial-gradient(circle at 50% 20%,#141020,#050508 70%);
            flex-direction:column; align-items:center; overflow-y:auto; overflow-x:hidden; color:#fff; padding:calc(env(safe-area-inset-top) + 14px) 14px calc(env(safe-area-inset-bottom) + 16px); gap:12px;
        }
        .cd-category { font-size:1.25em; font-weight:900; text-align:center; color:#fff; max-width:94%; }
        /* The reveal viewport — the whole game. A fixed square window; the photo inside is
           scaled/positioned via transform, and the transform TRANSITION is the suspense. */
        .cd-viewport { position:relative; width:min(86vw,52vh); aspect-ratio:1; border-radius:16px; overflow:hidden; background:#000;
            border:3px solid #7c4dff; box-shadow:0 0 40px rgba(124,77,255,0.35), inset 0 0 60px rgba(0,0,0,0.55); flex-shrink:0; }
        .cd-viewport img { position:absolute; left:0; top:0; transform-origin:0 0; will-change:transform;
            transition:transform 2.2s cubic-bezier(0.22, 1, 0.36, 1); image-rendering:auto; }
        .cd-viewport.cd-full img { transition:transform 1s cubic-bezier(0.22, 1, 0.36, 1); }
        .cd-vignette { position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 0 70px 24px rgba(0,0,0,0.65); border-radius:13px; }
        .cd-viewport.cd-pulse { animation:cd-pulse 0.7s ease-out; }
        @keyframes cd-pulse { 0% { box-shadow:0 0 70px rgba(124,77,255,0.9), inset 0 0 60px rgba(0,0,0,0.55); } 100% { box-shadow:0 0 40px rgba(124,77,255,0.35), inset 0 0 60px rgba(0,0,0,0.55); } }
        .cd-stage-label { font-family:monospace; color:#b39ddb; font-size:0.82em; letter-spacing:2px; min-height:1.2em; }
        .cd-worth { font-family:monospace; font-weight:bold; font-size:0.88em; color:var(--c-brand); background:rgba(255,235,59,0.1); border:1.5px solid rgba(255,235,59,0.5); border-radius:16px; padding:5px 14px; }
        .cd-worth.cd-worth-hot { color:#ff8a65; border-color:#ff8a65; background:rgba(255,138,101,0.12); animation:cd-hot 1.2s infinite; }
        @keyframes cd-hot { 0%,100% { box-shadow:0 0 4px rgba(255,138,101,0.3); } 50% { box-shadow:0 0 16px rgba(255,138,101,0.7); } }
        .cd-guess-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; width:min(440px,94%); }
        .cd-guess-btn { padding:12px 8px; border:2px solid #4a3a75; border-radius:12px; background:rgba(124,77,255,0.12); color:#fff;
            font-weight:bold; font-size:0.95em; cursor:pointer; letter-spacing:0.5px; transition:transform 0.1s, border-color 0.2s; }
        .cd-guess-btn:disabled { opacity:0.35; }
        .cd-guess-btn:active { transform:scale(0.96); }
        .cd-guess-grid.cd-wrong { animation:cd-shake 0.4s; }
        @keyframes cd-shake { 0%,100%{transform:translateX(0);} 25%{transform:translateX(-8px);} 75%{transform:translateX(8px);} }
        .cd-feed { font-family:monospace; font-size:0.8em; color:#ef9a9a; min-height:1.3em; text-align:center; }
        .cd-owner-card { background:rgba(255,235,59,0.08); border:2px solid var(--c-brand); border-radius:14px; padding:16px 22px; text-align:center; max-width:92%; }
        #cd-gallery-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(96px,1fr)); gap:10px; width:min(460px,94%); }
        #cd-gallery-grid img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:10px; border:2px solid rgba(255,255,255,0.18); }
        #cd-upload-preview { max-width:min(300px,80vw); max-height:34vh; border-radius:12px; border:3px solid #7c4dff; display:none; }
        #cd-result-photo { max-width:min(340px,88vw); max-height:38vh; border-radius:12px; border:3px solid var(--c-brand); }
        .cd-scores { display:flex; flex-direction:column; gap:6px; min-width:min(360px,90%); }
        .cd-score-row { display:flex; justify-content:space-between; gap:16px; background:rgba(255,255,255,0.05); border:1.5px solid rgba(255,255,255,0.12); border-radius:10px; padding:8px 14px; }
        .cd-score-row .pts { color:var(--c-brand); font-family:monospace; }