.wtg{--wtg-border:#dcdcde;max-width:1200px;margin:24px auto;font-family:-apple-system,BlinkMacSystemFont,"Malgun Gothic",sans-serif}.wtg *{box-sizing:border-box}.wtg__header h2,.wtg h3{margin-top:0}.wtg__layout{display:grid;grid-template-columns:minmax(280px,1fr) minmax(320px,1.4fr);gap:20px}.wtg__panel,.wtg__output{border:1px solid var(--wtg-border);border-radius:8px;background:#fff;padding:20px}.wtg__field{margin-bottom:16px}.wtg__field label{display:block;font-weight:600;margin-bottom:6px}.wtg__field input,.wtg__field textarea,.wtg__field select,.wtg__code{width:100%;border:1px solid #8c8f94;border-radius:4px;padding:9px}.wtg__field textarea{min-height:100px}.wtg__field small{display:block;color:#646970;margin-top:5px}.wtg__media{margin-top:7px}.wtg__preview{width:100%;min-height:420px;border:1px solid var(--wtg-border);background:#fff}.wtg__output{margin-top:20px}.wtg__output-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.wtg__code{font-family:Consolas,Monaco,monospace;white-space:pre}.wtg__status{min-height:1.4em;color:#2271b1}.wtg .button{cursor:pointer;padding:7px 12px}.wtg .button-primary{background:#2271b1;color:#fff;border:1px solid #2271b1;border-radius:4px}@media(max-width:760px){.wtg__layout{grid-template-columns:1fr}.wtg__preview{min-height:320px}}
.wtg__preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.wtg__preview-head h3{margin:0 0 12px}.wtg__preview-state{margin-bottom:12px;color:#646970;font-size:12px}

/* 0.5.0 — 표 보관 */
.wtg__store{margin-top:22px;padding-top:18px;border-top:1px solid var(--wtg-border)}
.wtg__store h3{margin:0 0 6px}
.wtg__store-help{margin:0 0 10px;font-size:13px;color:#50575e;line-height:1.7}
.wtg__store-help code{background:#f0f0f1;border-radius:3px;padding:1px 5px}
.wtg__store-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.wtg__store-name{flex:1;min-width:220px;padding:7px 10px;border:1px solid var(--wtg-border);border-radius:4px;font-size:14px}
.wtg__store-msg{margin:9px 0 0;font-size:13px;color:#1d6f42;min-height:1.4em}
.wtg__store-msg.is-bad{color:#b32d2e}
.wtg__store-off{margin-top:18px;padding-top:16px;border-top:1px solid var(--wtg-border);font-size:13px;color:#787c82}
.wtg__store-list h4{margin:16px 0 7px;font-size:13px;color:#50575e}
.wtg__store-items{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.wtg__store-items li{display:flex;align-items:center;gap:5px;border:1px solid var(--wtg-border);border-radius:14px;padding:3px 5px 3px 10px;background:#fff}
.wtg__store-items code{font-size:12px}
.wtg__store-items button{border:0;background:#f0f0f1;border-radius:10px;padding:2px 9px;font-size:11.5px;cursor:pointer;color:#3c434a}
.wtg__store-items button:hover{background:#dcdcde}
.wtg__store-del:hover{background:#f7d7d7;color:#b32d2e}
@media(max-width:640px){.wtg__store-row{flex-direction:column;align-items:stretch}.wtg__store-name{min-width:0}}
.wtg__header{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.wtg__picker{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:13px;color:#50575e}
.wtg__picker select{padding:5px 8px;border:1px solid var(--wtg-border);border-radius:4px;font-size:13px;max-width:220px}
.wtg__store-post{display:flex;align-items:center;gap:7px;margin-top:9px;font-size:13px;color:#3c434a;cursor:pointer}
.wtg__store-post span{color:#787c82;font-size:12px}
.wtg__store-note{margin:9px 0 0;font-size:12.5px;color:#787c82}
/* 0.5.0 — 미리보기를 글 화면과 같은 방식으로 그린다 (iframe 아님) */
.wtg__preview{border:1px solid var(--wtg-border);border-radius:4px;background:#fff;padding:12px;min-height:320px;max-height:70vh;overflow:auto}
.wtg__preview:empty::before{content:"값을 채우면 여기에 표가 나옵니다.";color:#8c8f94;font-size:13px}
.wtg__preview-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.wtg__preview-head h3{margin:0}
.wtg__refresh{white-space:nowrap}
.wtg__preview-state{margin-left:auto;font-size:12px;color:#787c82}

/* 0.6.0 — 양식을 칸 단위로 다룬다 */
.wtg__row{border:1px solid var(--wtg-border);border-radius:6px;margin-bottom:12px;background:#fff}
.wtg__row-head{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;padding:8px 10px;background:#f6f7f7;border-bottom:1px solid var(--wtg-border);border-radius:5px 5px 0 0}
.wtg__row.is-plain .wtg__row-head{border-bottom:0;border-radius:5px}
.wtg__row-del{flex:0 0 auto;display:flex;align-items:center;gap:5px;font-size:12px;color:#787c82;cursor:pointer;white-space:nowrap;word-break:keep-all}
.wtg__row-del input{margin:0}
.wtg__row-title{flex:1 1 auto;min-width:0;padding:5px 8px;border:1px solid var(--wtg-border);border-radius:4px;font-size:13.5px;font-weight:600;background:#fff}
.wtg__row-name{flex:1 1 auto;min-width:0;font-size:13px;color:#646970;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wtg__row-body{padding:12px 10px 2px}
.wtg__row-body .wtg__field:last-child{margin-bottom:12px}
.wtg__row.is-del{opacity:.42}
.wtg__row.is-del .wtg__row-body{display:none}
.wtg__row.is-del .wtg__row-title{text-decoration:line-through}
.wtg__row.is-del .wtg__row-head{background:#fbeaea}
.wtg__row.is-global .wtg__row-head{background:#eef4fb}

/* 사진 — 워드프레스에서 고르고 위키로 보낸다 */
.wtg__imgbar{display:flex;gap:7px;flex-wrap:wrap;margin-top:7px}
.wtg__imgbar .button{margin-top:0}
.wtg__imgnote{display:block;margin-top:6px;font-size:12px;color:#1d6f42;min-height:1.2em}
.wtg__imgnote.is-bad{color:#b32d2e}
.wtg__imghint{display:block;margin-top:4px;font-size:11.5px;color:#787c82;line-height:1.6}
.wtg-plain table{border-collapse:collapse}
.wtg-plain th,.wtg-plain td{border:1px solid #a2a9b1;padding:8px}

/* 0.7.0 — 미리보기는 표 전체를 보여 준다 (높이 제한 없음). 넓은 표만 옆으로 민다 */
.wtg__preview{max-height:none;overflow:visible;overflow-x:auto}
.wtg__row-add{margin-left:auto;padding:2px 10px!important;font-size:12px;border:1px solid #2271b1;color:#2271b1;background:#fff;border-radius:4px;white-space:nowrap}
.wtg__row-add:hover{background:#2271b1;color:#fff}

/* 0.7.1 — 양식 고르기를 칩으로 */
.wtg__chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.wtg__chip{display:inline-block;padding:6px 14px;border:1px solid #dcdcde;border-radius:999px;background:#fff;color:#3c434a;font-size:13.5px;line-height:1.3;text-decoration:none!important;white-space:nowrap;transition:background .15s,border-color .15s}
.wtg__chip:hover{border-color:#2271b1;color:#2271b1}
.wtg__chip.is-on{background:#2271b1;border-color:#2271b1;color:#fff;font-weight:600}
@media(max-width:760px){.wtg__chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}}

/* 0.7.2 — 입력칸을 또렷하게 (테마의 옅은 입력칸 모양을 덮는다) */
.wtg .wtg__field{margin-bottom:14px}
.wtg .wtg__field label{color:#1d2327!important;font-size:13.5px!important;font-weight:700!important;margin-bottom:5px;opacity:1!important}
.wtg .wtg__field input:not([type=color]):not([type=checkbox]),.wtg .wtg__field textarea,.wtg .wtg__field select{
 background:#fff!important;color:#111!important;border:1.5px solid #646970!important;border-radius:5px!important;
 padding:8px 10px!important;font-size:14px!important;opacity:1!important;box-shadow:none!important}
.wtg .wtg__field input::placeholder,.wtg .wtg__field textarea::placeholder{color:#8c8f94!important}
.wtg .wtg__field input:focus,.wtg .wtg__field textarea:focus,.wtg .wtg__field select:focus{border-color:#2271b1!important;box-shadow:0 0 0 2px rgba(34,113,177,.2)!important;outline:0}
.wtg .wtg__field input[type=color]{width:100%;height:34px;padding:2px!important;border:1.5px solid #646970!important;border-radius:5px;background:#fff;cursor:pointer}
.wtg .wtg__row{border-color:#c3c4c7}
.wtg .wtg__row-head{background:#f0f0f1}
.wtg .wtg__row-name{color:#1d2327!important;font-weight:600}
.wtg .wtg__row-del{color:#50575e!important}
.wtg .wtg__field small,.wtg .wtg__imghint{color:#50575e!important}

/* 0.7.2 — 표 너비 */
.wtg__width{border-color:#2271b1!important}
.wtg__width .wtg__row-head{background:#eaf2fa!important}
.wtg__width-body{padding:10px 12px}
.wtg__seg{display:flex;flex-wrap:wrap;gap:6px}
.wtg__seg button{border:1.5px solid #8c8f94;background:#fff;color:#1d2327;border-radius:999px;padding:4px 12px;font-size:13px;cursor:pointer}
.wtg__seg button.is-on{background:#2271b1;border-color:#2271b1;color:#fff;font-weight:600}
.wtg__width-line{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:10px}
.wtg__width-line[hidden],.wtg__width-num[hidden],.wtg__width-unit[hidden],.wtg__width-presets[hidden]{display:none!important}
.wtg .wtg__width-num{width:96px;padding:6px 8px;border:1.5px solid #8c8f94;border-radius:5px;font-size:14px;color:#111;background:#fff}
.wtg__width-unit{font-weight:700;color:#1d2327;margin-right:6px}
.wtg__width-presets{display:flex;gap:5px;flex-wrap:wrap}
.wtg__width-pre{border:1px solid #c3c4c7;background:#f6f7f7;color:#1d2327;border-radius:4px;padding:3px 8px;font-size:12px;cursor:pointer}
.wtg__width-pre.is-on,.wtg__width-pre:hover{border-color:#2271b1;color:#2271b1;background:#fff}

/* 0.7.3 — 문단 제목에 숨 쉴 틈 · 너비/정렬 이름표 */
.wtg .wtg__header{margin-bottom:18px}
.wtg .wtg__header h2{margin:0 8px 0 0}
.wtg .wtg__panel>h3,.wtg .wtg__preview-head{margin:0 0 16px!important;padding-bottom:12px;border-bottom:1px solid #dcdcde}
.wtg .wtg__panel>h3{font-size:18px}
.wtg .wtg__preview-head h3{font-size:18px;margin:0!important}
.wtg .wtg__output-head{margin-bottom:12px}
.wtg .wtg__output-head h3{margin:0}
.wtg__opt-label{font-size:12.5px;font-weight:700;color:#1d2327;margin:2px 0 6px}
.wtg__width-line+.wtg__opt-label,.wtg__seg+.wtg__opt-label{margin-top:14px}
/* 미리보기 상자는 글 본문 CSS(.mje-wk-out table{float:none!important}) 를 같이 받는다.
   정렬을 고르면 미리보기에서도 보이도록 표에 적힌 값을 되살린다 */
.wtg .wtg__preview.mje-wk-out{overflow:hidden}
.wtg .wtg__preview.mje-wk-out table[style*="float:left"]{float:left!important;margin:0 1em 1em 0!important}
.wtg .wtg__preview.mje-wk-out table[style*="float:right"]{float:right!important;margin:0 0 1em 1em!important}
.wtg .wtg__preview.mje-wk-out table[style*="margin:0 auto"]{margin-left:auto!important;margin-right:auto!important}

/* 0.7.4 — 비로그인 둘러보기 */
.wtg__lock{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 16px;padding:11px 14px;border:1px solid #f0c36d;background:#fff8e5;border-radius:8px;color:#50400b;font-size:14px}
.wtg__lock b{color:#3b2f06}
.wtg__lock-btn{display:inline-block;padding:5px 14px;border-radius:999px;background:#2271b1;color:#fff!important;text-decoration:none!important;font-weight:600;font-size:13px}
.wtg__lock-btn:first-of-type{margin-left:auto}
.wtg__lock-btn.is-sub{background:#fff;color:#2271b1!important;border:1px solid #2271b1}
.wtg .wtg__fields.is-locked input,.wtg .wtg__fields.is-locked textarea,.wtg .wtg__fields.is-locked select{background:#f6f7f7!important;color:#50575e!important;cursor:not-allowed}
.wtg .wtg__fields.is-locked button{cursor:not-allowed;opacity:.55}
.wtg .wtg__output.is-locked .wtg__code{background:#f6f7f7;user-select:none;-webkit-user-select:none}
.wtg button:disabled{cursor:not-allowed;opacity:.55}

/* 0.7.5 — 휴대폰에서 입력칸이 화면 밖으로 삐져나오지 않게.
   격자 칸은 기본 min-width:auto 라 긴 칸 이름·버튼 줄 폭만큼 늘어난다. 0 으로 풀어 화면 폭 안에 가둔다 */
.wtg{max-width:100%;overflow-x:hidden}
.wtg__layout>*,.wtg__panel,.wtg__fields,.wtg__row,.wtg__row-body,.wtg__field,.wtg__output{min-width:0;max-width:100%}
.wtg__header{min-width:0}
.wtg__chips{min-width:0;max-width:100%}
@media(max-width:760px){
 .wtg{margin:12px auto}
 .wtg__layout{gap:14px}
 .wtg__panel,.wtg__output{padding:14px 12px}
 .wtg__header h2{font-size:20px;flex:1 1 100%}
 .wtg__row-head{flex-wrap:wrap;row-gap:6px}
 .wtg__row-name{white-space:normal;overflow:visible;flex:1 1 60%}
 .wtg__seg button{padding:4px 10px;font-size:12.5px}
 .wtg__lock{font-size:13px}
 .wtg__lock-btn:first-of-type{margin-left:0}
 .wtg__code{font-size:12px}
}
/* 미리보기 — 화면보다 넓은 표는 잘리지 않고 옆으로 밀어서 본다 */
.wtg .wtg__preview.mje-wk-out{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}