/* 向畑家ポータル 共通スタイル */
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { font-family: 'Noto Sans JP',-apple-system,sans-serif; color: #2e2622; font-weight: 400; }
body { background: linear-gradient(180deg, #f5efe6 0%, #ebe3d4 100%); min-height: 100vh; padding-bottom: 40px; }

.header {
  padding: 12px 14px; padding-top: calc(12px + env(safe-area-inset-top));
  display: flex; align-items: center; gap: 10px;
  background: #faf6f0; border-bottom: 1px solid #d4c8b8;
  position: sticky; top: 0; z-index: 50;
}
.header .back, .header .user {
  background: transparent; color: #5d4f47; border: 1.5px solid #c4b8a8;
  padding: 6px 12px; border-radius: 100px; font-size: 12px; font-weight: 500;
  text-decoration: none; flex-shrink: 0;
}
.header .back:active, .header .user:active { background: #efe5d4; }
.header .ttl { flex: 1; text-align: center; font-weight: 700; font-size: 16px; letter-spacing: .05em; }

.sec { padding: 16px 14px 0; }
.card { background: #faf6f0; border: 1px solid #d4c8b8; border-radius: 20px; padding: 18px; }
.card h2 { font-size: 16px; font-weight: 700; margin-bottom: 12px; letter-spacing: .04em; }
.card h3 { font-size: 14px; font-weight: 700; margin-bottom: 10px; letter-spacing: .04em; }

.pill { display: inline-block; background: #c25d4a; color: #faf6f0; padding: 3px 12px; border-radius: 100px; font-family: 'Fredoka',sans-serif; font-size: 10px; letter-spacing: .25em; font-weight: 600; }

.btn {
  background: #c25d4a; color: #faf6f0; border: 0; padding: 12px 18px;
  border-radius: 10px; font-weight: 600; font-size: 14px; cursor: pointer; font-family: inherit;
}
.btn:active { background: #a84a3a; }
.btn.ghost { background: transparent; color: #5d4f47; border: 1px solid #c4b8a8; }
.btn.ghost:active { background: #efe5d4; }

.field { margin-bottom: 12px; }
.field .l { display: block; font-family: 'Fredoka',sans-serif; font-size: 10px; font-weight: 500; color: #8b7a6e; margin-bottom: 5px; letter-spacing: .2em; }
.field input, .field select, .field textarea {
  width: 100%; padding: 12px 14px; border: 1px solid #d4c8b8; border-radius: 10px;
  background: #fff; font-family: inherit; font-size: 16px; color: #2e2622;
  -webkit-appearance: none; appearance: none;
}
.field input:focus, .field select:focus { outline: none; border-color: #c25d4a; }

.sec-head { display: flex; align-items: center; gap: 10px; margin: 22px 4px 12px; }
.sec-head .ja { font-size: 14px; font-weight: 700; letter-spacing: .08em; }
.sec-head .en { font-family: 'Fredoka',sans-serif; font-size: 10px; letter-spacing: .25em; color: #8b7a6e; font-weight: 500; }
.sec-head .line { flex: 1; height: 1px; background: #d4c8b8; }