/* =================================================================== INCEPTION_V65_UNIFIED_CARDS FINAL DIRECTION BERANDA - Statistik + Journey = SATU WHITE CARD BESAR - Statistik tetap 3 card - Journey tetap 4 internal cards PENGUMPULAN PENYISIHAN - Header + requirement + note + submit + hasil seleksi = SATU WHITE CARD BESAR - Logic React TIDAK disentuh =================================================================== */ /* =================================================================== SHARED MAIN CARD =================================================================== */ @media (min-width: 901px) { /* * Jangan mengubah struktur React. * * White card besar dibuat sebagai layer di belakang * seluruh isi halaman menggunakan ::before. */ .participant-content:has(.participant-stats-v41):has(.participant-home-timeline), .participant-content:has(.submission-initial-v61):has(.participant-selection-banner) { position: relative !important; isolation: isolate !important; } .participant-content:has(.participant-stats-v41):has(.participant-home-timeline)::before, .participant-content:has(.submission-initial-v61):has(.participant-selection-banner)::before { content: "" !important; position: absolute !important; top: 28px !important; right: 28px !important; bottom: 28px !important; left: 28px !important; z-index: 0 !important; pointer-events: none !important; background: #ffffff !important; border: 1px solid #dfe5ef !important; border-radius: 24px !important; box-shadow: 0 12px 32px rgba( 29, 45, 79, .055 ) !important; } .participant-content:has(.participant-stats-v41):has(.participant-home-timeline) > *, .participant-content:has(.submission-initial-v61):has(.participant-selection-banner) > * { position: relative !important; z-index: 1 !important; } } /* =================================================================== A. BERANDA =================================================================== */ @media (min-width: 901px) { /* --------------------------------------------------------------- Statistik sekarang menjadi SECTION pertama di main white card. --------------------------------------------------------------- */ .participant-content:has(.participant-home-timeline) .participant-stats-v41 { margin: 0 !important; padding: 24px 26px 26px !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; border-bottom: 1px solid #e5eaf2 !important; } .participant-content:has(.participant-home-timeline) .participant-stats-v41-grid { grid-template-columns: repeat( 3, minmax(0, 1fr) ) !important; gap: 15px !important; } /* * Mini cards statistik tetap ada, * karena memang diminta sebagai isi main card. */ .participant-content:has(.participant-home-timeline) .participant-stat-v41 { min-height: 110px !important; border: 1px solid #dfe5ef !important; border-radius: 15px !important; background: linear-gradient( 145deg, #fbfcff 0%, #f7f9fd 100% ) !important; box-shadow: none !important; } /* --------------------------------------------------------------- Journey = SECTION kedua dalam card yang sama. --------------------------------------------------------------- */ .participant-content:has(.participant-stats-v41) .participant-home-timeline { position: relative !important; margin: 0 !important; padding: 58px 26px 26px !important; background: transparent !important; border: 0 !important; box-shadow: none !important; grid-template-columns: repeat( 4, minmax(0, 1fr) ) !important; gap: 15px !important; } /* * Section title internal. */ .participant-content:has(.participant-stats-v41) .participant-home-timeline::before { content: "PERJALANAN KOMPETISI" !important; position: absolute !important; top: 24px !important; left: 26px !important; color: #536cc5 !important; font-family: inherit !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .13em !important; line-height: 1 !important; } /* * Journey cards tetap sebagai internal panels. */ .participant-content:has(.participant-stats-v41) .participant-home-timeline .journey-stage { border-radius: 16px !important; box-shadow: none !important; } } /* =================================================================== BERANDA TABLET =================================================================== */ @media (min-width: 901px) and (max-width: 1180px) { .participant-content:has(.participant-stats-v41) .participant-home-timeline { grid-template-columns: repeat( 2, minmax(0, 1fr) ) !important; } } /* =================================================================== B. PENGUMPULAN PENYISIHAN =================================================================== */ @media (min-width: 901px) { /* --------------------------------------------------------------- Hilangkan visual outer card lama. White card sekarang berasal dari V65 main wrapper. --------------------------------------------------------------- */ .participant-content:has(.submission-initial-v61) .submission-initial-v61, .participant-content:has(.submission-initial-v61) .submission-section { margin: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } /* * Header pengumpulan = section pertama. */ .participant-content:has(.submission-initial-v61) .submission-section-head { margin: 0 !important; padding: 24px 26px 25px !important; border-bottom: 1px solid #e5eaf2 !important; } /* * Form menjadi bagian tengah dari card besar. */ .participant-content:has(.submission-initial-v61) .submission-form-v61 { padding: 24px 26px 0 !important; } /* --------------------------------------------------------------- Proposal + GitHub tetap 2 internal panels. BUKAN outer cards halaman. --------------------------------------------------------------- */ .participant-content:has(.submission-initial-v61) .submission-requirement { border: 1px solid #dfe5ef !important; border-radius: 15px !important; background: #fbfcff !important; box-shadow: none !important; overflow: hidden !important; } /* * Accent tipis dipertahankan tapi dibuat halus. */ .participant-content:has(.submission-initial-v61) .submission-requirement::before { height: 2px !important; opacity: .58 !important; } /* --------------------------------------------------------------- Sebelum mengirim = bukan card terpisah. Sekarang hanya section dengan divider. --------------------------------------------------------------- */ .participant-content:has(.submission-initial-v61) .submission-guide-note { margin: 22px 0 0 !important; padding: 18px 0 !important; border: 0 !important; border-top: 1px solid #e5eaf2 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; } .participant-content:has(.submission-initial-v61) .submission-guide-note > b { color: #111827 !important; font-weight: 400 !important; } .participant-content:has(.submission-initial-v61) .submission-guide-note > span { color: #111827 !important; font-weight: 400 !important; } /* --------------------------------------------------------------- Footer submit = section, bukan mini card. --------------------------------------------------------------- */ .participant-content:has(.submission-initial-v61) .participant-save { margin: 0 !important; padding: 18px 0 23px !important; border: 0 !important; border-top: 1px solid #e5eaf2 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; } .participant-content:has(.submission-initial-v61) .participant-save > div > strong { color: #111827 !important; font-weight: 400 !important; } .participant-content:has(.submission-initial-v61) .participant-save > div > span { color: #111827 !important; font-weight: 400 !important; } /* --------------------------------------------------------------- HASIL SELEKSI Sekarang masih punya warna status, TAPI berada di dalam white card besar. --------------------------------------------------------------- */ .participant-content:has(.submission-initial-v61) .participant-selection-banner { margin: 0 26px 26px !important; padding: 22px 24px !important; border: 1px solid #eadcaf !important; border-radius: 16px !important; background: linear-gradient( 135deg, #fffdf6 0%, #fff9e7 100% ) !important; box-shadow: none !important; } .participant-content:has(.submission-initial-v61) .participant-selection-banner h2, .participant-content:has(.submission-initial-v61) .participant-selection-banner h3 { color: #24314e !important; } .participant-content:has(.submission-initial-v61) .participant-selection-banner p { color: #111827 !important; font-weight: 400 !important; } } /* =================================================================== C. MOBILE / TABLET SMALL =================================================================== */ @media (max-width: 900px) { .participant-content:has(.participant-stats-v41):has(.participant-home-timeline), .participant-content:has(.submission-initial-v61):has(.participant-selection-banner) { position: relative !important; isolation: isolate !important; } .participant-content:has(.participant-stats-v41):has(.participant-home-timeline)::before, .participant-content:has(.submission-initial-v61):has(.participant-selection-banner)::before { content: "" !important; position: absolute !important; top: 14px !important; right: 14px !important; bottom: 14px !important; left: 14px !important; z-index: 0 !important; pointer-events: none !important; background: #ffffff !important; border: 1px solid #dfe5ef !important; border-radius: 18px !important; box-shadow: 0 8px 24px rgba( 29, 45, 79, .045 ) !important; } .participant-content:has(.participant-stats-v41):has(.participant-home-timeline) > *, .participant-content:has(.submission-initial-v61):has(.participant-selection-banner) > * { position: relative !important; z-index: 1 !important; } /* BERANDA */ .participant-content:has(.participant-home-timeline) .participant-stats-v41 { margin: 0 !important; padding: 19px 20px 21px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid #e5eaf2 !important; border-radius: 0 !important; box-shadow: none !important; } .participant-content:has(.participant-home-timeline) .participant-stats-v41-grid { grid-template-columns: 1fr !important; } .participant-content:has(.participant-stats-v41) .participant-home-timeline { grid-template-columns: 1fr !important; margin: 0 !important; padding: 54px 20px 21px !important; } .participant-content:has(.participant-stats-v41) .participant-home-timeline::before { content: "PERJALANAN KOMPETISI" !important; position: absolute !important; top: 22px !important; left: 20px !important; color: #536cc5 !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: .12em !important; } /* PENGUMPULAN */ .participant-content:has(.submission-initial-v61) .submission-initial-v61, .participant-content:has(.submission-initial-v61) .submission-section { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; } .participant-content:has(.submission-initial-v61) .submission-section-head { padding: 20px 20px 22px !important; border-bottom: 1px solid #e5eaf2 !important; } .participant-content:has(.submission-initial-v61) .submission-form-v61 { padding: 20px 20px 0 !important; } .participant-content:has(.submission-initial-v61) .submission-guide-note { background: transparent !important; border: 0 !important; border-top: 1px solid #e5eaf2 !important; border-radius: 0 !important; padding: 17px 0 !important; } .participant-content:has(.submission-initial-v61) .participant-save { background: transparent !important; border: 0 !important; border-top: 1px solid #e5eaf2 !important; border-radius: 0 !important; padding: 17px 0 21px !important; } .participant-content:has(.submission-initial-v61) .participant-selection-banner { margin: 0 20px 21px !important; padding: 20px !important; border-radius: 14px !important; box-shadow: none !important; } } /* =================================================================== END V65 =================================================================== */