/* ==================================================
   DESKTOP / DEFAULT
   ================================================== */
.ok-submit-form{display:grid;gap:14px}.ok-submit-form>label,.ok-upload-box{display:grid;gap:7px;font-weight:650}.ok-submit-form input[type=text],.ok-submit-form input:not([type]),.ok-submit-form textarea,.ok-submit-form input[type=file]{width:100%;border:1px solid #a2a9b1;border-radius:11px;padding:12px;background:#fff}.ok-submit-form textarea{resize:vertical}.ok-upload-box{border:1px dashed #a2a9b1;border-radius:12px;padding:14px}.ok-upload-box small{font-weight:400;color:var(--ok-muted)}.ok-category-list{display:grid;gap:8px}.ok-category{border:1px solid #c8ccd1;border-radius:12px;overflow:hidden;background:#fff}.ok-category summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:14px;font-weight:700;cursor:pointer}.ok-category summary::-webkit-details-marker{display:none}.ok-category-body{border-top:1px solid #eaecf0;padding:12px}.ok-category-enable{display:flex;gap:10px;align-items:center;padding:9px 0;font-weight:800}.ok-situation{margin:12px 0 20px;padding:12px;border-radius:11px;background:#f8f9fa}.ok-situation h3{font-size:15px;margin:0 0 10px}.ok-subhead{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ok-muted);font-weight:800}.ok-check{display:grid;grid-template-columns:22px 1fr;gap:9px;align-items:start;padding:9px 0;border-top:1px solid #eaecf0;font-weight:450}.ok-check input{width:19px;height:19px;margin-top:2px}.ok-submit-final{width:100%;position:sticky;bottom:12px;box-shadow:0 6px 24px rgba(51,102,204,.2)}

/* ==================================================
   MAX-WIDTH: 600PX
   ================================================== */
@media (max-width: 600px) {
  .ok-submit-form{gap:13px}
  .ok-submit-form input[type=text],.ok-submit-form textarea,.ok-submit-form input[type=file]{font-size:16px}
  .ok-category summary{min-height:50px;padding:13px}
  .ok-situation{margin:10px 0 16px;padding:11px}
  .ok-submit-final{bottom:max(10px,env(safe-area-inset-bottom))}
}

/* ==================================================
   MAX-WIDTH: 430PX
   ================================================== */
@media (max-width: 430px) {
  .ok-category-body{padding:10px}
  .ok-check{grid-template-columns:21px minmax(0,1fr);gap:8px;padding:9px 0}
  .ok-check span,.ok-check label{overflow-wrap:anywhere}
}

/* ==================================================
   MAX-WIDTH: 390PX
   ================================================== */
@media (max-width: 390px) {
  .ok-situation{padding:10px}
  .ok-category summary{padding:12px 11px}
}