/* ============================================================
   ARIFE 스튜디오 조작칸 색 맞추기 v1460

   왜 (라이브 실측 2026-08-07)
     판매자 화면에서 잡았던 검은 체크칸이 스튜디오 쪽에도 그대로 있었다.

       nodes.html (뎁스맵)   4개 — Depth Map · OpenPose · 인물 마스크 · 손·얼굴 키포인트
       motion.html (모션전이) 1개
       background: rgb(9,17,28)

     앞서 고친 규칙이 body.role-system / [data-glass-page] 만 겨냥해서
     이 화면들은 빠져 있었다. 하필 뎁스맵의 넷은 '무엇을 뽑을지' 고르는
     핵심 조작칸이다. 밝은 화면에서 까만 사각형은 '이미 켜진 것'처럼
     보여서, 켜야 하는 줄 모른 채 지나치게 된다.

   왜 따로 두나
     이 화면들에는 콘솔 시트가 안 실려 있고, 실을 수도 없다(콘솔 전용
     규칙이 많아 엉뚱한 데가 바뀐다). 조작칸 결만 뽑아 얇게 둔다.

   영화제작소(.film-page)는 건드리지 않는다
     그쪽은 어두운 판을 쓰는 화면이고 자체 체크칸 규칙이 따로 있다.
     사장님이 나중에 직접 손보실 자리라 손대지 않는다.
   ============================================================ */

html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input:is([type="checkbox"],[type="radio"]){
  appearance:none!important;
  -webkit-appearance:none!important;
  position:relative;
  width:19px!important;
  height:19px!important;
  flex:none;
  border:0!important;
  border-radius:6px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(240,246,255,.9))!important;
  box-shadow:inset 0 1.5px 1px -1px #fff,inset 0 0 0 1px rgba(160,196,244,.75)!important;
  cursor:pointer;
  transition:background .14s,box-shadow .14s;
}
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input[type="radio"]{ border-radius:50%!important; }

html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input:is([type="checkbox"],[type="radio"]):hover{
  box-shadow:inset 0 1.5px 1px -1px #fff,inset 0 0 0 1px rgba(110,163,235,.95)!important;
}
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input:is([type="checkbox"],[type="radio"]):checked{
  background:linear-gradient(180deg,#5b9bec,#2f6ec9)!important;
  box-shadow:inset 0 1.5px 1px -1px rgba(255,255,255,.7),0 6px 12px -8px rgba(30,80,160,.9)!important;
}

/* 켜진 표시 — 확인란은 갈고리, 라디오는 점 */
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input[type="checkbox"]::after{
  content:"";
  position:absolute;
  left:6px;top:2.5px;
  width:5px;height:10px;
  border:solid #fff;
  border-width:0 2.2px 2.2px 0;
  transform:rotate(43deg);
  opacity:0;
  transition:opacity .12s;
}
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input[type="checkbox"]:checked::after{ opacity:1; }
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input[type="radio"]::after{
  content:"";
  position:absolute;
  inset:5px;
  border-radius:50%;
  background:#fff;
  opacity:0;
  transition:opacity .12s;
}
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input[type="radio"]:checked::after{ opacity:1; }

html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input:is([type="checkbox"],[type="radio"]):focus-visible{
  outline:2px solid #2f6ec9;
  outline-offset:2px;
}
html body:is(.a-glass,.arife-glass):not(.film-page):not(#nope):not(#_):not(#__)
  input:is([type="checkbox"],[type="radio"]):disabled{
  opacity:.45;
  cursor:not-allowed;
}
