:root {
  font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  color:#252c29;
  background:#f8f9f6;
  font-synthesis:none;
  --ink:#252c29;
  --muted:#66716b;
  --line:#e3e7e1;
  --paper:#fff;
  --accent:#435c56;
  --shadow:0 5px 24px #23382c12
}

* {
  box-sizing:border-box
}

body {
  margin:0;
  font-size:16px;
  line-height:1.55
}

button,input,a {
  -webkit-tap-highlight-color:transparent
}

button,input {
  font:inherit
}

button,a {
  touch-action:manipulation
}

button {
  cursor:pointer;
  color:inherit
}

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

a {
  color:inherit
}

button:focus-visible,a:focus-visible,input:focus-visible {
  outline:3px solid #7c9890;
  outline-offset:3px
}

button {
  min-height:44px
}

button, input {
  border-radius:8px
}

h1,h2,h3,p {
  margin:0
}

button svg {
  width:20px;
  height:20px
}

[hidden] {
  display:none!important
}

.eyebrow {
  display:block;
  font-size:11px;
  font-weight:750;
  letter-spacing:2px;
  color:var(--muted)
}

.app-header {
  height:80px;
  border-bottom:1px solid var(--line);
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 28px;
  gap:16px
}

.brand {
  display:flex;
  align-items:center;
  gap:13px;
  text-decoration:none
}

.brand-mark {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  background:#eff2ec;
  border-radius:12px;
  color:#43564a
}

.brand-mark svg {
  width:32px;
  height:32px
}

.brand strong {
  display:block;
  font-size:19px;
  letter-spacing:-.6px;
  margin-top:1px
}

.header-end {
  display:flex;
  align-items:center;
  gap:20px
}

.scope-label {
  font-size:14px;
  color:var(--muted)
}

.quiet-button {
  background:transparent;
  border:1px solid var(--line);
  padding:8px 14px;
  font-size:14px
}

.primary-button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:100%;
  padding:13px 18px;
  background:var(--accent);
  border:0;
  color:#fff;
  font-weight:650;
  text-decoration:none;
  border-radius:8px;
  min-height:48px
}

.primary-button:hover {
  background:#334b44
}

.primary-button span {
  margin-left:auto
}

.workspace {
  display:grid;
  grid-template-columns:minmax(0,1fr) 400px;
  height:calc(100dvh - 80px);
  min-height:440px;
  overflow:hidden
}

.password-dialog {
  border:1px solid var(--line);
  border-radius:20px;
  padding:40px;
  width:440px;
  max-width:calc(100% - 32px);
  box-shadow:0 20px 100px #13251c24
}

.password-dialog::backdrop {
  background:#eef1e8dc;
  backdrop-filter:blur(7px)
}

.password-dialog h2 {
  font-size:30px;
  letter-spacing:-1.2px;
  line-height:1.3;
  margin:22px 0 16px
}

.password-dialog p {
  color:var(--muted);
  margin-bottom:24px
}

.password-dialog label {
  display:block;
  margin-bottom:8px;
  font-weight:650;
  font-size:14px
}

.password-dialog input {
  width:100%;
  padding:13px;
  border:1px solid #bdc8bf;
  background:#fff;
  font-size:16px
}

.password-dialog small {
  display:block;
  font-size:13px;
  color:var(--muted);
  margin-top:20px
}

.password-dialog .form-error {
  margin:8px 0;
  min-height:22px;
  color:#9a421c;
  font-size:14px
}

.toast {
  position:fixed;
  bottom:26px;
  left:50%;
  transform:translateX(-50%);
  padding:13px 20px;
  background:#273d33;
  color:#fff;
  border-radius:10px;
  box-shadow:var(--shadow);
  z-index:20;
  max-width:calc(100% - 32px);
  width:max-content;
  font-size:14px
}

.muted {
  color:var(--muted)
}

.app-shell {
  height:100dvh;
  overflow:hidden
}

.workspace {
  grid-template-rows:minmax(0,1fr);
  min-height:0
}

.map-region,.panel {
  min-height:0
}

#map {
  position:absolute;
  inset:0
}
