/* 동물농장 편의 개선 모양 (qol.js 짝). 원작 화면에는 손대지 않고, 우리가 덧붙이는 것만 꾸민다. */

/* --- 화면 안 창(원작 팝업) --- */
.farm-pop-dim{position:fixed;inset:0;background:rgba(20,40,0,.38);opacity:0;pointer-events:none;transition:opacity .15s;z-index:2147483000}
.farm-pop-dim.on{opacity:1;pointer-events:auto}
html.farm-pop-open,html.farm-pop-open body{overflow:hidden}
.farm-pop{position:fixed;left:0;top:0;background:#fff;border-radius:12px;overflow:hidden;
  box-shadow:0 10px 32px rgba(0,0,0,.32),0 0 0 2px #7cc70a;animation:farmpopin .14s ease-out;z-index:2147483001}
.farm-pop-bar{height:34px;display:flex;align-items:center;gap:8px;padding:0 6px 0 12px;cursor:move;touch-action:none;user-select:none;
  background:linear-gradient(#a4ea2f,#79c90b);color:#173400;font:bold 14px/34px "Malgun Gothic","맑은 고딕","Apple SD Gothic Neo",Dotum,sans-serif}
.farm-pop-title{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.farm-pop-x{flex:none;width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.55);color:#2a4a00;
  font:bold 15px/28px Arial,sans-serif;cursor:pointer;padding:0}
.farm-pop-x:hover,.farm-pop-x:focus-visible{background:#fff;color:#c0392b;outline:none}
.farm-pop-body{position:relative;overflow:hidden;background:#fff}
.farm-pop-body iframe{display:block;border:0;background:#fff;transform-origin:0 0}
.farm-pop-drag iframe{pointer-events:none}
.farm-pop-nudge{animation:farmnudge .3s}
@keyframes farmpopin{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes farmnudge{0%,100%{transform:none}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media (max-width:639px){.farm-pop{border-radius:0;box-shadow:0 0 0 2px #7cc70a}}

/* --- 누를 수 있는 그림: 마우스 올림 표시 (원작 on/off 그림 바꿈이 없는 것만) --- */
html.farm-qol a[href] img:not([onmouseover]){transition:filter .12s}
html.farm-qol a[href]:hover img:not([onmouseover]){filter:brightness(1.07) saturate(1.08)}
html.farm-qol img[onclick],html.farm-qol td[onclick],html.farm-qol div[onclick],html.farm-qol span[onclick],
html.farm-qol area[href],html.farm-qol input[type=image]{cursor:pointer}
html.farm-qol a[href] img.farm-here{filter:none}

/* --- 오른쪽 아래 띠 안의 단추 --- */
.farm-qolctl{display:inline-flex;align-items:center;gap:4px;margin-left:6px;vertical-align:middle}
.farm-zoomctl{display:inline-flex;align-items:center;border:1px solid #5aa800;border-radius:9px;overflow:hidden;background:#fff}
.farm-zoomctl button,.farm-qol-toggle{border:0;background:transparent;color:#1d3a00;font:12px/18px "Malgun Gothic","맑은 고딕",Dotum,sans-serif;
  padding:0 6px;cursor:pointer;height:18px}
.farm-zoomctl button:hover,.farm-qol-toggle:hover{background:#eaffc8}
.farm-zoomctl .farm-zoom-val{min-width:46px;border-left:1px solid #b6e07a;border-right:1px solid #b6e07a;font-weight:bold}
.farm-qol-toggle{border:1px solid #5aa800;border-radius:9px;background:#fff;font-size:11px}
@media print{.farm-qolctl,.farm-pop-dim{display:none!important}}