/* 시트 시뮬레이터 모양(L4). 색은 app.css 변수(--ink --sub --line --soft --hi --ok --bad --acc)를 쓴다.
   외부 글꼴·외부 주소·로고·실제 아이콘 없음. 단추는 글자뿐이다. */
.pr-sheet{--sg-row-h:26px;--sg-head-h:24px;--sg-rowhead-w:46px;--sg-line:#cdcdc6;--sg-edge:#e2e2dc;--sg-frozen:#8a8a82;
  position:relative;display:flex;flex-direction:column;min-height:320px;height:100%;min-width:0;background:#fff;color:var(--ink);
  font:14px/1.4 "PretendardSub","Pretendard","Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",system-ui,sans-serif;word-break:keep-all}
.pr-sheet *,.pr-sheet *::before,.pr-sheet *::after{box-sizing:border-box}
.pr-sheet button{font:inherit;color:inherit;cursor:pointer}
.pr-sheet :focus-visible{outline:2px solid var(--acc);outline-offset:1px}

/* 파일 이름 + 메뉴 줄 */
.pr-sh-top{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;padding:2px 8px;background:var(--soft);border-bottom:1px solid var(--sg-line)}
.pr-sh-filebox{display:flex;align-items:center;min-width:0}
.pr-sheet .pr-sh-file{min-height:34px;max-width:100%;padding:2px 8px;border:1px solid transparent;border-radius:4px;background:none;font-weight:700;font-size:15px;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pr-sheet .pr-sh-file:hover{border-color:var(--sg-line);background:#fff}
.pr-sheet .pr-sh-file-input{min-height:34px;width:min(280px,100%);padding:2px 8px;border:2px solid var(--acc);border-radius:4px;font:inherit;font-weight:700;background:#fff;color:var(--ink)}
.pr-sh-menus{min-width:0}
.pr-sheet [role="menubar"]{display:flex;flex-wrap:wrap}
.pr-sheet .pr-menu-slot{position:relative}
.pr-sheet .pr-menutop{min-height:34px;padding:2px 10px;border:0;border-radius:4px;background:none;white-space:nowrap}
.pr-sheet .pr-menutop:hover,.pr-sheet .pr-menutop[aria-expanded="true"]{background:var(--hi)}
.pr-sheet .pr-menu{position:absolute;top:100%;left:0;z-index:40;min-width:180px;padding:4px 0;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 4px 16px rgba(0,0,0,.2)}
.pr-sheet .pr-menu[hidden]{display:none}
.pr-sheet .pr-menu-entry{position:relative}
.pr-sheet .pr-submenu{position:absolute;top:-5px;left:100%}
.pr-sheet .pr-menuitem{display:block;width:100%;min-height:34px;padding:4px 16px;border:0;background:none;text-align:left;white-space:nowrap}
.pr-sheet .pr-menuitem:hover,.pr-sheet .pr-menuitem:focus{background:var(--hi)}
.pr-sheet .pr-menuitem[aria-haspopup="menu"]::after{content:"▸";float:right;margin-left:14px}
.pr-sheet .pr-menuitem[aria-disabled="true"]{color:var(--sub);cursor:default}
.pr-sheet .pr-menu-sep{height:1px;margin:4px 0;background:var(--sg-edge)}

/* 도구 줄 */
.pr-sh-tools{display:flex;flex-wrap:wrap;gap:4px;padding:3px 8px;border-bottom:1px solid var(--sg-line);background:#fff}
.pr-sheet .pr-sh-tool{min-height:34px;padding:2px 12px;border:1px solid var(--sg-line);border-radius:5px;background:#fff;white-space:nowrap}
.pr-sheet .pr-sh-tool:hover:not(:disabled){background:var(--hi)}
.pr-sheet .pr-sh-tool:disabled{color:#8a8a8a;cursor:default}
.pr-sheet .pr-sh-tool.is-on{background:var(--acc);border-color:var(--acc);color:#fff}

/* 수식 줄 */
.pr-sh-fxbar{display:flex;align-items:stretch;border-bottom:1px solid var(--sg-line);background:#fff}
.pr-sh-ref{flex:none;min-width:74px;max-width:130px;padding:0 8px;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--sg-line);background:var(--soft);font-weight:700;overflow:hidden;white-space:nowrap}
.pr-sh-fxmark{flex:none;padding:0 8px;display:flex;align-items:center;color:var(--sub);border-right:1px solid var(--sg-edge)}
.pr-sheet .pr-sh-fx{flex:1;min-width:0;min-height:34px;padding:0 8px;border:0;background:#fff;font:inherit;color:var(--ink)}
.pr-sheet .pr-sh-fx:focus{outline:2px solid var(--acc);outline-offset:-2px}

/* 칸 그리드 */
.pr-sh-grid{flex:1 1 auto;min-height:200px;display:flex;flex-direction:column;position:relative}
.pr-sg{flex:1 1 auto;min-height:0;display:flex;position:relative}
.pr-sg-scroll{flex:1 1 auto;min-width:0;min-height:0;position:relative;overflow:auto;background:#fff;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.pr-sg-content{position:relative;min-width:100%}
.pr-sg-empty{margin:0;padding:18px;color:var(--sub)}
.pr-sg-heads{position:sticky;top:0;z-index:6;display:flex;background:var(--soft)}
.pr-sg-corner{position:sticky;left:0;z-index:7;flex:none;height:100%;background:#e8e8e2;border-right:1px solid var(--sg-line);border-bottom:1px solid var(--sg-line)}
.pr-sg-colhead{position:relative;flex:none;height:100%;text-align:center;line-height:calc(var(--sg-head-h) - 1px);background:var(--soft);border-right:1px solid var(--sg-line);border-bottom:1px solid var(--sg-line);color:var(--sub);font-weight:700;user-select:none;cursor:pointer}
.pr-sg-colhead.is-hl,.pr-sg-rowhead.is-hl{background:#dbe7f1;color:var(--ink)}
.pr-sg-resize{position:absolute;top:0;right:-4px;z-index:2;width:9px;height:100%;cursor:col-resize}
.pr-sg-resize:hover{background:rgba(11,79,138,.35)}
.pr-sg-row{display:flex;background:#fff}
.pr-sg-row.is-frozen{position:sticky;z-index:4}
.pr-sg-row.is-frozen-last .pr-sg-cell,.pr-sg-row.is-frozen-last .pr-sg-rowhead{border-bottom:3px solid var(--sg-frozen)}
.pr-sg-rowhead{position:sticky;left:0;z-index:2;flex:none;height:100%;text-align:center;line-height:calc(var(--sg-row-h) - 1px);background:var(--soft);border-right:1px solid var(--sg-line);border-bottom:1px solid var(--sg-line);color:var(--sub);user-select:none;cursor:pointer}
.pr-sg-cell{position:relative;flex:none;height:100%;padding:0 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:calc(var(--sg-row-h) - 1px);border-right:1px solid var(--sg-edge);border-bottom:1px solid var(--sg-edge);user-select:none;cursor:cell}
.pr-sg-cell.is-num{text-align:right}
.pr-sg-cell.is-formula{color:var(--sub)}
.pr-sg-cell.is-sel{background:rgba(11,79,138,.1)}
.pr-sg-cell.is-active{background:#fff;box-shadow:inset 0 0 0 2px var(--acc)}
.pr-sg-fbtn{position:absolute;top:0;right:0;height:100%;min-width:24px;padding:0 4px;border:0;border-left:1px solid var(--sg-line);background:var(--soft);color:var(--ink);font-size:11px;line-height:1;cursor:pointer}
.pr-sg-fbtn:hover{background:var(--hi)}
.pr-sg-fbtn.is-on{background:var(--acc);color:#fff}
.pr-sg-input{position:absolute;z-index:5;margin:0;padding:0 5px;border:0;border-radius:0;resize:none;overflow:hidden;white-space:pre;opacity:0;pointer-events:none;background:#fff;color:var(--ink);font:inherit;line-height:calc(var(--sg-row-h) - 4px);outline:0}
.pr-sg-input.is-editing{opacity:1;pointer-events:auto;border:2px solid var(--acc);box-shadow:0 2px 8px rgba(0,0,0,.2)}

/* 아래 탭 */
.pr-sh-tabbar{display:flex;align-items:stretch;border-top:1px solid var(--sg-line);background:var(--soft)}
.pr-sh-tablist{flex:1 1 auto;min-width:0;display:flex;gap:2px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
.pr-sheet .pr-sh-tab{flex:none;min-height:38px;padding:0 16px;border:0;border-bottom:3px solid transparent;border-radius:0;background:none;white-space:nowrap;color:var(--sub)}
.pr-sheet .pr-sh-tab:hover{background:var(--hi)}
.pr-sheet .pr-sh-tab.is-active{background:#fff;color:var(--ink);font-weight:700;border-bottom-color:var(--acc)}
.pr-sheet .pr-sh-tab.is-response{background:#dcdcd6;color:var(--sub);font-style:italic}
.pr-sheet .pr-sh-tab.is-response.is-active{background:#cfcfc8;color:var(--ink)}
.pr-sheet .pr-sh-tab[hidden]{display:none}
.pr-sheet .pr-sh-tab-input{flex:none;width:130px;min-height:34px;margin:2px;padding:0 8px;border:2px solid var(--acc);border-radius:4px;background:#fff;font:inherit;color:var(--ink)}
.pr-sheet .pr-sh-tabbtn{flex:none;min-width:38px;min-height:38px;padding:0 8px;border:0;background:none;font-weight:700;font-size:16px}
.pr-sheet .pr-sh-tabbtn:hover{background:var(--hi)}
.pr-sheet .pr-sh-tabbtn[hidden]{display:none}

/* 거르기·정렬 창, 탭 메뉴 */
.pr-sheet .pr-sh-pop{position:absolute;z-index:40;width:min(264px,calc(100% - 8px));padding:8px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.pr-sheet .pr-sh-pop-small{width:auto;min-width:150px;padding:4px 0}
.pr-sh-pop-title{font-weight:700;margin-bottom:6px}
.pr-sh-pop-row{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.pr-sh-pop-foot{justify-content:flex-end}
.pr-sh-pop-list{max-height:min(34vh,220px);overflow:auto;border:1px solid var(--sg-edge);border-radius:4px;padding:2px 6px}
.pr-sh-pop-empty{margin:6px 0;color:var(--sub)}
.pr-sh-opt{display:flex;align-items:center;gap:8px;min-height:34px;cursor:pointer}
.pr-sh-opt input{width:18px;height:18px;flex:none}
.pr-sheet .pr-btn{min-height:34px;padding:2px 12px;border:1px solid var(--line);border-radius:6px;background:#fff;font-weight:400}
.pr-sheet .pr-btn:hover{background:var(--hi)}
.pr-sheet .pr-btn-primary{background:var(--acc);border-color:var(--acc);color:#fff}
.pr-sheet .pr-btn-primary:hover{background:#093d6c}
.pr-sheet .pr-link{min-height:34px;padding:0 4px;border:0;background:none;color:var(--acc);text-decoration:underline;text-underline-offset:3px}
.pr-sheet .pr-sh-pop-item{display:block;width:100%;min-height:36px;padding:4px 16px;border:0;background:none;text-align:left;white-space:nowrap}
.pr-sheet .pr-sh-pop-item:hover{background:var(--hi)}

/* 붙여 넣기 창 안의 글 상자(대화 상자는 body 아래에 열린다) */
.pr-sh-paste{display:block;width:100%;min-height:9em;margin:8px 0;padding:8px;border:2px solid var(--acc);border-radius:6px;font:14px/1.5 "SF Mono",Menlo,Consolas,"Noto Sans Mono CJK KR",monospace;color:var(--ink);background:#fff}

/* 좁은 화면: 누를 곳 40px 이상, 입력 칸 16px(확대 방지) */
@media (max-width:600px){
  .pr-sheet{--sg-row-h:34px;--sg-head-h:30px;--sg-rowhead-w:40px;font-size:14px}
  .pr-sheet .pr-menutop,.pr-sheet .pr-sh-tool,.pr-sheet .pr-sh-file,.pr-sheet .pr-menuitem,.pr-sheet .pr-btn,.pr-sheet .pr-link{min-height:40px}
  .pr-sheet .pr-sh-tool{padding:2px 10px}
  .pr-sheet .pr-menutop{padding:2px 8px}
  .pr-sheet .pr-sh-fx,.pr-sheet .pr-sh-file-input,.pr-sheet .pr-sh-tab-input,.pr-sg-input,.pr-sh-paste{font-size:16px}
  .pr-sheet .pr-sh-fx{min-height:40px}
  .pr-sh-ref{min-width:64px}
  .pr-sheet .pr-sh-tab,.pr-sheet .pr-sh-tabbtn{min-height:42px}
  .pr-sg-fbtn{min-width:34px}
  .pr-sh-opt{min-height:40px}
  .pr-sheet .pr-sh-pop-item{min-height:42px}
  .pr-sheet .pr-menu{min-width:150px;max-width:calc(100vw - 16px)}
  .pr-sheet .pr-submenu{position:static;margin-left:14px;box-shadow:none;border:0;border-left:3px solid var(--sg-edge);border-radius:0}
}
@media (prefers-reduced-motion:reduce){.pr-sheet *{scroll-behavior:auto;transition:none;animation:none}}