:root{
  --ink:#101722; --navy:#0a1830; --navy2:#122442; --blue:#2463eb;
  --paper:#f5f3ee; --paper2:#ebe8e1; --line:#d8d5ce; --muted:#7a7f87;
  --white:#fff; --gold:#b79b62; --green:#d7dfd1; --track:#caa183;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Arial,"Noto Sans KR",sans-serif;background:var(--paper);color:var(--ink)}
button{font:inherit}
.shell{height:100%;display:flex;flex-direction:column;background:var(--paper)}
header{
  height:76px;flex:none;display:flex;align-items:center;padding:0 34px;
  background:rgba(245,243,238,.96);border-bottom:1px solid var(--line);z-index:20
}
.brand{font-weight:900;letter-spacing:.16em;font-size:14px;color:var(--navy)}
.brand b{color:var(--gold)}
header nav{display:flex;align-items:center;gap:28px;margin-left:42px;font-size:13px;color:#80858c}
header nav strong{color:var(--ink);font-weight:800}
header nav span{font-weight:600}
.exit{margin-left:auto;font-size:12px;color:var(--navy)}
.exit a{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;font-weight:800;border:1px solid rgba(183,155,98,.75);border-radius:999px;padding:9px 14px;background:rgba(255,255,255,.28);transition:background .18s ease,border-color .18s ease}
.exit a:hover{background:#fff;border-color:var(--gold)}
.app{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(390px,.72fr);background:var(--paper)}

/* map */
.map{position:relative;overflow:hidden;background:#efede8}
.map::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.8),transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,.35),transparent 45%)
}
.campus{
  position:absolute;inset:5.5% 5%;background:var(--green);
  border:1px solid #cbd4c7;border-radius:24px
}
.campus::after{
  content:"";position:absolute;inset:18px;border:1px solid rgba(70,88,72,.08);border-radius:17px
}
.road{position:absolute;background:#e9ecee;border:0}
.road.h{left:7%;right:7%;top:56%;height:6%}
.road.v{top:8%;bottom:8%;left:66%;width:5.5%}
.field{
  position:absolute;left:36%;top:34%;width:36%;height:31%;border-radius:18px;
  background:#a9c899;border:6px solid var(--track);box-shadow:none
}
.field::before{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:74px;height:74px;border-radius:50%;border:1.5px solid rgba(255,255,255,.85)
}
.field::after{
  content:"";position:absolute;top:0;bottom:0;left:50%;border-left:1.5px solid rgba(255,255,255,.85)
}
.map-title{
  position:absolute;left:34px;top:26px;z-index:10;
  color:#65706f;font-size:10px;font-weight:800;letter-spacing:.18em
}
.legend{
  position:absolute;z-index:10;left:32px;bottom:30px;width:170px;
  background:transparent;border:0;box-shadow:none;padding:0
}
.legend h3{font-size:12px;margin:0 0 10px;color:#5c6167}
.legend button{
  width:auto;display:block;border:0;background:transparent;color:#7b8086;
  padding:4px 0;margin:0;text-align:left;font-size:12px;cursor:pointer
}
.legend button.active{color:var(--ink);font-weight:800}
.legend p{font-size:10px;line-height:1.5;color:#8b8f95;margin-top:12px}

/* buildings: flat architectural blocks */
.building{
  position:absolute;z-index:8;transform:translate(-50%,-50%);
  border:0;background:transparent;padding:0;text-align:center;cursor:pointer;
  filter:none;transition:transform .18s ease,opacity .18s ease
}
.building:hover{transform:translate(-50%,-50%) scale(1.025)}
.building.selected{transform:translate(-50%,-50%) scale(1.03)}
.shape{
  background:#d7d8d8;border:1px solid #c7c9c9;border-radius:3px;
  box-shadow:8px 8px 0 rgba(16,23,34,.055);transform:none;overflow:hidden
}
.shape::before,.shape::after{display:none}
.xwide{width:220px;height:60px}.medium{width:150px;height:52px}.wide{width:145px;height:54px}.tall{width:70px;height:128px}.short{height:98px}.low{height:42px}
.stage .shape{background:#d9c6ad;border-color:#cbb291}
.pin{display:none}
.label{
  margin-top:7px;background:transparent;border:0;border-radius:0;padding:0;
  font-size:11px;font-weight:800;white-space:nowrap;box-shadow:none;color:#4c535a;
  letter-spacing:-.02em
}
.building.selected .shape{background:var(--navy);border-color:var(--navy)}
.building.selected .label{color:var(--navy);font-weight:900}
.coming .shape{background:#d9d4ca;opacity:.55}
.coming .label::after{content:"  준비중";color:#aa8a4d;font-size:9px;font-weight:700}
.ref{opacity:.35;pointer-events:none}
.gate{pointer-events:none}.gate .shape{width:92px;height:12px;background:#7b838a;border:0;box-shadow:none}
.tree{
  position:absolute;z-index:4;width:12px;height:12px;border-radius:50%;background:#7f9c78;
  box-shadow:none;opacity:.65
}

/* panel */
.panel{
  min-width:0;background:#f8f7f4;border-left:1px solid var(--line);overflow:auto;box-shadow:none
}
.empty{height:100%;display:flex;align-items:center;justify-content:center;text-align:left;padding:54px;color:#8a8e94}
.empty b{display:block;color:var(--ink);font-size:28px;line-height:1.18;margin-bottom:12px;letter-spacing:-.045em}
.detail{display:none}.detail.show{display:block}
.head{padding:42px 34px 24px}
.badge{
  display:inline-block;width:auto;height:auto;border-radius:0;background:transparent;color:#9b8350;
  font-weight:800;font-size:11px;letter-spacing:.16em;margin:0 0 14px;box-shadow:none
}
.head h1{display:block;font-size:34px;line-height:1.08;letter-spacing:-.05em;margin:0;color:var(--navy)}
.category{
  display:inline-block;margin:12px 0 0;border:0;background:transparent;color:#84898f;
  border-radius:0;padding:0;font-size:11px;font-weight:700
}
.head p{margin:18px 0 0;color:#737980;line-height:1.75;font-size:14px}
.hero{
  margin:0 34px;height:300px;border-radius:0;overflow:hidden;position:relative;
  background:#e9e7e1;box-shadow:none
}
.hero img{width:100%;height:100%;object-fit:cover}
.pending{
  position:absolute;left:16px;bottom:16px;right:auto;background:rgba(10,24,48,.88);color:#fff;
  border:0;border-radius:0;padding:9px 11px;font-size:10px;backdrop-filter:none
}
.thumbs{
  display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:10px 34px 0;overflow:visible;padding:0
}
.thumb{
  width:auto;height:54px;padding:0;border:0;border-radius:0;overflow:hidden;background:#e8e6e0;cursor:pointer;opacity:.62
}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb.on{opacity:1;outline:2px solid var(--navy);outline-offset:1px}
.actions{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;margin:24px 34px}
.actions button{
  border:1px solid #cfd2d2;background:transparent;border-radius:0;padding:13px 14px;font-weight:800;cursor:pointer;color:#42484e
}
.actions button:hover{background:#f1efeb}
.actions .primary{
  background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:none
}
.actions .primary:hover{background:#102648}
.info{
  margin:0 34px 36px;padding-top:22px;border-top:1px solid var(--line);
  color:#777d84;font-size:12px;line-height:1.8
}
.info b{
  display:block;color:#383e44;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px
}
.panel::-webkit-scrollbar,.thumbs::-webkit-scrollbar{width:7px;height:7px}
.panel::-webkit-scrollbar-thumb,.thumbs::-webkit-scrollbar-thumb{background:#d2d0ca}

/* gallery */
.gallery{position:fixed;z-index:50;inset:0;background:#0b1018;color:#fff;display:none}
.gallery.open{display:grid;grid-template-rows:72px 1fr 80px}
.gtop{display:flex;align-items:center;padding:0 32px;border-bottom:1px solid rgba(255,255,255,.12)}
.gtop h2{margin:0;font-size:15px;font-weight:700}
.gtop button{
  margin-left:auto;width:36px;height:36px;border:1px solid rgba(255,255,255,.2);
  border-radius:0;background:transparent;color:#fff;font-size:18px
}
.gmain{min-height:0;display:grid;place-items:center;padding:18px 6vw}
.gmain img{max-width:100%;max-height:100%;object-fit:contain;border-radius:0;box-shadow:none}
.gbottom{display:flex;align-items:center;justify-content:center;gap:10px}
.gbottom button{
  border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;border-radius:0;padding:10px 15px
}
.gbottom span{font-size:11px;color:#aab3be}

@media(max-width:920px){
  .shell{height:auto;min-height:100%;overflow:auto}
  header{position:sticky;top:0;height:64px;padding:0 18px}
  header nav{display:none}.exit{font-size:11px}
  .app{display:block}
  .map{height:62vh;min-height:520px}
  .panel{border-left:0;border-top:1px solid var(--line)}
  .xwide{width:160px;height:48px}.wide{width:108px}.medium{width:114px}.tall{width:60px;height:104px}
  .head{padding:34px 24px 22px}.hero{margin:0 24px;height:260px}.thumbs{margin:9px 24px 0}.actions{margin:22px 24px}.info{margin:0 24px 32px}
}
@media(max-width:620px){
  .brand{font-size:12px}.exit{display:block;font-size:10px}.exit a{padding:8px 11px}.map{height:58vh;min-height:480px}
  .map-title{left:18px;top:18px;font-size:9px}.legend{left:18px;bottom:18px}
  .building{transform:translate(-50%,-50%) scale(.86)}.building:hover,.building.selected{transform:translate(-50%,-50%) scale(.88)}
  .head h1{font-size:30px}.hero{height:230px}.thumbs{grid-template-columns:repeat(4,1fr)}
}


.mobile-dock,.mobile-peek,.mobile-detail-top{display:none}
@media(max-width:920px){
 html,body{overscroll-behavior-y:none}.shell{height:100dvh;min-height:0;overflow:hidden}
 header{height:62px;position:relative;padding:0 17px;flex:none}.brand{font-size:12px}.exit{font-size:10px}header nav{display:none}
 .app{display:block;height:calc(100dvh - 62px)}.map{height:100%;min-height:0;overflow:hidden}
 .campus{inset:4% 3% 11%;border-radius:20px}.map-title{left:17px;top:16px;font-size:8px}.legend{display:none}
 .road.h{left:5%;right:5%;top:55%;height:6%}.road.v{top:6%;bottom:12%;left:65%;width:6%}.field{left:34%;top:34%;width:40%;height:31%;border-width:5px}
 .building{padding:14px;transform:translate(-50%,-50%) scale(.78);touch-action:manipulation}.building:hover,.building.selected{transform:translate(-50%,-50%) scale(.81)}
 .xwide{width:158px;height:48px}.wide{width:108px;height:46px}.medium{width:110px;height:44px}.tall{width:58px;height:102px}.short{height:80px}.low{height:36px}.label{font-size:10px}.tree{width:9px;height:9px}
 .mobile-dock{display:flex;position:absolute;z-index:24;left:0;right:0;bottom:13px;gap:7px;overflow-x:auto;padding:0 13px 5px;scrollbar-width:none}.mobile-dock::-webkit-scrollbar{display:none}
 .mobile-dock button{flex:none;border:1px solid #d4d2cc;background:#faf9f5e8;backdrop-filter:blur(10px);border-radius:999px;padding:9px 12px;font-size:10px;font-weight:800;color:#555d64;box-shadow:0 5px 16px #1a263518}.mobile-dock button.on{background:#0a1830;border-color:#0a1830;color:#fff}
 .mobile-peek{position:absolute;z-index:29;left:13px;right:13px;bottom:65px;background:#faf9f6;box-shadow:0 18px 50px #17233332;grid-template-columns:88px 1fr 34px;min-height:88px}.mobile-peek.show{display:grid}
 .mobile-peek img{width:88px;height:88px;object-fit:cover;background:#e5e2dc}.peek-copy{padding:12px 11px;min-width:0}.peek-copy small{display:block;color:#ae925d;font-size:8px;font-weight:900;letter-spacing:.12em;margin-bottom:4px}.peek-copy b{display:block;font-size:16px;letter-spacing:-.04em}.peek-copy span{display:block;margin-top:5px;color:#747b83;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.peek-go{border:0;border-left:1px solid #dfdcd6;background:transparent;color:#0a1830;font-size:20px}
 .panel{display:none}.panel.mobile-open{display:block;position:fixed;z-index:60;inset:0;background:#f8f7f4;overflow:auto}
 .mobile-detail-top{height:56px;display:flex;align-items:center;padding:0 17px;position:sticky;top:0;z-index:8;background:#f8f7f4ed;backdrop-filter:blur(12px);border-bottom:1px solid #dad7d0}.mobile-back{border:0;background:transparent;padding:8px 10px 8px 0;font-weight:800;color:#30363d}.mobile-detail-title{margin-left:auto;font-size:9px;letter-spacing:.13em;color:#7a7f86}
 .empty{display:none}.detail.show{display:block}.head{padding:32px 21px 20px}.badge{font-size:9px;margin-bottom:10px}.head h1{font-size:34px}.head p{font-size:13px;margin-top:16px}
 .hero{margin:0;height:min(61vw,350px);min-height:245px;border-radius:0}.pending{left:13px;bottom:13px;right:auto;border-radius:0;font-size:9px}
 .thumbs{display:flex;grid-template-columns:none;margin:0;padding:9px 13px 3px;overflow-x:auto}.thumb{width:72px;height:54px;flex:none}.actions{margin:21px;grid-template-columns:1fr 1.25fr}.info{margin:0 21px 34px}
}

@media(max-width:920px){
 .building{min-width:72px;min-height:72px;z-index:15}
 .building .shape,.building .label{pointer-events:none}
 .ref{z-index:7}
}

/* v11 actual campus layout — latest hand sketch */
.field{left:35%;top:31%;width:35%;height:38%}
.road.h{left:5%;right:5%;top:70%;height:4.5%;opacity:.72}
.road.v{top:10%;bottom:5%;left:72%;width:4.5%;opacity:.72}
@media(max-width:920px){
 .campus{inset:3% 3% 10%}
 .field{left:34%;top:31%;width:37%;height:38%}
 .road.h{left:5%;right:5%;top:70%;height:4.5%}
 .road.v{top:8%;bottom:10%;left:72%;width:5%}
 .building{min-width:78px;min-height:78px}
 .building .label{font-size:10px}
}

/* ===== v12 VERTICAL CAMPUS — mobile primary ===== */
@media(max-width:920px){
 .map{background:#f3f1ec}
 .campus{inset:2.5% 3% 9%;border-radius:26px;background:#dce4d7}
 .road.h{display:none}
 .road.v{display:block;left:47.5%;top:12%;bottom:8%;width:5%;opacity:.52;background:#ecefed}
 .field{left:35%;top:30%;width:29%;height:36%;border-radius:15px;border-width:5px}
 .field:before{width:55px;height:55px}
 .map-title{top:13px;left:17px}
 .building{transform:translate(-50%,-50%) scale(.88)}
 .building:hover,.building.selected{transform:translate(-50%,-50%) scale(.91)}
 .xwide{width:128px;height:50px}
 .wide{width:105px;height:48px}
 .medium{width:100px;height:48px}
 .tall{width:58px;height:122px}
 .short{height:92px}
 .low{width:68px;height:64px;border-radius:18px 18px 5px 5px}
 .stage .shape{background:#d4c1a7}
 .gate .shape{width:72px;height:9px}
 .label{font-size:10px;line-height:1.2}
 .coming .shape{opacity:.78;background:#d8d0c1}
 .coming .label:after{content:""}
}
/* desktop: keep the same vertical composition as a focal campus plan */
@media(min-width:921px){
 .campus{inset:4% 8%}
 .road.h{display:none}.road.v{left:48%;top:10%;bottom:7%;width:4%}
 .field{left:35%;top:29%;width:29%;height:38%}
}

/* v13 — latest hand sketch locked as the source of truth */
@media(max-width:920px){
  .campus{inset:2.2% 2.8% 9%;background:#f2f1ec;border-color:#dedbd4}
  .road.h,.road.v{display:none!important}
  .field{
    left:35%;top:27%;width:25%;height:42%;
    background:#dfe6d9;border:1px solid #cbd3c5;border-radius:10px;
  }
  .field:before,.field:after{opacity:.55}
  .building{z-index:15}
  /* building proportions mirror the user's sketch rather than a generic campus map */
  .building[onclick*="'store'"] .shape{width:62px;height:150px}
  .building[onclick*="'seong'"] .shape{width:68px;height:142px}
  .building[onclick*="'annex'"] .shape{width:68px;height:152px}
  .building[onclick*="'cafeteria'"] .shape{width:55px;height:128px}
  .building[onclick*="'stage'"] .shape{width:68px;height:76px;border-radius:28px 28px 10px 10px}
  .building[onclick*="'gym'"] .shape{width:128px;height:58px}
  .building.ref .shape{width:138px;height:60px}
  .building[onclick*="'main'"] .shape{width:132px;height:60px}
  .gate .shape{width:72px;height:8px}
  .label{font-size:10px;font-weight:850}
  .mobile-dock{bottom:10px}
}
@media(min-width:921px){
  .road.h,.road.v{display:none!important}
  .field{left:36%;top:27%;width:25%;height:42%;background:#dfe6d9;border:1px solid #cbd3c5}
}

/* ============================================================
   v14 — latest hand sketch is the fixed geometry source of truth
   ============================================================ */
@media(max-width:920px){
  .campus{
    inset:1.5% 2.5% 8.5%;
    background:#f4f2ed;
    border:1px solid #dedbd3;
    border-radius:24px;
  }
  .campus:after{display:none}
  .road.h,.road.v{display:none!important}

  /* central playground: open vertical void, not a dominant stadium block */
  .field{
    left:34.5%; top:22%;
    width:29%; height:49%;
    background:rgba(184,204,174,.34);
    border:1px dashed rgba(89,110,84,.22);
    border-radius:16px;
    box-shadow:none;
  }
  .field:before{
    width:64px;height:64px;border:1px solid rgba(255,255,255,.72)
  }
  .field:after{border-left:1px solid rgba(255,255,255,.65)}

  .building{padding:12px;min-width:0;min-height:0;transform:translate(-50%,-50%)}
  .building:hover,.building.selected{transform:translate(-50%,-50%)}
  .building .shape{box-shadow:6px 7px 0 rgba(16,23,34,.045)}
  .building .label{font-size:10px;margin-top:6px;line-height:1.15}

  /* TOP: two horizontal buildings */
  .sketch-middle .shape{
    width:152px!important;height:66px!important;border-radius:3px!important;
  }
  .sketch-main .shape{
    width:154px!important;height:66px!important;border-radius:3px!important;
  }

  /* LEFT upper: tall Haesim/store */
  .sketch-store .shape{
    width:63px!important;height:184px!important;border-radius:4px 4px 12px 4px!important;
  }

  /* RIGHT upper: tall Seonggyungwan */
  .sketch-seong .shape{
    width:66px!important;height:170px!important;border-radius:4px!important;
  }

  /* LEFT lower: outdoor stage is a vertical capsule / oval */
  .sketch-stage .shape{
    width:68px!important;height:126px!important;
    border-radius:34px 34px 30px 30px!important;
    background:#d8c6ad!important;
  }

  /* RIGHT lower: annex is longest tall block */
  .sketch-annex .shape{
    width:70px!important;height:210px!important;border-radius:4px!important;
  }

  /* FAR RIGHT lower: cafeteria is narrower and shorter */
  .sketch-cafe .shape{
    width:52px!important;height:145px!important;border-radius:3px!important;
  }

  /* BOTTOM center: 77th anniversary hall is horizontal */
  .sketch-memorial .shape{
    width:154px!important;height:64px!important;border-radius:4px!important;
    background:#d8d0c1!important;opacity:.92!important;
  }

  /* BOTTOM left: short gate bar */
  .sketch-gate .shape{
    width:92px!important;height:9px!important;border-radius:2px!important;
    background:#727980!important;box-shadow:none!important;
  }

  /* labels readable and close to sketch objects */
  .sketch-stage .label{max-width:92px;white-space:normal}
  .sketch-store .label{max-width:90px;white-space:normal}
  .sketch-memorial .label{font-size:10px}
}

/* Desktop keeps the same silhouette instead of reverting to generic blocks. */
@media(min-width:921px){
  .road.h,.road.v{display:none!important}
  .field{left:36%;top:21%;width:28%;height:51%;background:rgba(184,204,174,.28);border:1px dashed rgba(89,110,84,.2)}
  .sketch-middle .shape,.sketch-main .shape{width:190px!important;height:76px!important}
  .sketch-store .shape{width:78px!important;height:215px!important}
  .sketch-seong .shape{width:82px!important;height:205px!important}
  .sketch-stage .shape{width:86px!important;height:150px!important;border-radius:43px!important}
  .sketch-annex .shape{width:88px!important;height:250px!important}
  .sketch-cafe .shape{width:66px!important;height:172px!important}
  .sketch-memorial .shape{width:190px!important;height:74px!important}
  .sketch-gate .shape{width:110px!important;height:10px!important}
}

/* v18 final corrections */
.tree{display:none!important}
.ref{opacity:.38!important;pointer-events:none!important}
.sketch-middle{opacity:1!important}
.sketch-seong.ref{opacity:.38!important}
@media(max-width:920px){.sketch-main .label{font-size:9.5px;white-space:nowrap}}

/* ==========================================================
   v20 VERIFIED VISUAL OVERRIDES
   ========================================================== */

/* kill every older field pseudo-marking */
.field::before,.field::after{content:none!important;display:none!important}

/* Football pitch: exactly one horizontal halfway line */
.field{overflow:visible!important;position:absolute!important}
.halfway-line{
  position:absolute;left:0;right:0;top:50%;
  height:0;border-top:2px solid rgba(255,255,255,.95);
  z-index:4;pointer-events:none
}
.center-circle{
  position:absolute;left:50%;top:50%;
  width:66px;height:66px;transform:translate(-50%,-50%);
  border:2px solid rgba(255,255,255,.95);border-radius:50%;
  z-index:4;pointer-events:none
}
.penalty-box{
  position:absolute;left:50%;width:58%;height:14%;
  transform:translateX(-50%);
  border:2px solid rgba(255,255,255,.95);
  z-index:4;pointer-events:none
}
.penalty-top{top:0;border-top:0}
.penalty-bottom{bottom:0;border-bottom:0}
.goal{
  position:absolute;left:50%;width:24%;height:3%;
  transform:translateX(-50%);
  border:2px solid rgba(255,255,255,.98);
  z-index:5;pointer-events:none
}
.goal-top{top:-3%;border-bottom:0}
.goal-bottom{bottom:-3%;border-top:0}

/* Straight sprint track on RIGHT side of field.
   Running direction is vertical; lane separators are vertical. */
.sprint-track{
  position:absolute;
  left:65.5%;top:29.5%;
  width:8.2%;height:42.5%;
  background:#cda482;
  border:1px solid #b98f6c;
  border-radius:8px;
  z-index:5;
  box-shadow:0 5px 12px rgba(70,48,31,.09);
  overflow:hidden;
  pointer-events:none
}
.sprint-track span{
  position:absolute;top:3%;bottom:3%;width:1px;
  background:rgba(255,255,255,.95)
}
.sprint-track span:nth-child(1){left:25%}
.sprint-track span:nth-child(2){left:50%}
.sprint-track span:nth-child(3){left:75%}

/* Clearly visible but restrained 3D building blocks */
.building:not(.stage):not(.gate) .shape{
  position:relative!important;
  overflow:visible!important;
  background:linear-gradient(145deg,#f0f1f1 0%,#cdd2d5 100%)!important;
  border:1px solid #bcc3c7!important;
  box-shadow:
    9px 10px 0 rgba(117,126,132,.18),
    0 13px 22px rgba(24,33,40,.10)!important;
}
.building:not(.stage):not(.gate) .shape::before{
  display:block!important;content:""!important;
  position:absolute!important;
  left:4px!important;right:-8px!important;top:-9px!important;
  height:9px!important;
  background:#f5f5f2!important;
  border:1px solid #c7cccf!important;
  transform:skewX(-38deg)!important;
  transform-origin:left bottom!important;
  opacity:1!important;
}
.building:not(.stage):not(.gate) .shape::after{
  display:block!important;content:""!important;
  position:absolute!important;
  top:-4px!important;right:-9px!important;
  width:9px!important;height:calc(100% + 4px)!important;
  background:linear-gradient(#c4c9cc,#aeb6ba)!important;
  clip-path:polygon(0 5px,100% 0,100% 94%,0 100%)!important;
  opacity:1!important;
}

/* only Milseong Middle School stays faded */
.ref{opacity:.38!important;pointer-events:none!important}
.ref .shape{filter:saturate(.5)}
.tree{display:none!important}

/* mobile positioning of the straight track relative to the locked field */
@media(max-width:920px){
  .sprint-track{left:64.5%;top:22.5%;width:7.2%;height:49%}
}

/* v23 SVG MINIATURE RENDERER */
.building .shape{display:none!important}
.building{filter:none!important}
.building:hover{filter:none!important}
.mini{display:block;overflow:visible;pointer-events:none}
.mini-h{width:180px;height:95px}
.mini-v{width:88px;height:178px}
.mini-v.narrow{width:68px;height:160px}
.mini-stage{width:92px;height:125px}
.sketch-middle,.sketch-main{margin-top:4px}
.sketch-annex .mini-v{width:92px;height:205px}
.sketch-store .mini-v{width:82px;height:190px}
.sketch-seong .mini-v{width:80px;height:175px}
.sketch-cafe .mini-v{width:62px;height:150px}
.sketch-memorial .mini-h{width:175px;height:90px}
.sketch-stage .mini-stage{width:88px;height:122px}
.ref{opacity:1!important;filter:none!important}
.ref .mini{opacity:.36!important;filter:saturate(.45)}
.tree{display:none!important}
.building.selected .mini{transform:translateY(-2px);transition:.18s}
.building .label{margin-top:0!important}
@media(max-width:920px){
 .mini-h{width:145px;height:80px}
 .mini-v{width:72px;height:155px}
 .sketch-annex .mini-v{width:76px;height:190px}
 .sketch-store .mini-v{width:70px;height:174px}
 .sketch-seong .mini-v{width:68px;height:160px}
 .sketch-cafe .mini-v{width:54px;height:138px}
 .sketch-memorial .mini-h{width:150px;height:82px}
 .sketch-stage .mini-stage{width:78px;height:112px}
}

/* v24 photo-informed miniature sizes */
.ref-photo{display:block;overflow:visible;pointer-events:none}
.sketch-stage .ref-photo{width:100px;height:112px}
.sketch-seong .ref-photo{width:150px;height:90px;transform:rotate(0deg)!important}
.sketch-annex .ref-photo{width:178px;height:102px}
.sketch-store .ref-photo{width:86px;height:178px}
.sketch-main .ref-photo{width:165px;height:94px}
.sketch-middle .ref-photo{width:150px;height:84px}
.ref .ref-photo{opacity:.38!important;filter:saturate(.45)}
@media(max-width:920px){
  .sketch-stage .ref-photo{width:88px;height:100px}
  .sketch-seong .ref-photo{width:126px;height:78px}
  .sketch-annex .ref-photo{width:150px;height:90px}
  .sketch-store .ref-photo{width:74px;height:160px}
  .sketch-main .ref-photo{width:143px;height:84px}
  .sketch-middle .ref-photo{width:132px;height:76px}
}

/* v25 corrections */
.sketch-annex .ref-photo,
.sketch-seong .ref-photo{
  transform:rotate(90deg)!important;
  transform-origin:center center!important;
}
@media(max-width:920px){
  .sketch-annex .ref-photo{width:138px!important;height:82px!important}
  .sketch-seong .ref-photo{width:118px!important;height:72px!important}
}

.sketch-main .mini-haesim{width:165px!important;height:92px!important}
.sketch-store .mini-annex{width:82px!important;height:166px!important}
@media(max-width:920px){
  .sketch-main .mini-haesim{width:145px!important;height:82px!important}
  .sketch-store .mini-annex{width:72px!important;height:150px!important}
}

/* v26 — redraw orientation, NO literal CSS rotation */
.sketch-annex .ref-photo,
.sketch-seong .ref-photo{
  transform:none!important;
  transform-origin:center center!important;
}
.sketch-annex .mini-main-v26{width:175px!important;height:100px!important}
.sketch-seong .mini-middle-v26{width:160px!important;height:92px!important}
.sketch-store .mini-annex-v26{width:150px!important;height:82px!important}
.sketch-cafe .mini-seong-v26{width:138px!important;height:80px!important}

@media(max-width:920px){
  .sketch-annex .mini-main-v26{width:150px!important;height:88px!important}
  .sketch-seong .mini-middle-v26{width:137px!important;height:82px!important}
  .sketch-store .mini-annex-v26{width:132px!important;height:74px!important}
  .sketch-cafe .mini-seong-v26{width:120px!important;height:70px!important}
}

/* v27 final layout lock */
.layout-locked-v27 .building:hover,.layout-locked-v27 .building.selected{transform:translate(-50%,-50%)!important}
.layout-locked-v27 .field{left:31.5%!important;top:23%!important;width:31.5%!important;height:49%!important;border-radius:15px!important}
.layout-locked-v27 .sprint-track{left:65%!important;top:23%!important;width:7%!important;height:49%!important;border-radius:7px!important}
@media(max-width:920px){
.layout-locked-v27 .sketch-middle{left:28%!important;top:10%!important}
.layout-locked-v27 .sketch-main{left:67%!important;top:10%!important}
.layout-locked-v27 .sketch-store{left:15%!important;top:31%!important}
.layout-locked-v27 .sketch-seong{left:79%!important;top:31%!important}
.layout-locked-v27 .sketch-stage{left:14%!important;top:61%!important}
.layout-locked-v27 .sketch-annex{left:76%!important;top:66%!important}
.layout-locked-v27 .sketch-cafe{left:91%!important;top:72%!important}
.layout-locked-v27 .sketch-memorial{left:50%!important;top:84%!important}
.layout-locked-v27 .sketch-gate{left:15%!important;top:89%!important}
.layout-locked-v27 .sketch-middle .ref-photo{width:132px!important;height:76px!important}
.layout-locked-v27 .sketch-main .ref-photo{width:140px!important;height:78px!important}
.layout-locked-v27 .sketch-store .ref-photo{width:118px!important;height:70px!important}
.layout-locked-v27 .sketch-seong .ref-photo{width:112px!important;height:70px!important}
.layout-locked-v27 .sketch-annex .ref-photo{width:132px!important;height:78px!important}
.layout-locked-v27 .sketch-cafe .ref-photo{width:108px!important;height:66px!important}
.layout-locked-v27 .sketch-stage .ref-photo{width:80px!important;height:98px!important}
.layout-locked-v27 .sketch-memorial .ref-photo{width:138px!important;height:76px!important}
}
.layout-locked-v27 .sketch-seong.ref{opacity:.38!important;filter:saturate(.45)!important}

/* v28 click/tap reliability only */
.building[data-place]{
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:rgba(20,50,90,.08);
}
.building[data-place] .mini,
.building[data-place] .label,
.building[data-place] svg,
.building[data-place] svg *{
  pointer-events:none!important;
}
.ref{pointer-events:none!important}
.peek-go{pointer-events:auto!important;touch-action:manipulation!important}
/* MPromotion Virtual Campus media integration — map geometry intentionally untouched */
.hero video,.gmain video{width:100%;height:100%;object-fit:contain;background:#05080a}.vc-media-caption{padding:12px 2px 4px}.vc-media-caption b,.vc-gallery-caption b{display:block}.vc-media-caption p,.vc-gallery-caption p{margin:.35rem 0 0;opacity:.76;line-height:1.55}.vc-video-thumb{display:grid;place-items:center;width:100%;height:100%;min-height:62px;background:#111820;color:#d9b66d;font-size:12px;font-weight:800;letter-spacing:.08em}.vc-gallery-caption{padding:12px 18px;background:rgba(4,8,10,.92);color:#f4f0e8}