*{
  box-sizing:border-box;
}

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

body{
  margin:0;
  background:#050810;
  color:#e8edf7;
  font-family:Arial,"Apple SD Gothic Neo",sans-serif;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  cursor:pointer;
}

button:disabled{
  cursor:default;
  opacity:.6;
}

img{
  max-width:100%;
  height:auto;
}

.hidden{
  display:none!important;
}

/* ===== 공통 레이아웃 ===== */
.container{
  width:100%;
  max-width:1380px;
  margin:0 auto;
  padding:20px;
  overflow-x:hidden;
}

.screen{
  display:block;
}

.card,
.party-card,
.summary-card,
.event-card,
.empty-card{
  background:#07111e;
  border:1px solid #14233a;
  border-radius:22px;
  padding:20px;
  box-shadow:0 0 0 1px rgba(255,255,255,.02) inset;
}

.narrow{
  max-width:480px;
  margin:80px auto;
}

.hero{
  margin-bottom:20px;
}

.section-title{
  margin:16px 0 12px;
}

.muted{
  color:#92a3bf;
}

.empty-card{
  text-align:center;
  color:#91a1bc;
}

.summary-grid,
.home-event-grid,
.party-grid{
  display:grid;
  gap:16px;
}

.summary-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.home-event-grid{
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:14px;
}

.party-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:start;
}

.summary-card .big-number{
  font-size:34px;
  font-weight:800;
  margin-top:10px;
}

/* ===== 상단 ===== */
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 20px;
  border-bottom:1px solid #162033;
  background:#050810;
  position:sticky;
  top:0;
  z-index:30;
}

.brand{
  font-size:20px;
  font-weight:800;
  white-space:nowrap;
}

.top-tabs{
  display:flex;
  gap:10px;
  flex:1;
  min-width:0;
}

.top-right{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.tab-btn,
.pill,
.actions button,
.inline-btn,
.close-btn{
  border:1px solid #22304a;
  background:#0b1220;
  color:#dce7ff;
  border-radius:999px;
  padding:10px 14px;
}

.tab-btn{
  white-space:nowrap;
  min-height:44px;
}

.tab-btn.active{
  background:#1a2f66;
}

.admin-menu{
  position:absolute;
  top:72px;
  right:20px;
  background:#0b1220;
  border:1px solid #22304a;
  border-radius:16px;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
  z-index:40;
}

/* ===== 버튼/폼 ===== */
.text-input,
select{
  width:100%;
  background:#09111d;
  color:#e8edf7;
  border:1px solid #22304a;
  border-radius:14px;
  padding:12px 14px;
  min-height:44px;
}

textarea.text-input{
  resize:vertical;
}

.actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.actions.single{
  margin-top:12px;
}

.right-wrap{
  justify-content:flex-end;
}

.inline-btn{
  padding:6px 10px;
  border-radius:10px;
  min-height:34px;
}

.card-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:14px;
}

.form-group{
  margin-bottom:14px;
}

.form-help{
  margin:8px 0 0;
  font-size:14px;
}

.checkbox-label{
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}

.triple-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:10px;
}

.danger-btn{
  border:1px solid #6b2530;
  background:#351018;
  color:#ffd8df;
}

/* ===== 홈/이벤트 카드 ===== */
.event-card h3,
.party-title{
  margin:0 0 10px;
  font-size:28px;
  font-weight:800;
}

.party-card .party-title{
  font-size:22px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.event-card p,
.party-sub{
  margin:6px 0;
  color:#9eb0cc;
}

.event-top-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:18px;
}

.clickable-event-card{
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,background .15s ease;
}

.clickable-event-card:hover{
  transform:translateY(-2px);
  border-color:rgba(96,165,250,.55);
  background:rgba(15,23,42,.92);
}

.home-event-grid .event-card{
  padding:16px;
  min-height:auto;
}

.home-event-grid .event-card h3{
  font-size:20px;
  margin:0 0 8px;
}

.home-event-grid .event-card p{
  font-size:14px;
  line-height:1.35;
  margin:0;
}

/* ===== 멤버 목록 ===== */
.member-list{
  margin-top:14px;
  border-top:1px solid #152640;
  padding-top:12px;
}

.member-list.compact .member-line{
  margin:4px 0;
}

.member-line{
  display:flex;
  align-items:center;
  gap:6px;
  justify-content:space-between;
  margin:6px 0;
  line-height:1.25;
}

.member-line span{
  display:inline-block;
  flex:1;
  min-width:0;
  word-break:break-word;
}

.my-name{
  color:#68a7ff;
  font-weight:800;
}

/* ===== 모달 ===== */
.modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:80;
}

.modal{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(920px,92vw);
  max-height:85vh;
  overflow:auto;
  background:#08121f;
  border:1px solid #1d2d49;
  border-radius:22px;
  padding:20px;
  z-index:90;
}

.modal-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}

.user-modal-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.name-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px 18px;
  align-items:start;
}

.name-item{
  padding:6px 0;
  text-align:left;
  border-bottom:1px solid rgba(255,255,255,.04);
}

/* ===== 이미지 모달/예시 ===== */
.example-image{
  display:block;
  width:100%;
  max-width:180px;
  max-height:220px;
  object-fit:contain;
  border-radius:16px;
  border:1px solid #22304a;
  margin-top:0;
  background:#0b1220;
  cursor:zoom-in;
  pointer-events:auto;
  touch-action:manipulation;
  -webkit-user-select:none;
  user-select:none;
}

.image-modal{
  width:min(96vw,1100px);
  z-index:100;
}

.image-modal-body{
  display:flex;
  justify-content:center;
  align-items:center;
}

.example-image-large{
  display:block;
  max-width:100%;
  max-height:78vh;
  object-fit:contain;
  border-radius:16px;
  border:1px solid #22304a;
  background:#0b1220;
}

/* ===== 로그 ===== */
.log-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.log-item{
  border:1px solid #20304b;
  border-radius:16px;
  padding:14px;
}

.log-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-bottom:6px;
}

.log-action{
  font-weight:700;
}

.undo-btn{
  margin-top:10px;
}

/* ===== 자리재배치 ===== */
.rearrange-modal-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,300px);
  gap:16px;
  align-items:start;
}

.rearrange-example-wrap{
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:flex-start;
}

.rank-table-card,
.layout-guide-card{
  grid-column:1/-1;
}

.rank-table-wrap{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  border:1px solid #1a2943;
  border-radius:16px;
  background:#07111e;
}

.rank-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  background:#07111e;
  font-size:13px;
}

.rank-table col:nth-child(1){width:6%}
.rank-table col:nth-child(2){width:8%}
.rank-table col:nth-child(3){width:16%}
.rank-table col:nth-child(4){width:11%}
.rank-table col:nth-child(5){width:11%}
.rank-table col:nth-child(6){width:10%}
.rank-table col:nth-child(7){width:8%}
.rank-table col:nth-child(8){width:16%}

.rank-table th,
.rank-table td{
  padding:5px 3px;
  border-bottom:1px solid #16243a;
  text-align:center;
  vertical-align:middle;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  word-break:keep-all;
}

.rank-table th{
  background:#0d1728;
  color:#dce7ff;
  font-weight:800;
  font-size:13px;
}

.rank-table td{
  font-size:13px;
}

.rank-table td.left{
  text-align:left;
}

.rank-table td:nth-child(6){
  white-space:normal;
  word-break:break-word;
}

.rank-table tr:last-child td{
  border-bottom:none;
}

.rank-row-me td{
  background:rgba(104,167,255,.08);
}

.rank-edit-btn{
  padding:3px 4px;
  font-size:10px;
  border-radius:6px;
  border:1px solid #22304a;
  background:#0b1220;
  color:#dce7ff;
  white-space:nowrap;
}

.rank-empty{
  padding:24px;
  text-align:center;
  color:#92a3bf;
}

.layout-guide-wrap{
  display:flex;
  justify-content:center;
}

.layout-guide-image{
  display:block;
  width:100%;
  max-width:1064px;
  height:auto;
  border:1px solid #1a2943;
  border-radius:18px;
  background:#08121f;
}

.move-up{
  color:#ff4d4d;
  font-weight:700;
}

.move-down{
  color:#4da3ff;
  font-weight:700;
}

.move-done{
  color:#9aa7bd;
  font-weight:700;
}

.move-neutral{
  color:#9aa7bd;
}

/* ===== 성검/삼대 ===== */
.holy-party-title{
  font-size:16px!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  letter-spacing:-.2px;
}

.triple-alliance-title{
  font-size:18px!important;
}

.holy-side-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:84px;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid #22304a;
  background:#0b1220;
  font-size:12px;
  font-weight:700;
  margin-left:6px;
}

.holy-member-rank{
  display:inline-block;
  min-width:36px;
  color:#92a3bf;
  font-weight:600;
  font-size:13px;
}

.holy-area-board{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(4,minmax(74px,auto));
  gap:10px;
  margin-top:14px;
  margin-bottom:14px;
}

.holy-area-slot{
  border:1px solid #22304a;
  border-radius:16px;
  padding:8px 4px;
  background:linear-gradient(180deg,#0d1829 0%,#0a1321 100%);
  min-height:74px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.22);
}

.holy-area-empty{
  min-height:74px;
}

.holy-area-slot-badge{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:6px;
  min-height:34px;
}

.holy-area-slot-users{
  font-size:12px;
  line-height:1.25;
  text-align:center;
  color:#e8edf7;
  white-space:nowrap;
}

.area-badges{
  display:inline-flex;
  gap:6px;
  flex-wrap:wrap;
  margin-left:8px;
  vertical-align:middle;
  align-items:center;
}

.holy-area-badge-img{
  display:block;
  width:18px;
  height:18px;
  object-fit:contain;
  flex:0 0 18px;
}

.holy-area-badge-img.large{
  width:30px;
  height:30px;
  flex:0 0 30px;
}

.holy-sword-assign-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:8px 0;
}

.holy-sword-assign-item:last-child{
  border-bottom:none;
}

/* ===== 캐슬전투 ===== */
.castle-battle-modal{
  width:min(980px,calc(100% - 24px));
  max-height:calc(100vh - 48px);
  overflow-y:auto;
}

.castle-form-section{
  border:1px solid #14233a;
  border-radius:18px;
  padding:14px;
  margin-bottom:14px;
  background:#07111e;
}

.castle-form-title{
  font-weight:800;
  margin-bottom:12px;
}

.castle-form-grid{
  display:grid;
  gap:10px;
}

.castle-tg-grid{
  grid-template-columns:repeat(3,minmax(130px,1fr));
}

.castle-form-grid .form-group{
  margin:0;
}

.castle-form-grid label{
  display:block;
  margin-bottom:6px;
  font-size:13px;
  color:#b7c5df;
}

.castle-hero-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(260px,1fr));
  gap:10px;
}

.castle-hero-card{
  display:grid;
  grid-template-columns:90px 1fr;
  align-items:center;
  gap:10px;
  border:1px solid #182944;
  border-radius:14px;
  padding:10px;
  background:#091321;
}

.castle-hero-name{
  font-weight:800;
  font-size:13px;
  color:#d9e6ff;
  white-space:nowrap;
}

.castle-hero-levels{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:5px;
}

.castle-hero-level-btn{
  min-width:0;
  padding:7px 0;
  border-radius:10px;
  border:1px solid #223653;
  background:#07111e;
  color:#c9d8f2;
  font-weight:800;
  font-size:13px;
}

.castle-hero-level-btn.active{
  border-color:#4f8cff;
  background:#12396c;
  color:#fff;
}

.castle-submit-actions{
  position:sticky;
  bottom:0;
  padding-top:10px;
  background:linear-gradient(to top,#050b14 70%,rgba(5,11,20,0));
}

#partyList.castle-battle-list{
  display:block!important;
  grid-template-columns:none!important;
  width:100%;
  max-width:none;
}

#partyList.castle-battle-list .rank-table-card{
  width:100%;
}

#partyList:has(.castle-rally-category-grid){
  display:block;
  width:100%;
  max-width:none;
}

#partyList:has(.castle-rally-category-grid) .rank-table-card{
  width:100%;
}

.castle-applicant-card{
  width:100%;
}

.castle-table-wrap{
  overflow-x:auto;
}

.castle-table{
  min-width:820px;
}

.castle-table th,
.castle-table td{
  white-space:nowrap;
}

.castle-table th:nth-child(1),
.castle-table td:nth-child(1){
  width:54px;
}

.castle-table th:nth-child(2),
.castle-table td:nth-child(2){
  min-width:110px;
}

.castle-table th:nth-child(3),
.castle-table td:nth-child(3),
.castle-table th:nth-child(4),
.castle-table td:nth-child(4),
.castle-table th:nth-child(5),
.castle-table td:nth-child(5){
  min-width:82px;
}

.castle-table th:nth-child(6),
.castle-table td:nth-child(6){
  min-width:92px;
}

.castle-table th:nth-child(7),
.castle-table td:nth-child(7){
  min-width:90px;
}

.castle-hero-one-level{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  border:1px solid #22304a;
  background:#09111d;
  border-radius:999px;
  padding:4px 10px;
  font-size:12px;
  font-weight:900;
  line-height:1.2;
}

.castle-hero-header-select{
  width:110px;
  min-height:30px;
  border-radius:999px;
  border:1px solid #30527f;
  background:#0c1b2f;
  color:#e7f1ff;
  padding:4px 9px;
  font-size:12px;
  font-weight:900;
}

.castle-rally-assign-select{
  width:140px;
  min-height:30px;
  border-radius:999px;
  border:1px solid #30527f;
  background:#0c1b2f;
  color:#e7f1ff;
  padding:4px 9px;
  font-size:12px;
  font-weight:900;
}

.castle-create-panel{
  margin-bottom:16px;
}

.castle-manage-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.castle-create-grid{
  grid-template-columns:minmax(0,1fr) 180px;
}

.castle-manage-actions{
  margin-top:10px;
}

.castle-rally-category-grid{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-bottom:16px;
}

.castle-my-rally-section,
.castle-rally-category-row{
  width:100%;
  min-width:0;
}

.castle-rally-category-title{
  border:1px solid #1f3657;
  background:#0b1a2d;
  color:#e7f1ff;
  border-radius:12px;
  padding:8px 11px;
  font-size:14px;
  font-weight:1000;
  margin-bottom:8px;
}

.my-rally-title{
  border-color:#315a93;
  background:#102545;
  color:#dceaff;
}

.castle-my-rally-wrap{
  display:grid;
  grid-template-columns:minmax(260px,360px);
  gap:10px;
}

.castle-rally-category-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:10px;
  align-items:start;
}

.castle-rally-card{
  width:100%;
  min-width:0;
  padding:12px;
  border-radius:16px;
}

.castle-rally-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  margin-bottom:6px;
}

.castle-rally-head .party-title{
  margin-bottom:3px;
  font-size:17px;
  line-height:1.15;
}

.castle-rally-card .party-sub{
  font-size:12px;
  line-height:1.25;
  margin:3px 0;
}

.castle-rally-count{
  flex:0 0 auto;
  border:1px solid #28476e;
  background:#0b1a2d;
  color:#dceaff;
  border-radius:999px;
  padding:4px 8px;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

.castle-rally-member-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:8px;
  padding-top:8px;
}

.castle-rally-leader-row{
  width:100%;
}

.castle-rally-normal-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}

.castle-rally-member-line{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:5px;
  align-items:center;
  padding:6px 7px;
  border:1px solid #172a45;
  background:#081522;
  border-radius:11px;
  min-width:0;
}

.castle-rally-member-line.leader-line{
  grid-template-columns:minmax(0,1fr) auto;
}

.castle-rally-member-main{
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:3px;
}

.castle-rally-member-name{
  min-width:0;
  font-weight:900;
  font-size:12px;
  line-height:1.15;
  word-break:keep-all;
  overflow-wrap:anywhere;
}

.castle-member-hero-chip{
  display:inline-flex;
  align-items:center;
  color:#60a5fa;
  font-size:9px;
  font-weight:800;
  line-height:1.1;
  white-space:nowrap;
}

.castle-rally-member-controls{
  display:grid;
  grid-template-columns:28px 28px 28px;
  gap:4px;
  align-items:center;
}

.castle-member-hero-select{
  width:28px;
  min-width:28px;
  min-height:28px;
  border-radius:8px;
  border:1px solid #223653;
  background:#07111e;
  color:transparent;
  padding:0;
  font-size:0;
  font-weight:800;
  cursor:pointer;
}

.castle-member-hero-select option{
  color:#d9e6ff;
  background:#07111e;
  font-size:13px;
}

.castle-crown-btn,
.castle-remove-btn,
.castle-crown-fixed{
  width:28px;
  min-width:28px;
  height:28px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
}

.castle-crown-fixed{
  border:1px solid #28476e;
  background:#0b1a2d;
  border-radius:8px;
}

.castle-rally-empty{
  padding:9px;
  border:1px dashed #28405f;
  border-radius:12px;
  color:#c5d7f4;
  font-weight:800;
  font-size:12px;
}

.castle-rally-actions{
  margin-top:8px;
  justify-content:flex-end;
  gap:5px;
}

.castle-rally-actions button{
  min-width:44px;
  white-space:nowrap;
  padding:5px 7px;
  font-size:12px;
}

/* ===== 사바나의 첨탑/미궁 ===== */
.labyrinth-hero{
  background:
    radial-gradient(circle at 10% 0%, rgba(96,165,250,.24), transparent 32%),
    radial-gradient(circle at 90% 20%, rgba(168,85,247,.16), transparent 34%),
    linear-gradient(135deg,#07111e 0%,#081827 45%,#050810 100%);
  border-color:#203a61;
}

.labyrinth-home-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:22px;
  align-items:start;
}

.labyrinth-section{
  min-width:0;
  background:rgba(7,17,30,.42);
  border:1px solid rgba(42,66,102,.65);
  border-radius:24px;
  padding:18px;
}

.section-header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px;
}

.labyrinth-section .section-title{
  margin:0;
  font-size:22px;
  font-weight:1000;
  letter-spacing:-.4px;
}

.labyrinth-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:16px;
}

.labyrinth-card{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(15,35,62,.86) 0%,rgba(7,17,30,.98) 100%);
  border:1px solid rgba(56,96,150,.78);
  border-radius:24px;
  padding:18px;
  box-shadow:
    0 18px 34px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,255,255,.025) inset;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:230px;
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}

.labyrinth-card::before{
  content:"";
  position:absolute;
  inset:-80px -80px auto auto;
  width:180px;
  height:180px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(96,165,250,.18),transparent 68%);
  pointer-events:none;
}

.labyrinth-card:hover{
  transform:translateY(-3px);
  border-color:rgba(96,165,250,.9);
  box-shadow:
    0 22px 42px rgba(0,0,0,.36),
    0 0 0 1px rgba(96,165,250,.18) inset;
}

.labyrinth-card-top{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.labyrinth-card-title{
  margin:0;
  font-size:24px;
  font-weight:1000;
  line-height:1.15;
  letter-spacing:-.5px;
  word-break:break-word;
}

.labyrinth-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #29466f;
  background:rgba(11,18,32,.9);
  color:#dbe7ff;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

.labyrinth-status-badge.public{
  border-color:#2563eb;
  background:rgba(37,99,235,.18);
  color:#dbeafe;
}

.labyrinth-status-badge.private{
  border-color:#b45309;
  background:rgba(180,83,9,.16);
  color:#ffedd5;
}

.labyrinth-status-badge.closed{
  border-color:#b91c1c;
  background:rgba(185,28,28,.16);
  color:#fee2e2;
}

.labyrinth-card-description{
  position:relative;
  z-index:1;
  color:#c8d5ea;
  line-height:1.55;
  font-size:14px;
  min-height:48px;
  word-break:break-word;
}

.labyrinth-card-meta{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:5px;
  font-size:12px;
  color:#93a8c7;
  padding:10px 12px;
  border:1px solid rgba(42,66,102,.58);
  border-radius:16px;
  background:rgba(5,13,24,.55);
}

.labyrinth-card-actions{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:auto;
}

.labyrinth-card-actions button,
.labyrinth-maker-tools button,
.labyrinth-stage-footer button,
.labyrinth-detail-toggle-row button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:8px 12px;
  min-height:36px;
  font-size:13px;
  font-weight:900;
}

.labyrinth-card-actions button:hover,
.labyrinth-maker-tools button:hover,
.labyrinth-stage-footer button:hover,
.labyrinth-detail-toggle-row button:hover{
  border-color:#60a5fa;
  background:#183965;
}

.labyrinth-empty{
  background:
    linear-gradient(180deg,rgba(8,18,31,.9),rgba(5,11,20,.9));
  border:1px dashed #33557f;
  border-radius:22px;
  padding:28px;
  text-align:center;
  color:#9db4d4;
  font-weight:800;
}

#labyrinthDetailView{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:18px;
  align-items:start;
}

#labyrinthDetailView .labyrinth-detail-top{
  grid-column:1;
}

#labyrinthDetailView .labyrinth-progress-summary{
  grid-column:2;
}

#labyrinthDetailView #labyrinthStageList{
  grid-column:1 / -1;
}

.labyrinth-detail-top{
  margin-bottom:0;
  background:
    radial-gradient(circle at top right, rgba(96,165,250,.24), transparent 34%),
    linear-gradient(135deg,#07111e 0%,#0a1f35 58%,#050810 100%);
  border-color:#25446c;
  box-shadow:0 18px 36px rgba(0,0,0,.28);
}

.labyrinth-detail-top h2{
  margin:0 0 8px;
  font-size:34px;
  line-height:1.16;
  letter-spacing:-.7px;
}

.labyrinth-detail-description{
  margin:12px 0 0;
  line-height:1.65;
  color:#d0ddf2;
  white-space:pre-wrap;
  word-break:break-word;
}

.labyrinth-progress-summary{
  display:block;
  margin-bottom:14px;
}

.labyrinth-progress-main-card{
  width:100%;
  max-width:none;
  min-height:0;
}

.labyrinth-detail-toggle-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}

#labyrinthStageList.party-grid{
  grid-template-columns:1fr;
  gap:14px;
}

#labyrinthStageList .party-card,
.labyrinth-maker-panel-card{
  max-width:720px;
}

.labyrinth-stage-card{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(9,22,38,.98),rgba(5,13,24,.98));
  border:1px solid #1f3657;
  border-radius:24px;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
  box-shadow:
    0 16px 32px rgba(0,0,0,.26),
    0 0 0 1px rgba(255,255,255,.025) inset;
}

.labyrinth-stage-card.current{
  border-color:#3b82f6;
  box-shadow:
    0 20px 40px rgba(0,0,0,.32),
    0 0 0 1px rgba(96,165,250,.22) inset;
}

.labyrinth-stage-card.current::before{
  content:"현재 단계";
  position:absolute;
  top:14px;
  right:14px;
  border:1px solid #3b82f6;
  background:rgba(37,99,235,.18);
  color:#dbeafe;
  border-radius:999px;
  padding:5px 10px;
  font-size:11px;
  font-weight:1000;
}

.labyrinth-stage-card.cleared{
  border-color:#22c55e;
  background:
    linear-gradient(180deg,rgba(8,35,24,.7),rgba(5,13,24,.98));
}

.labyrinth-stage-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-right:72px;
}

.labyrinth-stage-title{
  margin:0;
  font-size:25px;
  font-weight:1000;
  line-height:1.2;
  letter-spacing:-.5px;
}

.labyrinth-stage-order{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:56px;
  padding:6px 10px;
  border-radius:999px;
  background:#0d1728;
  border:1px solid #28476e;
  color:#dce7ff;
  font-size:12px;
  font-weight:900;
}

.labyrinth-stage-story{
  color:#cad8ef;
  line-height:1.65;
  white-space:pre-wrap;
  word-break:break-word;
  border-left:3px solid #315a93;
  padding-left:12px;
}

.labyrinth-stage-question{
  background:
    linear-gradient(180deg,rgba(13,27,47,.92),rgba(8,18,31,.94));
  border:1px solid #2b4770;
  border-radius:18px;
  padding:16px;
  color:#edf3ff;
  line-height:1.7;
  white-space:pre-wrap;
  word-break:break-word;
  font-weight:700;
}

.labyrinth-stage-input-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}

.labyrinth-stage-input-wrap .text-input{
  min-height:46px;
  border-radius:999px;
}

.labyrinth-stage-footer{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  justify-content:space-between;
}

.labyrinth-stage-meta{
  color:#8ea3c2;
  font-size:12px;
  line-height:1.45;
}

.labyrinth-clear-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(34,197,94,.13);
  border:1px solid #28543f;
  color:#d8ffea;
  font-size:12px;
  font-weight:900;
}

.labyrinth-lock-card{
  background:
    linear-gradient(180deg,rgba(6,16,28,.9),rgba(4,10,18,.9));
  border:1px dashed #33557f;
  border-radius:22px;
  padding:22px;
  color:#9db4d4;
  text-align:center;
  font-weight:800;
}

.labyrinth-maker-tools{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  padding:12px;
  border:1px solid rgba(42,66,102,.58);
  border-radius:18px;
  background:rgba(5,13,24,.48);
}

.labyrinth-textarea{
  min-height:120px;
  line-height:1.55;
}

.labyrinth-player-line{
  padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
  color:#dfe9fb;
  font-size:14px;
  word-break:break-word;
}

.labyrinth-player-line:last-child{
  border-bottom:none;
}

.labyrinth-small-note{
  font-size:12px;
  color:#8ea3c2;
  line-height:1.45;
}

.labyrinth-inline-status{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.labyrinth-dim{
  opacity:.72;
}

.labyrinth-hall-modal{
  width:min(520px,92vw);
}

#labyrinthHallModalBody .party-card{
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
}

#labyrinthHallModalBody .member-list{
  margin-top:12px;
}

.notification-pill{
  position:relative;
}

.notification-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  margin-left:4px;
  padding:0 5px;
  border-radius:999px;
  background:#ef4444;
  color:#fff;
  font-size:11px;
  font-weight:1000;
  line-height:1;
}

.notification-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.notification-empty{
  padding:24px;
  text-align:center;
  color:#92a3bf;
  font-weight:800;
}

.notification-item{
  display:flex;
  justify-content:space-between;
  gap:12px;
  border:1px solid #20304b;
  border-radius:16px;
  padding:12px;
  background:#07111e;
}

.notification-item.unread{
  border-color:#315a93;
  background:#0b1a2d;
}

.notification-item.read{
  opacity:.72;
}

.notification-main{
  min-width:0;
}

.notification-title{
  display:flex;
  align-items:center;
  gap:6px;
  color:#edf3ff;
  font-size:14px;
  font-weight:1000;
  margin-bottom:4px;
}

.notification-new{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #f59e0b;
  background:rgba(245,158,11,.16);
  color:#fde68a;
  border-radius:999px;
  padding:2px 6px;
  font-size:10px;
  font-weight:1000;
}

.notification-message{
  color:#dbeafe;
  font-size:13px;
  line-height:1.4;
  font-weight:800;
  word-break:break-word;
}

.notification-meta{
  margin-top:5px;
  color:#8ea3c2;
  font-size:11px;
  font-weight:800;
}

.notification-actions{
  display:flex;
  align-items:center;
  gap:6px;
}

.notification-actions button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:5px 10px;
  min-height:28px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

/* ===== 바다거북스프 ===== */
.turtle-section{
  margin-top:22px;
}

.danger-mini-btn{
  border-color:#7f1d1d!important;
  background:#351018!important;
  color:#fecaca!important;
}

.turtle-answer-edit-btn{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:2px 7px;
  min-height:20px;
  font-size:10px;
  font-weight:900;
  margin-left:5px;
}

.turtle-bubble.question.spoiler{
  cursor:pointer;
  background:#111827;
  border-color:#374151;
  color:#cbd5e1;
}

.turtle-difficulty{
  display:inline-flex;
  align-items:center;
  letter-spacing:1px;
  color:#fbbf24;
  font-size:12px;
  font-weight:1000;
  white-space:nowrap;
}

.turtle-bubble.question.spoiler .spoiler-real{
  display:none;
}

.turtle-bubble.question.spoiler.revealed .spoiler-placeholder{
  display:none;
}

.turtle-bubble.question.spoiler.revealed .spoiler-real{
  display:inline;
}

.turtle-spoiler-control{
  margin-top:3px;
  display:flex;
  justify-content:flex-start;
}

.turtle-spoiler-control button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:3px 8px;
  min-height:24px;
  font-size:11px;
  font-weight:900;
}

.turtle-clearers-panel{
  border:1px solid #28543f;
  border-radius:18px;
  background:rgba(8,35,24,.38);
  padding:10px;
}

.turtle-clearer-list{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.turtle-clearer-item{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:5px 0;
  border-top:1px solid rgba(255,255,255,.06);
  color:#edf3ff;
  font-size:13px;
  font-weight:900;
}

.turtle-clearer-item:first-child{
  border-top:none;
}

.turtle-soup-list{
  display:grid;
  gap:10px;
}

.turtle-solution-panel{
  border:1px solid #28543f;
  border-radius:18px;
  background:rgba(8,35,24,.55);
  padding:10px;
}

.turtle-solution-text{
  color:#d8ffea;
  font-size:13px;
  line-height:1.55;
  font-weight:800;
  word-break:break-word;
}

.turtle-submission-panel{
  border:1px solid #1f3657;
  border-radius:18px;
  background:rgba(7,17,30,.86);
  padding:10px;
}

.turtle-submission-title{
  color:#dbeafe;
  font-size:13px;
  font-weight:1000;
  margin-bottom:8px;
}

.turtle-submission-empty{
  color:#8ea3c2;
  font-size:12px;
  font-weight:800;
  padding:8px 0;
}

.turtle-submission-item{
  border-top:1px solid rgba(255,255,255,.06);
  padding:8px 0;
}

.turtle-submission-item:first-of-type{
  border-top:none;
}

.turtle-submission-item.judged{
  opacity:.88;
}

.turtle-submission-meta{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  color:#8ea3c2;
  font-size:11px;
  font-weight:900;
  margin-bottom:4px;
}

.turtle-submission-text{
  color:#edf3ff;
  font-size:13px;
  line-height:1.45;
  font-weight:800;
  word-break:break-word;
}

.turtle-submission-actions{
  display:flex;
  gap:6px;
  justify-content:flex-end;
  margin-top:6px;
}

.turtle-submission-actions button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:5px 10px;
  min-height:28px;
  font-size:12px;
  font-weight:900;
}

.turtle-submission-history{
  margin-top:8px;
}

.turtle-submission-history summary{
  cursor:pointer;
  color:#bfdbfe;
  font-size:12px;
  font-weight:900;
}

.turtle-soup-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid rgba(49,90,147,.7);
  background:rgba(7,17,30,.86);
  border-radius:18px;
  padding:12px 14px;
  cursor:pointer;
  transition:border-color .15s ease,background .15s ease,transform .15s ease;
}

.turtle-soup-card:hover{
  border-color:#60a5fa;
  background:rgba(13,31,54,.9);
  transform:translateY(-1px);
}

.turtle-card-main{
  min-width:0;
}

.turtle-card-title{
  color:#edf3ff;
  font-size:16px;
  font-weight:1000;
  line-height:1.25;
  word-break:break-word;
}

.turtle-card-meta{
  margin-top:4px;
  color:#8ea3c2;
  font-size:12px;
  font-weight:800;
}

#turtleSoupDetailView{
  grid-column:1 / -1;
}

.turtle-detail-view{
  height:calc(100vh - 150px);
  min-height:580px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.turtle-detail-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}

.turtle-problem-card{
  border:1px solid #1f3657;
  border-radius:18px;
  background:rgba(7,17,30,.9);
  padding:12px 14px;
}

.turtle-problem-title{
  font-size:20px;
  font-weight:1000;
  color:#edf3ff;
  line-height:1.25;
}

.turtle-problem-meta{
  margin-top:4px;
  color:#8ea3c2;
  font-size:12px;
  font-weight:800;
}

.turtle-problem-body{
  margin-top:8px;
}

.turtle-problem-body summary{
  cursor:pointer;
  color:#bfdbfe;
  font-size:12px;
  font-weight:900;
  margin-bottom:8px;
}

.turtle-problem-content{
  max-height:240px;
  overflow:auto;
  background:
    linear-gradient(180deg,rgba(13,27,47,.92),rgba(8,18,31,.94));
  border:1px solid #2b4770;
  border-radius:14px;
  padding:12px;
  line-height:1.6;
  color:#edf3ff;
  font-size:14px;
  word-break:break-word;
}

.turtle-chat-list{
  flex:1;
  min-height:0;
  overflow-y:auto;
  border:1px solid #14233a;
  border-radius:18px;
  background:rgba(5,13,24,.72);
  padding:12px;
}

.turtle-empty-chat{
  color:#8ea3c2;
  text-align:center;
  font-size:13px;
  font-weight:900;
  padding:28px 0;
}

.turtle-thread{
  margin-bottom:8px;
}

.turtle-bubble-row{
  display:flex;
  margin:2px 0;
}

.turtle-bubble-row.left{
  justify-content:flex-start;
}

.turtle-bubble-row.right{
  justify-content:flex-end;
}

.turtle-bubble-wrap{
  max-width:min(78%,620px);
}

.turtle-bubble-meta{
  color:#8ea3c2;
  font-size:11px;
  font-weight:800;
  margin:0 0 2px 2px;
}

.turtle-bubble-meta.right{
  text-align:right;
  margin:0 2px 2px 0;
}

.turtle-bubble{
  border-radius:14px;
  padding:7px 10px;
  line-height:1.42;
  font-size:13px;
  font-weight:800;
  word-break:break-word;
}

.turtle-bubble.question{
  border:1px solid #243a5f;
  background:#0b1a2d;
  color:#e7f1ff;
  border-top-left-radius:5px;
}

.turtle-bubble.answer{
  border:1px solid #315a93;
  background:#102545;
  color:#dbeafe;
  border-top-right-radius:5px;
}

.turtle-pending-row{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:6px;
  color:#8ea3c2;
  font-size:11px;
  font-weight:900;
  margin-top:2px;
}

.turtle-pending-row button,
.turtle-quick-row button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:4px 8px;
  min-height:24px;
  font-size:11px;
  font-weight:900;
}

.turtle-composer{
  position:sticky;
  bottom:0;
  border:1px solid #1f3657;
  border-radius:18px;
  background:rgba(5,8,16,.98);
  padding:10px;
  box-shadow:0 -12px 22px rgba(0,0,0,.24);
}

.turtle-answering-label{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  color:#bfdbfe;
  font-size:12px;
  font-weight:900;
  margin-bottom:6px;
}

.turtle-answering-label button{
  border:none;
  background:transparent;
  color:#93c5fd;
  font-size:12px;
  font-weight:900;
}

.turtle-quick-row{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-bottom:7px;
}

.turtle-input-row,
.turtle-answer-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
  align-items:center;
}

.turtle-input-actions,
.turtle-answer-actions{
  display:flex;
  gap:7px;
  align-items:center;
  flex-wrap:wrap;
}

.turtle-input-row{
  margin-bottom:7px;
}

.turtle-input-row .text-input,
.turtle-answer-row .text-input{
  min-height:38px;
  border-radius:999px;
  font-size:13px;
  padding:8px 12px;
}

.turtle-input-row button,
.turtle-answer-row button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:7px 11px;
  min-height:36px;
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}

/* ===== 반응형 ===== */
@media(min-width:1000px){
  .home-event-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media(max-width:1200px){
  .castle-rally-category-list{
    grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  }
}

@media(max-width:1100px){
  .party-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .summary-grid{
    grid-template-columns:1fr;
  }

  .home-event-grid{
    grid-template-columns:1fr 1fr;
  }

  .labyrinth-home-grid{
    grid-template-columns:1fr;
  }

  .labyrinth-card-grid{
    grid-template-columns:1fr 1fr;
  }

  #labyrinthStageList .party-card,
  .labyrinth-maker-panel-card{
    max-width:none;
  }
}

@media(max-width:900px){
  .rearrange-modal-body{
    grid-template-columns:1fr;
  }

  #labyrinthDetailView{
    display:block;
  }

  #labyrinthDetailView .labyrinth-detail-top{
    margin-bottom:14px;
  }

  .example-image{
    max-width:130px;
    max-height:170px;
    margin:0 auto;
  }

  .event-card h3,
  .party-title{
    font-size:24px;
  }

  .party-card .party-title{
    font-size:20px;
  }

  .party-sub{
    font-size:15px;
  }

  .rank-table{
    font-size:12px;
  }

  .rank-table th,
  .rank-table td{
    padding:5px 3px;
    font-size:12px;
  }

  .rank-edit-btn{
    padding:3px 4px;
    font-size:9px;
  }

  .labyrinth-card-grid{
    grid-template-columns:1fr;
  }

  .labyrinth-detail-top h2{
    font-size:26px;
  }

  .labyrinth-stage-title{
    font-size:22px;
  }

  .castle-manage-grid,
  .castle-create-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .castle-hero-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:720px){
  .topbar{
    flex-wrap:wrap;
  }

  .top-tabs{
    order:3;
    width:100%;
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:6px;
  }

  .tab-btn{
    white-space:nowrap;
    font-size:12px;
    padding:9px 4px;
    min-height:42px;
  }

  .top-right{
    width:100%;
    justify-content:flex-end;
    flex-wrap:wrap;
  }

  .event-top-row{
    flex-direction:column;
  }

  .party-grid,
  .home-event-grid,
  .summary-grid,
  .user-modal-grid,
  .triple-grid,
  .name-columns{
    grid-template-columns:1fr;
  }

  .modal{
    width:min(94vw,94vw);
    padding:16px;
  }

  .image-modal{
    width:min(94vw,94vw);
  }

  .container{
    padding:14px;
  }

  .card,
  .party-card,
  .summary-card,
  .event-card,
  .empty-card{
    padding:16px;
    border-radius:18px;
  }

  .brand{
    font-size:18px;
  }

  .event-card h3,
  .party-title{
    font-size:22px;
    line-height:1.2;
  }

  .party-card .party-title{
    font-size:18px;
  }

  .party-sub,
  .muted{
    font-size:15px;
    line-height:1.45;
  }

  .actions button,
  .pill,
  .close-btn{
    min-height:42px;
    padding:9px 12px;
    font-size:14px;
  }

  .rank-table th,
  .rank-table td{
    padding:5px 2px;
    font-size:11px;
  }

  .rank-table col:nth-child(3){width:20%}
  .rank-table col:nth-child(6){width:14%}
  .rank-table col:nth-child(8){width:18%}

  .rank-edit-btn{
    font-size:9px;
    padding:2px 3px;
  }

  .holy-area-board{
    grid-template-columns:repeat(4,minmax(0,1fr));
    grid-template-rows:repeat(4,minmax(58px,auto));
    gap:6px;
  }

  .holy-area-slot{
    min-height:58px;
    padding:6px 3px;
    border-radius:12px;
  }

  .holy-area-empty{
    min-height:58px;
  }

  .holy-area-slot-badge{
    margin-bottom:4px;
    min-height:24px;
  }

  .holy-area-slot-users{
    font-size:10px;
    line-height:1.15;
    white-space:nowrap;
  }

  .area-badges{
    gap:5px;
    margin-left:6px;
  }

  .holy-area-badge-img{
    width:16px;
    height:16px;
    flex:0 0 16px;
  }

  .holy-area-badge-img.large{
    width:22px;
    height:22px;
    flex:0 0 22px;
  }

  .labyrinth-detail-top h2{
    font-size:24px;
  }

  .labyrinth-stage-title{
    font-size:20px;
  }

  .labyrinth-stage-header{
    flex-direction:column;
    align-items:flex-start;
  }

  .labyrinth-stage-order{
    min-width:auto;
  }
}

@media(max-width:700px){
  .home-event-grid{
    grid-template-columns:1fr;
  }

  .home-event-grid .event-card{
    padding:14px;
  }

  .castle-tg-grid{
    grid-template-columns:1fr 1fr 1fr;
  }

  .castle-my-rally-wrap,
  .castle-rally-category-list{
    grid-template-columns:1fr;
  }

  .castle-rally-normal-grid{
    grid-template-columns:1fr 1fr;
  }

  .castle-rally-card{
    padding:11px;
  }

  .castle-rally-member-line{
    grid-template-columns:1fr;
  }

  .castle-rally-member-controls{
    grid-template-columns:30px 30px 30px;
    width:100%;
    justify-content:end;
  }

  .castle-member-hero-select{
    width:30px;
    min-width:30px;
  }

    .turtle-soup-card{
    align-items:flex-start;
    flex-direction:column;
  }

  .turtle-detail-view{
    height:calc(100vh - 130px);
    min-height:520px;
  }

  .turtle-bubble-wrap{
    max-width:86%;
  }

  .turtle-answer-row{
    grid-template-columns:1fr;
  }
}

@media(max-width:520px){
  .castle-tg-grid{
    grid-template-columns:1fr;
  }

  .castle-hero-card{
    grid-template-columns:1fr;
    gap:8px;
  }
}

@media(max-width:480px){
  .container{
    padding:12px;
  }

  .brand{
    font-size:17px;
  }

  .event-card h3,
  .party-title{
    font-size:20px;
  }

  .party-card .party-title{
    font-size:17px;
  }

  .party-sub,
  .muted{
    font-size:15px;
  }

  .tab-btn{
    font-size:11px;
    padding:8px 2px;
  }

  .rank-table th,
  .rank-table td{
    font-size:10px;
  }

  .labyrinth-card{
    min-height:auto;
  }

  .labyrinth-card-title{
    font-size:20px;
  }

  .labyrinth-card-description{
    font-size:14px;
  }
}

@media(max-width:420px){
  .castle-rally-normal-grid{
    grid-template-columns:1fr;
  }
}


.labyrinth-new-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:6px;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid #f59e0b;
  background:rgba(245,158,11,.16);
  color:#fde68a;
  font-size:10px;
  font-weight:1000;
  line-height:1;
  vertical-align:middle;
}

.labyrinth-editor-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.labyrinth-editor-toolbar button,
.labyrinth-editor-upload{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:8px 12px;
  min-height:36px;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
}

.labyrinth-content-editor{
  min-height:220px;
  border:1px solid #2b4770;
  border-radius:18px;
  background:#07111e;
  color:#e8edf7;
  padding:16px;
  line-height:1.65;
  outline:none;
  white-space:pre-wrap;
  word-break:break-word;
}

.labyrinth-content-editor:empty::before{
  content:attr(data-placeholder);
  color:#6f819d;
}

.labyrinth-content-editor:focus{
  border-color:#60a5fa;
  box-shadow:0 0 0 1px rgba(96,165,250,.18) inset;
}

.labyrinth-content-image,
.labyrinth-content-view img{
  display:block;
  max-width:100%;
  max-height:520px;
  object-fit:contain;
  margin:12px auto;
  border:1px solid #2b4770;
  border-radius:16px;
  background:#050810;
}

.labyrinth-content-view{
  background:
    linear-gradient(180deg,rgba(13,27,47,.92),rgba(8,18,31,.94));
  border:1px solid #2b4770;
  border-radius:18px;
  padding:16px;
  color:#edf3ff;
  line-height:1.7;
  white-space:pre-wrap;
  word-break:break-word;
  font-weight:700;
}

.labyrinth-content-view p{
  margin:0 0 10px;
}

.labyrinth-content-view p:last-child{
  margin-bottom:0;
}

.labyrinth-stage-clear-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 12px;
  border:1px solid rgba(49,90,147,.65);
  border-radius:14px;
  background:rgba(16,37,69,.42);
  color:#dbeafe;
  font-size:13px;
  font-weight:900;
}

.labyrinth-stage-clear-summary button{
  border:1px solid #315a93;
  background:#102545;
  color:#e7f1ff;
  border-radius:999px;
  padding:5px 10px;
  min-height:28px;
  font-size:12px;
  font-weight:900;
}

.labyrinth-stage-manage-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.labyrinth-stage-manage-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.labyrinth-stage-clear-mini{
  color:#dbeafe;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

@media(max-width:700px){
  .labyrinth-stage-manage-line{
    align-items:flex-start;
    flex-direction:column;
  }

  .labyrinth-stage-manage-actions{
    justify-content:flex-start;
  }
}

.labyrinth-stage-review-modal{
  width:min(760px,92vw);
}

.labyrinth-stage-review-meta{
  margin-bottom:12px;
  color:#92a3bf;
  font-size:13px;
  font-weight:800;
}

.labyrinth-cleared-review-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

@media(max-width:700px){
  .labyrinth-cleared-review-line{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* ===== 상단 메뉴 / 웹게임 카드 / 겹겹타일 최종 단일 블록 ===== */

/* 상단 메뉴: 사이드 드로어 고정 */
.topbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:12px 14px!important;
  border-bottom:1px solid #162033!important;
  background:#050810!important;
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:120!important;
  min-height:58px!important;
}

.container{
  padding-top:78px!important;
}

.top-left{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
}

.brand-home-btn{
  border:none!important;
  background:transparent!important;
  color:#e8edf7!important;
  padding:0!important;
  cursor:pointer!important;
  text-align:left!important;
}

.menu-btn{
  border:1px solid #22304a!important;
  background:#0b1220!important;
  color:#dce7ff!important;
  border-radius:12px!important;
  padding:8px 11px!important;
  min-height:38px!important;
  font-weight:1000!important;
}

.top-tabs{
  pointer-events:auto!important;
  position:fixed!important;
  top:0!important;
  left:0!important;
  width:min(290px,86vw)!important;
  height:100vh!important;
  background:#07111e!important;
  border-right:1px solid #22304a!important;
  box-shadow:18px 0 40px rgba(0,0,0,.38)!important;
  z-index:100!important;
  padding:14px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  transform:translateX(-105%)!important;
  transition:transform .18s ease!important;
  flex:none!important;
}

.top-tabs.open{
  transform:translateX(0)!important;
}

.drawer-header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:8px!important;
  padding-bottom:10px!important;
  border-bottom:1px solid #162033!important;
}

.event-menu-backdrop{
  pointer-events:auto!important;
  position:fixed!important;
  inset:0!important;
  background:rgba(0,0,0,.48)!important;
  z-index:90!important;
}

.top-right{
  display:flex!important;
  gap:6px!important;
  align-items:center!important;
  justify-content:flex-end!important;
  min-width:0!important;
  flex-wrap:nowrap!important;
}

.tab-btn{
  width:100%!important;
  white-space:nowrap!important;
  min-height:44px!important;
  text-align:left!important;
}

.pill{
  white-space:nowrap!important;
}

.admin-menu{
  position:fixed!important;
  top:64px!important;
  right:14px!important;
  z-index:110!important;
}

/* 웹게임 선택 카드 */
#labyrinthMenuPanel.hidden,
#labyrinthRealHome.hidden,
#turtleMenuPanel.hidden,
#stackTilePanel.hidden{
  display:none!important;
}

.webgame-select-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;
  gap:18px!important;
  margin-bottom:24px!important;
}

.webgame-select-card{
  border:1px solid #315a93!important;
  background:linear-gradient(180deg,rgba(13,27,47,.95),rgba(7,17,30,.98))!important;
  border-radius:18px!important;
  padding:22px!important;
  cursor:pointer!important;
  transition:border-color .15s ease,transform .15s ease,background .15s ease!important;
  box-shadow:0 12px 28px rgba(0,0,0,.24)!important;
}

.webgame-select-card:hover{
  border-color:#60a5fa!important;
  transform:translateY(-2px)!important;
}

.webgame-select-title{
  font-size:24px!important;
  font-weight:800!important;
  margin-bottom:12px!important;
  color:#edf3ff!important;
  letter-spacing:-.5px!important;
}

.webgame-select-desc{
  color:#c5d7f4!important;
  font-size:14px!important;
  line-height:1.65!important;
  font-weight:700!important;
}

/* 겹겹타일: 외부 이벤트 제목 제거 */
#eventScreen:has(#stackTilePanel:not(.hidden)) .event-top-row{
  display:none!important;
}

#eventScreen:has(#stackTilePanel:not(.hidden)){
  padding-top:0!important;
}

#stackTilePanel .stack-tile-section{
  width:100%!important;
  max-width:980px!important;
  margin:0 auto!important;
  padding:10px!important;
  border-radius:20px!important;
}

#stackTilePanel .section-header-row{
  display:none!important;
}

/* 겹겹타일 전체 레이아웃 */
.stack-tile-layout{
  display:grid!important;
  grid-template-columns:minmax(0,590px) minmax(250px,300px)!important;
  gap:14px!important;
  align-items:start!important;
  justify-content:center!important;
}

.stack-tile-game-card{
  width:100%!important;
  max-width:590px!important;
  min-width:0!important;
}

#stackTilePanel .stack-tile-wrap{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
}

#stackTilePanel .stack-tile-top{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  min-height:34px!important;
}

/* 상태바 */
.stack-tile-statusbar{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
}

.stack-tile-status-main{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  color:#dbeafe!important;
  font-size:12px!important;
  font-weight:1000!important;
  line-height:1.2!important;
}

.stack-tile-status-main span{
  display:inline-flex!important;
  align-items:center!important;
  position:relative!important;
  white-space:nowrap!important;
}

.stack-tile-status-main span+span::before{
  content:"·";
  margin-right:8px;
  color:#557399;
}

.stack-tile-status-difficulty{
  color:#fde68a!important;
}

.stack-tile-score-stat{
  color:#bbf7d0!important;
  overflow:visible!important;
}

/* 점수 플로팅 */
.stack-tile-score-float-wrap{
  position:absolute;
  left:50%;
  top:-8px;
  pointer-events:none;
}

.stack-tile-score-floater{
  position:absolute;
  left:0;
  top:0;
  transform:translateX(-50%);
  white-space:nowrap;
  font-size:13px;
  font-weight:1000;
  text-shadow:0 2px 6px rgba(0,0,0,.65);
  animation:stackTileScoreFloat .9s ease forwards;
}

.stack-tile-score-floater.plus{
  color:#86efac;
}

.stack-tile-score-floater.minus{
  color:#fca5a5;
}

@keyframes stackTileScoreFloat{
  0%{opacity:0; transform:translate(-50%,6px) scale(.9)}
  20%{opacity:1; transform:translate(-50%,0) scale(1)}
  100%{opacity:0; transform:translate(-50%,-26px) scale(1.05)}
}

/* 난이도 선택 */
.stack-tile-difficulty-select-wrap{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex:0 0 auto!important;
  color:#93c5fd!important;
  font-size:11px!important;
  font-weight:1000!important;
}

.stack-tile-difficulty-select{
  width:auto!important;
  min-height:30px!important;
  height:30px!important;
  padding:3px 28px 3px 10px!important;
  border-radius:999px!important;
  border:1px solid #315a93!important;
  background:#102545!important;
  color:#e7f1ff!important;
  font-size:12px!important;
  font-weight:1000!important;
}

/* 보드 */
#stackTilePanel .stack-tile-board-card{
  padding:8px!important;
  border-radius:18px!important;
  border:1px solid #28476e!important;
  background:linear-gradient(180deg,rgba(9,22,38,.98),rgba(5,13,24,.98))!important;
}

#stackTilePanel .stack-tile-board{
  position:relative!important;
  width:100%!important;
  max-width:430px!important;
  height:410px!important;
  margin:0 auto!important;
  border:1px solid #14233a!important;
  border-radius:16px!important;
  background:
    radial-gradient(circle at 50% 34%,rgba(96,165,250,.10),transparent 45%),
    rgba(5,13,24,.72)!important;
  overflow:hidden!important;
}

/* 타일 */
#stackTilePanel .stack-tile{
  position:absolute!important;
  width:52px!important;
  height:52px!important;
  left:calc(var(--x) * 26px + var(--offset-x, 0px))!important;
  top:calc(var(--y) * 26px + var(--offset-y, 0px))!important;
  border-radius:13px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:27px!important;
  font-weight:1000!important;
  line-height:1!important;
  user-select:none!important;
  touch-action:manipulation!important;
  transition:filter .15s ease,box-shadow .12s ease,border-color .12s ease!important;
}

#stackTilePanel .stack-tile.selectable{
  border:1px solid #6ea8ff!important;
  background:linear-gradient(180deg,#f4f9ff,#bfdcff)!important;
  color:#0b1220!important;
  filter:none!important;
  opacity:1!important;
  cursor:pointer!important;
  box-shadow:0 0 0 2px rgba(96,165,250,.58),0 8px 16px rgba(0,0,0,.38)!important;
}

#stackTilePanel .stack-tile.selectable:hover{
  transform:none!important;
  box-shadow:0 0 0 2px rgba(191,219,254,.95),0 8px 16px rgba(0,0,0,.38)!important;
}

#stackTilePanel .stack-tile.preview{
  border:1px solid #5d789f!important;
  background:linear-gradient(180deg,#d7e4f4,#8fa8c9)!important;
  color:#172235!important;
  box-shadow:0 6px 12px rgba(0,0,0,.28)!important;
  cursor:not-allowed!important;
  opacity:1!important;
  filter:brightness(.9) saturate(.85)!important;
}

#stackTilePanel .stack-tile.back{
  border:1px solid #6686b8!important;
  background:
    radial-gradient(circle at 50% 45%,rgba(147,197,253,.22),transparent 34%),
    linear-gradient(180deg,#344968,#17243a 60%,#263b5d)!important;
  color:#b9d5ff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 7px 13px rgba(0,0,0,.34)!important;
  cursor:not-allowed!important;
  opacity:1!important;
  filter:none!important;
}

#stackTilePanel .stack-tile.back::before{
  content:"◆";
  font-size:24px;
  color:#b9d5ff;
  opacity:.95;
}

#stackTilePanel .stack-tile.back span{
  display:none!important;
}

#stackTilePanel .stack-tile.blocked-feedback{
  animation:stackTileBlockedShake .18s ease;
  box-shadow:0 0 0 2px #ef4444,0 8px 16px rgba(0,0,0,.38)!important;
}

@keyframes stackTileBlockedShake{
  0%{transform:translateX(0)}
  25%{transform:translateX(-4px)}
  50%{transform:translateX(4px)}
  75%{transform:translateX(-2px)}
  100%{transform:translateX(0)}
}

/* 보드 안 보관 슬롯 */
#stackTilePanel .stack-tile-storage-on-board{
  position:absolute!important;
  left:50%!important;
  bottom:10px!important;
  transform:translateX(-50%)!important;
  z-index:3000!important;
  display:grid!important;
  grid-template-columns:repeat(3,52px)!important;
  gap:8px!important;
  pointer-events:auto!important;
}

#stackTilePanel .stack-tile-storage-on-board .stack-tile-slot,
#stackTilePanel .stack-tile-storage-on-board .stack-tile-storage-tile{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  min-height:52px!important;
  border-radius:13px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

#stackTilePanel .stack-tile-storage-on-board .stack-tile-slot{
  border:1px dashed rgba(96,165,250,.55)!important;
  background:rgba(16,37,69,.22)!important;
  color:transparent!important;
}

#stackTilePanel .stack-tile-storage-on-board .stack-tile-storage-tile{
  border:1px solid #315a93!important;
  background:linear-gradient(180deg,#eef6ff,#bcd7ff)!important;
  color:#0b1220!important;
  font-size:27px!important;
  font-weight:1000!important;
  box-shadow:0 6px 12px rgba(0,0,0,.26)!important;
  cursor:pointer!important;
}

/* 하단 */
#stackTilePanel .stack-tile-bottom{
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
}

#stackTilePanel .stack-tile-lane-card{
  padding:7px 8px!important;
  border-radius:14px!important;
}

#stackTilePanel .stack-tile-lane-title{
  margin-bottom:5px!important;
  font-size:11px!important;
}

#stackTilePanel .stack-tile-queue{
  display:grid!important;
  grid-template-columns:repeat(7,52px)!important;
  gap:6px!important;
  align-items:center!important;
  justify-content:start!important;
  overflow:visible!important;
}

#stackTilePanel .stack-tile-slot,
#stackTilePanel .stack-tile-queue-tile{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  min-height:52px!important;
  border-radius:13px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
}

#stackTilePanel .stack-tile-slot{
  border:1px dashed #4b6388!important;
  background:#0a1525!important;
  color:#7c91b4!important;
  font-size:11px!important;
  font-weight:1000!important;
}

#stackTilePanel .stack-tile-queue-tile{
  border:1px solid #315a93!important;
  background:linear-gradient(180deg,#eef6ff,#bcd7ff)!important;
  color:#0b1220!important;
  font-size:27px!important;
  font-weight:1000!important;
  box-shadow:0 6px 12px rgba(0,0,0,.26)!important;
}

#stackTilePanel .stack-tile-queue-tile.added-pop,
#stackTilePanel .stack-tile-storage-tile.stored-pop{
  animation:stackTilePop .24s ease;
}

#stackTilePanel .stack-tile-queue-tile.matching{
  animation:stackTileMatchedPop .26s ease forwards;
  box-shadow:0 0 0 2px rgba(251,191,36,.9),0 0 18px rgba(251,191,36,.45)!important;
}

@keyframes stackTilePop{
  0%{transform:scale(.86)}
  55%{transform:scale(1.12)}
  100%{transform:scale(1)}
}

@keyframes stackTileMatchedPop{
  0%{transform:scale(1); opacity:1}
  45%{transform:scale(1.18); opacity:1}
  100%{transform:scale(.2); opacity:0}
}

/* 버튼 */
#stackTilePanel .stack-tile-item-row{
  display:flex!important;
  gap:5px!important;
  flex-wrap:wrap!important;
}

#stackTilePanel .stack-tile-item-row button{
  min-height:30px!important;
  padding:5px 9px!important;
  border:1px solid #315a93!important;
  border-radius:999px!important;
  background:#102545!important;
  color:#e7f1ff!important;
  font-size:11px!important;
  font-weight:900!important;
}

#stackTilePanel .stack-tile-message{
  padding:7px 9px!important;
  border:1px solid #28476e!important;
  border-radius:12px!important;
  background:rgba(16,37,69,.35)!important;
  color:#dbeafe!important;
  font-size:12px!important;
  font-weight:900!important;
}

/* 랭킹 */
.stack-tile-ranking-card{
  border:1px solid #28476e!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(9,22,38,.98),rgba(5,13,24,.98))!important;
  padding:12px!important;
  min-height:220px!important;
}

.stack-tile-ranking-title{
  color:#dbeafe!important;
  font-size:14px!important;
  font-weight:1000!important;
  margin-bottom:10px!important;
}

.stack-tile-ranking-list{
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
}

.stack-tile-rank-row{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) auto auto!important;
  gap:6px!important;
  align-items:center!important;
  border:1px solid #172a45!important;
  background:#081522!important;
  border-radius:11px!important;
  padding:7px 8px!important;
  font-size:11px!important;
  font-weight:900!important;
}

.stack-tile-rank-row.me{
  border-color:#60a5fa!important;
  background:rgba(96,165,250,.12)!important;
}

.stack-tile-rank-no{
  color:#93c5fd!important;
}

.stack-tile-rank-name{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#e7f1ff!important;
}

.stack-tile-rank-score{
  color:#fde68a!important;
  white-space:nowrap!important;
}

.stack-tile-rank-time{
  color:#9fb3d3!important;
  white-space:nowrap!important;
}

.stack-tile-rank-empty{
  border:1px dashed #28405f!important;
  border-radius:12px!important;
  padding:16px!important;
  color:#9fb3d3!important;
  text-align:center!important;
  font-size:12px!important;
  font-weight:900!important;
}

/* 결과 오버레이 */
.stack-tile-result-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:blur(3px)!important;
}

.stack-tile-result-box{
  width:min(380px,100%)!important;
  border:1px solid #315a93!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#102545,#07111e)!important;
  box-shadow:0 18px 45px rgba(0,0,0,.55)!important;
  padding:22px 18px!important;
  text-align:center!important;
  color:#e7f1ff!important;
}

.stack-tile-result-title{
  font-size:26px!important;
  font-weight:1000!important;
  color:#fecaca!important;
  margin-bottom:8px!important;
}

.stack-tile-result-title.pause{
  color:#bfdbfe!important;
}

.stack-tile-result-title.clear{
  color:#bbf7d0!important;
}

.stack-tile-result-desc{
  font-size:14px!important;
  line-height:1.55!important;
  color:#dbeafe!important;
}

.stack-tile-result-meta{
  margin-top:10px!important;
  font-size:12px!important;
  color:#93c5fd!important;
  font-weight:900!important;
}

.stack-tile-result-actions{
  display:flex!important;
  gap:8px!important;
  justify-content:center!important;
  margin-top:16px!important;
}

.stack-tile-result-actions.three{
  flex-wrap:wrap!important;
}

.stack-tile-result-actions button{
  flex:1!important;
  border:1px solid #60a5fa!important;
  background:#102545!important;
  color:#e7f1ff!important;
  border-radius:999px!important;
  min-height:38px!important;
  padding:8px 12px!important;
  font-size:13px!important;
  font-weight:1000!important;
}

.stack-tile-result-actions button:first-child{
  border-color:#fbbf24!important;
  color:#fde68a!important;
}

.stack-tile-score-detail{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  margin:12px 0!important;
  border:1px solid #28476e!important;
  border-radius:14px!important;
  padding:10px!important;
  background:rgba(5,13,24,.45)!important;
}

.stack-tile-score-detail div{
  display:flex!important;
  justify-content:space-between!important;
  gap:10px!important;
  color:#dbeafe!important;
  font-size:13px!important;
  font-weight:900!important;
}

.stack-tile-score-detail .total{
  border-top:1px solid rgba(255,255,255,.08)!important;
  padding-top:7px!important;
  color:#fde68a!important;
}

/* 반응형 */
@media(max-width:980px){
  .stack-tile-layout{
    grid-template-columns:1fr!important;
  }

  .stack-tile-game-card{
    max-width:590px!important;
    margin:0 auto!important;
  }

  .stack-tile-ranking-card{
    display:none!important;
  }
}

@media(max-width:720px){
  .container{
    padding-top:72px!important;
  }

  .topbar{
    flex-wrap:nowrap!important;
  }

  .top-tabs{
    order:initial!important;
    width:min(290px,86vw)!important;
    display:flex!important;
    grid-template-columns:none!important;
  }

  .top-right{
    width:auto!important;
    justify-content:flex-end!important;
    flex-wrap:nowrap!important;
  }

  .top-right .pill{
    font-size:12px!important;
    padding:8px 9px!important;
  }

  #stackTilePanel .stack-tile-section{
    padding:7px!important;
  }

  #stackTilePanel .stack-tile-top{
    min-height:30px!important;
    gap:5px!important;
  }

  .stack-tile-status-main{
    gap:5px!important;
    font-size:10px!important;
  }

  .stack-tile-status-main span+span::before{
    margin-right:5px!important;
  }

  .stack-tile-difficulty-select-wrap label{
    display:none!important;
  }

  .stack-tile-difficulty-select{
    min-height:28px!important;
    height:28px!important;
    padding:3px 24px 3px 9px!important;
    font-size:10px!important;
  }

  #stackTilePanel .stack-tile-board{
    max-width:360px!important;
    height:340px!important;
  }

  #stackTilePanel .stack-tile{
    width:44px!important;
    height:44px!important;
    left:calc(var(--x) * 22px + var(--offset-x, 0px))!important;
    top:calc(var(--y) * 22px + var(--offset-y, 0px))!important;
    border-radius:11px!important;
    font-size:23px!important;
  }

  #stackTilePanel .stack-tile.back::before{
    font-size:20px!important;
  }

  #stackTilePanel .stack-tile-storage-on-board{
    grid-template-columns:repeat(3,44px)!important;
    gap:6px!important;
    bottom:8px!important;
  }

  #stackTilePanel .stack-tile-storage-on-board .stack-tile-slot,
  #stackTilePanel .stack-tile-storage-on-board .stack-tile-storage-tile{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    border-radius:11px!important;
  }

  #stackTilePanel .stack-tile-storage-on-board .stack-tile-storage-tile{
    font-size:23px!important;
  }

  #stackTilePanel .stack-tile-queue{
    grid-template-columns:repeat(7,40px)!important;
    gap:5px!important;
  }

  #stackTilePanel .stack-tile-slot,
  #stackTilePanel .stack-tile-queue-tile{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    border-radius:10px!important;
  }

  #stackTilePanel .stack-tile-queue-tile{
    font-size:21px!important;
  }

  #stackTilePanel .stack-tile-slot{
    font-size:10px!important;
  }

  #stackTilePanel .stack-tile-item-row button{
    flex:1 1 calc(33.333% - 5px)!important;
    min-width:70px!important;
    min-height:27px!important;
    padding:4px 6px!important;
    font-size:10px!important;
  }
}