:root { --green:#173b32; --deep:#0f2922; --cream:#f4f0e8; --paper:#f8f7f3; --ink:#1b2521; --muted:#718078; --line:#dfe3df; --gold:#b3965e; --sans:"Noto Sans KR",sans-serif; --serif:"DM Serif Display",serif; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
a { color:inherit; text-decoration:none; }
[hidden] { display:none !important; }
.auth-screen { min-height:100vh; display:grid; grid-template-columns:1.15fr .85fr; background:#fff; }
.auth-photo { background:linear-gradient(90deg,rgba(10,29,24,.08),rgba(10,29,24,.35)),url("../images/exterior-2/YBC00392.jpg") center/cover; }
.auth-panel { display:flex; flex-direction:column; justify-content:center; padding:8vw; }
.auth-brand { position:absolute; top:42px; display:flex; align-items:center; gap:12px; }
.auth-brand span,.side-brand>span { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--green); font:24px var(--serif); }
.auth-brand strong { font:17px var(--serif); letter-spacing:.08em; }
.kicker { margin:0 0 18px; color:var(--gold); font-size:9px; font-weight:700; letter-spacing:.28em; }
.auth-panel h1 { margin:0; font:52px/1.1 var(--serif); }
.auth-note { max-width:470px; margin:25px 0 5px; color:var(--muted); font-size:12px; line-height:1.8; }
.auth-form { display:grid; gap:18px; margin-top:40px; }
.auth-form label,.form-grid label { display:grid; gap:8px; color:#4b5a53; font-size:11px; font-weight:600; }
.auth-form input,.form-grid input,.form-grid textarea,.form-grid select,.item-card input,.item-card textarea,.item-card select { width:100%; border:1px solid var(--line); border-radius:2px; background:#fff; color:var(--ink); outline:none; transition:.2s; }
.auth-form input { height:52px; padding:0 15px; }
input:focus,textarea:focus,select:focus { border-color:var(--gold)!important; box-shadow:0 0 0 3px rgba(179,150,94,.1); }
.auth-form button { height:54px; margin-top:10px; border:0; background:var(--green); color:#fff; font-size:12px; font-weight:700; }
.form-error { min-height:1em; margin:0; color:#a33737; font-size:11px; }
.admin-app { min-height:100vh; }
.sidebar { position:fixed; inset:0 auto 0 0; z-index:30; width:260px; display:flex; flex-direction:column; padding:34px 24px; background:var(--deep); color:#fff; }
.side-brand { display:flex; align-items:center; gap:12px; padding:0 8px 35px; border-bottom:1px solid rgba(255,255,255,.13); }
.side-brand>span { border-color:rgba(255,255,255,.6); }
.side-brand strong { display:block; font:16px var(--serif); letter-spacing:.06em; }
.side-brand small { display:block; margin-top:4px; color:rgba(255,255,255,.38); font-size:7px; letter-spacing:.18em; }
.sidebar nav { display:grid; gap:5px; margin-top:34px; }
.sidebar nav button { display:flex; gap:15px; align-items:center; padding:13px 14px; border:0; background:transparent; color:rgba(255,255,255,.57); text-align:left; font-size:12px; }
.sidebar nav button span { color:rgba(255,255,255,.25); font:10px var(--serif); }
.sidebar nav button.active,.sidebar nav button:hover { background:rgba(255,255,255,.09); color:#fff; }
.sidebar nav button.active span { color:#ceb67f; }
.side-bottom { display:grid; gap:15px; margin-top:auto; padding:25px 8px 0; border-top:1px solid rgba(255,255,255,.13); }
.side-bottom a,.side-bottom button { border:0; background:transparent; color:rgba(255,255,255,.5); padding:0; text-align:left; font-size:10px; }
.mobile-admin-header { display:none; }
.admin-main { margin-left:260px; padding:0 6vw 90px; }
.admin-top { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; min-height:128px; margin:0 -6vw 55px; padding:25px 6vw; border-bottom:1px solid var(--line); background:rgba(248,247,243,.94); backdrop-filter:blur(10px); }
.admin-top p { margin:0; color:var(--gold); font-size:8px; letter-spacing:.22em; }
.admin-top h1 { margin:3px 0 0; font:34px var(--serif); }
.top-actions { display:flex; align-items:center; gap:10px; }
.save-state { margin-right:8px; color:var(--muted); font-size:10px; }
.button { min-height:42px; padding:0 18px; border:1px solid transparent; font-size:11px; font-weight:600; }
.button.primary { background:var(--green); color:#fff; }
.button.ghost { border-color:var(--line); background:#fff; color:var(--muted); }
.button.ghost.dark { border-color:#8b9892; background:transparent; color:var(--ink); }
.button.add { border-color:#cbd3ce; background:transparent; color:var(--green); }
.admin-view { display:none; max-width:1120px; margin:auto; }
.admin-view.active { display:block; }
.panel-intro { margin-bottom:28px; }
.panel-intro.with-action { display:flex; align-items:end; justify-content:space-between; gap:25px; }
.panel-intro h2 { margin:0; font-size:21px; }
.panel-intro p { margin:7px 0 0; color:var(--muted); font-size:12px; }
.panel-divider { height:1px; margin:60px 0; background:var(--line); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px 25px; padding:32px; border:1px solid var(--line); background:#fff; }
.form-grid .wide { grid-column:1/-1; }
.form-grid input { height:46px; padding:0 13px; }
.form-grid textarea { min-height:90px; padding:12px 13px; resize:vertical; line-height:1.7; }
.form-grid label small { color:var(--muted); font-weight:400; }
.image-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:18px; align-items:start; }
.image-item { position:relative; overflow:hidden; width:100%; min-width:0; height:190px; background:#dfe4e1; isolation:isolate; contain:layout paint; }
.image-item img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.image-item .image-order { position:absolute; left:10px; top:10px; display:grid; place-items:center; width:30px; height:30px; background:var(--green); color:#fff; font:12px var(--serif); }
.image-item .image-actions { position:absolute; inset:auto 0 0; display:flex; transform:translateY(100%); transition:.25s; }
.image-item:hover .image-actions { transform:none; }
.image-actions button { flex:1; height:38px; border:0; background:rgba(15,41,34,.9); color:#fff; font-size:10px; }
.asset-library,.picker-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); grid-auto-rows:132px; gap:12px; align-items:stretch; }
.asset-library figure,.picker-grid button { position:relative; display:block; width:100%; min-width:0; height:132px; min-height:132px; max-height:132px; margin:0; overflow:hidden; border:0; padding:0; background:#e0e4e1; isolation:isolate; contain:strict; }
.asset-library img,.picker-grid img { position:absolute!important; inset:0!important; display:block!important; width:100%!important; min-width:0!important; height:100%!important; max-width:none!important; max-height:none!important; margin:0!important; object-fit:cover!important; }
.repeater { display:grid; gap:22px; }
.item-card { border:1px solid var(--line); background:#fff; }
.item-head { display:flex; justify-content:space-between; align-items:center; padding:18px 22px; border-bottom:1px solid var(--line); }
.item-head h3 { margin:0; font-size:15px; }
.item-head .danger { border:0; background:transparent; color:#a64b4b; font-size:10px; }
.item-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; padding:24px; }
.item-body > * { min-width:0; }
.item-body label { display:grid; gap:6px; color:var(--muted); font-size:10px; }
.item-body label.wide { grid-column:1/-1; }
.item-body input,.item-body select { height:42px; padding:0 11px; }
.item-body textarea { padding:10px 11px; resize:vertical; }
.room-photos { grid-column:1/-1; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); grid-auto-flow:row; gap:8px; align-items:start; width:100%; min-width:0; }
.room-photo { position:relative; overflow:hidden; width:100%; min-width:0; aspect-ratio:4/3; isolation:isolate; contain:layout paint; }
.room-photo img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.room-photo button { position:absolute; right:4px; top:4px; width:24px; height:24px; border:0; border-radius:50%; background:rgba(0,0,0,.6); color:#fff; }
.add-photo { display:grid; place-items:center; width:100%; min-width:0; aspect-ratio:4/3; border:1px dashed #aeb8b2; background:#f7f8f6; color:var(--muted); font-size:10px; }
.compact-repeater { display:grid; gap:10px; }
.compact-row { display:grid; grid-template-columns:1fr 1.4fr 44px; gap:10px; align-items:center; padding:13px; border:1px solid var(--line); background:#fff; }
.compact-row.attraction { grid-template-columns:1fr .7fr 1.6fr 44px; }
.compact-row input { height:40px; padding:0 10px; border:1px solid var(--line); }
.compact-row button { height:40px; border:0; background:#f8eeee; color:#9c4949; }
.deploy-hero { margin-bottom:35px; padding:50px; background:var(--deep); color:#fff; }
.deploy-hero span { color:#d0b77e; font-size:9px; letter-spacing:.22em; }
.deploy-hero h2 { margin:15px 0; font:46px/1.08 var(--serif); }
.deploy-hero p { max-width:700px; margin:0; color:rgba(255,255,255,.58); font-size:12px; line-height:1.8; }
.deploy-grid { margin-bottom:20px; }
.token-label input { font-family:monospace; }
.token-help { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:-6px; padding:16px 18px; background:#f2f6f3; border:1px solid #d6e0da; }
.token-help a { flex:none; color:var(--green); font-size:11px; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.token-help p { margin:0; color:var(--muted); font-size:10px; line-height:1.7; text-align:right; }
.repo-advanced { border-top:1px solid var(--line); padding-top:18px; }
.repo-advanced summary { color:var(--muted); font-size:11px; cursor:pointer; }
.repo-advanced-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px 22px; margin-top:18px; }
.repo-advanced-grid label { display:grid; gap:8px; }
.deploy-actions { display:flex; justify-content:flex-end; gap:10px; }
.deploy-log { margin-top:20px; padding:18px; border-left:3px solid var(--gold); background:#eeece5; color:#5b6861; font:11px/1.7 monospace; white-space:pre-wrap; }
.security-note { margin-top:30px; padding:22px; border:1px solid #dacfb9; background:#faf7ef; }
.security-note strong { font-size:12px; }
.security-note p { margin:6px 0 0; color:var(--muted); font-size:11px; }
.picker-dialog { width:min(980px,94vw); max-width:none; max-height:88vh; padding:0; border:0; background:#fff; }
.picker-dialog::backdrop { background:rgba(10,25,21,.75); backdrop-filter:blur(5px); }
.picker-head { display:flex; justify-content:space-between; align-items:center; padding:25px 30px; border-bottom:1px solid var(--line); }
.picker-head small { color:var(--gold); font-size:8px; letter-spacing:.2em; }
.picker-head h2 { margin:3px 0 0; font:31px var(--serif); }
.picker-head button { width:38px;height:38px;border:0;background:#f1f2ef;font-size:22px; }
.upload-drop { display:block; margin:20px 30px; padding:17px; border:1px dashed #9eaaa4; text-align:center; color:var(--green); font-size:11px; cursor:pointer; }
.upload-drop input { display:none; }
.picker-grid { max-height:55vh; overflow-x:hidden; overflow-y:auto; padding:0 30px 30px; }
.picker-grid button:hover::after { content:"선택"; position:absolute; inset:0; display:grid; place-items:center; background:rgba(15,41,34,.65); color:#fff; font-size:11px; }
.toast { position:fixed; z-index:100; right:25px; bottom:25px; max-width:380px; padding:14px 18px; background:var(--deep); color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.2); font-size:11px; opacity:0; transform:translateY(15px); pointer-events:none; transition:.25s; }
.toast.show { opacity:1; transform:none; }

@media (max-width:900px) {
  .auth-screen { grid-template-columns:1fr; }
  .auth-photo { display:none; }
  .auth-panel { min-height:100vh; padding:90px 9vw 50px; }
  .sidebar { transform:translateX(-100%); transition:.3s; }
  .sidebar.open { transform:none; }
  .mobile-admin-header { position:sticky; top:0; z-index:25; display:flex; justify-content:space-between; align-items:center; height:60px; padding:0 20px; background:var(--deep); color:#fff; }
  .mobile-admin-header strong { font:15px var(--serif); letter-spacing:.08em; }
  .mobile-admin-header button { border:0; background:transparent; color:#fff; font-size:20px; }
  .admin-main { margin-left:0; padding:0 25px 70px; }
  .admin-top { top:60px; margin:0 -25px 40px; padding:20px 25px; }
  .save-state,.button.ghost { display:none; }
  .image-list { grid-template-columns:1fr 1fr; }
  .asset-library,.picker-grid { grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:128px; }
  .asset-library figure,.picker-grid button { height:128px; min-height:128px; max-height:128px; }
  .room-photos { grid-template-columns:repeat(4,1fr); }
}
@media (max-width:560px) {
  .auth-panel h1 { font-size:42px; }
  .admin-main { padding-left:16px; padding-right:16px; }
  .admin-top { top:60px; margin-left:-16px; margin-right:-16px; padding:16px; }
  .admin-top h1 { font-size:27px; }
  .top-actions { gap:0; }
  .form-grid { grid-template-columns:1fr; padding:20px; }
  .form-grid .wide { grid-column:auto; }
  .repo-advanced-grid { grid-template-columns:1fr; }
  .token-help { align-items:flex-start; flex-direction:column; }
  .token-help p { text-align:left; }
  .panel-intro.with-action { align-items:start; }
  .image-list { grid-template-columns:1fr; }
  .asset-library,.picker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:112px; }
  .asset-library figure,.picker-grid button { height:112px; min-height:112px; max-height:112px; }
  .item-body { grid-template-columns:1fr; padding:18px; }
  .item-body label.wide,.room-photos { grid-column:auto; }
  .room-photos { grid-template-columns:repeat(3,1fr); }
  .compact-row,.compact-row.attraction { grid-template-columns:1fr 44px; }
  .compact-row input:nth-last-child(n+3) { grid-column:1/-1; }
  .deploy-hero { padding:30px 24px; }
  .deploy-hero h2 { font-size:38px; }
}