@import url('https://hangeul.pstatic.net/hangeul_static/css/nanum-square-round.css');
        
        * { font-family: 'NanumSquareRound', sans-serif !important; -webkit-tap-highlight-color: transparent; }
        
        body { background-color: #F9FAFB; user-select: none; overflow: hidden; margin: 0; }
        .app-container { height: 100dvh; display: flex; flex-direction: column; overflow: hidden; position: relative; }
        .no-scrollbar::-webkit-scrollbar { display: none; }
        
        /* 암송 모드 말씀 상자 */
        .word-box { 
            display: inline-block; 
            padding: 1px 3px; 
            margin: 1px 0.5px; 
            border-radius: 4px; 
            font-weight: 800; 
            transition: background-color 0.2s;
            line-height: inherit; 
            min-height: 1.25em;
            vertical-align: baseline;
        }
        .is-blinded .word-box { 
            background-color: rgba(0,0,0,0.06); 
            color: transparent !important; 
            border-bottom: none;
            box-shadow: none;
        }
        
        .word-box-text { color: #000000 !important; }

        .unified-card { background-color: white; padding: 1.15rem; border-radius: 1.75rem; border: 1px solid #F1F5F9; position: relative; transition: all 0.5s ease; }
        
        @keyframes slideUp { from { transform: translateY(50px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
        @keyframes floating { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-8px); } }
        
        /* 저장 버튼 컨테이너 */
        .save-btn-container { 
            animation: slideUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards; 
            position: fixed; bottom: 81px; left: 0; right: 0; display: flex; justify-content: center; z-index: 1000;
        }
        .animate-float { animation: floating 2.5s ease-in-out infinite; }
        
        .badge-dot { position: absolute; top: -1px; right: -1px; width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid white; z-index: 10; }
        .loading-screen { position: fixed; inset: 0; background: white; z-index: 9999; display: flex; align-items: center; justify-content: center; }
        
        .dashboard-header { background-color: white; border-radius: 2rem; border: 1px solid #F1F5F9; padding: 1.25rem; margin-bottom: 0.75rem; box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.02); }
        .profile-badge { width: 3.5rem; height: 3.5rem; border-radius: 9999px; overflow: hidden; background-color: #F8FAFC; border: 2px solid #F1F5F9; cursor: pointer; flex-shrink: 0; }
        .profile-badge img { width: 100%; height: 100%; object-fit: cover; }

        .sticky-title { 
            position: sticky; 
            top: 0; 
            z-index: 40; 
            background-color: #F9FAFB; 
            padding-top: 10px; 
            padding-bottom: 8px; 
        }
        
        .study-verse-card {
            border-radius: 2.75rem;
            position: relative;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            box-shadow: 0 10px 25px -10px rgba(0,0,0,0.08);
            border-width: 1px;
            /* 버그 수정 1: 터치 액션 제한으로 드래그 시 풀림 방지 */
            touch-action: none;
        }

        .pastel-blue { background-color: #EFF6FF; border-color: #DBEAFE; }
        .pastel-orange { background-color: #FFF7ED; border-color: #FFEDD5; }
        .pastel-green { background-color: #F0FDF4; border-color: #DCFCE7; }

        .verse-centering-area {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0 1.5rem;
            margin-top: 5rem; 
            margin-bottom: 4rem; 
        }

        .hold-fill { position: absolute; top: 0; left: 0; bottom: 0; background-color: rgba(0,0,0,0.03); transition: width 0.1s linear; z-index: 0; }
        .toast-enter { animation: toastIn 0.3s ease-out forwards; }
        @keyframes toastIn { from { transform: translate(-50%, 20px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }
        
        .verse-fade-in { animation: verseFadeIn 0.4s ease-out; }
        @keyframes verseFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }