:root {
  font-family:
    Inter,
    Segoe UI,
    sans-serif;
  color: #26392e;
  background: #f7f6f0;
  font-synthesis: none;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
}
header {
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 6%;
  border-bottom: 1px solid #dedfd5;
  background: #fcfbf6;
}
.brand {
  font-family: Georgia, serif;
  font-size: 32px;
  font-weight: bold;
  letter-spacing: -2px;
}
.brand span {
  color: #b85f37;
}
a {
  color: inherit;
  text-decoration: none;
}
nav {
  display: flex;
  gap: 28px;
  font-size: 14px;
}
main {
  max-width: 1300px;
  margin: auto;
  padding: 55px 5%;
  min-height: 75vh;
}
h1,
h2,
h3,
p {
  margin-top: 0;
}
h1 {
  font-family: Georgia, serif;
  font-size: clamp(42px, 6vw, 76px);
  font-weight: 400;
  letter-spacing: -2px;
  line-height: 1.05;
  margin-bottom: 24px;
}
h2 {
  font-family: Georgia, serif;
  font-size: 30px;
  font-weight: 400;
}
h3 {
  font-size: 19px;
}
.eyebrow {
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #6b795d;
  font-weight: 700;
}
.muted {
  color: #6a746c;
  line-height: 1.6;
}
.hero {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 60px;
  align-items: center;
  margin-bottom: 55px;
}
.hero-art {
  background: #e8eadb;
  padding: 35px;
  border-radius: 130px 130px 12px 12px;
  transform: rotate(2deg);
  text-align: center;
}
.hero-art img {
  width: 100%;
  border-radius: 100%;
  mix-blend-mode: multiply;
}
.hero-art p {
  margin: 10px 0 0;
  font-family: Georgia, serif;
  font-size: 22px;
}
.grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
}
.restaurant {
  background: #fff;
  border: 1px solid #e2e2d8;
  border-radius: 15px;
  overflow: hidden;
  transition: transform 0.2s;
}
.restaurant:hover {
  transform: translateY(-4px);
}
.restaurant img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.restaurant .inner {
  padding: 25px;
}
.row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.pill {
  background: #eef1e8;
  border-radius: 30px;
  padding: 7px 12px;
  font-size: 12px;
}
.button,
button {
  border: 0;
  border-radius: 7px;
  padding: 12px 17px;
  background: #345340;
  color: white;
  font: inherit;
  cursor: pointer;
}
button:disabled {
  opacity: 0.5;
  cursor: wait;
}
.secondary {
  background: #e9ece3;
  color: #345340;
}
.danger {
  background: #f8e6e0;
  color: #993f28;
}
.menu-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 35px;
}
.item {
  background: white;
  border: 1px solid #e2e2d8;
  border-radius: 12px;
  display: flex;
  overflow: hidden;
  margin-bottom: 16px;
  min-height: 150px;
}
.item img {
  width: 150px;
  object-fit: cover;
}
.item .inner {
  padding: 20px;
  flex: 1;
}
.item h3 {
  margin-bottom: 8px;
}
.item p {
  font-size: 14px;
  margin-bottom: 16px;
}
.cart {
  padding: 25px;
  background: #fff;
  border: 1px solid #e2e2d8;
  border-radius: 12px;
  align-self: start;
  position: sticky;
  top: 25px;
}
.cart-line {
  padding: 14px 0;
  border-bottom: 1px solid #eee;
}
.quantity {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 9px;
}
.quantity button {
  padding: 4px 10px;
}
.total {
  margin: 22px 0;
  font-weight: bold;
}
.full {
  width: 100%;
}
label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin: 15px 0 6px;
}
input,
select,
textarea {
  width: 100%;
  font: inherit;
  padding: 11px;
  border: 1px solid #cfd6cb;
  border-radius: 6px;
  background: #fff;
}
textarea {
  min-height: 80px;
}
input[type="checkbox"] {
  width: auto;
}
.panel {
  padding: 28px;
  background: white;
  border: 1px solid #ddd;
  border-radius: 12px;
  margin-bottom: 24px;
}
.login {
  max-width: 460px;
  margin: 25px auto;
}
.tabs {
  display: flex;
  gap: 10px;
  margin: 25px 0;
}
.edit-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.small {
  font-size: 12px;
}
.error {
  color: #a43c28;
}
#notice {
  position: fixed;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%);
  background: #26392e;
  color: white;
  border-radius: 8px;
  padding: 15px 25px;
  display: none;
  z-index: 5;
}
footer {
  padding: 30px 6%;
  border-top: 1px solid #ddd;
  font-family: Georgia, serif;
  display: flex;
  justify-content: space-between;
}
footer span {
  font-family:
    Segoe UI,
    sans-serif;
  font-size: 12px;
  color: #6a746c;
}
.success {
  padding: 40px;
  background: #e7eddf;
  border-radius: 15px;
}
.category-edit {
  display: grid;
  grid-template-columns: 1fr 90px 80px;
  gap: 10px;
  margin-bottom: 12px;
}
.admin-top {
  margin-bottom: 30px;
}
@media (max-width: 850px) {
  .hero {
    grid-template-columns: 1fr;
  }
  .hero-art {
    display: none;
  }
  .menu-layout {
    grid-template-columns: 1fr;
  }
  .cart {
    position: static;
  }
  .edit-grid {
    grid-template-columns: 1fr;
  }
  main {
    padding: 35px 5%;
  }
  nav {
    gap: 15px;
    font-size: 12px;
  }
  header {
    padding: 0 5%;
  }
  .item img {
    width: 100px;
  }
  footer {
    display: block;
  }
  footer span {
    display: block;
    margin-top: 10px;
  }
}
@media (max-width: 550px) {
  .grid {
    grid-template-columns: 1fr;
  }
  .item img {
    width: 85px;
  }
  .item .inner {
    padding: 14px;
  }
  h1 {
    font-size: 44px;
  }
}
/* Restaurant-controlled theme and Kanpai-inspired storefront. */
:root{--brand-primary:#345340;--brand-bg:#f7f6f0;--brand-text:#26392e;--brand-button-text:#fff}
body.is-themed{background:var(--brand-bg);color:var(--brand-text)}.is-themed header{height:auto;display:block;text-align:center;background:var(--brand-bg);padding:24px 5% 0;border-bottom:1px solid color-mix(in srgb,var(--brand-primary) 30%,transparent)}.is-themed .brand{display:inline-block;max-width:100%;font-family:'Segoe UI',Arial,sans-serif;letter-spacing:3px;font-weight:200;font-size:70px;line-height:1.15}.brand-wordmark{display:block;color:var(--brand-text)!important}.brand-subtitle{display:block;color:var(--brand-text)!important;font-size:15px;font-weight:400;letter-spacing:4px;margin-top:8px}.brand-logo{max-width:280px;max-height:100px;object-fit:contain}.is-themed header nav{justify-content:center;padding:18px 0;gap:38px;color:var(--brand-primary);font-weight:650}.is-themed button,.is-themed .button{background:var(--brand-primary);color:var(--brand-button-text);border-radius:28px;font-weight:650}.is-themed .secondary{background:color-mix(in srgb,var(--brand-primary) 9%,var(--brand-bg));color:var(--brand-primary)}.is-themed .danger{background:#f9e7e2;color:#9a3426}.is-themed h1,.is-themed h2{font-family:'Segoe UI',Arial,sans-serif;letter-spacing:-1px;font-weight:650}.is-themed .eyebrow{color:var(--brand-primary)}.is-themed main{padding-top:28px}.brand-hero{position:relative;min-height:330px;border-radius:3px;overflow:hidden;background:#2c302b;display:flex;align-items:center}.hero-photo{position:absolute;width:100%;height:100%;inset:0;object-fit:cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.18))}.hero-copy{position:relative;padding:45px;max-width:670px;color:#fffde1}.hero-copy h1{font-size:clamp(38px,5vw,62px);letter-spacing:-1.5px;line-height:1.07;margin:16px 0}.hero-copy p{line-height:1.6}.hero-copy .eyebrow{color:#fffde1}.hero-copy .button{display:inline-block;margin-top:12px}.store-details{display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-size:13px;border-bottom:1px solid #d9d5be}.reference-notice{font-size:12px;line-height:1.5;padding:12px 16px;background:color-mix(in srgb,var(--brand-primary) 6%,var(--brand-bg));color:var(--brand-text);border-left:3px solid var(--brand-primary)}.menu-heading{margin:34px 0 18px}.menu-heading h2{font-size:34px;margin-bottom:10px}.category-nav{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 32px}.category-nav a{padding:9px 16px;border:1px solid var(--brand-primary);border-radius:30px;color:var(--brand-primary);font-weight:600;font-size:13px}.category-nav a:hover{background:var(--brand-primary);color:var(--brand-button-text)}.is-themed .item{border-color:#dedbc8}.is-themed .cart{border-top:4px solid var(--brand-primary)}.is-themed .cart-line .row{flex-wrap:wrap}.is-themed .cart-line .row .small{flex-basis:100%;order:3}.is-themed .pill{background:color-mix(in srgb,var(--brand-primary) 7%,var(--brand-bg));color:var(--brand-primary)}.visit-panel{border-top:1px solid #d5d2c1;margin-top:40px;padding-top:28px}.visit-panel p{line-height:1.7}.color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:20px 0}.color-grid input{height:50px;padding:5px;cursor:pointer}.group-settings{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px}.option-row{display:grid;grid-template-columns:2fr 1fr 1fr 40px;gap:15px;align-items:center;margin-bottom:15px}.option-row button{padding:8px}.choice{font-weight:400;line-height:1.7}.dialog-backdrop{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:20;padding:20px}.customize-dialog{background:var(--brand-bg);color:var(--brand-text);border-radius:18px;width:550px;max-height:90vh;overflow:auto;padding:28px;box-shadow:0 25px 80px #0006}.customize-dialog h2{font-family:'Segoe UI',Arial,sans-serif;font-size:26px;margin-bottom:0}.customize-dialog fieldset{border:0;border-bottom:1px solid #d9d5c2;padding:20px 0;margin:0}.customize-dialog legend{padding:0;font-weight:700}.customize-dialog legend span{display:block;margin-top:5px;font-weight:400}.customize-dialog .full{margin-top:20px}.tabs{flex-wrap:wrap}.muted{color:color-mix(in srgb,var(--brand-text) 65%,var(--brand-bg))}.is-themed footer p{font:13px 'Segoe UI',Arial,sans-serif;margin:10px 0 0}
@media(max-width:850px){.is-themed .brand{font-size:54px}.hero-copy{padding:32px}.store-details{flex-wrap:wrap}.brand-hero{min-height:310px}.group-settings{grid-template-columns:1fr 1fr}.group-settings label:first-child{grid-column:1/-1}.option-row{grid-template-columns:1fr 1fr}.color-grid{grid-template-columns:1fr 1fr}.admin-top{align-items:flex-start}.admin-top h1{font-size:34px!important}.customize-dialog{padding:22px}.visit-panel .grid{grid-template-columns:1fr;gap:0}}
@media(max-width:550px){.is-themed header nav{gap:18px;font-size:12px}.is-themed .brand{font-size:48px}.brand-subtitle{font-size:12px;letter-spacing:3px}.brand-hero{min-height:340px}.hero-copy{padding:26px}.hero-copy h1{font-size:39px}.store-details{font-size:12px;gap:8px}.category-nav{gap:7px}.category-nav a{padding:8px 12px;font-size:12px}.dialog-backdrop{padding:10px}.customize-dialog{max-height:94vh}.is-themed .row strong{overflow-wrap:anywhere}}