/* ============================================================
   Majesty 御膳房 — placeholder / "coming soon"
   Committed to Majesty's own palette: lacquer-red ground,
   ivory type, a whisper of gold. One look, no theme switch.
   ============================================================ */

:root{
  --red:#8a1c1e;
  --red-light:#a4272a;
  --red-deep:#4a0f11;
  --red-panel:#5c1416;
  --branch-ink:#2c0a0b;
  --blossom:#ecd2ce;
  --gold:#cba14e;
  --gold-soft:#ecd4a0;
  --ivory:#faf3ea;
  --ivory-dim:#e4d1c1;
  --jade:#a9d4a3;
  --amber:#e6b667;
  --rule:rgba(203,161,78,0.34);
  --rule-faint:rgba(203,161,78,0.15);
}

*{box-sizing:border-box;}
html{
  -webkit-text-size-adjust:100%;
  color-scheme:dark;
  scrollbar-color:rgba(203,161,78,0.4) var(--red-deep);
}

body{
  position:relative;
  margin:0;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:clamp(28px, 5vh, 44px);
  padding:clamp(64px, 11vh, 104px) clamp(20px, 6vw, 64px);
  background:var(--red);
  color:var(--ivory);
  font-family:'Work Sans', ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-size:16px;
  line-height:1.6;
  letter-spacing:-0.01em;
  overflow-x:hidden;
}

::selection{ background:rgba(236,212,160,0.85); color:var(--red-deep); }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--red-deep); }
::-webkit-scrollbar-thumb{ background:rgba(203,161,78,0.32); border-radius:10px; }

/* ---- lacquer ground: deep sheen + vignette ---- */
.lacquer{
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(ellipse 70% 50% at 32% 4%, rgba(255,231,201,0.14), transparent 60%),
    radial-gradient(ellipse 130% 90% at 50% 128%, rgba(0,0,0,0.46), transparent 60%),
    radial-gradient(ellipse 100% 72% at 50% -16%, rgba(0,0,0,0.34), transparent 55%),
    linear-gradient(163deg, var(--red-light), var(--red) 46%, var(--red-deep));
}

/* ---- lacquer-box frame: gold hairline pair, inset ---- */
.frame{
  position:fixed;
  inset:clamp(10px, 1.6vw, 18px);
  z-index:-1;
  pointer-events:none;
  border:1px solid var(--rule);
}
.frame::after{
  content:"";
  position:absolute;
  inset:5px;
  border:1px solid var(--rule-faint);
}

/* ---- 御膳房 set vertically, cropped at the right edge like a scroll ---- */
.hanzi-scroll{
  position:fixed;
  top:50%;
  right:-0.14em;
  transform:translateY(-50%);
  z-index:-1;
  writing-mode:vertical-rl;
  font-family:'Noto Serif SC','Songti SC','STSong',serif;
  font-weight:400;
  font-size:clamp(5.5rem, 17vw, 12rem);
  letter-spacing:0.05em;
  color:var(--gold-soft);
  opacity:0.06;
  user-select:none;
  white-space:nowrap;
}

/* ---- plum branch, upper-left corner, draws itself in ---- */
.branch{
  position:absolute;
  top:clamp(6px, 1.4vw, 18px);
  left:clamp(6px, 1.4vw, 18px);
  width:clamp(150px, 25vw, 296px);
  height:auto;
  z-index:0;
  pointer-events:none;
}
.branch .bough,
.branch .twig{
  stroke:var(--branch-ink);
  stroke-linecap:round;
  fill:none;
  stroke-dasharray:1;
  stroke-dashoffset:1;
  animation:draw 1.6s cubic-bezier(.65,.02,.3,1) forwards;
}
.branch .bough{ stroke-width:1.5; }
.branch .twig{ stroke-width:1.05; animation-delay:var(--d,.5s); }
.branch .bloom{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  animation:bloom .7s cubic-bezier(.2,.7,.3,1) forwards;
  animation-delay:var(--d,1.2s);
}

/* ---- content ---- */
main{
  position:relative;
  z-index:1;
  width:100%;
  max-width:600px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:clamp(18px, 3.4vh, 26px);
  opacity:0;
  animation:rise 640ms cubic-bezier(.2,.75,.25,1) 120ms forwards;
}

.mark{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.wordmark{
  font-family:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  font-weight:600;
  font-size:clamp(2.5rem, 7vw, 3.7rem);
  letter-spacing:0.2em;
  line-height:1;
  text-transform:uppercase;
  text-indent:0.2em;
}
.hanzi-row{
  display:flex;
  align-items:center;
  gap:7px;
}
.cjk{ font-family:'Noto Serif SC','Songti SC','STSong',serif; }

.hanzi{
  font-family:'Noto Serif SC','Songti SC',serif;
  font-size:0.95rem;
  letter-spacing:0.5em;
  text-indent:0.5em;
  color:var(--ivory-dim);
}
.seal{
  display:flex;
  align-items:center;
  justify-content:center;
  width:17px;
  height:17px;
  border-radius:2px;
  background:#c33a2c;
  color:var(--ivory);
  font-family:'Noto Serif SC','Songti SC',serif;
  font-size:10px;
  line-height:1;
  transform:translateY(1px) rotate(-4deg);
  box-shadow:0 1px 3px rgba(0,0,0,0.32);
}
.tagline{
  font-size:0.72rem;
  font-weight:600;
  letter-spacing:0.32em;
  text-indent:0.32em;
  text-transform:uppercase;
  color:var(--gold-soft);
}

h1{
  margin:0;
  font-family:'Cormorant Garamond', Georgia, serif;
  font-weight:500;
  font-style:italic;
  font-size:clamp(2.1rem, 6vw, 3.4rem);
  line-height:1.1;
  letter-spacing:0;
  text-wrap:balance;
}
h1 em{ font-style:italic; color:var(--gold-soft); }

.divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:150px;
  color:var(--gold);
}
.divider::before,
.divider::after{
  content:"";
  flex:1;
  height:1px;
  background:linear-gradient(90deg, transparent, currentColor);
}
.divider::after{ transform:scaleX(-1); }
.divider svg{ width:15px; height:15px; flex:none; }

.lede{
  max-width:46ch;
  margin:0;
  font-size:clamp(1rem, 1.7vw, 1.12rem);
  color:var(--ivory-dim);
  text-wrap:pretty;
}
.lede strong{ color:var(--ivory); font-weight:600; }

.status-row{
  display:flex;
  align-items:center;
  gap:9px;
  font-size:0.72rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold-soft);
}
.status-row .dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--jade);
  box-shadow:0 0 0 0 rgba(169,212,163,0.55);
  animation:pulse 2.8s ease-in-out infinite;
}
.status-row .dot.is-closed{
  background:var(--amber);
  box-shadow:none;
  animation:none;
}

/* ---- hours + contact panel: recessed lacquer plate ---- */
.panel{
  width:100%;
  margin-top:4px;
  padding:clamp(20px, 4vw, 28px);
  border:1px solid var(--rule);
  border-radius:4px;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.24), rgba(0,0,0,0.05) 60%),
    var(--red-panel);
  box-shadow:inset 0 1px 0 rgba(250,243,234,0.05);
  text-align:left;
}
.panel-title{
  font-size:0.68rem;
  font-weight:600;
  letter-spacing:0.3em;
  text-indent:0.3em;
  text-transform:uppercase;
  color:var(--gold-soft);
}
.hours{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:9px 24px;
  margin:16px 0 0;
  font-size:0.92rem;
  color:var(--ivory-dim);
}
.hours dt{
  font-weight:600;
  color:var(--ivory);
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.hours dd{
  margin:0;
  font-variant-numeric:tabular-nums;
}
.hours .mid{ color:var(--gold); padding:0 0.3em; }
.hours .sub{ display:block; font-size:0.82rem; opacity:0.72; }

.note{
  margin:14px 0 0;
  font-size:0.8rem;
  font-style:italic;
  color:var(--ivory-dim);
  opacity:0.78;
}

.contact-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px 26px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--rule);
}
.contact-row a{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--ivory);
  text-decoration:none;
  font-size:0.92rem;
}
.contact-row a span{
  border-bottom:1px solid transparent;
  transition:border-color 180ms ease;
}
.contact-row svg{
  flex:none;
  color:var(--gold-soft);
  transition:transform 180ms ease;
}
.contact-row a:hover span,
.contact-row a:focus-visible span{ border-color:var(--gold-soft); }
.contact-row a:hover svg{ transform:scale(1.1); }

footer{
  position:relative;
  z-index:1;
  max-width:600px;
  text-align:center;
  font-size:0.68rem;
  letter-spacing:0.08em;
  color:var(--ivory-dim);
  opacity:0;
  animation:rise 640ms cubic-bezier(.2,.75,.25,1) 260ms forwards;
}

/* ---- 404 ---- */
.notfound h1{ font-style:normal; }
.notfound .code{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:clamp(3.5rem, 12vw, 6rem);
  color:var(--gold-soft);
  line-height:1;
}
.home-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ivory);
  text-decoration:none;
  font-size:0.8rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  border-bottom:1px solid var(--gold-soft);
  padding-bottom:3px;
}

/* ---- keyframes ---- */
@keyframes rise{
  from{ opacity:0; transform:translateY(12px); }
  to{ opacity:1; transform:translateY(0); }
}
@keyframes draw{
  to{ stroke-dashoffset:0; }
}
@keyframes bloom{
  from{ opacity:0; transform:scale(.4); }
  to{ opacity:1; transform:scale(1); }
}
@keyframes pulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(169,212,163,0.5); }
  50%{ box-shadow:0 0 0 6px rgba(169,212,163,0); }
}

/* ---- focus ---- */
a:focus-visible{
  outline:2px solid var(--gold-soft);
  outline-offset:3px;
  border-radius:1px;
}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:1ms !important;
    animation-delay:0ms !important;
    animation-iteration-count:1 !important;
    transition-duration:1ms !important;
  }
  main, footer, .branch .bloom, .notfound .code{ opacity:1 !important; transform:none !important; }
  .branch .bough, .branch .twig{ stroke-dashoffset:0 !important; }
}

/* ---- small screens ---- */
@media (max-width:520px){
  .hanzi-scroll{ right:-0.32em; opacity:0.04; }
  .branch{ width:30vw; opacity:0.8; }
  .hours{ grid-template-columns:1fr; gap:3px 0; }
  .hours dt{ margin-top:10px; }
  .hours dt:first-child{ margin-top:0; }
}

@media (prefers-reduced-transparency: reduce){
  .hanzi-scroll{ opacity:0.05; }
}