/* 전역 박스 모델 강제 */
* { box-sizing: border-box !important; }

@font-face {
    font-family: 'NeoDunggeunmo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.3/NeoDunggeunmo.woff') format('woff');
}

body { background: #008080; font-family: 'NeoDunggeunmo', sans-serif; margin: 0; padding: 0; overflow: hidden; color: #000; width: 100vw; height: 100vh; }

.win-hidden { display: none !important; }

/* --- 바탕화면 --- */
.desktop { display: flex; flex-direction: column; height: calc(100vh - 35px); position: relative; width: 100%; overflow: hidden; }
.desktop-icons { 
    display: flex; flex-direction: column; flex-wrap: wrap; gap: 30px; 
    height: 100%; width: auto; padding: 20px; z-index: 1; align-content: flex-start; 
}
.desktop-icon { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: white; text-align: center; position: relative; width: 85px; }
.desktop-icon img { width: 32px; height: 32px; margin-bottom: 5px; flex-shrink: 0; }
.desktop-icon span { padding: 2px 4px; border: 1px dotted transparent; font-size: 14px; white-space: nowrap; display: block; }

/* 바탕화면 N 배지 */
.desktop-icon.has-new::after {
    content: "N"; position: absolute; top: -5px; left: calc(50% + 8px); 
    width: 14px; height: 14px; background-color: #ff0000 !important; color: #fff !important; 
    font-size: 10px; font-weight: bold; display: flex; align-items: center; justify-content: center; 
    border: 1px solid #000; box-shadow: inset 1px 1px 0 #ff7070; z-index: 2;
}

/* --- 탐색기 창 구조 (여백 상하 5%, 좌우 10% 강제) --- */
.explorer-window {
    display: none; background: #c0c0c0; border: 2px solid; border-color: #dfdfdf #0a0a0a #0a0a0a #dfdfdf;
    box-shadow: 1px 1px 0 #000; flex-direction: column; position: absolute; 
    top: 5%; left: 10%; width: 80%; height: 90%; /* 화면의 80x90 사이즈로 띄움 */
    min-width: 450px !important; min-height: 450px !important; resize: both; overflow: hidden; z-index: 10;
}
.tt-body-page .explorer-window, .tt-body-category .explorer-window, .tt-body-archive .explorer-window, .tt-body-search .explorer-window, .tt-body-guestbook .explorer-window { display: flex; }
.explorer-window.maximized { top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; resize: none; }

/* 타이틀 바 버튼 */
.win-title-bar { background: linear-gradient(90deg, #000080, #1084d0); padding: 3px 4px; display: flex; justify-content: space-between; align-items: center; color: white; cursor: move; flex-shrink: 0; }
.win-title-controls { display: flex; flex-direction: row !important; gap: 2px; flex-shrink: 0; }
.win-btn { 
    background: #c0c0c0; border: 1px solid; border-color: #fff #000 #000 #fff; 
    width: 16px; height: 14px; display: flex; align-items: center; justify-content: center;
    padding: 0 0 2px 0; font-size: 10px; font-weight: bold; color: #000; cursor: pointer;
}
.win-btn:active { border-color: #000 #fff #fff #000; padding: 1px 0 0 1px; }

/* 메뉴 */
.win-menu-bar { padding: 4px 10px; border-bottom: 1px solid #808080; box-shadow: 0 1px 0 #fff; display: flex; gap: 20px; flex-shrink: 0; }

/* 툴바 영역 */
.win-tool-bar { 
    padding: 6px 10px; display: flex; align-items: center; 
    gap: 16px; border-bottom: 1px solid #808080; box-shadow: 0 1px 0 #fff; flex-shrink: 0; 
}
.tool-btn { 
    background: #c0c0c0; border: 1px solid; border-color: #fff #000 #000 #fff; 
    display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 6px; 
    padding: 4px 12px; cursor: pointer; font-family: inherit; font-size: 12px; height: 32px;
}
.tool-btn:active { border-color: #000 #fff #fff #000; padding: 5px 11px 3px 13px; }
.tool-divider { width: 2px; height: 26px; background: #808080; border-right: 1px solid #fff; }

/* 주소 및 검색창 */
.win-address-bar, .win-search-bar { padding: 6px 10px; border-bottom: 1px solid #808080; display: flex; align-items: center; gap: 10px; flex-shrink: 0; width: 100%; }
.search-form { display: flex; align-items: center; gap: 5px; flex-grow: 1; }
.bar-label { white-space: nowrap; width: 60px; flex-shrink: 0; }
.address-input, .search-input { background: #fff; border: inset 2px #dfdfdf; padding: 3px 6px; flex-grow: 1; font-family: inherit; height: 24px; }
.win-btn-submit { 
    background: #c0c0c0; border: 1px solid; border-color: #fff #000 #000 #fff; 
    padding: 0 15px; font-weight: bold; cursor: pointer; height: 24px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.win-btn-submit:active { border-color: #000 #fff #fff #000; padding: 1px 14px 0 16px; }

/* 본문 영역 */
.win-content { background: #fff; border: inset 2px #dfdfdf; margin: 5px; padding: 25px; flex-grow: 1; overflow-y: auto !important; min-height: 0; word-break: keep-all; overflow-wrap: break-word; }

/* 포스트 본문 줄바꿈 */
.post-body, .post-body * { word-break: keep-all !important; overflow-wrap: break-word !important; }

/* --- 비밀번호 보호글 --- */
.protected-wrap { padding: 40px 20px; text-align: center; }
.protected-text { margin-bottom: 20px; font-size: 14px; line-height: 1.8; }
.protected-form .input-group { display: inline-flex; align-items: center; gap: 8px; }
.protected-form .win-input { width: 160px; height: 24px; }

/* 목록 한 줄 정렬 */
.explorer-list-view { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.list-btn { 
    display: flex; align-items: center; background: #c0c0c0; color: #000; text-decoration: none; 
    padding: 8px 12px; border: 1px solid; border-color: #fff #000 #000 #fff; 
    box-shadow: inset 1px 1px 0 #dfdfdf; width: 100% !important; flex-shrink: 0; gap: 10px;
}
.list-btn:active { border-color: #000 #fff #fff #000; padding: 9px 11px 7px 13px; }

/* 목록 내 N 아이콘: 무적의 배경 교체 트릭 적용 */
.explorer-list-view img[alt="N"], 
.explorer-list-view img[alt="새글"], 
.explorer-list-view img[src*="new"] {
    display: inline-block !important;
    width: 14px !important; 
    height: 14px !important; 
    background-color: #ff0000 !important; 
    border: 1px solid #000 !important;
    box-shadow: inset 1px 1px 0 #ff7070 !important; 
    margin-left: 4px !important; 
    vertical-align: middle !important;
    
    box-sizing: border-box !important;
    object-fit: none !important;
    object-position: -9999px -9999px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Ctext x='50%25' y='60%25' font-family='Arial, sans-serif' font-weight='bold' font-size='10' fill='white' text-anchor='middle' dominant-baseline='middle'%3EN%3C/text%3E%3C/svg%3E") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    padding: 0 !important;
}

/* 페이지네이션 */
.win-pagination { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 80px !important; margin-bottom: 40px !important; width: 100%; }

/* --- 댓글창 전체 구조 --- */
.win-comments { background: #c0c0c0; padding: 15px; border: 1px solid; border-color: #fff #000 #000 #fff; margin-top: 60px; width: 100%; }

/* 이미 달린 댓글 (하얀 네모 텍스트박스) */
.comment-list {
    background: #fff;
    border: inset 2px #dfdfdf;
    padding: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
    max-height: 400px;
    overflow-y: auto;
}

/* 댓글이 없을 때 하얀 네모 박스 숨기기 */
.comment-list:not(:has(.comment-item)) { display: none !important; }

.comment-item { border-bottom: 1px dashed #ccc; padding: 10px 0; }
.comment-item:last-child { border-bottom: none; padding-bottom: 0; }

/* 댓글 작성자 정보 및 수정/삭제 버튼 */
.comment-meta { margin-bottom: 5px; }
.comment-action-btn {
    float: right; 
    background: #c0c0c0; 
    border: 1px solid; border-color: #fff #000 #000 #fff;
    padding: 1px 5px; 
    font-size: 11px; 
    color: #000; 
    text-decoration: none; 
    cursor: pointer;
    margin-top: -2px;
}
.comment-action-btn:active {
    border-color: #000 #fff #fff #000; 
    padding: 2px 4px 0px 6px;
}

/* 댓글 입력칸 폼 */
.form-inputs { display: flex; flex-direction: column; gap: 5px; margin-bottom: 10px; }
.input-group { display: flex; align-items: center; gap: 10px; }
.input-group label { width: 85px; font-weight: bold; font-size: 13px; flex-shrink: 0; text-align: left; }
.input-group .win-input { background: #fff; border: inset 2px #dfdfdf; padding: 3px 6px; font-family: inherit; width: 160px; height: 24px; }
.form-inputs > div:not(.input-group) { margin-top: 10px !important; } 

.win-textarea { width: 100%; min-height: 120px; border: inset 2px #dfdfdf; font-family: inherit; padding: 12px; margin-top: 10px; }
.form-actions { display: flex !important; justify-content: space-between; align-items: center; margin-top: 15px; }
.secret-label { display: none !important; }

/* --- 커스텀 캡챠 --- */
.captcha-wrap { margin-top: 10px; }
.captcha-row { display: flex; align-items: center; gap: 8px; }
.captcha-row canvas { border: inset 2px #dfdfdf; flex-shrink: 0; }
.captcha-row .win-input { width: 80px; height: 24px; background: #fff; border: inset 2px #dfdfdf; padding: 3px 6px; font-family: inherit; }
.captcha-refresh { cursor: pointer; white-space: nowrap; font-size: 12px; }
.captcha-refresh:hover { text-decoration: underline; }
.captcha-notice { margin-top: 4px; font-size: 12px; color: #333; }

/* --- 작업표시줄 (리얼 3D 볼록 버튼) --- */
.taskbar { background: #c0c0c0; border-top: 2px solid #dfdfdf; position: fixed; bottom: 0; left: 0; width: 100%; height: 35px; display: flex; align-items: center; padding: 0 5px; z-index: 1000; }
.start-btn { 
    background: #c0c0c0; 
    border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #000; border-bottom: 1px solid #000;
    box-shadow: inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 #808080;
    padding: 3px 8px; display: flex; align-items: center; gap: 5px; font-weight: bold; cursor: pointer; height: 26px; margin-right: 5px;
}
.start-btn:active {
    border-top: 1px solid #000; border-left: 1px solid #000; border-right: 1px solid #fff; border-bottom: 1px solid #fff;
    box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf;
    padding: 4px 7px 2px 9px;
}
.taskbar-divider { width: 2px; height: 28px; background: #808080; border-right: 1px solid #fff; margin: 0 5px; }
.taskbar-window { 
    background: #c0c0c0; 
    border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #000; border-bottom: 1px solid #000;
    box-shadow: inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 #808080;
    padding: 3px 10px; display: flex; align-items: center; gap: 5px; min-width: 140px; cursor: pointer; height: 26px;
}
.taskbar-window.active { 
    background: #dfdfdf; 
    border-top: 1px solid #000; border-left: 1px solid #000; border-right: 1px solid #fff; border-bottom: 1px solid #fff;
    box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf;
    padding: 4px 9px 2px 11px;
}
.taskbar-tray { margin-left: auto; margin-right: 12px; border: inset 2px #dfdfdf; padding: 4px 15px; height: 26px; display: flex; align-items: center; }

/* --- 모바일 대응 (창 꽉 차게 유지) --- */
@media screen and (max-width: 768px) {
    body { overflow: hidden; width: 100vw; position: fixed; }
    .desktop { height: calc(100vh - 35px); padding: 0 !important; }
    .desktop-icons { 
        display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
        width: 100% !important; height: 85px !important; overflow-x: auto !important; 
        padding: 10px !important; gap: 15px !important;
    }
    .desktop-icon { min-width: 75px; width: auto; margin: 0; }
    .explorer-window { 
        display: none; position: relative !important; top: 0 !important; left: 0 !important; 
        width: 100vw !important; height: 0 !important; flex-grow: 1 !important; 
        margin: 0 !important; border: none !important; min-width: 0 !important; min-height: 0 !important; resize: none !important; 
    }
    .tt-body-page .explorer-window, .tt-body-category .explorer-window, .tt-body-archive .explorer-window, .tt-body-search .explorer-window, .tt-body-guestbook .explorer-window { display: flex !important; }
    .win-content { padding: 15px; padding-bottom: 150px !important; width: 100% !important; }
    .taskbar-tray { display: none; }
}

[data-tistory-react-app="Namecard"] { display: none !important; }
[data-tistory-react-app="NaverAd"] { display: none !important; }

/* 대댓글 들여쓰기 */
.comment-reply { margin-left: 30px; border-left: 2px solid #808080; padding-left: 12px; }

/* 댓글 작성자 blank 링크 제거 */
.comment-meta strong a[href="blank"],
.comment-meta strong a[href=""] {
    color: #000 !important;
    text-decoration: none !important;
    pointer-events: none;
    cursor: default;
}